handoff-app 1.2.0-2 → 1.2.1-0

package/Changelog.md

@@ -6,6 +6,76 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to
 [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
+## \[1.2.1] - 2026-04-08
+
+This is a minor release that fixes a bug in the new config diff calculator.
+Under some conditions, this would fail depending on your node configuration.
+
+## \[1.2.0] - 2026-04-03
+
+This release introduces support for patterns and significantly
+modernizes the configuration and declaration workflow. It expands Handoff from
+documenting individual components to documenting larger design-system
+compositions, while also improving TypeScript support, preview usability, and
+overall build and development reliability.
+
+### Patterns
+
+* Added support for design system patterns as a new documentation
+  layer above individual components.
+* Patterns support composing multiple component previews into a single page.
+* Pattern definitions can reference existing named component previews or
+  provide inline args for custom pattern-specific compositions.
+* Added support for `entries.patterns`, allowing projects to register composed
+  design-system patterns alongside components.
+* Added pattern summary and detail artifacts so patterns behave as first-class
+  generated output alongside components.
+
+### Typed Config and Declaration Workflow
+
+* Added support for typed TypeScript and JavaScript config and declaration
+  files across the project workflow.
+* Established TypeScript-based config and declaration files as the preferred
+  convention, while continuing to support JavaScript, CJS, and JSON where
+  applicable.
+* Added clear config resolution precedence when multiple root config files are
+  present.
+* Introduced the `.handoff.ts` and `.handoff.js` declaration convention for
+  components and patterns.
+* Introduced structured helper APIs including `defineConfig`,
+  `defineReactComponent`, `defineHandlebarsComponent`,
+  `defineCsfComponent`, and `definePattern`.
+* Updated runtime loading and normalization so typed declarations and modern
+  config shapes work consistently across the pipeline.
+* Updated scaffolding and CLI flows to support both TypeScript and JavaScript
+  project setup.
+* Updated generated examples and component scaffolds to follow the new
+  `.handoff.*` declaration convention.
+
+### Usage Snippets and Preview Improvements
+
+* Added usage snippets as a new documentation feature, with output that
+  reflects the currently selected preview variant.
+* Expanded CSF preview handling to produce more useful implementation examples
+  for React and Storybook-style components.
+* Improved story and preview resolution so generated documentation is more
+  actionable for engineers consuming the design system.
+* Enhanced code display behavior to better support usage-oriented
+  documentation rather than only static rendered output.
+
+### General Improvements
+
+* Improved incremental build and watch behavior so changes trigger more
+  selective and reliable rebuilds.
+* Added better cleanup of stale generated artifacts to keep component and
+  pattern output in sync as files change or are removed.
+* Improved summary artifact maintenance during rebuilds so generated API output
+  stays aligned with the current source of truth.
+* Enhanced logging with clearer scoped output across Handoff, Vite, and Next.js
+  processes.
+* Improved child-process logging and development server reporting to make local
+  debugging and build visibility better.
+
 ## \[1.1.3] - 2026-03-27
 
 This release reworks the markdown page rendering system with four improvements:

package/dist/app-builder/config-diff/registry.js

@@ -23,7 +23,7 @@ exports.getAllStrategies = getAllStrategies;
  * Called after component rebuilds so derived artifacts stay up-to-date.
  */
 const runAllFinalizers = (handoff, context) => __awaiter(void 0, void 0, void 0, function* () {
-    for (const strategy of strategies.values()) {
+    for (const strategy of Array.from(strategies.values())) {
         yield strategy.finalize(handoff, context);
     }
 });

package/dist/cli.js

@@ -19,7 +19,7 @@ class HandoffCliError extends Error {
  * Show the help message
  */
 const showVersion = () => {
-    return 'Handoff App - 1.2.0-2';
+    return 'Handoff App - 1.2.1';
 };
 /**
  * Define a CLI error

package/handoff.config.js

@@ -0,0 +1,90 @@
+/** @type {import('handoff-app').Config} */
+const path = require('path');
+module.exports = {
+  // Set your Figma project ID here or in the environment variable HANDOFF_FIGMA_PROJECT_ID
+  figma_project_id: null,
+  // Set the output directory for the exported components
+  exportsOutputDirectory: 'exported',
+  // Set the output directory for the sites
+  sitesOutputDirectory: 'out',
+  // These settings control the behavior of the application
+  app: {
+    // Set the theme for the application
+    theme: 'default',
+    // Set the title for the application
+    title: 'Handoff Design System',
+    // Set the client for the application, used in the footer
+    client: 'Handoff Technologies',
+    // Set the Google Tag Manager ID to add GTM scripts
+    google_tag_manager: null,
+    // Set the attribution for the application
+    attribution: true, // Should we remove this?
+    // Set the type copy for the typeography page
+    type_copy: 'Almost before we knew it, we had left the ground.',
+    // Set the type sort for the typeography page
+    type_sort: [
+      'Heading 1',
+      'Heading 2',
+      'Heading 3',
+      'Heading 4',
+      'Heading 5',
+      'Heading 6',
+      'Paragraph',
+      'Subheading',
+      'Blockquote',
+      'Input Labels',
+      'Link',
+    ],
+    // Set the color sort for the color page
+    color_sort: ['primary', 'secondary', 'extra', 'system'],
+    // Set the component sort for the component page
+    component_sort: ['primary', 'secondary', 'transparent'],
+    // Set the base path for the application
+    base_path: '',
+    // Set the breakpoints for the application
+    breakpoints: {
+      sm: { size: 576, name: 'Small' },
+      md: { size: 768, name: 'Medium' },
+      lg: { size: 992, name: 'Large' },
+      xl: { size: 1200, name: 'Extra Large' },
+    },
+    // Set the ports for the application
+    ports: { app: 3000, websocket: 3001 },
+  },
+  // These are the entry points used to compile the target application
+  entries: {
+    scss: './sass/main.scss',
+    js: './js/main.js',
+    bundle: './js/main.js',
+    components: ['./test_components'],
+    patterns: ['./test_patterns'],
+  },
+  // These are the asset zip file download links
+  assets_zip_links: {
+    icons: null,
+    logos: null,
+  },
+  // Hooks allow you to override the default behavior of the application
+  hooks: {
+    // Alter the vite css build config
+    cssBuildConfig: (config) => {
+      return config;
+    },
+    // Validate each component before it is exported
+    validateComponent: (component) => {
+      return {};
+    },
+    // Alter the vite client build config
+    clientBuildConfig: (config) => {
+      return config;
+    },
+    // Alter the vite html build config
+    htmlBuildConfig: (config) => {
+      return config;
+    },
+    // Alter the vite js build config
+    jsBuildConfig: (config) => {
+      return config;
+    },
+  },
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "handoff-app",
-  "version": "1.2.0-2",
+  "version": "1.2.1-0",
   "description": "Automated documentation toolchain for building client side documentation from figma",
   "author ": {
     "name": "Convertiv",

package/src/app-builder/config-diff/registry.ts

@@ -17,7 +17,7 @@ export const getAllStrategies = (): ConfigDiffStrategy[] =>
  * Called after component rebuilds so derived artifacts stay up-to-date.
  */
 export const runAllFinalizers = async (handoff: Handoff, context?: FinalizeContext): Promise<void> => {
-  for (const strategy of strategies.values()) {
+  for (const strategy of Array.from(strategies.values())) {
     await strategy.finalize(handoff, context);
   }
 };

package/src/cli.ts

@@ -19,7 +19,7 @@ class HandoffCliError extends Error {
  * Show the help message
  */
 const showVersion = () => {
-  return 'Handoff App - 1.2.0-2';
+  return 'Handoff App - 1.2.1';
 };
 
 /**