@dannote/figma-use 0.4.0 → 0.5.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 +61 -0
- package/README.md +217 -366
- package/SKILL.md +69 -157
- package/bin/figma-use.js +4 -1
- package/dist/cli/index.js +381 -62
- package/dist/proxy/index.js +8 -1
- package/package.json +7 -1
- package/packages/cli/src/render/component-set.tsx +138 -0
- package/packages/cli/src/render/components.tsx +155 -0
- package/packages/cli/src/render/index.ts +47 -0
- package/packages/cli/src/render/reconciler.ts +845 -0
- package/packages/cli/src/render/vars.ts +185 -0
- package/packages/plugin/dist/main.js +52 -10
package/CHANGELOG.md
CHANGED
|
@@ -7,6 +7,67 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
|
|
|
7
7
|
|
|
8
8
|
## [Unreleased]
|
|
9
9
|
|
|
10
|
+
## [0.5.1] - 2026-01-18
|
|
11
|
+
|
|
12
|
+
### Added
|
|
13
|
+
|
|
14
|
+
- Package exports for `@dannote/figma-use/render` and `@dannote/figma-use/components`
|
|
15
|
+
|
|
16
|
+
### Fixed
|
|
17
|
+
|
|
18
|
+
- SKILL.md now starts with connection check instructions
|
|
19
|
+
- Simplified SKILL.md for better AI agent comprehension
|
|
20
|
+
|
|
21
|
+
## [0.5.0] - 2026-01-18
|
|
22
|
+
|
|
23
|
+
### Added
|
|
24
|
+
|
|
25
|
+
- **`render --examples`** — full API reference for JSX rendering
|
|
26
|
+
- Main CLI help now mentions JSX rendering and points to `render --examples`
|
|
27
|
+
- **`defineComponent` for reusable components**
|
|
28
|
+
```tsx
|
|
29
|
+
const Button = defineComponent('Button',
|
|
30
|
+
<Frame style={{ padding: 12, backgroundColor: '#3B82F6' }}>
|
|
31
|
+
<Text style={{ color: '#FFF' }}>Click me</Text>
|
|
32
|
+
</Frame>
|
|
33
|
+
)
|
|
34
|
+
// First usage creates Component, subsequent create Instances
|
|
35
|
+
<Button />
|
|
36
|
+
<Button />
|
|
37
|
+
```
|
|
38
|
+
|
|
39
|
+
- **`defineComponentSet` for component variants**
|
|
40
|
+
```tsx
|
|
41
|
+
const Button = defineComponentSet('Button', {
|
|
42
|
+
variant: ['Primary', 'Secondary'] as const,
|
|
43
|
+
size: ['Small', 'Large'] as const,
|
|
44
|
+
}, ({ variant, size }) => (
|
|
45
|
+
<Frame style={{
|
|
46
|
+
padding: size === 'Large' ? 16 : 8,
|
|
47
|
+
backgroundColor: variant === 'Primary' ? '#3B82F6' : '#E5E7EB'
|
|
48
|
+
}}>
|
|
49
|
+
<Text>{variant} {size}</Text>
|
|
50
|
+
</Frame>
|
|
51
|
+
))
|
|
52
|
+
// Creates ComponentSet with all variant combinations
|
|
53
|
+
<Button variant="Primary" size="Large" />
|
|
54
|
+
```
|
|
55
|
+
|
|
56
|
+
- Proper auto-sizing support (`hug contents`) for frames with `flexDirection`
|
|
57
|
+
- ComponentSet creates real Figma ComponentSet with `isStateGroup=true`
|
|
58
|
+
|
|
59
|
+
### Fixed
|
|
60
|
+
|
|
61
|
+
- Auto-layout sizing mode now correctly set to FIXED when explicit dimensions provided
|
|
62
|
+
- TEXT nodes render with correct height (lineHeight encoding fix)
|
|
63
|
+
- Alignment fields use correct names (stackPrimaryAlignItems, not stackJustify)
|
|
64
|
+
|
|
65
|
+
### Technical Notes
|
|
66
|
+
|
|
67
|
+
ComponentSet instances are created via Plugin API instead of multiplayer because
|
|
68
|
+
Figma reassigns GUIDs on receive, breaking symbolData.symbolID references within
|
|
69
|
+
the same batch. See `component-set.tsx` for detailed explanation.
|
|
70
|
+
|
|
10
71
|
## [0.4.0] - 2026-01-18
|
|
11
72
|
|
|
12
73
|
### Added
|