@figma-vars/hooks 3.0.0-beta.1 → 3.0.0
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/README.md +371 -177
- package/dist/api/fetcher.d.ts.map +1 -1
- package/dist/api/index.d.ts.map +1 -1
- package/dist/api/mutator.d.ts +10 -9
- package/dist/api/mutator.d.ts.map +1 -1
- package/dist/constants/index.d.ts +2 -28
- package/dist/constants/index.d.ts.map +1 -1
- package/dist/contexts/FigmaTokenContext.d.ts.map +1 -1
- package/dist/contexts/FigmaVarsProvider.d.ts +1 -1
- package/dist/contexts/FigmaVarsProvider.d.ts.map +1 -1
- package/dist/contexts/index.d.ts +1 -1
- package/dist/contexts/index.d.ts.map +1 -1
- package/dist/contexts/useFigmaTokenContext.d.ts.map +1 -1
- package/dist/core/index.d.cts +8 -0
- package/dist/core/index.d.ts +8 -0
- package/dist/core/index.d.ts.map +1 -0
- package/dist/core.cjs +1 -0
- package/dist/core.d.cts +2 -0
- package/dist/core.d.ts +2 -0
- package/dist/core.mjs +20 -0
- package/dist/hooks/index.d.ts +19 -0
- package/dist/hooks/index.d.ts.map +1 -1
- package/dist/hooks/useBulkUpdateVariables.d.ts.map +1 -1
- package/dist/hooks/useCreateVariable.d.ts.map +1 -1
- package/dist/hooks/useDeleteVariable.d.ts.map +1 -1
- package/dist/hooks/useFigmaToken.d.ts.map +1 -1
- package/dist/hooks/useInvalidateVariables.d.ts +31 -0
- package/dist/hooks/useInvalidateVariables.d.ts.map +1 -0
- package/dist/hooks/usePublishedVariables.d.ts +42 -0
- package/dist/hooks/usePublishedVariables.d.ts.map +1 -0
- package/dist/hooks/useUpdateVariable.d.ts.map +1 -1
- package/dist/hooks/useVariableCollections.d.ts.map +1 -1
- package/dist/hooks/useVariableModes.d.ts.map +1 -1
- package/dist/hooks/useVariables.d.ts +3 -1
- package/dist/hooks/useVariables.d.ts.map +1 -1
- package/dist/index-BIUpDTdr.cjs +1 -0
- package/dist/index-Cd4HQQHO.js +94 -0
- package/dist/index.cjs +1 -1
- package/dist/index.d.cts +9 -4
- package/dist/index.d.ts +9 -4
- package/dist/index.d.ts.map +1 -1
- package/dist/index.mjs +235 -162
- package/dist/types/contexts.d.ts +29 -3
- package/dist/types/contexts.d.ts.map +1 -1
- package/dist/types/figma.d.ts +56 -3
- package/dist/types/figma.d.ts.map +1 -1
- package/dist/types/hooks.d.ts.map +1 -1
- package/dist/types/index.d.ts.map +1 -1
- package/dist/types/mutations.d.ts +4 -4
- package/dist/types/mutations.d.ts.map +1 -1
- package/dist/utils/errorHelpers.d.ts +96 -0
- package/dist/utils/errorHelpers.d.ts.map +1 -0
- package/dist/utils/filterVariables.d.ts.map +1 -1
- package/dist/utils/index.d.ts +2 -1
- package/dist/utils/index.d.ts.map +1 -1
- package/package.json +75 -31
- package/scripts/export-variables.mjs +101 -0
- package/dist/index.d.mts +0 -2
package/dist/api/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/api/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,OAAO,EAAE,OAAO,EAAE,MAAM,aAAa,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/api/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,OAAO,EAAE,OAAO,EAAE,MAAM,aAAa,CAAA;AACrC,OAAO,EAAE,OAAO,EAAE,MAAM,aAAa,CAAA"}
|
package/dist/api/mutator.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { VariableAction } from '../types/mutations';
|
|
1
|
+
import { VariableAction, BulkUpdatePayload } from '../types/mutations.js';
|
|
2
2
|
/**
|
|
3
3
|
* Low-level utility to send authenticated POST, PUT, or DELETE requests to the Figma Variables REST API.
|
|
4
4
|
*
|
|
@@ -7,28 +7,29 @@ import { VariableAction } from '../types/mutations';
|
|
|
7
7
|
* It handles JSON serialization of the request body, parses JSON responses, and propagates detailed errors.
|
|
8
8
|
* Intended primarily for internal use by mutation hooks, but also suitable for direct custom API mutations.
|
|
9
9
|
*
|
|
10
|
-
* @typeParam
|
|
10
|
+
* @typeParam TResponse - The expected response type returned from the Figma API.
|
|
11
11
|
* @param url - The full Figma REST API endpoint URL (e.g., 'https://api.figma.com/v1/files/{file_key}/variables').
|
|
12
12
|
* @param token - Figma Personal Access Token (PAT) used for authentication.
|
|
13
13
|
* @param action - The action for the mutation: 'CREATE', 'UPDATE', or 'DELETE'.
|
|
14
|
-
* @param body - Optional request payload
|
|
14
|
+
* @param body - Optional request payload. For bulk operations, use BulkUpdatePayload. For individual operations, use objects with `variables` array.
|
|
15
15
|
*
|
|
16
16
|
* @returns A Promise resolving to the parsed JSON response from the Figma API.
|
|
17
17
|
*
|
|
18
|
-
* @throws Throws
|
|
19
|
-
* @throws Throws an Error if the HTTP response is unsuccessful, including the error message from the API or a default message.
|
|
18
|
+
* @throws Throws a FigmaApiError if the token is not provided or if the HTTP response is unsuccessful.
|
|
20
19
|
*
|
|
21
20
|
* @example
|
|
22
21
|
* ```ts
|
|
23
22
|
* import { mutator } from '@figma-vars/hooks/api';
|
|
24
23
|
*
|
|
25
24
|
* async function updateVariable(fileKey: string, token: string, variableId: string) {
|
|
26
|
-
* const url = `https://api.figma.com/v1/files/${fileKey}/variables
|
|
27
|
-
* const payload = { name: 'Updated Name' };
|
|
28
|
-
* const result = await mutator(url, token, '
|
|
25
|
+
* const url = `https://api.figma.com/v1/files/${fileKey}/variables`;
|
|
26
|
+
* const payload = { variables: [{ action: 'UPDATE', id: variableId, name: 'Updated Name' }] };
|
|
27
|
+
* const result = await mutator(url, token, 'UPDATE', payload);
|
|
29
28
|
* return result;
|
|
30
29
|
* }
|
|
31
30
|
* ```
|
|
32
31
|
*/
|
|
33
|
-
export declare function mutator<TResponse = unknown
|
|
32
|
+
export declare function mutator<TResponse = unknown>(url: string, token: string, action: VariableAction, body?: BulkUpdatePayload | {
|
|
33
|
+
variables?: Array<Record<string, unknown>>;
|
|
34
|
+
} | Record<string, unknown>): Promise<TResponse>;
|
|
34
35
|
//# sourceMappingURL=mutator.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"mutator.d.ts","sourceRoot":"","sources":["../../src/api/mutator.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"mutator.d.ts","sourceRoot":"","sources":["../../src/api/mutator.ts"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,cAAc,EAAE,iBAAiB,EAAE,MAAM,oBAAoB,CAAA;AAG3E;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6BG;AACH,wBAAsB,OAAO,CAAC,SAAS,GAAG,OAAO,EAC/C,GAAG,EAAE,MAAM,EACX,KAAK,EAAE,MAAM,EACb,MAAM,EAAE,cAAc,EACtB,IAAI,CAAC,EACD,iBAAiB,GACjB;IAAE,SAAS,CAAC,EAAE,KAAK,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAAA;CAAE,GAC9C,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,GAC1B,OAAO,CAAC,SAAS,CAAC,CAwDpB"}
|
|
@@ -11,34 +11,8 @@
|
|
|
11
11
|
*/
|
|
12
12
|
export declare const FIGMA_API_BASE_URL = "https://api.figma.com";
|
|
13
13
|
export declare const FIGMA_FILES_ENDPOINT = "https://api.figma.com/v1/files";
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
*
|
|
17
|
-
* @param fileKey - The unique key of the Figma file.
|
|
18
|
-
* @returns The URL string to access variables in the specified file.
|
|
19
|
-
*
|
|
20
|
-
* @example
|
|
21
|
-
* ```ts
|
|
22
|
-
* const url = FIGMA_VARIABLES_ENDPOINT('your-file-key')
|
|
23
|
-
* ```
|
|
24
|
-
*/
|
|
25
|
-
export declare const FIGMA_VARIABLES_ENDPOINT: (fileKey: string) => string;
|
|
26
|
-
/**
|
|
27
|
-
* The base endpoint for creating new variables via POST requests.
|
|
28
|
-
*/
|
|
29
|
-
export declare const FIGMA_POST_VARIABLES_ENDPOINT = "https://api.figma.com/v1/variables";
|
|
30
|
-
/**
|
|
31
|
-
* Builds the URL to access a specific Figma variable by its ID.
|
|
32
|
-
*
|
|
33
|
-
* @param variableId - The unique ID of the Figma variable.
|
|
34
|
-
* @returns The URL string to access the variable.
|
|
35
|
-
*
|
|
36
|
-
* @example
|
|
37
|
-
* ```ts
|
|
38
|
-
* const url = FIGMA_VARIABLE_BY_ID_ENDPOINT('variable-id')
|
|
39
|
-
* ```
|
|
40
|
-
*/
|
|
41
|
-
export declare const FIGMA_VARIABLE_BY_ID_ENDPOINT: (variableId: string) => string;
|
|
14
|
+
export declare const FIGMA_PUBLISHED_VARIABLES_PATH: (fileKey: string) => string;
|
|
15
|
+
export declare const FIGMA_FILE_VARIABLES_PATH: (fileKey: string) => string;
|
|
42
16
|
/**
|
|
43
17
|
* Builds the URL to fetch local variables for a given Figma file.
|
|
44
18
|
*
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/constants/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAEH,eAAO,MAAM,kBAAkB,0BAA0B,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/constants/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAEH,eAAO,MAAM,kBAAkB,0BAA0B,CAAA;AAEzD,eAAO,MAAM,oBAAoB,mCAAmC,CAAA;AAEpE,eAAO,MAAM,8BAA8B,GAAI,SAAS,MAAM,WAClB,CAAA;AAE5C,eAAO,MAAM,yBAAyB,GAAI,SAAS,MAAM,WACvB,CAAA;AAElC;;;;;;;;;;GAUG;AACH,eAAO,MAAM,8BAA8B,GAAI,SAAS,MAAM,WACR,CAAA;AAEtD;;GAEG;AACH,eAAO,MAAM,iBAAiB,qBAAqB,CAAA;AAEnD;;GAEG;AACH,eAAO,MAAM,kBAAkB,kBAAkB,CAAA;AAEjD;;GAEG;AACH,eAAO,MAAM,wBAAwB,mCAAmC,CAAA;AAExE;;GAEG;AACH,eAAO,MAAM,iCAAiC,8DAA2D,CAAA;AAEzG;;GAEG;AACH,eAAO,MAAM,4BAA4B,mCAAmC,CAAA;AAE5E;;GAEG;AACH,eAAO,MAAM,gCAAgC,qCACT,CAAA;AAEpC;;GAEG;AACH,eAAO,MAAM,gCAAgC,qCACT,CAAA;AAEpC;;GAEG;AACH,eAAO,MAAM,gCAAgC,qCACT,CAAA;AAEpC;;GAEG;AACH,eAAO,MAAM,iCAAiC,8DACe,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FigmaTokenContext.d.ts","sourceRoot":"","sources":["../../src/contexts/FigmaTokenContext.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,gBAAgB,
|
|
1
|
+
{"version":3,"file":"FigmaTokenContext.d.ts","sourceRoot":"","sources":["../../src/contexts/FigmaTokenContext.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,gBAAgB,CAAA;AAE3D,eAAO,MAAM,iBAAiB,4DAElB,CAAA"}
|
|
@@ -22,5 +22,5 @@ import { FigmaVarsProviderProps } from '../types/contexts';
|
|
|
22
22
|
*
|
|
23
23
|
* @public
|
|
24
24
|
*/
|
|
25
|
-
export declare const FigmaVarsProvider: ({ children, token, fileKey, fallbackFile, }: FigmaVarsProviderProps) => import("react/jsx-runtime").JSX.Element;
|
|
25
|
+
export declare const FigmaVarsProvider: ({ children, token, fileKey, fallbackFile, swrConfig, }: FigmaVarsProviderProps) => import("react/jsx-runtime").JSX.Element;
|
|
26
26
|
//# sourceMappingURL=FigmaVarsProvider.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FigmaVarsProvider.d.ts","sourceRoot":"","sources":["../../src/contexts/FigmaVarsProvider.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"FigmaVarsProvider.d.ts","sourceRoot":"","sources":["../../src/contexts/FigmaVarsProvider.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAEV,sBAAsB,EACvB,MAAM,gBAAgB,CAAA;AAMvB;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,eAAO,MAAM,iBAAiB,GAAI,wDAM/B,sBAAsB,4CAsBxB,CAAA"}
|
package/dist/contexts/index.d.ts
CHANGED
|
@@ -18,7 +18,7 @@
|
|
|
18
18
|
* }
|
|
19
19
|
* ```
|
|
20
20
|
*/
|
|
21
|
-
export { FigmaVarsProvider
|
|
21
|
+
export { FigmaVarsProvider } from './FigmaVarsProvider';
|
|
22
22
|
export { useFigmaTokenContext } from './useFigmaTokenContext';
|
|
23
23
|
export { FigmaTokenContext } from './FigmaTokenContext';
|
|
24
24
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/contexts/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AACH,OAAO,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/contexts/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AACH,OAAO,EAAE,iBAAiB,EAAE,MAAM,4BAA4B,CAAA;AAC9D,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAA;AAC7D,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useFigmaTokenContext.d.ts","sourceRoot":"","sources":["../../src/contexts/useFigmaTokenContext.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,gBAAgB,
|
|
1
|
+
{"version":3,"file":"useFigmaTokenContext.d.ts","sourceRoot":"","sources":["../../src/contexts/useFigmaTokenContext.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,gBAAgB,CAAA;AAE3D,eAAO,MAAM,oBAAoB,QAAO,qBAQvC,CAAA"}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { fetcher } from '../api/fetcher.js';
|
|
2
|
+
import { mutator } from '../api/mutator.js';
|
|
3
|
+
import { filterVariables } from '../utils/filterVariables.js';
|
|
4
|
+
export { fetcher, mutator, filterVariables };
|
|
5
|
+
export * from '../constants/index.js';
|
|
6
|
+
export type * from '../types/figma.js';
|
|
7
|
+
export type * from '../types/mutations.js';
|
|
8
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { fetcher } from '../api/fetcher.js';
|
|
2
|
+
import { mutator } from '../api/mutator.js';
|
|
3
|
+
import { filterVariables } from '../utils/filterVariables.js';
|
|
4
|
+
export { fetcher, mutator, filterVariables };
|
|
5
|
+
export * from '../constants/index.js';
|
|
6
|
+
export type * from '../types/figma.js';
|
|
7
|
+
export type * from '../types/mutations.js';
|
|
8
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/core/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;GAgBG;AAEH,OAAO,EAAE,OAAO,EAAE,MAAM,mBAAmB,CAAA;AAC3C,OAAO,EAAE,OAAO,EAAE,MAAM,mBAAmB,CAAA;AAC3C,OAAO,EAAE,eAAe,EAAE,MAAM,6BAA6B,CAAA;AAE7D,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,eAAe,EAAE,CAAA;AAC5C,cAAc,uBAAuB,CAAA;AACrC,mBAAmB,mBAAmB,CAAA;AACtC,mBAAmB,uBAAuB,CAAA"}
|
package/dist/core.cjs
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const _=require("./index-BIUpDTdr.cjs");exports.CONTENT_TYPE_JSON=_.CONTENT_TYPE_JSON;exports.ERROR_MSG_BULK_UPDATE_FAILED=_.ERROR_MSG_BULK_UPDATE_FAILED;exports.ERROR_MSG_CREATE_VARIABLE_FAILED=_.ERROR_MSG_CREATE_VARIABLE_FAILED;exports.ERROR_MSG_DELETE_VARIABLE_FAILED=_.ERROR_MSG_DELETE_VARIABLE_FAILED;exports.ERROR_MSG_FETCH_FIGMA_DATA_FAILED=_.ERROR_MSG_FETCH_FIGMA_DATA_FAILED;exports.ERROR_MSG_TOKEN_FILE_KEY_REQUIRED=_.ERROR_MSG_TOKEN_FILE_KEY_REQUIRED;exports.ERROR_MSG_TOKEN_REQUIRED=_.ERROR_MSG_TOKEN_REQUIRED;exports.ERROR_MSG_UPDATE_VARIABLE_FAILED=_.ERROR_MSG_UPDATE_VARIABLE_FAILED;exports.FIGMA_API_BASE_URL=_.FIGMA_API_BASE_URL;exports.FIGMA_FILES_ENDPOINT=_.FIGMA_FILES_ENDPOINT;exports.FIGMA_FILE_VARIABLES_PATH=_.FIGMA_FILE_VARIABLES_PATH;exports.FIGMA_LOCAL_VARIABLES_ENDPOINT=_.FIGMA_LOCAL_VARIABLES_ENDPOINT;exports.FIGMA_PUBLISHED_VARIABLES_PATH=_.FIGMA_PUBLISHED_VARIABLES_PATH;exports.FIGMA_TOKEN_HEADER=_.FIGMA_TOKEN_HEADER;exports.fetcher=_.fetcher;exports.filterVariables=_.filterVariables;exports.mutator=_.mutator;
|
package/dist/core.d.cts
ADDED
package/dist/core.d.ts
ADDED
package/dist/core.mjs
ADDED
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import { C as A, j as R, k as I, l as a, o as L, a as s, E as F, n as T, e as D, g as O, F as G, h as M, b as S, i as N, f as B, d as P, m as U } from "./index-Cd4HQQHO.js";
|
|
2
|
+
export {
|
|
3
|
+
A as CONTENT_TYPE_JSON,
|
|
4
|
+
R as ERROR_MSG_BULK_UPDATE_FAILED,
|
|
5
|
+
I as ERROR_MSG_CREATE_VARIABLE_FAILED,
|
|
6
|
+
a as ERROR_MSG_DELETE_VARIABLE_FAILED,
|
|
7
|
+
L as ERROR_MSG_FETCH_FIGMA_DATA_FAILED,
|
|
8
|
+
s as ERROR_MSG_TOKEN_FILE_KEY_REQUIRED,
|
|
9
|
+
F as ERROR_MSG_TOKEN_REQUIRED,
|
|
10
|
+
T as ERROR_MSG_UPDATE_VARIABLE_FAILED,
|
|
11
|
+
D as FIGMA_API_BASE_URL,
|
|
12
|
+
O as FIGMA_FILES_ENDPOINT,
|
|
13
|
+
G as FIGMA_FILE_VARIABLES_PATH,
|
|
14
|
+
M as FIGMA_LOCAL_VARIABLES_ENDPOINT,
|
|
15
|
+
S as FIGMA_PUBLISHED_VARIABLES_PATH,
|
|
16
|
+
N as FIGMA_TOKEN_HEADER,
|
|
17
|
+
B as fetcher,
|
|
18
|
+
P as filterVariables,
|
|
19
|
+
U as mutator
|
|
20
|
+
};
|
package/dist/hooks/index.d.ts
CHANGED
|
@@ -141,4 +141,23 @@ export { useDeleteVariable } from './useDeleteVariable';
|
|
|
141
141
|
* @public
|
|
142
142
|
*/
|
|
143
143
|
export { useBulkUpdateVariables } from './useBulkUpdateVariables';
|
|
144
|
+
export { useInvalidateVariables } from './useInvalidateVariables';
|
|
145
|
+
/**
|
|
146
|
+
* React hook to fetch published Figma Variables from a file.
|
|
147
|
+
*
|
|
148
|
+
* @remarks
|
|
149
|
+
* Fetches variables that have been published to a library. Published variables
|
|
150
|
+
* are shared across files and represent the source of truth for design tokens.
|
|
151
|
+
*
|
|
152
|
+
* @see {@link https://www.figma.com/developers/api#variables | Figma Variables API}
|
|
153
|
+
*
|
|
154
|
+
* @example
|
|
155
|
+
* ```tsx
|
|
156
|
+
* import { usePublishedVariables } from '@figma-vars/hooks';
|
|
157
|
+
* const { data, isLoading } = usePublishedVariables();
|
|
158
|
+
* ```
|
|
159
|
+
*
|
|
160
|
+
* @public
|
|
161
|
+
*/
|
|
162
|
+
export { usePublishedVariables } from './usePublishedVariables';
|
|
144
163
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/hooks/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAEH;;;;;;;;;;;;;;;GAeG;AACH,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/hooks/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAEH;;;;;;;;;;;;;;;GAeG;AACH,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAA;AACjD;;;;;;;;;;;;;GAaG;AACH,OAAO,EAAE,sBAAsB,EAAE,MAAM,8BAA8B,CAAA;AACrE;;;;;;;;;;;;;GAaG;AACH,OAAO,EAAE,gBAAgB,EAAE,MAAM,wBAAwB,CAAA;AACzD;;;;;;;;;;;;;GAaG;AACH,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,qBAAqB,CAAA;AAC9D;;;;;;;;;;;;;;;;GAgBG;AACH,OAAO,EAAE,iBAAiB,EAAE,MAAM,yBAAyB,CAAA;AAC3D;;;;;;;;;;;;;;;;GAgBG;AACH,OAAO,EAAE,iBAAiB,EAAE,MAAM,yBAAyB,CAAA;AAC3D;;;;;;;;;;;;;;;;GAgBG;AACH,OAAO,EAAE,iBAAiB,EAAE,MAAM,yBAAyB,CAAA;AAC3D;;;;;;;;;;;;;;;;GAgBG;AACH,OAAO,EAAE,sBAAsB,EAAE,MAAM,8BAA8B,CAAA;AACrE,OAAO,EAAE,sBAAsB,EAAE,MAAM,8BAA8B,CAAA;AACrE;;;;;;;;;;;;;;;;GAgBG;AACH,OAAO,EAAE,qBAAqB,EAAE,MAAM,6BAA6B,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useBulkUpdateVariables.d.ts","sourceRoot":"","sources":["../../src/hooks/useBulkUpdateVariables.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,
|
|
1
|
+
{"version":3,"file":"useBulkUpdateVariables.d.ts","sourceRoot":"","sources":["../../src/hooks/useBulkUpdateVariables.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAA;AAQxD;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AACH,eAAO,MAAM,sBAAsB,4EAiBlC,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useCreateVariable.d.ts","sourceRoot":"","sources":["../../src/hooks/useCreateVariable.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,iBAAiB,
|
|
1
|
+
{"version":3,"file":"useCreateVariable.d.ts","sourceRoot":"","sources":["../../src/hooks/useCreateVariable.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,iBAAiB,CAAA;AAQ5D;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,eAAO,MAAM,iBAAiB,gFAmB7B,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useDeleteVariable.d.ts","sourceRoot":"","sources":["../../src/hooks/useDeleteVariable.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"useDeleteVariable.d.ts","sourceRoot":"","sources":["../../src/hooks/useDeleteVariable.ts"],"names":[],"mappings":"AASA;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,eAAO,MAAM,iBAAiB,oDAmB7B,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useFigmaToken.d.ts","sourceRoot":"","sources":["../../src/hooks/useFigmaToken.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;;;GAkBG;AACH,QAAA,MAAM,aAAa,QAAO,MAAM,GAAG,IAGlC,
|
|
1
|
+
{"version":3,"file":"useFigmaToken.d.ts","sourceRoot":"","sources":["../../src/hooks/useFigmaToken.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;;;GAkBG;AACH,QAAA,MAAM,aAAa,QAAO,MAAM,GAAG,IAGlC,CAAA;AAED,eAAe,aAAa,CAAA"}
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Hook that provides cache invalidation utilities for Figma variables.
|
|
3
|
+
*
|
|
4
|
+
* @remarks
|
|
5
|
+
* Returns functions to invalidate and revalidate SWR cache for variables hooks.
|
|
6
|
+
* Use this after mutations to ensure fresh data is fetched.
|
|
7
|
+
*
|
|
8
|
+
* @returns Object with `invalidate` and `revalidate` functions.
|
|
9
|
+
*
|
|
10
|
+
* @example
|
|
11
|
+
* ```tsx
|
|
12
|
+
* import { useInvalidateVariables, useUpdateVariable } from '@figma-vars/hooks';
|
|
13
|
+
*
|
|
14
|
+
* function UpdateButton() {
|
|
15
|
+
* const { mutate } = useUpdateVariable();
|
|
16
|
+
* const { invalidate } = useInvalidateVariables();
|
|
17
|
+
*
|
|
18
|
+
* const handleUpdate = async () => {
|
|
19
|
+
* await mutate({ variableId: 'id', payload: { name: 'New Name' } });
|
|
20
|
+
* invalidate(); // Refetch all variable queries
|
|
21
|
+
* };
|
|
22
|
+
* }
|
|
23
|
+
* ```
|
|
24
|
+
*
|
|
25
|
+
* @public
|
|
26
|
+
*/
|
|
27
|
+
export declare const useInvalidateVariables: () => {
|
|
28
|
+
invalidate: () => void;
|
|
29
|
+
revalidate: () => void;
|
|
30
|
+
};
|
|
31
|
+
//# sourceMappingURL=useInvalidateVariables.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useInvalidateVariables.d.ts","sourceRoot":"","sources":["../../src/hooks/useInvalidateVariables.ts"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,eAAO,MAAM,sBAAsB;;;CAgElC,CAAA"}
|
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
import { PublishedVariablesResponse } from '../types/figma';
|
|
2
|
+
/**
|
|
3
|
+
* Hook to fetch published Figma Variables from a file.
|
|
4
|
+
*
|
|
5
|
+
* @remarks
|
|
6
|
+
* This hook fetches variables that have been published to a library in Figma.
|
|
7
|
+
* Published variables are shared across files and represent the "source of truth"
|
|
8
|
+
* for design tokens in a design system. Use this hook when you need to access
|
|
9
|
+
* variables that are consumed from a library, rather than local file variables.
|
|
10
|
+
*
|
|
11
|
+
* **When to use:**
|
|
12
|
+
* - Fetching design tokens from a published library
|
|
13
|
+
* - Building design system dashboards that track published tokens
|
|
14
|
+
* - Monitoring changes to shared variables across a design system
|
|
15
|
+
* - Validating consistency between published and local variables
|
|
16
|
+
*
|
|
17
|
+
* **Rate Limiting:**
|
|
18
|
+
* The Figma API has rate limits. Published variables are typically more stable
|
|
19
|
+
* than local variables, so they can be cached longer. SWR handles caching and
|
|
20
|
+
* revalidation automatically, but be mindful of frequent refetches in production.
|
|
21
|
+
*
|
|
22
|
+
* @returns SWR response object with `data`, `error`, `isLoading`, and `isValidating`.
|
|
23
|
+
*
|
|
24
|
+
* @public
|
|
25
|
+
*
|
|
26
|
+
* @example
|
|
27
|
+
* ```tsx
|
|
28
|
+
* import { usePublishedVariables } from '@figma-vars/hooks';
|
|
29
|
+
*
|
|
30
|
+
* function LibraryTokens() {
|
|
31
|
+
* const { data, isLoading, error } = usePublishedVariables();
|
|
32
|
+
*
|
|
33
|
+
* if (isLoading) return <div>Loading published variables...</div>;
|
|
34
|
+
* if (error) return <div>Error: {error.message}</div>;
|
|
35
|
+
*
|
|
36
|
+
* const variables = Object.values(data?.meta.variables ?? {});
|
|
37
|
+
* return <ul>{variables.map(v => <li key={v.id}>{v.name}</li>)}</ul>;
|
|
38
|
+
* }
|
|
39
|
+
* ```
|
|
40
|
+
*/
|
|
41
|
+
export declare const usePublishedVariables: () => import('swr').SWRResponse<PublishedVariablesResponse, any, import('swr').SWRConfiguration<PublishedVariablesResponse, any, import('swr').BareFetcher<PublishedVariablesResponse>> | undefined>;
|
|
42
|
+
//# sourceMappingURL=usePublishedVariables.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"usePublishedVariables.d.ts","sourceRoot":"","sources":["../../src/hooks/usePublishedVariables.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,aAAa,CAAA;AAI7D;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAsCG;AACH,eAAO,MAAM,qBAAqB,sMAsCjC,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useUpdateVariable.d.ts","sourceRoot":"","sources":["../../src/hooks/useUpdateVariable.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,iBAAiB,
|
|
1
|
+
{"version":3,"file":"useUpdateVariable.d.ts","sourceRoot":"","sources":["../../src/hooks/useUpdateVariable.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,iBAAiB,CAAA;AAQ5D;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,eAAO,MAAM,iBAAiB;gBAOZ,MAAM;aACT,qBAAqB;EAyBnC,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useVariableCollections.d.ts","sourceRoot":"","sources":["../../src/hooks/useVariableCollections.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,OAAO,
|
|
1
|
+
{"version":3,"file":"useVariableCollections.d.ts","sourceRoot":"","sources":["../../src/hooks/useVariableCollections.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,OAAO,CAAA;AAE5C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6BG;AACH,eAAO,MAAM,sBAAsB;;;CAiBlC,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useVariableModes.d.ts","sourceRoot":"","sources":["../../src/hooks/useVariableModes.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,aAAa,
|
|
1
|
+
{"version":3,"file":"useVariableModes.d.ts","sourceRoot":"","sources":["../../src/hooks/useVariableModes.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,aAAa,CAAA;AAEzD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6BG;AACH,eAAO,MAAM,gBAAgB,QAAO,sBA0BnC,CAAA"}
|
|
@@ -4,7 +4,9 @@ import { LocalVariablesResponse } from '../types/figma';
|
|
|
4
4
|
*
|
|
5
5
|
* @remarks
|
|
6
6
|
* This hook uses SWR for caching and revalidation. It fetches the variables for the
|
|
7
|
-
* file key provided via the FigmaVarsProvider context.
|
|
7
|
+
* file key provided via the FigmaVarsProvider context. If a fallbackFile is provided,
|
|
8
|
+
* it will use that instead of making an API request, which is useful for users without
|
|
9
|
+
* Figma Enterprise accounts or for offline development.
|
|
8
10
|
*
|
|
9
11
|
* @returns SWR response object with `data`, `error`, `isLoading`, and `isValidating`.
|
|
10
12
|
*
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useVariables.d.ts","sourceRoot":"","sources":["../../src/hooks/useVariables.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,aAAa,
|
|
1
|
+
{"version":3,"file":"useVariables.d.ts","sourceRoot":"","sources":["../../src/hooks/useVariables.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,aAAa,CAAA;AAGzD;;;;;;;;;;;;GAYG;AACH,eAAO,MAAM,YAAY,0LAyCxB,CAAA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";var O=Object.defineProperty;var f=(t,e,E)=>e in t?O(t,e,{enumerable:!0,configurable:!0,writable:!0,value:E}):t[e]=E;var L=(t,e,E)=>f(t,typeof e!="symbol"?e+"":e,E);const n="https://api.figma.com",h=`${n}/v1/files`,p=t=>`/v1/files/${t}/variables/published`,S=t=>`/v1/files/${t}/variables`,D=t=>`${h}/${t}/variables/local`,d="application/json",I="X-FIGMA-TOKEN",i="A Figma API token is required.",G=`${i} and file key are required.`,u="Failed to perform bulk update.",m="Failed to create Figma variable.",P="Failed to delete Figma variable.",N="Failed to update Figma variable.",l="An error occurred while fetching data from the Figma API.";class o extends Error{constructor(E,s){super(E);L(this,"statusCode");this.name="FigmaApiError",this.statusCode=s,Error.captureStackTrace&&Error.captureStackTrace(this,o)}}async function B(t,e){if(!e)throw new Error(i);const E=t.startsWith("http://")||t.startsWith("https://")?t:`${n}${t.startsWith("/")?"":"/"}${t}`,s=await fetch(E,{method:"GET",headers:{[I]:e,"Content-Type":d}});if(!s.ok){let A=l;const T=s.status;try{const a=s.headers.get("content-type");if(a!=null&&a.includes("application/json")){const _=await s.json();_!=null&&_.message?A=_.message:_!=null&&_.err&&(A=_.err)}}catch{}throw new o(A,T)}return s.json()}async function U(t,e,E,s){if(!e)throw new Error(i);const a={method:{CREATE:"POST",UPDATE:"PUT",DELETE:"DELETE"}[E],headers:{"Content-Type":"application/json",[I]:e}};s&&(a.body=JSON.stringify(s));const _=t.startsWith("http://")||t.startsWith("https://")?t:`${n}${t.startsWith("/")?"":"/"}${t}`,r=await fetch(_,a);if(!r.ok){const M=r.status;let R="An API error occurred";try{const c=r.headers.get("content-type");if(c!=null&&c.includes("application/json")){const F=await r.json();R=F.err||F.message||R}}catch{}throw new o(R,M)}return r.status===204||!r.body?{}:r.json()}function g(t,e){return t.filter(E=>{let s=!0;return e.resolvedType&&(s=s&&E.resolvedType===e.resolvedType),e.name&&(s=s&&E.name.includes(e.name)),s})}exports.CONTENT_TYPE_JSON=d;exports.ERROR_MSG_BULK_UPDATE_FAILED=u;exports.ERROR_MSG_CREATE_VARIABLE_FAILED=m;exports.ERROR_MSG_DELETE_VARIABLE_FAILED=P;exports.ERROR_MSG_FETCH_FIGMA_DATA_FAILED=l;exports.ERROR_MSG_TOKEN_FILE_KEY_REQUIRED=G;exports.ERROR_MSG_TOKEN_REQUIRED=i;exports.ERROR_MSG_UPDATE_VARIABLE_FAILED=N;exports.FIGMA_API_BASE_URL=n;exports.FIGMA_FILES_ENDPOINT=h;exports.FIGMA_FILE_VARIABLES_PATH=S;exports.FIGMA_LOCAL_VARIABLES_ENDPOINT=D;exports.FIGMA_PUBLISHED_VARIABLES_PATH=p;exports.FIGMA_TOKEN_HEADER=I;exports.FigmaApiError=o;exports.fetcher=B;exports.filterVariables=g;exports.mutator=U;
|
|
@@ -0,0 +1,94 @@
|
|
|
1
|
+
var I = Object.defineProperty;
|
|
2
|
+
var T = (t, s, a) => s in t ? I(t, s, { enumerable: !0, configurable: !0, writable: !0, value: a }) : t[s] = a;
|
|
3
|
+
var l = (t, s, a) => T(t, typeof s != "symbol" ? s + "" : s, a);
|
|
4
|
+
const A = "https://api.figma.com", F = `${A}/v1/files`, M = (t) => `/v1/files/${t}/variables/published`, O = (t) => `/v1/files/${t}/variables`, S = (t) => `${F}/${t}/variables/local`, u = "application/json", p = "X-FIGMA-TOKEN", h = "A Figma API token is required.", g = `${h} and file key are required.`, D = "Failed to perform bulk update.", G = "Failed to create Figma variable.", P = "Failed to delete Figma variable.", w = "Failed to update Figma variable.", m = "An error occurred while fetching data from the Figma API.";
|
|
5
|
+
class E extends Error {
|
|
6
|
+
constructor(a, e) {
|
|
7
|
+
super(a);
|
|
8
|
+
/** HTTP status code from the API response. */
|
|
9
|
+
l(this, "statusCode");
|
|
10
|
+
this.name = "FigmaApiError", this.statusCode = e, Error.captureStackTrace && Error.captureStackTrace(this, E);
|
|
11
|
+
}
|
|
12
|
+
}
|
|
13
|
+
async function y(t, s) {
|
|
14
|
+
if (!s)
|
|
15
|
+
throw new Error(h);
|
|
16
|
+
const a = t.startsWith("http://") || t.startsWith("https://") ? t : `${A}${t.startsWith("/") ? "" : "/"}${t}`, e = await fetch(a, {
|
|
17
|
+
method: "GET",
|
|
18
|
+
headers: {
|
|
19
|
+
[p]: s,
|
|
20
|
+
"Content-Type": u
|
|
21
|
+
}
|
|
22
|
+
});
|
|
23
|
+
if (!e.ok) {
|
|
24
|
+
let i = m;
|
|
25
|
+
const d = e.status;
|
|
26
|
+
try {
|
|
27
|
+
const n = e.headers.get("content-type");
|
|
28
|
+
if (n != null && n.includes("application/json")) {
|
|
29
|
+
const o = await e.json();
|
|
30
|
+
o != null && o.message ? i = o.message : o != null && o.err && (i = o.err);
|
|
31
|
+
}
|
|
32
|
+
} catch {
|
|
33
|
+
}
|
|
34
|
+
throw new E(i, d);
|
|
35
|
+
}
|
|
36
|
+
return e.json();
|
|
37
|
+
}
|
|
38
|
+
async function C(t, s, a, e) {
|
|
39
|
+
if (!s)
|
|
40
|
+
throw new Error(h);
|
|
41
|
+
const n = {
|
|
42
|
+
method: {
|
|
43
|
+
CREATE: "POST",
|
|
44
|
+
UPDATE: "PUT",
|
|
45
|
+
DELETE: "DELETE"
|
|
46
|
+
}[a],
|
|
47
|
+
headers: {
|
|
48
|
+
"Content-Type": "application/json",
|
|
49
|
+
[p]: s
|
|
50
|
+
}
|
|
51
|
+
};
|
|
52
|
+
e && (n.body = JSON.stringify(e));
|
|
53
|
+
const o = t.startsWith("http://") || t.startsWith("https://") ? t : `${A}${t.startsWith("/") ? "" : "/"}${t}`, r = await fetch(o, n);
|
|
54
|
+
if (!r.ok) {
|
|
55
|
+
const f = r.status;
|
|
56
|
+
let c = "An API error occurred";
|
|
57
|
+
try {
|
|
58
|
+
const _ = r.headers.get("content-type");
|
|
59
|
+
if (_ != null && _.includes("application/json")) {
|
|
60
|
+
const R = await r.json();
|
|
61
|
+
c = R.err || R.message || c;
|
|
62
|
+
}
|
|
63
|
+
} catch {
|
|
64
|
+
}
|
|
65
|
+
throw new E(c, f);
|
|
66
|
+
}
|
|
67
|
+
return r.status === 204 || !r.body ? {} : r.json();
|
|
68
|
+
}
|
|
69
|
+
function N(t, s) {
|
|
70
|
+
return t.filter((a) => {
|
|
71
|
+
let e = !0;
|
|
72
|
+
return s.resolvedType && (e = e && a.resolvedType === s.resolvedType), s.name && (e = e && a.name.includes(s.name)), e;
|
|
73
|
+
});
|
|
74
|
+
}
|
|
75
|
+
export {
|
|
76
|
+
u as C,
|
|
77
|
+
h as E,
|
|
78
|
+
O as F,
|
|
79
|
+
g as a,
|
|
80
|
+
M as b,
|
|
81
|
+
E as c,
|
|
82
|
+
N as d,
|
|
83
|
+
A as e,
|
|
84
|
+
y as f,
|
|
85
|
+
F as g,
|
|
86
|
+
S as h,
|
|
87
|
+
p as i,
|
|
88
|
+
D as j,
|
|
89
|
+
G as k,
|
|
90
|
+
P as l,
|
|
91
|
+
C as m,
|
|
92
|
+
w as n,
|
|
93
|
+
m as o
|
|
94
|
+
};
|
package/dist/index.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const h=require("react/jsx-runtime"),i=require("react"),b=require("swr"),o=require("./index-BIUpDTdr.cjs"),p=i.createContext(void 0);let v=0;const k=({children:e,token:r,fileKey:t,fallbackFile:s,swrConfig:n})=>{const a=i.useMemo(()=>(v+=1,`figma-vars-provider-${v}`),[]),c=i.useMemo(()=>{const l={token:r,fileKey:t,providerId:a,...n!==void 0&&{swrConfig:n}};return s===void 0?l:{...l,fallbackFile:s}},[r,t,s,a,n]);return h.jsx(p.Provider,{value:c,children:e})},d=()=>{const e=i.useContext(p);if(e===void 0)throw new Error("useFigmaTokenContext must be used within a FigmaVarsProvider");return e},_=()=>{const{token:e,fileKey:r,fallbackFile:t,providerId:s,swrConfig:n}=d(),a=r?`https://api.figma.com/v1/files/${r}/variables/local`:null,E=!!(e&&a)?[a,e]:!!t?[`fallback-${s??"default"}`,"fallback"]:null;return b(E,async(...u)=>{const[f,R]=Array.isArray(u[0])?u[0]:[u[0],u[1]];if(t)return typeof t=="string"?JSON.parse(t):t;if(!f||!R)throw new Error("Missing URL or token for live API request");return o.fetcher(f,R)},n)},w=()=>{const{data:e}=_(),r=i.useMemo(()=>e!=null&&e.meta?Object.values(e.meta.variableCollections):[],[e]),t=i.useMemo(()=>e!=null&&e.meta?e.meta.variableCollections:{},[e]);return{collections:r,collectionsById:t}},S=()=>{const{data:e}=_();return i.useMemo(()=>{const r=[],t={},s={};if(e!=null&&e.meta)for(const n of Object.values(e.meta.variableCollections)){r.push(...n.modes),t[n.id]=n.modes;for(const a of n.modes)s[a.modeId]=a}return{modes:r,modesByCollectionId:t,modesById:s}},[e])};function V(e,r){switch(r.type){case"loading":return{...e,status:"loading",error:null};case"success":return{...e,status:"success",data:r.payload};case"error":return{...e,status:"error",error:r.payload};default:return e}}const m=e=>{const r={status:"idle",data:null,error:null},[t,s]=i.useReducer(V,r),n=i.useRef(e),a=i.useRef(!0);return i.useEffect(()=>{n.current=e},[e]),i.useEffect(()=>(a.current=!0,()=>{a.current=!1}),[]),{mutate:i.useCallback(async l=>{if(a.current){s({type:"loading"});try{const E=await n.current(l);return a.current&&s({type:"success",payload:E}),E}catch(E){a.current&&s({type:"error",payload:E});return}}},[]),...t,isLoading:t.status==="loading",isSuccess:t.status==="success",isError:t.status==="error"}},F=()=>{const{token:e,fileKey:r}=d();return m(async s=>{if(!e)throw new Error(o.ERROR_MSG_TOKEN_REQUIRED);if(!r)throw new Error(o.ERROR_MSG_TOKEN_FILE_KEY_REQUIRED);return await o.mutator(o.FIGMA_FILE_VARIABLES_PATH(r),e,"CREATE",{variables:[{action:"CREATE",...s}]})})},g=()=>{const{token:e,fileKey:r}=d();return m(async({variableId:s,payload:n})=>{if(!e)throw new Error(o.ERROR_MSG_TOKEN_REQUIRED);if(!r)throw new Error(o.ERROR_MSG_TOKEN_FILE_KEY_REQUIRED);return await o.mutator(o.FIGMA_FILE_VARIABLES_PATH(r),e,"UPDATE",{variables:[{action:"UPDATE",id:s,...n}]})})},M=()=>{const{token:e,fileKey:r}=d();return m(async s=>{if(!e)throw new Error(o.ERROR_MSG_TOKEN_REQUIRED);if(!r)throw new Error(o.ERROR_MSG_TOKEN_FILE_KEY_REQUIRED);return await o.mutator(o.FIGMA_FILE_VARIABLES_PATH(r),e,"DELETE",{variables:[{action:"DELETE",id:s}]})})},L=()=>{const{token:e,fileKey:r}=d();return m(async s=>{if(!e)throw new Error(o.ERROR_MSG_TOKEN_REQUIRED);if(!r)throw new Error(o.ERROR_MSG_TOKEN_FILE_KEY_REQUIRED);return await o.mutator(o.FIGMA_FILE_VARIABLES_PATH(r),e,"UPDATE",s)})},T=()=>{const{mutate:e}=b.useSWRConfig(),{fileKey:r,providerId:t}=d();return{invalidate:()=>{if(!r)return;const a=[`https://api.figma.com/v1/files/${r}/variables/local`,"token-placeholder"];e(a);const c=[o.FIGMA_PUBLISHED_VARIABLES_PATH(r),"token-placeholder"];if(e(c),t){const l=[`fallback-${t}`,"fallback"];e(l)}},revalidate:()=>{if(!r)return;const a=[`https://api.figma.com/v1/files/${r}/variables/local`,"token-placeholder"];e(a,void 0,{revalidate:!0});const c=[o.FIGMA_PUBLISHED_VARIABLES_PATH(r),"token-placeholder"];if(e(c,void 0,{revalidate:!0}),t){const l=[`fallback-${t}`,"fallback"];e(l,void 0,{revalidate:!0})}}}},K=()=>{const{token:e,fileKey:r,fallbackFile:t,providerId:s,swrConfig:n}=d(),a=r?o.FIGMA_PUBLISHED_VARIABLES_PATH(r):null,E=!!(e&&a)?[a,e]:!!t?[`fallback-${s??"default"}`,"fallback"]:null;return b(E,async(...u)=>{const[f,R]=Array.isArray(u[0])?u[0]:[u[0],u[1]];if(t)return typeof t=="string"?JSON.parse(t):t;if(!f||!R)throw new Error("Missing URL or token for live API request");return o.fetcher(f,R)},n)};function I(e){return e instanceof o.FigmaApiError}function A(e){return I(e)?e.statusCode:null}function P(e,r="An error occurred"){return e instanceof Error?e.message||r:typeof e=="string"?e:r}function O(e,r){return A(e)===r}exports.FigmaApiError=o.FigmaApiError;exports.filterVariables=o.filterVariables;exports.FigmaVarsProvider=k;exports.getErrorMessage=P;exports.getErrorStatus=A;exports.hasErrorStatus=O;exports.isFigmaApiError=I;exports.useBulkUpdateVariables=L;exports.useCreateVariable=F;exports.useDeleteVariable=M;exports.useInvalidateVariables=T;exports.usePublishedVariables=K;exports.useUpdateVariable=g;exports.useVariableCollections=w;exports.useVariableModes=S;exports.useVariables=_;
|
package/dist/index.d.cts
CHANGED
|
@@ -52,20 +52,25 @@ export { FigmaVarsProvider } from 'contexts';
|
|
|
52
52
|
* }
|
|
53
53
|
* ```
|
|
54
54
|
*/
|
|
55
|
-
export { useVariables, useVariableCollections, useVariableModes, useCreateVariable, useUpdateVariable, useDeleteVariable, useBulkUpdateVariables, } from 'hooks';
|
|
55
|
+
export { useVariables, usePublishedVariables, useVariableCollections, useVariableModes, useCreateVariable, useUpdateVariable, useDeleteVariable, useBulkUpdateVariables, useInvalidateVariables, } from 'hooks';
|
|
56
56
|
/**
|
|
57
57
|
* Utility functions for Figma Variable management.
|
|
58
58
|
*
|
|
59
59
|
* @remarks
|
|
60
|
-
* Helpers like `filterVariables` for searching and filtering variable lists. All utilities are stateless and type-safe—use for UI filtering, scripting, and dashboard logic.
|
|
60
|
+
* Helpers like `filterVariables` for searching and filtering variable lists, and error handling utilities. All utilities are stateless and type-safe—use for UI filtering, scripting, and dashboard logic.
|
|
61
61
|
*
|
|
62
62
|
* @example
|
|
63
63
|
* ```ts
|
|
64
|
-
* import { filterVariables } from '@figma-vars/hooks';
|
|
64
|
+
* import { filterVariables, isFigmaApiError, getErrorStatus } from '@figma-vars/hooks';
|
|
65
65
|
* const filtered = filterVariables(variables, { resolvedType: 'COLOR' });
|
|
66
|
+
*
|
|
67
|
+
* // Error handling
|
|
68
|
+
* if (isFigmaApiError(error)) {
|
|
69
|
+
* console.log('Status:', error.statusCode);
|
|
70
|
+
* }
|
|
66
71
|
* ```
|
|
67
72
|
*/
|
|
68
|
-
export { filterVariables } from 'utils';
|
|
73
|
+
export { filterVariables, isFigmaApiError, getErrorStatus, getErrorMessage, hasErrorStatus, } from 'utils';
|
|
69
74
|
/**
|
|
70
75
|
* All official TypeScript types for advanced usage and type-safe integration.
|
|
71
76
|
*
|
package/dist/index.d.ts
CHANGED
|
@@ -52,20 +52,25 @@ export { FigmaVarsProvider } from 'contexts';
|
|
|
52
52
|
* }
|
|
53
53
|
* ```
|
|
54
54
|
*/
|
|
55
|
-
export { useVariables, useVariableCollections, useVariableModes, useCreateVariable, useUpdateVariable, useDeleteVariable, useBulkUpdateVariables, } from 'hooks';
|
|
55
|
+
export { useVariables, usePublishedVariables, useVariableCollections, useVariableModes, useCreateVariable, useUpdateVariable, useDeleteVariable, useBulkUpdateVariables, useInvalidateVariables, } from 'hooks';
|
|
56
56
|
/**
|
|
57
57
|
* Utility functions for Figma Variable management.
|
|
58
58
|
*
|
|
59
59
|
* @remarks
|
|
60
|
-
* Helpers like `filterVariables` for searching and filtering variable lists. All utilities are stateless and type-safe—use for UI filtering, scripting, and dashboard logic.
|
|
60
|
+
* Helpers like `filterVariables` for searching and filtering variable lists, and error handling utilities. All utilities are stateless and type-safe—use for UI filtering, scripting, and dashboard logic.
|
|
61
61
|
*
|
|
62
62
|
* @example
|
|
63
63
|
* ```ts
|
|
64
|
-
* import { filterVariables } from '@figma-vars/hooks';
|
|
64
|
+
* import { filterVariables, isFigmaApiError, getErrorStatus } from '@figma-vars/hooks';
|
|
65
65
|
* const filtered = filterVariables(variables, { resolvedType: 'COLOR' });
|
|
66
|
+
*
|
|
67
|
+
* // Error handling
|
|
68
|
+
* if (isFigmaApiError(error)) {
|
|
69
|
+
* console.log('Status:', error.statusCode);
|
|
70
|
+
* }
|
|
66
71
|
* ```
|
|
67
72
|
*/
|
|
68
|
-
export { filterVariables } from 'utils';
|
|
73
|
+
export { filterVariables, isFigmaApiError, getErrorStatus, getErrorMessage, hasErrorStatus, } from 'utils';
|
|
69
74
|
/**
|
|
70
75
|
* All official TypeScript types for advanced usage and type-safe integration.
|
|
71
76
|
*
|
package/dist/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;GAWG;AAEH;;;;;;;;;;;;;;;;;;;GAmBG;AACH,OAAO,EAAE,iBAAiB,EAAE,MAAM,UAAU,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;GAWG;AAEH;;;;;;;;;;;;;;;;;;;GAmBG;AACH,OAAO,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAA;AAE5C;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,OAAO,EACL,YAAY,EACZ,qBAAqB,EACrB,sBAAsB,EACtB,gBAAgB,EAChB,iBAAiB,EACjB,iBAAiB,EACjB,iBAAiB,EACjB,sBAAsB,EACtB,sBAAsB,GACvB,MAAM,OAAO,CAAA;AAEd;;;;;;;;;;;;;;;;GAgBG;AACH,OAAO,EACL,eAAe,EACf,eAAe,EACf,cAAc,EACd,eAAe,EACf,cAAc,GACf,MAAM,OAAO,CAAA;AAEd;;;;;;;;;;GAUG;AACH,cAAc,OAAO,CAAA"}
|