auklet 0.0.2 → 0.0.4

package/dist/css/core/moduleGraph.js

@@ -0,0 +1,362 @@
+import path from 'node:path';
+import { aukletConfigFile } from '#auklet/config';
+import { loadAukletConfig } from '#auklet/configLoader';
+import { moduleStyleBuildConfig } from '#auklet/css/config';
+import { ModuleStyleGraphRequestCache } from '#auklet/css/core/moduleGraphRequestCache';
+import { StyleModuleEntryPlanner } from '#auklet/css/core/styleModuleEntryPlanner';
+import {
+  EXTERNAL_ENTRY,
+  MODULE_ENTRY,
+  STYLE_ENTRY,
+  THEMES_ENTRY_PREFIX,
+} from '#auklet/css/constants';
+import {
+  createExternalEntryParts,
+  createStyleEntryParts,
+  createThemeEntryParts,
+} from '#auklet/css/core/style/plan';
+import {
+  createImportCode,
+  parsePackageStyleSpecifier,
+  removeStyleExtension,
+} from '#auklet/css/core/style/specifier';
+import {
+  normalizeFileKey,
+  toFsSpecifier,
+  toPosixPath,
+  toWatchPath,
+} from '#auklet/utils';
+const mergeLoadResults = (...results) => {
+  return {
+    code: results
+      .map((result) => result.code)
+      .filter((code) => code.trim())
+      .join('\n'),
+    watchFiles: Array.from(
+      new Set(results.flatMap((result) => result.watchFiles)),
+    ),
+  };
+};
+export class ModuleStyleGraph {
+  config;
+  workspaceRoot;
+  packagesDir;
+  loadAukletConfig;
+  constructor(options) {
+    this.config = options.config ?? moduleStyleBuildConfig;
+    this.workspaceRoot = normalizeFileKey(options.workspaceRoot);
+    this.packagesDir = options.packagesDir ?? 'packages';
+    this.loadAukletConfig = options.loadAukletConfig ?? loadAukletConfig;
+  }
+  parsePackageStyleId(id) {
+    return parsePackageStyleId(id, this.getWorkspacePackageNames());
+  }
+  isWorkspaceSourceGraphFile(file) {
+    const normalizedFile = normalizeFileKey(file);
+    const packagesRoot = normalizeFileKey(
+      path.join(this.workspaceRoot, this.packagesDir),
+    );
+    if (!normalizedFile.startsWith(`${packagesRoot}/`)) {
+      return false;
+    }
+    if (normalizedFile.endsWith(aukletConfigFile)) return true;
+    if (normalizedFile.endsWith('.ts') || normalizedFile.endsWith('.tsx')) {
+      return true;
+    }
+    return this.config.styleExtensions.some((extension) =>
+      normalizedFile.endsWith(extension),
+    );
+  }
+  isStyleConfigFile(file) {
+    return normalizeFileKey(file).endsWith(aukletConfigFile);
+  }
+  isStyleFile(file) {
+    return this.config.styleExtensions.includes(path.extname(file));
+  }
+  getWorkspacePackageNames() {
+    return this.createRequestCache().getWorkspacePackageNames();
+  }
+  getWatchRoots() {
+    const packagesRoot = path.join(this.workspaceRoot, this.packagesDir);
+    return [
+      toWatchPath(packagesRoot, '*', 'src'),
+      toWatchPath(packagesRoot, '*', aukletConfigFile),
+    ];
+  }
+  async createPackageStyleCode(parsed) {
+    return this.createPackageStyleCodeWithCache(
+      parsed,
+      this.createRequestCache(),
+    );
+  }
+  async createPackageStyleCodeWithCache(parsed, cache) {
+    const context = await cache.getContext(parsed);
+    if (!context) {
+      return {
+        code: '',
+        watchFiles: [],
+      };
+    }
+    if (parsed.stylePath === STYLE_ENTRY) {
+      return this.createStyleCode(context, cache);
+    }
+    if (parsed.stylePath === EXTERNAL_ENTRY) {
+      return this.createExternalStyleCode(context, cache);
+    }
+    if (parsed.stylePath === MODULE_ENTRY) {
+      return this.createModuleStyleCode(context);
+    }
+    if (parsed.stylePath.startsWith(THEMES_ENTRY_PREFIX)) {
+      return this.createThemeStyleCode(context, cache, [
+        removeStyleExtension(
+          parsed.stylePath.slice(THEMES_ENTRY_PREFIX.length),
+        ),
+      ]);
+    }
+    return this.createSourceModuleStyleCode(context, cache, parsed.stylePath);
+  }
+  async createStyleCode(context, cache) {
+    const results = [];
+    for (const part of createStyleEntryParts(context.normalizedConfig)) {
+      if (part.type === 'dependencies') {
+        results.push(
+          await this.createDependencyStyleCode(context, cache, part.specifiers),
+        );
+        continue;
+      }
+      if (part.type === 'themes') {
+        results.push(
+          await this.createThemeStyleCode(
+            context,
+            cache,
+            part.themeNames,
+            false,
+          ),
+        );
+        continue;
+      }
+      results.push(this.createModuleStyleCode(context));
+    }
+    return mergeLoadResults(...results);
+  }
+  async createDependencyStyleCode(
+    context,
+    cache,
+    specifiers,
+    mapSpecifier = (specifier) => specifier,
+  ) {
+    const results = [];
+    const imports = [];
+    for (const specifier of specifiers) {
+      const outputSpecifier = mapSpecifier(specifier);
+      const parsed = this.parsePackageStyleIdInRequest(outputSpecifier, cache);
+      if (parsed) {
+        results.push(await this.createPackageStyleCodeWithCache(parsed, cache));
+        continue;
+      }
+      imports.push(outputSpecifier);
+    }
+    return mergeLoadResults(
+      {
+        code: createImportCode(imports),
+        watchFiles: [context.configPath],
+      },
+      ...results,
+    );
+  }
+  async createExternalStyleCode(context, cache) {
+    const results = [];
+    for (const part of createExternalEntryParts(context.normalizedConfig)) {
+      if (part.type === 'dependencies') {
+        results.push(
+          await this.createDependencyStyleCode(
+            context,
+            cache,
+            part.specifiers,
+            (specifier) => this.toDevExternalStyleSpecifier(specifier, cache),
+          ),
+        );
+      }
+    }
+    return mergeLoadResults(...results);
+  }
+  async createThemeStyleCode(
+    context,
+    cache,
+    themeNames,
+    includeDependencies = true,
+  ) {
+    const { themeFiles } = context.packageContext;
+    const targetThemeNames = themeNames ?? context.packageContext.themeNames;
+    const root = context.styleProcessor.createRoot();
+    const watchFiles = [context.configPath, ...themeFiles.values()];
+    const dependencyResults = [];
+    for (const themeName of targetThemeNames) {
+      for (const part of createThemeEntryParts(
+        context.normalizedConfig,
+        themeName,
+        {
+          includeDependencies,
+        },
+      )) {
+        if (part.type === 'dependencies') {
+          dependencyResults.push(
+            await this.createDependencyStyleCode(
+              context,
+              cache,
+              part.specifiers,
+            ),
+          );
+          continue;
+        }
+        const themeFile = themeFiles.get(part.themeName);
+        if (!themeFile) continue;
+        const content = context.styleProcessor.readStyleFile(themeFile);
+        if (content.trim()) {
+          context.styleProcessor.appendStyleContent(root, content, themeFile);
+        }
+      }
+    }
+    return mergeLoadResults(
+      {
+        code: '',
+        watchFiles,
+      },
+      ...dependencyResults,
+      {
+        code: root.nodes?.length ? context.styleProcessor.stringify(root) : '',
+        watchFiles: [],
+      },
+    );
+  }
+  createModuleStyleCode(context) {
+    const { styleFiles } = context.packageContext;
+    const root = context.styleProcessor.createRoot();
+    const seen = new Set();
+    for (const styleFile of styleFiles) {
+      const content = context.styleProcessor.readStyleFile(styleFile, seen);
+      if (content.trim()) {
+        context.styleProcessor.appendStyleContent(root, content, styleFile);
+      }
+    }
+    return {
+      code: root.nodes?.length ? context.styleProcessor.stringify(root) : '',
+      watchFiles: [context.configPath, ...styleFiles],
+    };
+  }
+  async createSourceModuleStyleCode(context, cache, stylePath) {
+    const sourceModuleDir = removeStyleExtension(stylePath);
+    const { styleFiles, sourceFiles } = context.packageContext;
+    const moduleStyleImports = context.packageContext.importCollector.collect(
+      sourceFiles,
+      context.normalizedConfig,
+    );
+    const entry = new StyleModuleEntryPlanner(
+      context.packageContext,
+    ).createEntry(sourceModuleDir, moduleStyleImports);
+    const sourceStyleDir = path.join(
+      context.sourceRoot,
+      sourceModuleDir,
+      this.config.output.styleDir,
+    );
+    const moduleStyleResults = [];
+    const moduleStyleSpecifiers = [];
+    for (const specifier of entry.moduleStyleImports) {
+      const result = this.toDevModuleImportSpecifier(
+        context,
+        cache,
+        sourceStyleDir,
+        specifier,
+      );
+      const parsed = this.parsePackageStyleIdInRequest(result, cache);
+      if (parsed) {
+        moduleStyleResults.push(
+          await this.createPackageStyleCodeWithCache(parsed, cache),
+        );
+        continue;
+      }
+      moduleStyleSpecifiers.push(result);
+    }
+    const root = context.styleProcessor.createRoot();
+    const seen = new Set();
+    for (const ownStyleFile of entry.ownStyleFiles) {
+      const content = context.styleProcessor.readStyleFile(ownStyleFile, seen);
+      if (content.trim()) {
+        context.styleProcessor.appendStyleContent(root, content, ownStyleFile);
+      }
+    }
+    const ownStyleCode = root.nodes?.length
+      ? context.styleProcessor.stringify(root)
+      : '';
+    return mergeLoadResults(...moduleStyleResults, {
+      code: [createImportCode(moduleStyleSpecifiers), ownStyleCode]
+        .filter((code) => code.trim())
+        .join('\n'),
+      watchFiles: [
+        context.configPath,
+        ...styleFiles,
+        ...sourceFiles.filter((file) => /\.(ts|tsx)$/.test(file)),
+      ],
+    });
+  }
+  toDevModuleImportSpecifier(context, cache, sourceStyleDir, specifier) {
+    if (!specifier.startsWith('.')) {
+      return this.toDevExternalStyleSpecifier(specifier, cache);
+    }
+    const outputStyleEntry = path.resolve(sourceStyleDir, specifier);
+    const styleEntrySuffix = `${path.sep}${this.config.output.styleDir}${path.sep}${this.config.output.indexStyleFile}`;
+    if (!outputStyleEntry.endsWith(styleEntrySuffix)) {
+      return toFsSpecifier(outputStyleEntry);
+    }
+    const sourceModuleDir = path.relative(
+      context.sourceRoot,
+      outputStyleEntry.slice(0, -styleEntrySuffix.length),
+    );
+    return `${context.packageName}/${toPosixPath(sourceModuleDir)}.css`;
+  }
+  toDevExternalStyleSpecifier(specifier, cache) {
+    const parsed = parsePackageStyleSpecifier(specifier);
+    if (!parsed) return specifier;
+    if (this.isWorkspacePackageName(parsed.packageName, cache)) {
+      if (parsed.stylePath === STYLE_ENTRY) {
+        return `${parsed.packageName}/${EXTERNAL_ENTRY}`;
+      }
+      if (
+        parsed.stylePath ===
+        [this.config.output.styleDir, this.config.output.indexStyleFile].join(
+          '/',
+        )
+      ) {
+        return `${parsed.packageName}/${EXTERNAL_ENTRY}`;
+      }
+    }
+    return specifier;
+  }
+  parsePackageStyleIdInRequest(id, cache) {
+    return parsePackageStyleId(id, cache.getWorkspacePackageNames());
+  }
+  isWorkspacePackageName(packageName, cache) {
+    return cache.isWorkspacePackageName(packageName);
+  }
+  createRequestCache() {
+    return new ModuleStyleGraphRequestCache({
+      workspaceRoot: this.workspaceRoot,
+      packagesDir: this.packagesDir,
+      config: this.config,
+      loadAukletConfig: this.loadAukletConfig,
+    });
+  }
+}
+export function parsePackageStyleId(id, packageNames) {
+  if (!id.endsWith('.css')) {
+    return null;
+  }
+  const packageName = [...packageNames]
+    .sort((left, right) => right.length - left.length)
+    .find((name) => id.startsWith(`${name}/`));
+  if (!packageName) return null;
+  return {
+    packageName,
+    stylePath: id.slice(packageName.length + 1),
+  };
+}

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

