@analogjs/vite-plugin-angular 3.0.0-alpha.5 → 3.0.0-alpha.50

package/src/lib/angular-vite-plugin.d.ts

@@ -1,48 +1,184 @@
-import { NgtscProgram } from '@angular/compiler-cli';
-import * as ts from 'typescript';
-import { Plugin } from 'vite';
-import { FileReplacement } from './plugins/file-replacements.plugin.js';
-export declare enum DiagnosticModes {
-    None = 0,
-    Option = 1,
-    Syntactic = 2,
-    Semantic = 4,
-    All = 7
-}
+import { NgtscProgram } from "@angular/compiler-cli";
+import * as ts from "typescript";
+import { ModuleNode, Plugin, ViteDevServer } from "vite";
+import type { StylePreprocessor } from "./style-preprocessor.js";
+import { type DebugOption } from "./utils/debug.js";
+import { FileReplacement } from "./plugins/file-replacements.plugin.js";
+import { AnalogStylesheetRegistry } from "./stylesheet-registry.js";
+import { AngularStylePipelineOptions } from "./style-pipeline.js";
+export { DiagnosticModes, injectViteIgnoreForHmrMetadata, isIgnoredHmrFile, toAngularCompilationFileReplacements, mapTemplateUpdatesToFiles, refreshStylesheetRegistryForFile, describeStylesheetContent, isTestWatchMode } from "./utils/compilation-shared.js";
+export { findStaticClassAndBoundClassConflicts, findBoundClassAndNgClassConflicts } from "./template-class-binding-guard-plugin.js";
+export { buildStylePreprocessor } from "./tailwind-plugin.js";
 export interface PluginOptions {
-    tsconfig?: string | (() => string);
-    workspaceRoot?: string;
-    inlineStylesExtension?: string;
-    jit?: boolean;
-    advanced?: {
-        /**
-         * Custom TypeScript transformers that are run before Angular compilation
-         */
-        tsTransformers?: ts.CustomTransformers;
-    };
-    supportedBrowsers?: string[];
-    transformFilter?: (code: string, id: string) => boolean;
-    /**
-     * Additional files to include in compilation
-     */
-    include?: string[];
-    additionalContentDirs?: string[];
-    liveReload?: boolean;
-    disableTypeChecking?: boolean;
-    fileReplacements?: FileReplacement[];
-    experimental?: {
-        useAngularCompilationAPI?: boolean;
-    };
+	tsconfig?: string | (() => string);
+	workspaceRoot?: string;
+	inlineStylesExtension?: string;
+	jit?: boolean;
+	advanced?: {
+		/**
+		* Custom TypeScript transformers that are run before Angular compilation
+		*/
+		tsTransformers?: ts.CustomTransformers;
+	};
+	supportedBrowsers?: string[];
+	transformFilter?: (code: string, id: string) => boolean;
+	/**
+	* Additional files to include in compilation
+	*/
+	include?: string[];
+	additionalContentDirs?: string[];
+	/**
+	* Enables Analog's Angular live-reload/HMR pipeline during development/watch mode.
+	*
+	* This is separate from Vite's `server.hmr` option, which configures the
+	* HMR client transport.
+	*
+	* Defaults to `true` for watch mode. Set to `false` to disable Angular
+	* reload updates while keeping other stylesheet externalization behavior
+	* available when needed.
+	*/
+	liveReload?: boolean;
+	disableTypeChecking?: boolean;
+	fileReplacements?: FileReplacement[];
+	/**
+	* Opt into the fast compile path. Skips Angular's template type-checking
+	* and routes compilation through an internal single-pass transform.
+	* Defaults to `false`.
+	*/
+	fastCompile?: boolean;
+	/**
+	* Compilation output mode used when `fastCompile` is enabled.
+	* - `'full'` (default): Emit final Ivy definitions for application builds.
+	* - `'partial'`: Emit partial declarations for library publishing.
+	*/
+	fastCompileMode?: "full" | "partial";
+	experimental?: {
+		useAngularCompilationAPI?: boolean;
+	};
+	/**
+	* Enable debug logging for specific scopes.
+	*
+	* - `true` → enables all `analog:angular:*` scopes
+	* - `string[]` → enables listed namespaces (e.g. `['analog:angular:tailwind']`)
+	* - `{ scopes?, mode? }` → object form with optional `mode: 'build' | 'dev'`
+	*   to restrict output to a specific Vite command (omit for both)
+	*
+	* Also responds to the `DEBUG` env var (Node.js) or `localStorage.debug`
+	* (browser), using the `obug` convention.
+	*/
+	debug?: DebugOption;
+	/**
+	* Optional preprocessor that transforms component CSS before it enters Vite's
+	* preprocessCSS pipeline. Runs on every component stylesheet (both external
+	* `.component.css` files and inline `styles: [...]` blocks).
+	*
+	* @param code - Raw CSS content of the component stylesheet
+	* @param filename - Resolved file path of the stylesheet (or containing .ts file for inline styles)
+	* @returns Transformed CSS string, or the original code if no transformation is needed
+	*/
+	stylePreprocessor?: StylePreprocessor;
+	/**
+	* Experimental Angular stylesheet-resource hooks for community-maintained
+	* style-pipeline plugins.
+	*
+	* These hooks run inside the Angular resource pipeline, which is the seam a
+	* standalone Vite plugin cannot own on its own.
+	*/
+	stylePipeline?: AngularStylePipelineOptions;
+	/**
+	* First-class Tailwind CSS v4 integration for Angular component styles.
+	*
+	* Angular's compiler processes component CSS through Vite's `preprocessCSS()`,
+	* which runs `@tailwindcss/vite` — but each component stylesheet is processed
+	* in isolation without access to the root Tailwind configuration (prefix, @theme,
+	* @custom-variant, @plugin definitions). This causes errors like:
+	*
+	*   "Cannot apply utility class `sa:grid` because the `sa` variant does not exist"
+	*
+	* The `tailwindCss` option solves this by auto-injecting a `@reference` directive
+	* into every component CSS file that uses Tailwind utilities, pointing it to the
+	* root Tailwind stylesheet so `@tailwindcss/vite` can resolve the full configuration.
+	*
+	* @example Basic usage — reference a root Tailwind CSS file:
+	* ```ts
+	* import { resolve } from 'node:path';
+	*
+	* angular({
+	*   tailwindCss: {
+	*     rootStylesheet: resolve(__dirname, 'src/styles/tailwind.css'),
+	*   },
+	* })
+	* ```
+	*
+	* @example With prefix detection — only inject for files using specific prefixes:
+	* ```ts
+	* angular({
+	*   tailwindCss: {
+	*     rootStylesheet: resolve(__dirname, 'src/styles/tailwind.css'),
+	*     // Only inject @reference into files that use these prefixed classes
+	*     prefixes: ['sa:', 'tw:'],
+	*   },
+	* })
+	* ```
+	*
+	* @example AnalogJS platform — passed through the `vite` option:
+	* ```ts
+	* analog({
+	*   vite: {
+	*     tailwindCss: {
+	*       rootStylesheet: resolve(__dirname, '../../../libs/meritos/tailwind.config.css'),
+	*     },
+	*   },
+	* })
+	* ```
+	*/
+	tailwindCss?: {
+		/**
+		* Absolute path to the root Tailwind CSS file that contains `@import "tailwindcss"`,
+		* `@theme`, `@custom-variant`, and `@plugin` definitions.
+		*
+		* A `@reference` directive pointing to this file will be auto-injected into
+		* component CSS files that use Tailwind utilities.
+		*/
+		rootStylesheet: string;
+		/**
+		* Optional list of class prefixes to detect (e.g. `['sa:', 'tw:']`).
+		* When provided, `@reference` is only injected into component CSS files that
+		* contain at least one of these prefixes. When omitted, `@reference` is injected
+		* into all component CSS files that contain `@apply` or `@` directives.
+		*
+		* @default undefined — inject into all component CSS files with `@apply`
+		*/
+		prefixes?: string[];
+	};
 }
