handoff-app 2.0.0-9 → 2.0.1

package/dist/registry/path.js

@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.resolvePathWithin = exports.isSafePathSegment = exports.normalizeRelativePath = exports.isSafeRelativePath = void 0;
+exports.resolvePathWithin = exports.isSafePathSegment = exports.isWorkspaceRelativePath = exports.normalizeRelativePath = exports.isSafeRelativePath = void 0;
 const path_1 = __importDefault(require("path"));
 const isSafeRelativePath = (value) => {
     if (typeof value !== 'string' || value.trim() === '') {
@@ -18,6 +18,16 @@ const isSafeRelativePath = (value) => {
 exports.isSafeRelativePath = isSafeRelativePath;
 const normalizeRelativePath = (value) => value.replace(/\\/g, '/');
 exports.normalizeRelativePath = normalizeRelativePath;
+/** Unlike {@link isSafeRelativePath}, it can start with `../`. */
+const isWorkspaceRelativePath = (value) => typeof value === 'string' &&
+    value !== '' &&
+    value !== '.' &&
+    !value.includes('\0') &&
+    !value.includes('\\') &&
+    !value.startsWith('/') &&
+    !/^[a-zA-Z]:/.test(value) &&
+    path_1.default.posix.normalize(value) === value;
+exports.isWorkspaceRelativePath = isWorkspaceRelativePath;
 const isSafePathSegment = (value) => typeof value === 'string' && value === value.trim() && (0, exports.isSafeRelativePath)(value) && !(0, exports.normalizeRelativePath)(value).includes('/');
 exports.isSafePathSegment = isSafePathSegment;
 const resolvePathWithin = (root, value) => {

package/dist/registry/publish/errors.js

@@ -4,6 +4,10 @@ exports.describePublishError = exports.describeUploadFailure = void 0;
 const client_1 = require("../client");
 /** Map registry error codes to the actionable messages used by publish commands. */
 const describeUploadFailure = (error, registryUrl, rejectedPayload) => {
+    // An oversized body is rejected by the platform or body parser, so the response has no error envelope.
+    if (error.status === 413) {
+        return `The registry at ${registryUrl} rejected the ${rejectedPayload} as too large (413). Reduce the size of its largest files and publish again.`;
+    }
     switch (error.code) {
         case 'runtime_mode_conflict':
             return `The registry at ${registryUrl} is not running in registry mode, so it cannot accept publishes: ${error.message}`;

package/dist/registry/publish/index.js

@@ -160,6 +160,7 @@ const publishEntity = (handoff, kind, id) => __awaiter(void 0, void 0, void 0, f
     }
     const pkg = yield (0, package_1.buildPublishPackage)(handoff, kind, id);
     (0, package_1.assertRequiredArtifactsPresent)(pkg);
+    (0, package_1.assertPackageWithinUploadLimit)(kind, id, pkg);
     const contents = `${pkg.artifacts.length} artifact(s), ${pkg.files.length} source file(s)`;
     if (!client) {
         logger_1.Logger.info(`Would publish ${kind} "${id}" (${contents}).`);
@@ -251,6 +252,7 @@ const uploadEntities = (handoff, transport, kind, ids) => __awaiter(void 0, void
         try {
             const pkg = yield (0, package_1.buildPublishPackage)(handoff, kind, id);
             (0, package_1.assertRequiredArtifactsPresent)(pkg);
+            (0, package_1.assertPackageWithinUploadLimit)(kind, id, pkg);
             const remoteHash = remoteHashById.get(id);
             const localHash = entityHash(pkg.build);
             if (!handoff.force && remoteHash && localHash && remoteHash === localHash) {

package/dist/registry/publish/package.d.ts

@@ -23,5 +23,11 @@ export declare class PublishPackageError extends Error {
  * upload, so a publish fails locally (no network call) on a missing required artifact.
  */
 export declare const assertRequiredArtifactsPresent: (pkg: TransferPackage) => void;
+/**
+ * The largest publish request body the registry accepts. Vercel rejects a larger function body with
+ * `413 FUNCTION_PAYLOAD_TOO_LARGE`, and the transfer route's `bodyParser.sizeLimit` matches it.
+ */
+export declare const MAX_PUBLISH_BODY_BYTES = 4500000;
+export declare const assertPackageWithinUploadLimit: (kind: TransferEntityKind, id: string, pkg: TransferPackage) => void;
 /** Assemble the publish package for an entity from the generated `public/api` artifacts. */
 export declare const buildPublishPackage: (handoff: Handoff, kind: TransferEntityKind, id: string) => Promise<TransferPackage>;

package/dist/registry/publish/package.js

@@ -37,7 +37,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.buildPublishPackage = exports.assertRequiredArtifactsPresent = exports.PublishPackageError = void 0;
+exports.buildPublishPackage = exports.assertPackageWithinUploadLimit = exports.MAX_PUBLISH_BODY_BYTES = exports.assertRequiredArtifactsPresent = exports.PublishPackageError = void 0;
 const fs_extra_1 = __importDefault(require("fs-extra"));
 const path_1 = __importDefault(require("path"));
 const source_files_1 = require("../../store/source-files");
@@ -97,6 +97,12 @@ const enrichItem = (handoff, kind, id, summary) => __awaiter(void 0, void 0, voi
     }
     return item;
 });
+const findSourceDir = (handoff, kind, id) => __awaiter(void 0, void 0, void 0, function* () {
+    const runtime = kind === 'component' ? yield handoff.store.components.get(id) : yield handoff.store.patterns.get(id);
+    const sourceDir = runtime === null || runtime === void 0 ? void 0 : runtime.path;
+    const relativeDir = sourceDir ? path_1.default.relative(handoff.workingPath, sourceDir) : '';
+    return relativeDir && !path_1.default.isAbsolute(relativeDir) ? relativeDir.split(path_1.default.sep).join('/') : undefined;
+});
 /** Map an entity's related source files to transfer files, dropping workspace-only declarations. */
 const collectSourceFiles = (handoff, kind, id) => __awaiter(void 0, void 0, void 0, function* () {
     const store = kind === 'component' ? handoff.store.components : kind === 'pattern' ? handoff.store.patterns : handoff.store.pages;
@@ -164,6 +170,7 @@ const buildComponentPackage = (handoff, id) => __awaiter(void 0, void 0, void 0,
     const artifacts = Array.from(byPath.values());
     return {
         item: yield enrichItem(handoff, 'component', id, summary),
+        sourceDir: yield findSourceDir(handoff, 'component', id),
         files: yield collectSourceFiles(handoff, 'component', id),
         artifacts,
         build: createArtifactBuild(artifacts),
@@ -206,6 +213,7 @@ const buildPatternPackage = (handoff, id) => __awaiter(void 0, void 0, void 0, f
     const artifacts = Array.from(byPath.values());
     return {
         item: yield enrichItem(handoff, 'pattern', id, summary),
+        sourceDir: yield findSourceDir(handoff, 'pattern', id),
         files: yield collectSourceFiles(handoff, 'pattern', id),
         artifacts,
         build: createArtifactBuild(artifacts),
@@ -261,6 +269,26 @@ const assertRequiredArtifactsPresent = (pkg) => {
     }
 };
 exports.assertRequiredArtifactsPresent = assertRequiredArtifactsPresent;
+/**
+ * The largest publish request body the registry accepts. Vercel rejects a larger function body with
+ * `413 FUNCTION_PAYLOAD_TOO_LARGE`, and the transfer route's `bodyParser.sizeLimit` matches it.
+ */
+exports.MAX_PUBLISH_BODY_BYTES = 4500000;
+const formatMegabytes = (bytes) => `${(bytes / 1000000).toFixed(1)} MB`;
+const assertPackageWithinUploadLimit = (kind, id, pkg) => {
+    const size = Buffer.byteLength(JSON.stringify(pkg));
+    if (size <= exports.MAX_PUBLISH_BODY_BYTES)
+        return;
+    const largest = [...pkg.artifacts, ...pkg.files]
+        .map((entry) => ({ path: entry.path, size: Buffer.byteLength(entry.content) }))
+        .sort((a, b) => b.size - a.size)
+        .slice(0, 3)
+        .map((entry) => `  - ${entry.path} (${formatMegabytes(entry.size)})`)
+        .join('\n');
+    throw new PublishPackageError(`The ${kind} "${id}" package is ${formatMegabytes(size)}; the registry accepts at most ` +
+        `${formatMegabytes(exports.MAX_PUBLISH_BODY_BYTES)} per publish. Largest entries:\n${largest}`);
+};
+exports.assertPackageWithinUploadLimit = assertPackageWithinUploadLimit;
 /** Assemble the publish package for an entity from the generated `public/api` artifacts. */
 const buildPublishPackage = (handoff, kind, id) => kind === 'component'
     ? buildComponentPackage(handoff, id)

package/dist/registry/transfer.d.ts

@@ -59,6 +59,8 @@ export interface TransferBuild {
 export interface TransferPackage {
     /** Normalized component, pattern, or page record stored as the served record. */
     item: Record<string, unknown>;
+    /** Workspace-relative entity directory, for components and patterns. It can start with `../`. */
+    sourceDir?: string;
     files: TransferFile[];
     artifacts: TransferArtifact[];
     build: TransferBuild;
@@ -71,6 +73,8 @@ export interface CheckoutPayload {
     kind: TransferEntityKind;
     /** Normalized record used to reconstruct the entity. */
     item: Record<string, unknown>;
+    /** The published {@link TransferPackage.sourceDir}. */
+    sourceDir?: string;
     files: TransferFile[];
 }
 /**

package/dist/store/registry.d.ts

@@ -13,7 +13,7 @@
  * - Reads never materialize source files or run the build pipeline — every record and file is
  *   returned exactly as it was published.
  */
-import type { AssetStorage } from '../registry/asset-storage/types';
+import type { StorageProvider } from '../registry/asset-storage/types';
 import type { RegistryDatabase } from '../registry/db/client';
 import { type AssetStorageProvider } from '../registry/db/schema';
 import type { ComponentListObject, PageListObject, PatternListObject } from '../transformers/preview/types';
@@ -22,11 +22,11 @@ import type { AssetContentResource, AssetMetadata, AssetStore, ComponentStore, H
 export interface RegistryStoreContext {
     db: RegistryDatabase;
     /**
-     * Resolve the {@link AssetStorage} adapter for a blob's recorded provider (or `null` for the inline
+     * Resolve the {@link StorageProvider} for a blob's recorded provider (or `null` for the inline
      * `database` provider). Injected by the app runtime so `src/store` stays free of app-side imports;
      * when omitted, only inline DB-backed asset content is resolvable.
      */
-    resolveAssetAdapter?: (provider: AssetStorageProvider) => Promise<AssetStorage | null>;
+    resolveStorageProvider?: (provider: AssetStorageProvider) => Promise<StorageProvider | null>;
 }
 export declare class RegistryComponentStore implements ComponentStore {
     private readonly context;

package/dist/store/registry.js

@@ -404,14 +404,14 @@ class RegistryAssetStore {
                 return Object.assign(Object.assign({}, base), { body: Buffer.from(row.blobContent) });
             }
             // Object-backed - resolve through the provider that stored it.
-            if (!row.storageRef || !this.context.resolveAssetAdapter) {
+            if (!row.storageRef || !this.context.resolveStorageProvider) {
                 return null;
             }
-            const adapter = yield this.context.resolveAssetAdapter(row.storageProvider);
-            if (!adapter) {
+            const storage = yield this.context.resolveStorageProvider(row.storageProvider);
+            if (!storage) {
                 return null;
             }
-            const result = yield adapter.get(row.storageRef);
+            const result = yield storage.get(row.storageRef);
             if (result.kind === 'redirect') {
                 return Object.assign(Object.assign({}, base), { redirectUrl: result.url });
             }

package/dist/transformers/preview/component/builder.d.ts

@@ -9,20 +9,12 @@ export declare enum ComponentSegment {
     Previews = "previews",
     Validation = "validation"
 }
-/**
- * Options for processing components
- */
-export interface ProcessComponentsOptions {
-    /** Enable caching to skip unchanged components */
-    useCache?: boolean;
-}
 /**
  * Process components and generate their code, styles, and previews
  * @param handoff - The Handoff instance containing configuration and state
  * @param id - Optional component ID to process a specific component
  * @param segmentToProcess - Optional segment to update
- * @param options - Optional processing options including cache settings
  * @returns Promise resolving to an array of processed components
  */
-export declare function processComponents(handoff: Handoff, id?: string, segmentToProcess?: ComponentSegment, options?: ProcessComponentsOptions): Promise<ComponentListObject[]>;
+export declare function processComponents(handoff: Handoff, id?: string, segmentToProcess?: ComponentSegment): Promise<ComponentListObject[]>;
 export default processComponents;

package/dist/transformers/preview/component/builder.js

@@ -153,12 +153,11 @@ const createComponentBuildPlan = (segmentToProcess, existingData) => {
  * @param handoff - The Handoff instance containing configuration and state
  * @param id - Optional component ID to process a specific component
  * @param segmentToProcess - Optional segment to update
- * @param options - Optional processing options including cache settings
  * @returns Promise resolving to an array of processed components
  */
-function processComponents(handoff, id, segmentToProcess, options) {
+function processComponents(handoff, id, segmentToProcess) {
     return __awaiter(this, void 0, void 0, function* () {
-        var _a, _b, _c, _d;
+        var _a, _b, _c, _d, _e;
         const result = [];
         const documentationObject = yield handoff.getDocumentationObject();
         const components = (_a = documentationObject === null || documentationObject === void 0 ? void 0 : documentationObject.components) !== null && _a !== void 0 ? _a : {};
@@ -177,17 +176,16 @@ function processComponents(handoff, id, segmentToProcess, options) {
             yield (0, artifacts_1.syncComponentArtifacts)(handoff, [id]);
             return [];
         }
-        // Determine which components need building based on cache (when enabled)
+        // Determine which components need building based on cache
         let componentsToBuild;
         let cache = null;
         let currentGlobalDeps = {};
         const componentFileStatesMap = new Map();
         // Only use caching when:
-        // - useCache option is enabled
         // - No specific component ID is requested (full build scenario)
         // - No specific segment is requested (full build scenario)
         // - Force flag is not set
-        const shouldUseCache = (options === null || options === void 0 ? void 0 : options.useCache) && !id && !segmentToProcess && !handoff.force;
+        const shouldUseCache = !id && !segmentToProcess && !handoff.force;
         if (shouldUseCache) {
             logger_1.Logger.debug('Loading build cache...');
             cache = yield (0, cache_1.loadBuildCache)(handoff);
@@ -209,7 +207,7 @@ function processComponents(handoff, id, segmentToProcess, options) {
                         logger_1.Logger.info(`Component '${componentId}': new component, will build`);
                         componentsToBuild.add(componentId);
                     }
-                    else if ((0, cache_1.hasComponentChanged)(cachedEntry, currentFileStates)) {
+                    else if (yield (0, cache_1.hasComponentChanged)(cachedEntry, currentFileStates)) {
                         logger_1.Logger.info(`Component '${componentId}': source files changed, will rebuild`);
                         componentsToBuild.add(componentId);
                     }
@@ -329,6 +327,7 @@ function processComponents(handoff, id, segmentToProcess, options) {
             }
             // Components should always have at least one preview variation.
             ensureDefaultPreview(data);
+            const inputs = shouldUseCache ? (0, cache_1.createBuildInputs)() : undefined;
             const runsViteBuildSteps = buildPlan.js || buildPlan.css || buildPlan.previews;
             let viteBuildStartedAtMs = 0;
             if (runsViteBuildSteps) {
@@ -337,15 +336,15 @@ function processComponents(handoff, id, segmentToProcess, options) {
             }
             // Build JS if needed (new build, validation missing, or explicit segment request).
             if (buildPlan.js) {
-                data = yield (0, javascript_1.default)(data, handoff);
+                data = yield (0, javascript_1.default)(data, handoff, inputs);
             }
             // Build CSS if needed.
             if (buildPlan.css) {
-                data = yield (0, css_1.default)(data, handoff);
+                data = yield (0, css_1.default)(data, handoff, inputs);
             }
             // Build previews (HTML, snapshots, etc) if needed.
             if (buildPlan.previews) {
-                data = yield (0, html_1.default)(Object.assign(Object.assign({}, data), { previews: getBuildPreviews(data) }), handoff, components);
+                data = yield (0, html_1.default)(Object.assign(Object.assign({}, data), { previews: getBuildPreviews(data) }), handoff, components, inputs);
             }
             if (runsViteBuildSteps) {
                 const elapsedMs = Date.now() - viteBuildStartedAtMs;
@@ -371,18 +370,19 @@ function processComponents(handoff, id, segmentToProcess, options) {
             // Add to the cumulative results, to later update the global components summary file.
             result.push(summary);
             // Update cache entry for this component after successful build
-            if (shouldUseCache) {
+            if (shouldUseCache && inputs) {
                 if (!cache) {
                     cache = (0, cache_1.createEmptyCache)();
                 }
-                const fileStates = componentFileStatesMap.get(runtimeComponentId);
-                if (fileStates) {
-                    (0, cache_1.updateComponentCacheEntry)(cache, runtimeComponentId, fileStates);
+                // Compute file states if not already computed (e.g., when global deps changed)
+                const fileStates = (_e = componentFileStatesMap.get(runtimeComponentId)) !== null && _e !== void 0 ? _e : (yield (0, cache_1.computeComponentFileStates)(handoff, runtimeComponentId));
+                const inputStates = yield (0, cache_1.computeBuildInputStates)(handoff, runtimeComponentId, inputs);
+                if (inputStates) {
+                    (0, cache_1.updateComponentCacheEntry)(cache, runtimeComponentId, fileStates, inputStates);
                 }
                 else {
-                    // Compute file states if not already computed (e.g., when global deps changed)
-                    const computedFileStates = yield (0, cache_1.computeComponentFileStates)(handoff, runtimeComponentId);
-                    (0, cache_1.updateComponentCacheEntry)(cache, runtimeComponentId, computedFileStates);
+                    // An incomplete list can miss a changed file, so the next run builds this component again.
+                    delete cache.components[runtimeComponentId];
                 }
             }
         }

package/dist/transformers/preview/component/css.d.ts

@@ -1,8 +1,9 @@
+import { BuildInputs } from '../../../cache/build-inputs';
 import Handoff from '../../../index';
 import { TransformComponentTokensResult } from '../types';
 export declare const MAIN_COMPONENT_CSS_FILE = "main.css";
 export declare const SHARED_COMPONENT_CSS_FILE = "shared.css";
-declare const buildComponentCss: (data: TransformComponentTokensResult, handoff: Handoff) => Promise<{
+declare const buildComponentCss: (data: TransformComponentTokensResult, handoff: Handoff, inputs?: BuildInputs) => Promise<{
     id: string;
     type?: import("../types").ComponentType;
     image?: string;

package/dist/transformers/preview/component/css.js

@@ -16,6 +16,7 @@ exports.buildMainCss = exports.SHARED_COMPONENT_CSS_FILE = exports.MAIN_COMPONEN
 const fs_extra_1 = __importDefault(require("fs-extra"));
 const path_1 = __importDefault(require("path"));
 const vite_1 = require("vite");
+const build_inputs_1 = require("../../../cache/build-inputs");
 const duration_1 = require("../../../utils/duration");
 const logger_1 = require("../../../utils/logger");
 const build_1 = require("../../utils/build");
@@ -33,8 +34,9 @@ exports.SHARED_COMPONENT_CSS_FILE = 'shared.css';
  * @param options.outputFilename - The name of the output file
  * @param options.loadPaths - Array of paths for SASS to look for imports
  * @param options.handoff - The Handoff configuration object
+ * @param options.inputs - Collects the files that the build reads, for the build cache
  */
-const buildCssBundle = (_a) => __awaiter(void 0, [_a], void 0, function* ({ entry, outputPath, outputFilename, loadPaths, handoff, }) {
+const buildCssBundle = (_a) => __awaiter(void 0, [_a], void 0, function* ({ entry, outputPath, outputFilename, loadPaths, handoff, inputs, }) {
     var _b, _c;
     // Store the current NODE_ENV value
     const oldNodeEnv = process.env.NODE_ENV;
@@ -73,7 +75,7 @@ const buildCssBundle = (_a) => __awaiter(void 0, [_a], void 0, function* ({ entr
         if ((_c = (_b = handoff === null || handoff === void 0 ? void 0 : handoff.config) === null || _b === void 0 ? void 0 : _b.hooks) === null || _c === void 0 ? void 0 : _c.cssBuildConfig) {
             viteConfig = handoff.config.hooks.cssBuildConfig(viteConfig);
         }
-        yield (0, vite_1.build)(viteConfig);
+        yield (0, vite_1.build)((0, build_inputs_1.withBuildInputs)(viteConfig, inputs));
     }
     catch (e) {
         logger_1.Logger.error(`Failed to build CSS for "${entry}"`);
@@ -124,7 +126,7 @@ const writeCombinedStyleEntry = (sources, outputPath, id) => __awaiter(void 0, v
     yield fs_extra_1.default.outputFile(entryPath, `${rules.join('\n')}\n`);
     return entryPath;
 });
-const buildComponentCss = (data, handoff) => __awaiter(void 0, void 0, void 0, function* () {
+const buildComponentCss = (data, handoff, inputs) => __awaiter(void 0, void 0, void 0, function* () {
     var _a, _b, _c;
     const id = data.id;
     logger_1.Logger.debug(`buildComponentCss`, id);
@@ -154,7 +156,7 @@ const buildComponentCss = (data, handoff) => __awaiter(void 0, void 0, void 0, f
         // Setup SASS load paths
         const loadPaths = [
             path_1.default.resolve(handoff.workingPath),
-            path_1.default.resolve(handoff.workingPath, handoff.exportsDirectory, handoff.getProjectId()),
+            handoff.getOutputPath(),
             path_1.default.resolve(handoff.workingPath, 'node_modules'),
         ];
         if ((_c = (_b = handoff.runtimeConfig) === null || _b === void 0 ? void 0 : _b.entries) === null || _c === void 0 ? void 0 : _c.scss) {
@@ -166,6 +168,7 @@ const buildComponentCss = (data, handoff) => __awaiter(void 0, void 0, void 0, f
             outputFilename: `${id}.css`,
             loadPaths,
             handoff,
+            inputs,
         });
         // Read the built CSS
         if (fs_extra_1.default.existsSync(builtCssPath)) {
@@ -217,7 +220,7 @@ const buildMainCss = (handoff) => __awaiter(void 0, void 0, void 0, function* ()
                 const loadPaths = [
                     path_1.default.dirname(scssEntry),
                     path_1.default.resolve(handoff.workingPath),
-                    path_1.default.resolve(handoff.workingPath, handoff.exportsDirectory, handoff.getProjectId()),
+                    handoff.getOutputPath(),
                     path_1.default.resolve(handoff.workingPath, 'node_modules'),
                 ];
                 yield buildCssBundle({

package/dist/transformers/preview/component/html.d.ts

@@ -1,4 +1,5 @@
 import { Types as CoreTypes } from 'handoff-core';
+import { BuildInputs } from '../../../cache/build-inputs';
 import Handoff from '../../../index';
 import { TransformComponentTokensResult } from '../types';
 /**
@@ -7,6 +8,7 @@ import { TransformComponentTokensResult } from '../types';
  * @param data - The result of transforming component tokens.
  * @param handoff - The Handoff configuration object.
  * @param components - Optional file components object.
+ * @param inputs - Collects the files that the build reads, for the build cache.
  * @returns A promise that resolves to the transformed component tokens result.
  * @throws Will throw an error if the Vite build process fails.
  *
@@ -15,5 +17,5 @@ import { TransformComponentTokensResult } from '../types';
  * const result = await buildPreviews(transformedData, handoffConfig, fileComponents);
  * ```
  */
-export declare const buildPreviews: (data: TransformComponentTokensResult, handoff: Handoff, components?: CoreTypes.IDocumentationObject["components"]) => Promise<TransformComponentTokensResult>;
+export declare const buildPreviews: (data: TransformComponentTokensResult, handoff: Handoff, components?: CoreTypes.IDocumentationObject["components"], inputs?: BuildInputs) => Promise<TransformComponentTokensResult>;
 export default buildPreviews;

package/dist/transformers/preview/component/html.js

@@ -15,6 +15,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.buildPreviews = void 0;
 const plugin_react_1 = __importDefault(require("@vitejs/plugin-react"));
 const vite_1 = require("vite");
+const build_inputs_1 = require("../../../cache/build-inputs");
 const logger_1 = require("../../../utils/logger");
 const plugins_1 = require("../../plugins");
 const vite_config_1 = __importDefault(require("../../vite-config"));
@@ -37,6 +38,7 @@ const RENDERER_PLUGINS = {
  * @param data - The result of transforming component tokens.
  * @param handoff - The Handoff configuration object.
  * @param components - Optional file components object.
+ * @param inputs - Collects the files that the build reads, for the build cache.
  * @returns A promise that resolves to the transformed component tokens result.
  * @throws Will throw an error if the Vite build process fails.
  *
@@ -45,7 +47,7 @@ const RENDERER_PLUGINS = {
  * const result = await buildPreviews(transformedData, handoffConfig, fileComponents);
  * ```
  */
-const buildPreviews = (data, handoff, components) => __awaiter(void 0, void 0, void 0, function* () {
+const buildPreviews = (data, handoff, components, inputs) => __awaiter(void 0, void 0, void 0, function* () {
     var _a, _b, _c;
     if (!((_a = data.entries) === null || _a === void 0 ? void 0 : _a.template))
         return data;
@@ -75,9 +77,11 @@ const buildPreviews = (data, handoff, components) => __awaiter(void 0, void 0, v
         if ((_c = (_b = handoff === null || handoff === void 0 ? void 0 : handoff.config) === null || _b === void 0 ? void 0 : _b.hooks) === null || _c === void 0 ? void 0 : _c.htmlBuildConfig) {
             viteConfig = handoff.config.hooks.htmlBuildConfig(viteConfig);
         }
-        yield (0, vite_1.build)(viteConfig);
+        yield (0, vite_1.build)((0, build_inputs_1.withBuildInputs)(viteConfig, inputs));
     }
     catch (error) {
+        if (inputs)
+            inputs.failed = true;
         logger_1.Logger.error(`Error building component previews: ${data.entries.template}`, error);
     }
     finally {

package/dist/transformers/preview/component/javascript.d.ts

@@ -1,3 +1,4 @@
+import { BuildInputs } from '../../../cache/build-inputs';
 import Handoff from '../../../index';
 import { TransformComponentTokensResult } from '../types';
 export declare const MAIN_COMPONENT_JS_FILE = "main.js";
@@ -10,7 +11,7 @@ export declare const MAIN_COMPONENT_JS_FILE = "main.js";
  * @param handoff - The Handoff configuration object
  * @returns The updated component transformation result with JavaScript data
  */
-export declare const buildComponentJs: (data: TransformComponentTokensResult, handoff: Handoff) => Promise<TransformComponentTokensResult>;
+export declare const buildComponentJs: (data: TransformComponentTokensResult, handoff: Handoff, inputs?: BuildInputs) => Promise<TransformComponentTokensResult>;
 /**
  * Builds the global preview script artifact (`component/main.js`) from the configured workspace JS
  * entry.

package/dist/transformers/preview/component/javascript.js

@@ -16,6 +16,7 @@ exports.buildMainJS = exports.buildComponentJs = exports.MAIN_COMPONENT_JS_FILE
 const fs_extra_1 = __importDefault(require("fs-extra"));
 const path_1 = __importDefault(require("path"));
 const vite_1 = require("vite");
+const build_inputs_1 = require("../../../cache/build-inputs");
 const duration_1 = require("../../../utils/duration");
 const logger_1 = require("../../../utils/logger");
 const vite_config_1 = __importDefault(require("../../vite-config"));
@@ -28,8 +29,9 @@ exports.MAIN_COMPONENT_JS_FILE = 'main.js';
  * @param options.entry - The entry file path for the bundle
  * @param options.outputPath - The directory where the bundle will be output
  * @param options.outputFilename - The name of the output file
+ * @param inputs - Collects the files that the build reads, for the build cache
  */
-const buildJsBundle = (_a, handoff_1) => __awaiter(void 0, [_a, handoff_1], void 0, function* ({ entry, outputPath, outputFilename, format = 'cjs', }, handoff) {
+const buildJsBundle = (_a, handoff_1, inputs_1) => __awaiter(void 0, [_a, handoff_1, inputs_1], void 0, function* ({ entry, outputPath, outputFilename, format = 'cjs', }, handoff, inputs) {
     var _b, _c, _d;
     const absEntryPath = path_1.default.resolve(entry);
     // Store the current NODE_ENV value before vite build
@@ -51,7 +53,7 @@ const buildJsBundle = (_a, handoff_1) => __awaiter(void 0, [_a, handoff_1], void
         if ((_d = (_c = handoff === null || handoff === void 0 ? void 0 : handoff.config) === null || _c === void 0 ? void 0 : _c.hooks) === null || _d === void 0 ? void 0 : _d.jsBuildConfig) {
             viteConfig = handoff.config.hooks.jsBuildConfig(viteConfig);
         }
-        yield (0, vite_1.build)(viteConfig);
+        yield (0, vite_1.build)((0, build_inputs_1.withBuildInputs)(viteConfig, inputs));
     }
     finally {
         // Restore the original NODE_ENV value after vite build completes
@@ -74,7 +76,7 @@ const buildJsBundle = (_a, handoff_1) => __awaiter(void 0, [_a, handoff_1], void
  * @param handoff - The Handoff configuration object
  * @returns The updated component transformation result with JavaScript data
  */
-const buildComponentJs = (data, handoff) => __awaiter(void 0, void 0, void 0, function* () {
+const buildComponentJs = (data, handoff, inputs) => __awaiter(void 0, void 0, void 0, function* () {
     var _a;
     const id = data.id;
     const outputPath = (0, component_1.getComponentOutputPath)(handoff);
@@ -97,9 +99,11 @@ const buildComponentJs = (data, handoff) => __awaiter(void 0, void 0, void 0, fu
                 entry,
                 outputPath,
                 outputFilename: `${id}.js`,
-            }, handoff);
+            }, handoff, inputs);
         }
         catch (e) {
+            if (inputs)
+                inputs.failed = true;
             logger_1.Logger.error(`Failed to bundle JS for component "${id}" (${id}.js):`, e);
             return data;
         }
@@ -113,6 +117,8 @@ const buildComponentJs = (data, handoff) => __awaiter(void 0, void 0, void 0, fu
         }
     }
     catch (e) {
+        if (inputs)
+            inputs.failed = true;
         logger_1.Logger.error(`JS build failed for component "${id}":`, e);
     }
     return data;

package/dist/transformers/utils/build.d.ts

@@ -15,6 +15,10 @@ export declare const STYLE_IMPORT_LOADERS: Record<string, esbuild.Loader>;
 export declare const DEFAULT_SSR_BUILD_CONFIG: esbuild.BuildOptions;
 /**
  * Default esbuild configuration for client builds
+ *
+ * Production React, minified: each client bundle carries its own React copy, and a publish uploads it
+ * with the component and with every pattern that uses it. A development build quickly pushes a pattern
+ * past serverless request body limits.
  */
 export declare const DEFAULT_CLIENT_BUILD_CONFIG: esbuild.BuildOptions;
 /** Apply after a consumer hook: a hook that replaces `loader` would otherwise drop these. */
@@ -26,6 +30,11 @@ export declare function withStyleLoaders<T extends esbuild.BuildOptions>(config:
  * declared entry.
  */
 export declare function collectStyleImports(entryPath: string, handoff: any): Promise<string[]>;
+/**
+ * Every file in the module graph of an entry, stylesheets included, or `null` when the graph does
+ * not build.
+ */
+export declare function collectModuleInputs(entryPath: string, handoff: any): Promise<string[] | null>;
 /**
  * Resolves a module from multiple search directories
  * @param id - Module ID to resolve

package/dist/transformers/utils/build.js

@@ -15,6 +15,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.DEFAULT_CLIENT_BUILD_CONFIG = exports.DEFAULT_SSR_BUILD_CONFIG = exports.STYLE_IMPORT_LOADERS = void 0;
 exports.withStyleLoaders = withStyleLoaders;
 exports.collectStyleImports = collectStyleImports;
+exports.collectModuleInputs = collectModuleInputs;
 exports.resolveModule = resolveModule;
 exports.createReactResolvePlugin = createReactResolvePlugin;
 const esbuild_1 = __importDefault(require("esbuild"));
@@ -44,6 +45,10 @@ exports.DEFAULT_SSR_BUILD_CONFIG = {
 };
 /**
  * Default esbuild configuration for client builds
+ *
+ * Production React, minified: each client bundle carries its own React copy, and a publish uploads it
+ * with the component and with every pattern that uses it. A development build quickly pushes a pattern
+ * past serverless request body limits.
  */
 exports.DEFAULT_CLIENT_BUILD_CONFIG = {
     bundle: true,
@@ -52,7 +57,8 @@ exports.DEFAULT_CLIENT_BUILD_CONFIG = {
     platform: 'browser',
     jsx: 'automatic',
     sourcemap: false,
-    minify: false,
+    minify: true,
+    define: { 'process.env.NODE_ENV': '"production"' },
     loader: exports.STYLE_IMPORT_LOADERS,
 };
 /** Apply after a consumer hook: a hook that replaces `loader` would otherwise drop these. */
@@ -98,17 +104,33 @@ function orderStyleImports(metafile, entryPath) {
  */
 function collectStyleImports(entryPath, handoff) {
     return __awaiter(this, void 0, void 0, function* () {
-        var _a, _b;
+        const metafile = yield buildModuleGraph(entryPath, handoff);
+        return metafile ? orderStyleImports(metafile, entryPath) : [];
+    });
+}
+/**
+ * Every file in the module graph of an entry, stylesheets included, or `null` when the graph does
+ * not build.
+ */
+function collectModuleInputs(entryPath, handoff) {
+    return __awaiter(this, void 0, void 0, function* () {
+        const metafile = yield buildModuleGraph(entryPath, handoff);
+        return metafile ? Object.keys(metafile.inputs).map((input) => path_1.default.resolve(input)) : null;
+    });
+}
+function buildModuleGraph(entryPath, handoff) {
+    return __awaiter(this, void 0, void 0, function* () {
+        var _a, _b, _c;
         const baseConfig = Object.assign(Object.assign({}, exports.DEFAULT_SSR_BUILD_CONFIG), { entryPoints: [entryPath], logLevel: 'silent' });
         const hookedConfig = ((_b = (_a = handoff === null || handoff === void 0 ? void 0 : handoff.config) === null || _a === void 0 ? void 0 : _a.hooks) === null || _b === void 0 ? void 0 : _b.ssrBuildConfig) ? handoff.config.hooks.ssrBuildConfig(baseConfig) : baseConfig;
         try {
             // The `empty` loader keeps stylesheets out of the JavaScript, and the metafile still records
             // them as inputs, so the graph carries the order.
             const result = yield esbuild_1.default.build(Object.assign(Object.assign({}, withStyleLoaders(hookedConfig)), { metafile: true }));
-            return result.metafile ? orderStyleImports(result.metafile, entryPath) : [];
+            return (_c = result.metafile) !== null && _c !== void 0 ? _c : null;
         }
-        catch (_c) {
-            return [];
+        catch (_d) {
+            return null;
         }
     });
 }