auklet 0.2.4 → 0.2.5

package/README.md

@@ -161,6 +161,7 @@ export const config = defineConfig({
       light: './src/themes/light.css',
       dark: './src/themes/dark.css',
     },
+    shared: ['./src/internal/**/*.css'],
     dependencies: {
       '@scope/ui': {
         entry: '/style.css',
@@ -170,3 +171,15 @@ export const config = defineConfig({
   },
 });
 ```
+
+`styles.shared` declares same-package CSS fragments that component CSS may
+import directly. Matched files must live under the current source root. The
+pattern syntax is a small glob subset: `*`, `**`, and `?`.
+
+For example, `components/CodeBlock/index.css` may import
+`../../internal/syntaxHighlight.css` when it matches `styles.shared`; component
+CSS outputs inline that shared CSS and its local helper CSS imports, while
+package-level CSS dedupes repeated shared imports. Shared CSS cannot import
+component CSS or theme CSS. Component-to-component CSS imports are still
+rejected; package CSS dependencies should be expressed through
+`styles.dependencies`.

package/dist/config.d.ts

@@ -12,6 +12,7 @@ export declare const aukletDefaultOptions: {
     };
     styles: {
         themes: {};
+        shared: never[];
         dependencies: {};
     };
 };
@@ -33,6 +34,7 @@ export declare function normalizeAukletConfig(config?: AukletConfig): {
     };
     styles: {
         themes: {};
+        shared: string[];
         dependencies: {
             [k: string]: {
                 entry: string | string[] | undefined;

package/dist/config.js

@@ -1,3 +1,4 @@
+import { isArray, isString } from 'aidly';
 export const aukletConfigFiles = ['auklet.config.js', 'auklet.config.mjs'];
 export function isAukletConfigFile(file) {
     return aukletConfigFiles.includes(file);
@@ -13,6 +14,7 @@ export const aukletDefaultOptions = {
     },
     styles: {
         themes: {},
+        shared: [],
         dependencies: {},
     },
 };
@@ -21,6 +23,20 @@ const normalizeStyleDependency = (dependency) => ({
     themes: dependency.themes,
     components: dependency.components,
 });
+const normalizeStyleShared = (shared) => {
+    if (isArray(shared)) {
+        for (const pattern of shared) {
+            if (!isString(pattern)) {
+                throw new Error('[config] styles.shared must be a string or an array of strings.');
+            }
+        }
+        return shared;
+    }
+    if (shared && !isString(shared)) {
+        throw new Error('[config] styles.shared must be a string or an array of strings.');
+    }
+    return shared ? [shared] : [];
+};
 export function normalizeAukletConfig(config = {}) {
     const dependencies = config.styles?.dependencies ?? aukletDefaultOptions.styles.dependencies;
     return {
@@ -33,6 +49,7 @@ export function normalizeAukletConfig(config = {}) {
         },
         styles: {
             themes: config.styles?.themes ?? aukletDefaultOptions.styles.themes,
+            shared: normalizeStyleShared(config.styles?.shared ?? aukletDefaultOptions.styles.shared),
             dependencies: Object.fromEntries(Object.entries(dependencies).map(([packageName, dependency]) => [
                 packageName,
                 normalizeStyleDependency(dependency),

package/dist/css/core/style/shared.d.ts

@@ -0,0 +1,7 @@
+export type SharedStyleFileOptions = {
+    packageRoot: string;
+    sourceRoot: string;
+    styleFiles: Array<string>;
+    patterns: Array<string>;
+};
+export declare function createSharedStyleFileKeySet(options: SharedStyleFileOptions): Set<string>;

package/dist/css/core/style/shared.js

@@ -0,0 +1,59 @@
+import path from 'node:path';
+import { normalizeFileKey, toPosixPath } from '#auklet/utils';
+export function createSharedStyleFileKeySet(options) {
+    const patterns = options.patterns.map((pattern) => createSharedStyleMatcher(options, pattern));
+    if (!patterns.length)
+        return new Set();
+    return new Set(options.styleFiles
+        .filter((styleFile) => patterns.some((matcher) => matcher(styleFile)))
+        .map((styleFile) => normalizeFileKey(styleFile)));
+}
+const createSharedStyleMatcher = (options, pattern) => {
+    const absolutePattern = normalizePatternPath(path.resolve(options.packageRoot, pattern));
+    if (!isInsideSourceRoot(absolutePattern, options.sourceRoot)) {
+        throw new Error(`[css] styles.shared pattern must resolve under source root: ${pattern}`);
+    }
+    const matcher = globToRegExp(absolutePattern);
+    return (file) => matcher.test(normalizeFileKey(file));
+};
+const normalizePatternPath = (value) => {
+    return toPosixPath(path.normalize(value));
+};
+const isInsideSourceRoot = (file, sourceRoot) => {
+    const relative = path.relative(sourceRoot, file);
+    return (Boolean(relative) &&
+        !relative.startsWith('..') &&
+        !path.isAbsolute(relative));
+};
+const globToRegExp = (pattern) => {
+    let source = '^';
+    for (let index = 0; index < pattern.length; index += 1) {
+        const char = pattern[index];
+        const nextChar = pattern[index + 1];
+        if (char === '*' && nextChar === '*') {
+            const afterGlob = pattern[index + 2];
+            if (afterGlob === '/') {
+                source += '(?:.*/)?';
+                index += 2;
+            }
+            else {
+                source += '.*';
+                index += 1;
+            }
+            continue;
+        }
+        if (char === '*') {
+            source += '[^/]*';
+            continue;
+        }
+        if (char === '?') {
+            source += '[^/]';
+            continue;
+        }
+        source += escapeRegExp(char);
+    }
+    return new RegExp(`${source}$`);
+};
+const escapeRegExp = (value) => {
+    return value.replace(/[|\\{}()[\]^$+?.]/g, '\\$&');
+};

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

@@ -26,4 +26,7 @@ export declare class StyleModuleEntryPlanner {
     private rejectCrossModuleStyleImports;
     private getStyleFileModuleDir;
     private toRelativeSourceFile;
+    private isImportedStyleFile;
+    private isSharedStyleFile;
+    private isInsideSourceRoot;
 }

package/dist/css/core/styleModuleEntryPlanner.js

@@ -42,11 +42,13 @@ export class StyleModuleEntryPlanner {
     }
     getOwnStyleDirs() {
         return Array.from(this.styleFilesByDir.entries())
-            .filter(([, dirStyleFiles]) => dirStyleFiles.some((styleFile) => !this.importedStyleFiles.has(path.resolve(styleFile))))
+            .filter(([, dirStyleFiles]) => dirStyleFiles.some((styleFile) => !this.isImportedStyleFile(styleFile) &&
+            !this.isSharedStyleFile(styleFile)))
             .map(([sourceDir]) => sourceDir);
     }
     getOwnStyleFiles(sourceDir) {
-        return (this.styleFilesByDir.get(sourceDir) ?? []).filter((styleFile) => !this.importedStyleFiles.has(path.resolve(styleFile)));
+        return (this.styleFilesByDir.get(sourceDir) ?? []).filter((styleFile) => !this.isImportedStyleFile(styleFile) &&
+            !this.isSharedStyleFile(styleFile));
     }
     rejectCrossModuleStyleImports() {
         if (!this.packageContext.normalizedConfig.modules)
@@ -54,6 +56,19 @@ export class StyleModuleEntryPlanner {
         const styleFileKeys = new Set(this.packageContext.styleFiles.map((file) => path.resolve(file)));
         const imports = this.packageContext.styleProcessor.collectImportedStyleFileReferences(this.packageContext.styleFiles);
         for (const item of imports) {
+            if (!this.isInsideSourceRoot(item.imported)) {
+                const importer = this.toRelativeSourceFile(item.importer);
+                const imported = toPosixPath(item.imported);
+                throw new Error(`[css] cross-package CSS import detected: ${importer} imports ${imported}. ` +
+                    'Use styles.dependencies to express package style dependencies.');
+            }
+            if (this.packageContext.shouldInlineSharedStyleImport(item))
+                continue;
+            if (this.packageContext.isSharedStyleFile(item.importer)) {
+                const importer = this.toRelativeSourceFile(item.importer);
+                const imported = this.toRelativeSourceFile(item.imported);
+                throw new Error(`[css] shared CSS import must target non-module source CSS: ${importer} imports ${imported}.`);
+            }
             if (!styleFileKeys.has(item.imported))
                 continue;
             const importerModuleDir = this.getStyleFileModuleDir(item.importer);
@@ -82,4 +97,14 @@ export class StyleModuleEntryPlanner {
     toRelativeSourceFile(file) {
         return toPosixPath(path.relative(this.packageContext.sourceRoot, file));
     }
+    isImportedStyleFile(styleFile) {
+        return this.importedStyleFiles.has(path.resolve(styleFile));
+    }
+    isSharedStyleFile(styleFile) {
+        return this.packageContext.isSharedStyleFile(styleFile);
+    }
+    isInsideSourceRoot(file) {
+        const relative = path.relative(this.packageContext.sourceRoot, file);
+        return relative && !relative.startsWith('..') && !path.isAbsolute(relative);
+    }
 }

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

@@ -1,6 +1,6 @@
 import { ModuleStyleImportCollector } from '#auklet/css/core/styleImports/collector';
 import { StyleModuleEntryPlanner } from '#auklet/css/core/styleModuleEntryPlanner';
-import { StyleProcessor } from '#auklet/css/core/styleProcessor';
+import { type StyleFileImportReference, StyleProcessor } from '#auklet/css/core/styleProcessor';
 import { WorkspaceStyleResolver } from '#auklet/css/core/workspaceStyleResolver';
 import type { ModuleStyleBuildConfig, NormalizedAukletConfig, ResolvedModuleStyleBuildContext } from '#auklet/types';
 export type StylePackageContextOptions = {
@@ -19,10 +19,21 @@ export declare class StylePackageContext {
     readonly themeFiles: Map<string, string>;
     readonly themeNames: Array<string>;
     readonly styleFiles: Array<string>;
+    private readonly sourceModuleDirs;
+    private readonly themeStyleFileKeys;
+    private readonly sharedStyleFileKeys;
     private moduleStyleEntryPlanner?;
     private moduleStyleImports?;
     constructor(options: StylePackageContextOptions);
     getStyleFiles(files: Array<string>): string[];
     getModuleStyleImports(): Map<string, string[]>;
     getModuleStyleEntryPlanner(): StyleModuleEntryPlanner;
+    isSharedStyleFile(file: string): boolean;
+    shouldInlineSharedStyleImport(reference: StyleFileImportReference): boolean;
+    private isSharedHelperStyleFile;
+    private getSourceModuleDirs;
+    private isSourceModuleStyleFile;
+    private isThemeStyleFile;
+    private isInsideSourceRoot;
+    private toSourceRelativePath;
 }

package/dist/css/core/stylePackageContext.js

@@ -1,12 +1,14 @@
 import fs from 'node:fs';
 import path from 'node:path';
+import { SOURCE_MODULE_RE } from '#auklet/css/constants';
 import { ModuleStyleImportCollector } from '#auklet/css/core/styleImports/collector';
 import { StyleModuleEntryPlanner } from '#auklet/css/core/styleModuleEntryPlanner';
-import { StyleProcessor } from '#auklet/css/core/styleProcessor';
+import { StyleProcessor, } from '#auklet/css/core/styleProcessor';
 import { WorkspaceStyleResolver } from '#auklet/css/core/workspaceStyleResolver';
 import { createStyleFileKeySet } from '#auklet/css/core/style/files';
+import { createSharedStyleFileKeySet } from '#auklet/css/core/style/shared';
 import { getThemeNames, resolveThemeStyleFiles, } from '#auklet/css/core/style/dependencies';
-import { fileWalker, normalizeFileKey } from '#auklet/utils';
+import { fileWalker, getSourceModuleDir, normalizeFileKey, toPosixPath, } from '#auklet/utils';
 export class StylePackageContext {
     options;
     normalizedConfig;
@@ -18,6 +20,9 @@ export class StylePackageContext {
     themeFiles;
     themeNames;
     styleFiles;
+    sourceModuleDirs;
+    themeStyleFileKeys;
+    sharedStyleFileKeys;
     moduleStyleEntryPlanner;
     moduleStyleImports;
     constructor(options) {
@@ -33,13 +38,20 @@ export class StylePackageContext {
             : [];
         this.themeFiles = resolveThemeStyleFiles(normalizedConfig, context.packageRoot);
         this.themeNames = getThemeNames(normalizedConfig);
+        this.themeStyleFileKeys = createStyleFileKeySet(this.themeFiles.values());
+        this.sourceModuleDirs = this.getSourceModuleDirs(this.sourceFiles);
         this.styleFiles = this.getStyleFiles(this.sourceFiles);
+        this.sharedStyleFileKeys = createSharedStyleFileKeySet({
+            packageRoot: context.packageRoot,
+            sourceRoot: this.sourceRoot,
+            styleFiles: this.styleFiles,
+            patterns: normalizedConfig.styles.shared,
+        });
     }
     getStyleFiles(files) {
-        const themeFileKeys = createStyleFileKeySet(this.themeFiles.values());
         return files
             .filter((file) => this.options.config.styleExtensions.includes(path.extname(file)))
-            .filter((styleFile) => !themeFileKeys.has(normalizeFileKey(styleFile)));
+            .filter((styleFile) => !this.themeStyleFileKeys.has(normalizeFileKey(styleFile)));
     }
     getModuleStyleImports() {
         this.moduleStyleImports ??= this.importCollector.collect(this.sourceFiles, this.normalizedConfig);
@@ -49,4 +61,49 @@ export class StylePackageContext {
         this.moduleStyleEntryPlanner ??= new StyleModuleEntryPlanner(this);
         return this.moduleStyleEntryPlanner;
     }
+    isSharedStyleFile(file) {
+        return this.sharedStyleFileKeys.has(normalizeFileKey(file));
+    }
+    shouldInlineSharedStyleImport(reference) {
+        return ((this.isSharedStyleFile(reference.imported) &&
+            this.isSharedHelperStyleFile(reference.imported)) ||
+            (this.isSharedStyleFile(reference.importer) &&
+                this.isSharedHelperStyleFile(reference.imported)));
+    }
+    isSharedHelperStyleFile(file) {
+        return (this.isInsideSourceRoot(file) &&
+            !this.isThemeStyleFile(file) &&
+            !this.isSourceModuleStyleFile(file));
+    }
+    getSourceModuleDirs(files) {
+        return new Set(files
+            .filter((file) => SOURCE_MODULE_RE.test(file))
+            .map((sourceFile) => toPosixPath(getSourceModuleDir(path.relative(this.sourceRoot, sourceFile)))));
+    }
+    isSourceModuleStyleFile(file) {
+        const sourceRelative = this.toSourceRelativePath(file);
+        if (!sourceRelative)
+            return false;
+        const styleModuleDir = toPosixPath(getSourceModuleDir(sourceRelative));
+        if (this.sourceModuleDirs.has(styleModuleDir))
+            return true;
+        for (const sourceModuleDir of this.sourceModuleDirs) {
+            if (sourceRelative.startsWith(`${sourceModuleDir}/`))
+                return true;
+        }
+        return false;
+    }
+    isThemeStyleFile(file) {
+        return this.themeStyleFileKeys.has(normalizeFileKey(file));
+    }
+    isInsideSourceRoot(file) {
+        return this.toSourceRelativePath(file) !== null;
+    }
+    toSourceRelativePath(file) {
+        const relative = path.relative(this.sourceRoot, file);
+        if (!relative || relative.startsWith('..') || path.isAbsolute(relative)) {
+            return null;
+        }
+        return toPosixPath(relative);
+    }
 }

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

@@ -5,6 +5,9 @@ export type StyleFileImportReference = {
     importer: string;
     imported: string;
 };
+export type StyleFileImportExpandOptions = {
+    shouldExpandImport?: (reference: StyleFileImportReference) => boolean;
+};
 export declare class StyleProcessor {
     private readonly config;
     private readonly resolver;
@@ -13,7 +16,7 @@ export declare class StyleProcessor {
     appendImportRule(root: Root, specifier: string): void;
     stringify(root: Root): string;
     appendStyleContent(target: Root, content: string, from: string): void;
-    readStyleFile(stylePath: string, seen?: Set<string>): string;
+    readStyleFile(stylePath: string, seen?: Set<string>, options?: StyleFileImportExpandOptions): string;
     collectImportedStyleFiles(styleFiles: Array<string>): Set<string>;
     collectImportedStyleFileReferences(styleFiles: Array<string>): StyleFileImportReference[];
     collectStyleImportSpecifiers(styleFiles: Array<string>): Set<string>;

package/dist/css/core/styleProcessor.js

@@ -32,7 +32,7 @@ export class StyleProcessor {
         }
         target.append(...(root.nodes ?? []));
     }
-    readStyleFile(stylePath, seen = new Set()) {
+    readStyleFile(stylePath, seen = new Set(), options = {}) {
         if (!fs.existsSync(stylePath)) {
             return '';
         }
@@ -52,7 +52,13 @@ export class StyleProcessor {
             const importedPath = this.resolver.resolveStyleDependency(specifier, path.dirname(stylePath));
             if (!importedPath)
                 continue;
-            const content = this.readStyleFile(importedPath, seen);
+            const reference = {
+                importer: normalizedPath,
+                imported: path.resolve(importedPath),
+            };
+            if (options.shouldExpandImport?.(reference) === false)
+                continue;
+            const content = this.readStyleFile(importedPath, seen, options);
             if (!content.trim()) {
                 rule.remove();
                 continue;

package/dist/css/production/format/sourceWriter.d.ts

@@ -1,6 +1,8 @@
 import { type FormatWriterOptions } from '#auklet/css/production/format/shared';
 export declare class SourceStyleFileWriter {
     private readonly sourceRoot;
+    private readonly packageContext;
+    private readonly styleProcessor;
     constructor(options: FormatWriterOptions);
     copy(files: Array<string>, outRoot: string): void;
 }

package/dist/css/production/format/sourceWriter.js

@@ -1,16 +1,22 @@
-import fs from 'node:fs';
 import path from 'node:path';
 import { writeStyleFile, } from '#auklet/css/production/format/shared';
 export class SourceStyleFileWriter {
     sourceRoot;
+    packageContext;
+    styleProcessor;
     constructor(options) {
         this.sourceRoot = options.packageContext.sourceRoot;
+        this.packageContext = options.packageContext;
+        this.styleProcessor = options.packageContext.styleProcessor;
     }
     copy(files, outRoot) {
         for (const sourceFile of files) {
             const relative = path.relative(this.sourceRoot, sourceFile);
             const target = path.join(outRoot, relative);
-            writeStyleFile(target, fs.readFileSync(sourceFile, 'utf8'));
+            const content = this.styleProcessor.readStyleFile(sourceFile, undefined, {
+                shouldExpandImport: (reference) => this.packageContext.shouldInlineSharedStyleImport(reference),
+            });
+            writeStyleFile(target, content);
         }
     }
 }

package/dist/css/vite/moduleGraph/requestCache.d.ts

@@ -53,6 +53,7 @@ export declare class ModuleStyleGraphRequestCache {
             };
             styles: {
                 themes: {};
+                shared: string[];
                 dependencies: {
                     [k: string]: {
                         entry: string | string[] | undefined;

package/dist/types.d.ts

@@ -6,6 +6,7 @@ export type StyleDependencyGroup = {
 };
 export type StyleOptions = {
     themes?: Record<string, string>;
+    shared?: string | Array<string>;
     dependencies?: Record<string, StyleDependencyGroup>;
 };
 export type NormalizedStyleDependencyGroup = {
@@ -19,6 +20,7 @@ export interface NormalizedAukletConfig {
     modules: boolean;
     styles: {
         themes: Record<string, string>;
+        shared: Array<string>;
         dependencies: Record<string, NormalizedStyleDependencyGroup>;
     };
     build: Required<Pick<PackageBuildOptions, 'formats' | 'target' | 'platform'>>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "auklet",
-  "version": "0.2.4",
+  "version": "0.2.5",
   "type": "module",
   "author": "chentao.arthur",
   "description": "Build utilities for TypeScript packages and module CSS output.",