@payfit/unity-icons 2.13.5 → 2.14.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
CHANGED
|
@@ -91,6 +91,45 @@ const myIcons: UnityIcon[] = ['AirplaneFilled', 'CakeOutlined']
|
|
|
91
91
|
console.log(iconNames) // ['AirplaneFilled', 'AirplaneOutlined', ...+309 icons more]
|
|
92
92
|
```
|
|
93
93
|
|
|
94
|
+
## Figma Code Connect
|
|
95
|
+
|
|
96
|
+
This package includes Figma Code Connect integration, which displays the correct `<Icon />` usage directly in Figma Dev Mode when inspecting icon components.
|
|
97
|
+
|
|
98
|
+
### How It Works
|
|
99
|
+
|
|
100
|
+
The `Icon.figma.tsx` file is auto-generated by the sync script and contains `figma.connect()` calls for all icons. Each icon maps:
|
|
101
|
+
|
|
102
|
+
- **Type variant** (Filled/Outlined) to the `src` prop
|
|
103
|
+
- **Size variant** (20/24) to the `size` prop
|
|
104
|
+
|
|
105
|
+
### Publishing Code Connect
|
|
106
|
+
|
|
107
|
+
After running the sync script, publish the Code Connect configuration to Figma:
|
|
108
|
+
|
|
109
|
+
```bash
|
|
110
|
+
cd libs/shared/unity/icons
|
|
111
|
+
npx figma connect publish
|
|
112
|
+
```
|
|
113
|
+
|
|
114
|
+
This requires `FIGMA_ACCESS_TOKEN` to be set in your environment.
|
|
115
|
+
|
|
116
|
+
## Syncing Icons from Figma
|
|
117
|
+
|
|
118
|
+
The icon library is synced from Figma using the `sync-unity-icons` script, which:
|
|
119
|
+
|
|
120
|
+
1. Downloads SVG icons from Figma (with breaking change detection)
|
|
121
|
+
2. Generates the Code Connect configuration file
|
|
122
|
+
|
|
123
|
+
To run the sync:
|
|
124
|
+
|
|
125
|
+
```bash
|
|
126
|
+
npx tsx libs/shared/unity/icons/scripts/sync-unity-icons.ts
|
|
127
|
+
```
|
|
128
|
+
|
|
129
|
+
Required environment variables:
|
|
130
|
+
|
|
131
|
+
- `FIGMA_UNITY_SYNC_ACCESS_TOKEN` - Figma access token (or use refresh token credentials)
|
|
132
|
+
|
|
94
133
|
## Browser Support
|
|
95
134
|
|
|
96
135
|
This package supports all modern evergreen browsers. It does not support IE.
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@payfit/unity-icons",
|
|
3
|
-
"version": "2.
|
|
3
|
+
"version": "2.14.0",
|
|
4
4
|
"module": "./dist/esm/index.js",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"sideEffects": false,
|
|
@@ -25,13 +25,14 @@
|
|
|
25
25
|
"react-dom": "^18"
|
|
26
26
|
},
|
|
27
27
|
"devDependencies": {
|
|
28
|
+
"@figma/code-connect": "1.4.1",
|
|
28
29
|
"@fontsource/inter": "5.0.19",
|
|
29
30
|
"@fontsource/source-serif-4": "5.0.19",
|
|
30
31
|
"@payfit/code-pushup-tools": "0.0.0-use.local",
|
|
31
32
|
"@payfit/hr-app-eslint": "0.0.0-use.local",
|
|
32
33
|
"@payfit/hr-apps-tsconfigs": "0.0.0-use.local",
|
|
33
34
|
"@payfit/storybook-config": "0.0.0-use.local",
|
|
34
|
-
"@payfit/unity-themes": "2.
|
|
35
|
+
"@payfit/unity-themes": "2.14.0",
|
|
35
36
|
"@payfit/vite-configs": "0.0.0-use.local",
|
|
36
37
|
"@storybook/addon-a11y": "10.2.15",
|
|
37
38
|
"@storybook/addon-docs": "10.2.15",
|
|
@@ -54,7 +55,7 @@
|
|
|
54
55
|
"vitest": "4.0.9"
|
|
55
56
|
},
|
|
56
57
|
"dependencies": {
|
|
57
|
-
"@payfit/unity-themes": "2.
|
|
58
|
+
"@payfit/unity-themes": "2.14.0",
|
|
58
59
|
"react": "18.3.1",
|
|
59
60
|
"react-dom": "18.3.1"
|
|
60
61
|
}
|