+export declare function evictDeletedFileMetadata(file: string, { removeActiveGraphMetadata, removeStyleOwnerMetadata, classNamesMap, fileTransformMap }: {
+	removeActiveGraphMetadata: (file: string) => void;
+	removeStyleOwnerMetadata: (file: string) => void;
+	classNamesMap: Map<string, string>;
+	fileTransformMap: Map<string, string>;
+}): void;
 export declare function angular(options?: PluginOptions): Plugin[];
-export declare function getFileMetadata(program: ts.BuilderProgram, angularCompiler?: NgtscProgram['compiler'], liveReload?: boolean, disableTypeChecking?: boolean): (file: string) => {
-    errors?: string[];
-    warnings?: (string | ts.DiagnosticMessageChain)[];
-    hmrUpdateCode?: string | null;
-    hmrEligible?: boolean;
-};
+export declare function createFsWatcherCacheInvalidator(invalidateFsCaches: () => void, invalidateTsconfigCaches: () => void, performCompilation: () => Promise<void>): () => Promise<void>;
 /**
- * Checks for vitest run from the command line
- * @returns boolean
- */
-export declare function isTestWatchMode(args?: string[]): boolean;
+* Returns every live Vite module that can legitimately represent a changed
+* Angular resource file.
+*
+* For normal files, `getModulesByFile()` is enough. For Angular component
+* stylesheets, it is not: the browser often holds virtual hashed requests
+* (`/abc123.css?direct&ngcomp=...` and `/abc123.css?ngcomp=...`) that are no
+* longer discoverable from the original source path alone. We therefore merge:
+* - watcher event modules
+* - module-graph modules by source file
+* - registry-tracked live request ids resolved back through the module graph
+*/
+export declare function getModulesForChangedFile(server: ViteDevServer, file: string, eventModules?: readonly ModuleNode[], stylesheetRegistry?: AnalogStylesheetRegistry): Promise<ModuleNode[]>;
+export declare function isModuleForChangedResource(mod: ModuleNode, changedFile: string, stylesheetRegistry?: AnalogStylesheetRegistry): boolean;
+export declare function findComponentStylesheetWrapperModules(server: ViteDevServer, changedFile: string, directModule: ModuleNode, fileModules: ModuleNode[], stylesheetRegistry?: AnalogStylesheetRegistry): Promise<ModuleNode[]>;
+export declare function findTemplateOwnerModules(server: ViteDevServer, resourceFile: string): ModuleNode[];
+export declare function getFileMetadata(program: ts.BuilderProgram, angularCompiler?: NgtscProgram["compiler"], hmrEnabled?: boolean, disableTypeChecking?: boolean): (file: string) => {
+	errors?: string[];
+	warnings?: (string | ts.DiagnosticMessageChain)[];
+	hmrUpdateCode?: string | null;
+	hmrEligible?: boolean;
+};