handoff-app 0.13.0 → 0.13.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/Changelog.md CHANGED
@@ -6,11 +6,21 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
6
6
  and this project adheres to
7
7
  [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
8
8
 
9
+ ## [0.13.1] - 2024-09-17
10
+
11
+ This release fixes a couple of small path issues that affect running 0.13.0 from the global path.
12
+
13
+ ### Bugfixes
14
+
15
+ - Fix a path issue in the ComponentDesignTokens component that causes an error when run from the global namespace
16
+ - Prevents typescript compile errors with the react-scroll `<Link>` component
17
+
9
18
  ## [0.13.0] - 2024-09-08
10
19
 
11
20
  ### Changes
12
21
 
13
22
  - **Integration System Overhaul**
23
+
14
24
  - **Local Integrations Only:** From this release onward, only local (ejected) integrations are supported. Handoff will automatically use the locally found integration.
15
25
  - Create a new local integration using `handoff-app make:integration` (or `eject:integration` which is still supported as an alias).
16
26
  - Since there is no need to specify integration information, integration options in `handoff.config.json` such as name and version are no longer recognized, making the integration section of `handoff.config.json` obsolete.
@@ -40,11 +50,11 @@ and this project adheres to
40
50
  - **For Projects with Legacy Schemas:**
41
51
  1. Eject legacy schemas using `handoff-app eject:exportables`.
42
52
  2. If schemas are already ejected:
43
- - Verify that transformer options are in `integration.config.json`.
44
- - Verify that demo options are in `view.config.json` files of respective components.
45
- - Temporarily rename the directory containing legacy schemas.
46
- - Re-eject schemas and move custom schemas into the new exportables.
47
- - Optionally, update custom schemas to remove obsolete options.
53
+ - Verify that transformer options are in `integration.config.json`.
54
+ - Verify that demo options are in `view.config.json` files of respective components.
55
+ - Temporarily rename the directory containing legacy schemas.
56
+ - Re-eject schemas and move custom schemas into the new exportables.
57
+ - Optionally, update custom schemas to remove obsolete options.
48
58
  - **For Projects with `handoff.config.json`:**
49
59
  1. Merge options from `figma.options` to the `integration.config.json` file as necessary.
50
60
  2. Optionally remove deprecated sections: `figma.options`, `figma.definitions`, `figma`, `integration`, and `use_legacy_definitions`.
@@ -53,122 +63,122 @@ and this project adheres to
53
63
 
54
64
  ### Changes
55
65
 
56
- * Integration bundle used for the docs app is no longer being built during `fetch` and `build:integration` steps.
66
+ - Integration bundle used for the docs app is no longer being built during `fetch` and `build:integration` steps.
57
67
 
58
68
  ## [0.12.1] - 2024-06-18
59
69
 
60
70
  ### Changes
61
71
 
62
- * Added support for the `cssRootClass` property in the Handoff Figma plugin metadata.
72
+ - Added support for the `cssRootClass` property in the Handoff Figma plugin metadata.
63
73
 
64
74
  ### Improvements
65
75
 
66
- * Enhanced handling of unnamed parts, resolving visibility issues in the documentation previews.
76
+ - Enhanced handling of unnamed parts, resolving visibility issues in the documentation previews.
67
77
 
68
78
  ## [0.12.0] - 2024-06-11
69
79
 
70
80
  ### Changes
71
81
 
72
- * All environment variables now contain the `HANDOFF_` prefix.
73
- * After updating to version 0.12.0, all environment variables need to be updated to reflect the new variable names:
74
- * `FIGMA_BASE_URL` -> `HANDOFF_FIGMA_BASE_URL`
75
- * `DEV_ACCESS_TOKEN` -> `HANDOFF_DEV_ACCESS_TOKEN`
76
- * `FIGMA_PROJECT_ID` -> `HANDOFF_FIGMA_PROJECT_ID`
77
- * `OUTPUT_DIR` -> `HANDOFF_OUTPUT_DIR`
78
- * `SITES_DIR` -> `HANDOFF_SITES_DIR`
79
- * `USE_HANDOFF_PLUGIN` -> `HANDOFF_USE_HANDOFF_PLUGIN`
80
- * `CREATE_ASSETS_ZIP_FILES` -> `HANDOFF_CREATE_ASSETS_ZIP_FILES`
81
- * The default integration is no longer pre-defined.
82
- * Bootstrap 5.3 is no longer set as the default integration.
83
- * To continue using the Bootstrap 5.3 integration in your project, ensure the configuration is ejected (`handoff-app eject:config`) and update it by setting the `integration` property to `{name: 'bootstrap', version: '5.3'}`.
84
- * All default options specified in the configuration that are used by the exporter and transformer have been removed.
85
- * To continue using the defaults present before the 0.12.0 release, ensure the configuration is ejected (`handoff-app eject:config`) and update the `figma.options` property to the [previous default value](https://github.com/Convertiv/handoff-app/blob/2a396145e7366732ae6a0e15cdf2226641d40a12/src/config.ts#L36-L59).
86
- * The logo placeholder copy showing spacing and orientation has been removed allowing users to add custom content via Markdown.
82
+ - All environment variables now contain the `HANDOFF_` prefix.
83
+ - After updating to version 0.12.0, all environment variables need to be updated to reflect the new variable names:
84
+ - `FIGMA_BASE_URL` -> `HANDOFF_FIGMA_BASE_URL`
85
+ - `DEV_ACCESS_TOKEN` -> `HANDOFF_DEV_ACCESS_TOKEN`
86
+ - `FIGMA_PROJECT_ID` -> `HANDOFF_FIGMA_PROJECT_ID`
87
+ - `OUTPUT_DIR` -> `HANDOFF_OUTPUT_DIR`
88
+ - `SITES_DIR` -> `HANDOFF_SITES_DIR`
89
+ - `USE_HANDOFF_PLUGIN` -> `HANDOFF_USE_HANDOFF_PLUGIN`
90
+ - `CREATE_ASSETS_ZIP_FILES` -> `HANDOFF_CREATE_ASSETS_ZIP_FILES`
91
+ - The default integration is no longer pre-defined.
92
+ - Bootstrap 5.3 is no longer set as the default integration.
93
+ - To continue using the Bootstrap 5.3 integration in your project, ensure the configuration is ejected (`handoff-app eject:config`) and update it by setting the `integration` property to `{name: 'bootstrap', version: '5.3'}`.
94
+ - All default options specified in the configuration that are used by the exporter and transformer have been removed.
95
+ - To continue using the defaults present before the 0.12.0 release, ensure the configuration is ejected (`handoff-app eject:config`) and update the `figma.options` property to the [previous default value](https://github.com/Convertiv/handoff-app/blob/2a396145e7366732ae6a0e15cdf2226641d40a12/src/config.ts#L36-L59).
96
+ - The logo placeholder copy showing spacing and orientation has been removed allowing users to add custom content via Markdown.
87
97
 
88
98
  ### Improvements
89
99
 
90
- * Handoff now appends to existing `.env` files instead of overriding them if the file already exists.
91
- * Introduced normalization of numeric values in `.css` and `.scss` files, along with correct indentations. This ensures that the generated files are valid for any local linting tools your project might use.
92
- * Configuration ejected by the `handoff-app eject:integration` command is now the same as the one ejected by the `handoff-app eject:config` command.
93
- * Handoff no longer uses the `iframe-resizer` package.
94
- * Resolved potential security issues by updating to newer versions of the `axios` and `next` packages.
100
+ - Handoff now appends to existing `.env` files instead of overriding them if the file already exists.
101
+ - Introduced normalization of numeric values in `.css` and `.scss` files, along with correct indentations. This ensures that the generated files are valid for any local linting tools your project might use.
102
+ - Configuration ejected by the `handoff-app eject:integration` command is now the same as the one ejected by the `handoff-app eject:config` command.
103
+ - Handoff no longer uses the `iframe-resizer` package.
104
+ - Resolved potential security issues by updating to newer versions of the `axios` and `next` packages.
95
105
 
96
106
  ## [0.11.0] - 2024-05-23
97
107
 
98
108
  ### Bugfixes
99
109
 
100
- * Issue that was causing the `handoff-app start` command to malfunction has been fixed.
101
- * The `Reference error: name is not defined` issue that occurred when a component specified in the schema was missing from the Figma file has been resolved. The `name` reference has been replaced with a correct identifier.
102
- * Icon sizes have been corrected.
110
+ - Issue that was causing the `handoff-app start` command to malfunction has been fixed.
111
+ - The `Reference error: name is not defined` issue that occurred when a component specified in the schema was missing from the Figma file has been resolved. The `name` reference has been replaced with a correct identifier.
112
+ - Icon sizes have been corrected.
103
113
 
104
114
  ### Changes
105
115
 
106
- * **Integration with Handoff Figma Plugin**: This release now seamlessly integrates with the Handoff Figma Plugin by default.
107
- * As a result, the local schema will not be used by default.
108
- * If you prefer to continue using local schemas, set `USE_HANDOFF_PLUGIN="FALSE"` in your `.env` file.
109
- * Internal module working directory has been relocated from `./src` to `./.handoff`
116
+ - **Integration with Handoff Figma Plugin**: This release now seamlessly integrates with the Handoff Figma Plugin by default.
117
+ - As a result, the local schema will not be used by default.
118
+ - If you prefer to continue using local schemas, set `USE_HANDOFF_PLUGIN="FALSE"` in your `.env` file.
119
+ - Internal module working directory has been relocated from `./src` to `./.handoff`
110
120
 
111
121
  ## [0.10.0] - 2024-01-16
112
122
 
113
123
  ### Improvements
114
124
 
115
- * Docs App:
116
- * Updated docs app to present components without associated content and assets more elegantly.
117
- * Improved the component pages by showing only the "Tokens" tab when no previews are detected; the "Overview" tab is hidden in such cases.
118
- * Configuration Handling:
119
- * Eliminated the need for `handoff.state.json` file.
120
- * All required parameters are now passed to the docs app through environment variables (`process.env`), defined in the project's respective `next.config.js` file.
121
- * Replaced `getConfig` with the more secure `getClientConfig` function.
122
- * New function returns only configurations that can be safely exposed on the client side.
125
+ - Docs App:
126
+ - Updated docs app to present components without associated content and assets more elegantly.
127
+ - Improved the component pages by showing only the "Tokens" tab when no previews are detected; the "Overview" tab is hidden in such cases.
128
+ - Configuration Handling:
129
+ - Eliminated the need for `handoff.state.json` file.
130
+ - All required parameters are now passed to the docs app through environment variables (`process.env`), defined in the project's respective `next.config.js` file.
131
+ - Replaced `getConfig` with the more secure `getClientConfig` function.
132
+ - New function returns only configurations that can be safely exposed on the client side.
123
133
 
124
134
  ### Changes
125
135
 
126
- * Handoff Figma Plugin Support:
127
- * Introduced initial support for the Handoff Figma Plugin.
128
- * Currently an opt-in feature as development is ongoing.
129
- * Can be enabled by setting `USE_HANDOFF_PLUGIN="TRUE"` in your `.env` file.
130
- * This functionality allows Handoff to extract metadata directly from the Figma file. Local JSON definitions are completely ignored in this case.
131
- * Will become the default behavior in the 1.0.0 release!
132
- * Deprecation Notice:
133
- * Deprecated local exportable component JSON definitions.
134
- * Still usable, but will be completely removed and ignored before the 1.0.0 release.
135
- * Components, parts, and related definitions should be defined with the Handoff Figma Plugin prior to the 1.0.0 release.
136
+ - Handoff Figma Plugin Support:
137
+ - Introduced initial support for the Handoff Figma Plugin.
138
+ - Currently an opt-in feature as development is ongoing.
139
+ - Can be enabled by setting `USE_HANDOFF_PLUGIN="TRUE"` in your `.env` file.
140
+ - This functionality allows Handoff to extract metadata directly from the Figma file. Local JSON definitions are completely ignored in this case.
141
+ - Will become the default behavior in the 1.0.0 release!
142
+ - Deprecation Notice:
143
+ - Deprecated local exportable component JSON definitions.
144
+ - Still usable, but will be completely removed and ignored before the 1.0.0 release.
145
+ - Components, parts, and related definitions should be defined with the Handoff Figma Plugin prior to the 1.0.0 release.
136
146
 
137
147
  ## [0.9.3] - 2023-11-23
138
148
 
139
149
  ### Improvements
140
150
 
141
- * It's now possible to declare conditions for exportable component parts. Condition dictates should the part be built based on provided condition (e.g. does a specific variant property have a certain value etc.).
142
- * Handoff will now process all component sets found within the frame in which the component set that matches the search is found. Previously it was limited to process only one (first) extra component set while others were ignored.
151
+ - It's now possible to declare conditions for exportable component parts. Condition dictates should the part be built based on provided condition (e.g. does a specific variant property have a certain value etc.).
152
+ - Handoff will now process all component sets found within the frame in which the component set that matches the search is found. Previously it was limited to process only one (first) extra component set while others were ignored.
143
153
 
144
154
  ### Changes
145
155
 
146
- * Component preview title will no longer default to the value of the first variant property if no distinctive value is found. Empty value is now used instead.
156
+ - Component preview title will no longer default to the value of the first variant property if no distinctive value is found. Empty value is now used instead.
147
157
 
148
158
  ### Bugfixes
149
159
 
150
- * Update of the app source will now update the watched app without having to restart the watch process (issue introduced in version 0.9.0).
151
-
160
+ - Update of the app source will now update the watched app without having to restart the watch process (issue introduced in version 0.9.0).
152
161
 
153
162
  ## [0.9.2] - 2023-11-21
154
163
 
155
164
  ### Improvements
156
165
 
157
- * Handoff now supports both **personal access** and **OAuth2 bearer** tokens. If Handoff detects that a access token used starts with "Bearer " it will use the `Authorization` header to send the token as part of any Figma API request. In any other case, `X-Figma-Token` header will be used.
166
+ - Handoff now supports both **personal access** and **OAuth2 bearer** tokens. If Handoff detects that a access token used starts with "Bearer " it will use the `Authorization` header to send the token as part of any Figma API request. In any other case, `X-Figma-Token` header will be used.
158
167
 
159
168
  ## [0.9.1] - 2023-11-14
160
169
 
161
170
  ### Changes
162
171
 
163
- * Footer component has been brought back into the app and is now visible on all pages.
164
- * Introduced token maps export feature which exports generated tokens alongside their respective values in form in JSON files (key/value object). Tokens for individual components/foundations are exported into the `tokens/maps` directory of the designated export directory as individual files while the `tokens-map` file, which contains all available tokens, gets exported into the designated export directory root.
172
+ - Footer component has been brought back into the app and is now visible on all pages.
173
+ - Introduced token maps export feature which exports generated tokens alongside their respective values in form in JSON files (key/value object). Tokens for individual components/foundations are exported into the `tokens/maps` directory of the designated export directory as individual files while the `tokens-map` file, which contains all available tokens, gets exported into the designated export directory root.
165
174
 
166
175
  ### Improvements
167
- * Added additional logging into the app's `next.config.js` file alongside improved path resolving for custom themes.
176
+
177
+ - Added additional logging into the app's `next.config.js` file alongside improved path resolving for custom themes.
168
178
 
169
179
  ### Maintenance
170
180
 
171
- * Updated the `.npmignore` file to reflect latest `.gitignore` changes made in the last release.
181
+ - Updated the `.npmignore` file to reflect latest `.gitignore` changes made in the last release.
172
182
 
173
183
  ## [0.9.0] - 2023-11-10
174
184
 
@@ -176,27 +186,27 @@ This release focuses heavily on better support for environments on which multipl
176
186
 
177
187
  ### Changes
178
188
 
179
- * Handoff exports and builds are now updated to support export and build of multiple projects. Each respective output is now located in the subdirectory that matches the exported project id (e.g. /exports/{figmaProjectId}). This change prevents issues where one project would override handoff output of another project in environments where multiple Figma projects are being handled.
180
- * Due to the change in the output directory structure, Bootstrap integration has been updated with a @exported alias which is set to point to export directory of the current project for which the integration is being built.
181
- * Alongside existing support for customized app assets via the `public` directory, it’s now also possible to create a `public-{figmaProjectId}` directory which gets used only when the project with the respective Figma project id is being built. If the `public` directory is used, assets located in that directory will be applied to all projects.
182
- * Handoff state file now always includes the Figma project id.
183
- * Initial anonymization of the config file that gets loaded into the app to prevent secrets from being exposed on the client side.
184
- * Improvements to path resolving for custom app theme(s).
185
- * Restructure and improvements of the configuration:
186
- * `poweredBy` option is now called `attribution` and has been moved into `app` config key.
187
- * `next_base_path` option is now called `base_path` and has been moved into the `app` config key.
188
- * Following options have also been moved into the `app` config key: `theme`, `title`, `client`, `google_tag_manager`, `type_copy`, `type_sort`, `color_sort`, `component_sort`
189
- * `logo` and `favicon` options have been removed (it’s still possible to use custom assets but their name must match the default names).
190
- * Misc.
189
+ - Handoff exports and builds are now updated to support export and build of multiple projects. Each respective output is now located in the subdirectory that matches the exported project id (e.g. /exports/{figmaProjectId}). This change prevents issues where one project would override handoff output of another project in environments where multiple Figma projects are being handled.
190
+ - Due to the change in the output directory structure, Bootstrap integration has been updated with a @exported alias which is set to point to export directory of the current project for which the integration is being built.
191
+ - Alongside existing support for customized app assets via the `public` directory, it’s now also possible to create a `public-{figmaProjectId}` directory which gets used only when the project with the respective Figma project id is being built. If the `public` directory is used, assets located in that directory will be applied to all projects.
192
+ - Handoff state file now always includes the Figma project id.
193
+ - Initial anonymization of the config file that gets loaded into the app to prevent secrets from being exposed on the client side.
194
+ - Improvements to path resolving for custom app theme(s).
195
+ - Restructure and improvements of the configuration:
196
+ - `poweredBy` option is now called `attribution` and has been moved into `app` config key.
197
+ - `next_base_path` option is now called `base_path` and has been moved into the `app` config key.
198
+ - Following options have also been moved into the `app` config key: `theme`, `title`, `client`, `google_tag_manager`, `type_copy`, `type_sort`, `color_sort`, `component_sort`
199
+ - `logo` and `favicon` options have been removed (it’s still possible to use custom assets but their name must match the default names).
200
+ - Misc.
191
201
 
192
202
  ### Bugfixes
193
203
 
194
- * Resolved the wrong favicon path issue when app base path was set/used.
204
+ - Resolved the wrong favicon path issue when app base path was set/used.
195
205
 
196
206
  ### Migrate to a New Version
197
207
 
198
- * Due to the restructure of the configuration, any local configuration (if exists) needs to be updated to match the new structure. Recommended way is to create a backup of the current local configuration(s) and to re-eject of the handoff configuration. Use the backup of the local configuration to update the up-to-date configuration ejected earlier. This process will ensure all the configuration options are defined correctly.
199
- * Since the export and app output directory structures have been updated, any custom script that relies on the old output path(s) should be updated to support new structure that includes the project id subdirectory.
208
+ - Due to the restructure of the configuration, any local configuration (if exists) needs to be updated to match the new structure. Recommended way is to create a backup of the current local configuration(s) and to re-eject of the handoff configuration. Use the backup of the local configuration to update the up-to-date configuration ejected earlier. This process will ensure all the configuration options are defined correctly.
209
+ - Since the export and app output directory structures have been updated, any custom script that relies on the old output path(s) should be updated to support new structure that includes the project id subdirectory.
200
210
 
201
211
  ## [0.8.8] - 2023-10-19
202
212
 
package/dist/cli.js CHANGED
@@ -80,7 +80,7 @@ var showHelp = function () {
80
80
  * Show the help message
81
81
  */
82
82
  var showVersion = function () {
83
- cliError('Handoff App - 0.13.0', 2);
83
+ cliError('Handoff App - 0.13.1', 2);
84
84
  };
85
85
  /**
86
86
  * Define a CLI error
@@ -1,3 +1,4 @@
1
+ /// <reference types="node" />
1
2
  import archiver from 'archiver';
2
3
  import * as stream from 'node:stream';
3
4
  import { DocumentationObject } from '../../types';
@@ -24,14 +24,20 @@ export declare const formatComponentCodeBlockComment: (component: ComponentInsta
24
24
  * @param options
25
25
  * @returns
26
26
  */
27
- export declare const formatTokenName: (tokenType: TokenType, componentName: string, componentVariantProps: [string, string][], part: string, property: string, options?: IntegrationObjectComponentOptions) => string;
27
+ export declare const formatTokenName: (tokenType: TokenType, componentName: string, componentVariantProps: [
28
+ string,
29
+ string
30
+ ][], part: string, property: string, options?: IntegrationObjectComponentOptions) => string;
28
31
  /**
29
32
  * Returns the token name segments
30
33
  * @param component
31
34
  * @param options
32
35
  * @returns
33
36
  */
34
- export declare const getTokenNameSegments: (componentName: string, componentVariantProps: [string, string][], part: string, property: string, options?: IntegrationObjectComponentOptions) => string[];
37
+ export declare const getTokenNameSegments: (componentName: string, componentVariantProps: [
38
+ string,
39
+ string
40
+ ][], part: string, property: string, options?: IntegrationObjectComponentOptions) => string[];
35
41
  /**
36
42
  * Normalizes the token name variable (specifier) by considering if the value should be replaced
37
43
  * with some other value based replace rules defined in the transformer options of the component
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "handoff-app",
3
- "version": "0.13.0",
3
+ "version": "0.13.1",
4
4
  "description": "Automated documentation toolchain for building client side documentation from figma",
5
5
  "author ": {
6
6
  "name": "Convertiv",
@@ -11,14 +11,25 @@ export const AnchorNavLink: React.FC<AnchorNavLinkProps> = ({ to, children }) =>
11
11
 
12
12
  useEffect(() => {
13
13
  setOffset(document.getElementById('site-header')?.clientHeight ?? 0);
14
- }, [])
14
+ }, []);
15
15
 
16
16
  return (
17
- <Link href="#" activeClass='is-selected' smooth spy to={to} offset={offset * -1.5} onClick={() => {
18
- history.pushState ? history.pushState(null, '', `#${to}`) : location.hash = `#${to}`;
19
- }}>
20
- {children}
21
- </Link>
17
+ <>
18
+ {/* @ts-ignore */}
19
+ <Link
20
+ href="#"
21
+ activeClass="is-selected"
22
+ smooth
23
+ spy
24
+ to={to}
25
+ offset={offset * -1.5}
26
+ onClick={() => {
27
+ history.pushState ? history.pushState(null, '', `#${to}`) : (location.hash = `#${to}`);
28
+ }}
29
+ >
30
+ {children}
31
+ </Link>
32
+ </>
22
33
  );
23
34
  };
24
35
 
@@ -4,7 +4,7 @@ import React, { useEffect } from 'react';
4
4
  import Icon from './Icon';
5
5
  import { transformComponentTokensToScssVariables } from '@handoff/transformers/scss/component';
6
6
  import { ComponentInstance } from '@handoff/exporters/components/types';
7
- import { IntegrationObjectComponentOptions } from '../../types/config';
7
+ import { IntegrationObjectComponentOptions } from '@handoff/types/config';
8
8
 
9
9
  const PropertyIconPathMap = {
10
10
  'border-width': 'token-border-width',
@@ -7,8 +7,8 @@ import '../sass/main.scss';
7
7
  function MyApp({ Component, pageProps }: AppProps) {
8
8
  return (
9
9
  <>
10
+ {/* @ts-ignore */}
10
11
  <Component {...pageProps} />
11
-
12
12
  </>
13
13
  );
14
14
  }
package/src/cli.ts CHANGED
@@ -57,7 +57,7 @@ const showHelp = () => {
57
57
  * Show the help message
58
58
  */
59
59
  const showVersion = () => {
60
- cliError('Handoff App - 0.13.0', 2);
60
+ cliError('Handoff App - 0.13.1', 2);
61
61
  };
62
62
 
63
63
  /**