@@ -0,0 +1,80 @@
+import { StylePackageContext } from '#auklet/css/core/stylePackageContext';
+import type {
+  AukletConfig,
+  ModuleStyleBuildConfig,
+  NormalizedAukletConfig,
+  ResolvedModuleStyleBuildContext,
+} from '#auklet/types';
+import type { StyleProcessor } from '#auklet/css/core/styleProcessor';
+import type { WorkspaceStyleResolver } from '#auklet/css/core/workspaceStyleResolver';
+import type { PackageStyleId } from '#auklet/css/core/moduleGraph';
+export type PackageStyleContext = {
+  normalizedConfig: NormalizedAukletConfig;
+  context: ResolvedModuleStyleBuildContext;
+  packageContext: StylePackageContext;
+  packageName: string;
+  configPath: string;
+  resolver: WorkspaceStyleResolver;
+  sourceRoot: string;
+  styleProcessor: StyleProcessor;
+};
+export type LoadAukletConfig = (
+  packageRoot: string,
+  options?: {
+    cacheBust?: boolean;
+  },
+) => Promise<AukletConfig>;
+export type ModuleStyleGraphRequestCacheOptions = {
+  workspaceRoot: string;
+  packagesDir: string;
+  config: ModuleStyleBuildConfig;
+  loadAukletConfig?: LoadAukletConfig;
+};
+export declare class ModuleStyleGraphRequestCache {
+  private readonly options;
+  private workspacePackages?;
+  private workspacePackageNames?;
+  private readonly contexts;
+  private readonly loadAukletConfig;
+  constructor(options: ModuleStyleGraphRequestCacheOptions);
+  getWorkspacePackageNames(): string[];
+  isWorkspacePackageName(packageName: string): boolean;
+  getContext(parsed: PackageStyleId): Promise<
+    | PackageStyleContext
+    | {
+        normalizedConfig: {
+          source: string;
+          output: string;
+          modules: boolean;
+          build: {
+            formats: Array<import('#auklet/types').PackageBuildFormat>;
+            target: import('#auklet/types').PackageBuildTarget;
+            platform: import('#auklet/types').PackageBuildPlatform;
+            banner?: string;
+            externals?: Array<string>;
+            tsconfig?: string;
+          };
+          styles: {
+            themes: {};
+            dependencies: {
+              [k: string]: {
+                entry: string | string[] | undefined;
+                themes: Record<string, string> | undefined;
+                components: string | string[] | undefined;
+              };
+            };
+          };
+        };
+        context: ResolvedModuleStyleBuildContext;
+        packageContext: StylePackageContext;
+        packageName: string;
+        configPath: string;
+        resolver: WorkspaceStyleResolver;
+        sourceRoot: string;
+        styleProcessor: StyleProcessor;
+      }
+    | null
+  >;
+  private createContext;
+  private getWorkspacePackages;
+}

