design-embed 0.1.1 → 0.2.0

package/src/core/pipeline/checkMode.ts

@@ -0,0 +1,46 @@
+import { resolve } from "node:path";
+import type { Diagnostic } from "../diagnostics/diagnostic.ts";
+import type { GeneratedFile } from "../index.ts";
+
+export interface CheckModeInput {
+	files: GeneratedFile[];
+	cwd: string;
+	readFile(path: string): string | undefined;
+}
+
+export interface CheckModeResult {
+	ok: boolean;
+	diagnostics: Diagnostic[];
+}
+
+export function checkGeneratedFiles(input: CheckModeInput): CheckModeResult {
+	const diagnostics: Diagnostic[] = [];
+
+	for (const file of input.files) {
+		const absolutePath = resolve(input.cwd, file.path);
+		const current = input.readFile(absolutePath);
+		if (current === undefined) {
+			diagnostics.push({
+				code: "CHECK_FILE_MISSING",
+				message: `Generated file is missing: ${file.path}`,
+				severity: "error",
+				file: file.path,
+			});
+			continue;
+		}
+
+		if (current !== file.contents) {
+			diagnostics.push({
+				code: "CHECK_FILE_STALE",
+				message: `Generated file is stale: ${file.path}`,
+				severity: "error",
+				file: file.path,
+			});
+		}
+	}
+
+	return {
+		ok: diagnostics.length === 0,
+		diagnostics,
+	};
+}

package/src/core/plugins/pluginApi.ts

@@ -0,0 +1,44 @@
+import type { Diagnostic } from "../diagnostics/diagnostic.ts";
+
+/**
+ * Represents a file generated by the compiler.
+ */
+export interface GeneratedFile {
+	/** Relative path from the output directory. */
+	path: string;
+	/** File content. */
+	contents: string;
+}
+
+export interface GeneratedAsset {
+	path: string;
+	contents?: string | Uint8Array;
+	sourceUrl?: string;
+}
+
+export interface SourcePlugin {
+	name: string;
+	run(input: SourcePluginInput): Promise<SourcePluginResult>;
+}
+
+export interface SourcePluginInput {
+	cwd: string;
+	config?: unknown;
+}
+
+export interface SourcePluginResult {
+	html?: string;
+	css?: string;
+	assets?: GeneratedAsset[];
+	files?: GeneratedFile[];
+	diagnostics: Diagnostic[];
+}
+
+export interface TargetEmitResult {
+	files: GeneratedFile[];
+}
+
+export interface TargetTestGenerateResult {
+	files: GeneratedFile[];
+	diagnostics: Diagnostic[];
+}

package/src/core/types.ts

@@ -0,0 +1,120 @@
+import type { Diagnostic } from "./diagnostics/diagnostic.ts";
+import type { DesignNode } from "./nodes.ts";
+import type {
+	SourcePlugin,
+	TargetEmitResult,
+	TargetTestGenerateResult,
+} from "./plugins/pluginApi.ts";
+
+// ---------------------------------------------------------------------------
+// Target adapter interfaces
+// ---------------------------------------------------------------------------
+
+export interface TargetEmitInput {
+	nodes: DesignNode[];
+	css?: string;
+	config?: DesignEmbedConfig;
+	diagnostics: Diagnostic[];
+}
+
+export interface TargetEmitter {
+	emit(input: TargetEmitInput): TargetEmitResult;
+}
+
+export interface TargetTestGenerateInput {
+	html: string;
+	css?: string;
+	config: DesignEmbedConfig;
+}
+
+export interface TargetTestGenerator {
+	generateTests(input: TargetTestGenerateInput): TargetTestGenerateResult;
+}
+
+// ---------------------------------------------------------------------------
+// Configuration types
+// ---------------------------------------------------------------------------
+
+export type StyleMode = "inline" | "css-modules" | "tailwind";
+
+export interface ComponentMapping {
+	selector: string;
+	component: string;
+	props?: Record<string, string>;
+}
+
+export interface TokenConfig {
+	spacing?: {
+		unit?: "px" | "rem";
+		threshold?: number;
+		values?: Record<string, number>;
+	};
+	sizing?: NumericTokenGroup;
+	typography?: NumericTokenGroup;
+	radius?: Record<string, number>;
+	borderWidth?: Record<string, number>;
+	shadow?: Record<string, string>;
+	colors?: Record<string, string>;
+	colorThreshold?: number;
+}
+
+export interface NumericTokenGroup {
+	unit?: "px" | "rem";
+	threshold?: number;
+	values?: Record<string, number>;
+}
+
+export type StyleMappings = Record<string, Record<string, string>>;
+
+export interface TestGenerationConfig {
+	outputDir?: string;
+	runner?: "playwright";
+	viewports?: TestViewport[];
+	states?: TestState[];
+	assertions?: TestAssertions;
+}
+
+export interface TestViewport {
+	name?: string;
+	width: number;
+	height: number;
+}
+
+export interface TestState {
+	name: string;
+	hover?: string;
+	focus?: string;
+	click?: string;
+	waitFor?: string;
+}
+
+export interface TestAssertions {
+	screenshot?: boolean;
+	layout?: boolean;
+	layoutTolerance?: number;
+	selectors?: string[];
+	/**
+	 * Per-pixel color sensitivity (0-1) for the screenshot comparison. Smaller
+	 * is stricter. Defaults to 0.2.
+	 */
+	screenshotThreshold?: number;
+	/**
+	 * Maximum number of differing pixels tolerated in the screenshot
+	 * comparison. Defaults to 0 (byte-exact).
+	 */
+	screenshotMaxDiffPixels?: number;
+}
+
+export interface DesignEmbedConfig {
+	output?: {
+		viewsDir?: string | URL;
+		target?: "html" | TargetEmitter;
+		viewName?: string;
+		styleMode?: StyleMode;
+	};
+	components?: ComponentMapping[];
+	tokens?: TokenConfig;
+	styleMappings?: StyleMappings;
+	source?: SourcePlugin;
+	tests?: TestGenerationConfig;
+}

package/src/index.ts

@@ -1,2 +1,48 @@
-export * from "@design-embed/config";
-export * from "@design-embed/core";
+// Config
+
+export type { LoadConfigResult } from "./config/index.ts";
+export {
+	defineConfig,
+	fromFile,
+	loadConfig,
+	validateConfig,
+} from "./config/index.ts";
+// Config schema types
+// Diagnostics
+// Extension types — for authoring source plugins and custom targets
+export type {
+	ComponentMapping,
+	DesignEmbedConfig,
+	DesignEmbedInput,
+	DesignEmbedResult,
+	DesignNode,
+	Diagnostic,
+	DiagnosticSeverity,
+	GeneratedAsset,
+	GeneratedFile,
+	NumericTokenGroup,
+	PropValue,
+	SourceLocation,
+	SourcePlugin,
+	SourcePluginInput,
+	SourcePluginResult,
+	StyleMappings,
+	StyleMode,
+	TargetEmitInput,
+	TargetEmitResult,
+	TargetEmitter,
+	TargetTestGenerateInput,
+	TargetTestGenerateResult,
+	TargetTestGenerator,
+	TestAssertions,
+	TestGenerationConfig,
+	TestState,
+	TestViewport,
+	TokenConfig,
+} from "./core/index.ts";
+// Embed
+// AST utilities and types — for custom target authors
+export { applyComponentMappings, embed, parseHtml } from "./core/index.ts";
+export type { HtmlTargetOptions } from "./targets/html.ts";
+// Built-in HTML target
+export { HtmlTarget, htmlTarget } from "./targets/html.ts";