package/dist/css/core/moduleGraphRequestCache.js

@@ -0,0 +1,92 @@
+import fs from 'node:fs';
+import path from 'node:path';
+import { aukletConfigFile, normalizeAukletConfig } from '#auklet/config';
+import { loadAukletConfig } from '#auklet/configLoader';
+import { StylePackageContext } from '#auklet/css/core/stylePackageContext';
+export class ModuleStyleGraphRequestCache {
+  options;
+  workspacePackages;
+  workspacePackageNames;
+  contexts = new Map();
+  loadAukletConfig;
+  constructor(options) {
+    this.options = options;
+    this.loadAukletConfig = options.loadAukletConfig ?? loadAukletConfig;
+  }
+  getWorkspacePackageNames() {
+    this.workspacePackageNames ??= this.getWorkspacePackages().map(
+      (item) => item.packageName,
+    );
+    return this.workspacePackageNames;
+  }
+  isWorkspacePackageName(packageName) {
+    return this.getWorkspacePackageNames().includes(packageName);
+  }
+  async getContext(parsed) {
+    const cachedContext = this.contexts.get(parsed.packageName);
+    if (cachedContext) return cachedContext;
+    const context = this.createContext(parsed);
+    this.contexts.set(parsed.packageName, context);
+    return context;
+  }
+  async createContext(parsed) {
+    const workspacePackage = this.getWorkspacePackages().find(
+      (item) => item.packageName === parsed.packageName,
+    );
+    if (!workspacePackage) return null;
+    const packageRoot = workspacePackage.packageRoot;
+    if (!fs.existsSync(packageRoot)) return null;
+    const rawConfig = await this.loadAukletConfig(packageRoot, {
+      cacheBust: true,
+    });
+    const normalizedConfig = normalizeAukletConfig(rawConfig);
+    const context = {
+      packageRoot,
+      sourceDir: normalizedConfig.source,
+      outputDir: normalizedConfig.output,
+    };
+    const packageContext = new StylePackageContext({
+      config: this.options.config,
+      context,
+      normalizedConfig,
+    });
+    return {
+      normalizedConfig,
+      context,
+      packageContext,
+      packageName: parsed.packageName,
+      configPath: path.join(packageRoot, aukletConfigFile),
+      resolver: packageContext.resolver,
+      sourceRoot: packageContext.sourceRoot,
+      styleProcessor: packageContext.styleProcessor,
+    };
+  }
+  getWorkspacePackages() {
+    if (this.workspacePackages) return this.workspacePackages;
+    const packagesRoot = path.join(
+      this.options.workspaceRoot,
+      this.options.packagesDir,
+    );
+    if (!fs.existsSync(packagesRoot)) {
+      this.workspacePackages = [];
+      return this.workspacePackages;
+    }
+    this.workspacePackages = fs
+      .readdirSync(packagesRoot, { withFileTypes: true })
+      .filter((entry) => entry.isDirectory())
+      .flatMap((entry) => {
+        const packageRoot = path.join(packagesRoot, entry.name);
+        const packageJsonPath = path.join(packageRoot, 'package.json');
+        if (!fs.existsSync(packageJsonPath)) return [];
+        const pkg = JSON.parse(fs.readFileSync(packageJsonPath, 'utf8'));
+        if (!pkg.name) return [];
+        return [
+          {
+            packageName: pkg.name,
+            packageRoot,
+          },
+        ];
+      });
+    return this.workspacePackages;
+  }
+}

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

@@ -1,4 +1,4 @@
-import type { CssOptions } from '#auklet/types';
+import type { NormalizedAukletConfig } from '#auklet/types';
 import type { WorkspaceStyleResolver } from '#auklet/css/core/workspaceStyleResolver';
 export declare class ModuleStyleImportCollector {
   private readonly srcRoot;
@@ -12,7 +12,10 @@ export declare class ModuleStyleImportCollector {
     resolver: WorkspaceStyleResolver,
     styleExtensions?: Array<string>,
   );
-  collect(files: Array<string>, cssOptions: CssOptions): Map<string, string[]>;
+  collect(
+    files: Array<string>,
+    config: NormalizedAukletConfig,
+  ): Map<string, string[]>;
   private getImportDeclarations;
   private collectSourceImportStyle;
   private resolveSourceImportStyleEntry;
@@ -24,6 +27,5 @@ export declare class ModuleStyleImportCollector {
   private getImportPathValues;
   private createStyleSpecifier;
   private createDirectStyleSpecifier;
-  private joinDependencySpecifier;
   private getImportedNames;
 }