- Dispose CanvasKit dash effects and render nested frame guides
- Validate imported guide GUIDs and invalidate stale raw guide metadata
- Resolve frame owners through nested hit ancestry and require primary-button ruler drags
- Share guide preview types through a neutral editor module
* refactor(canvas): adopt immutable CanvasKit paths
- Upgrade CanvasKit to 0.41.1 across app, Core, CLI, and Vue peers
- Build mutable geometry with PathBuilder and detach immutable paths for drawing
- Replace in-place strokes, transforms, and boolean operations with immutable results
- Update renderer mocks and path construction tests for the new API
* test(canvas): model immutable path ownership
- Return detached path instances from CanvasKit builder mocks
- Assert shadow ring and combined path disposal
- Preserve recorded vector operations across ownership transfer
* fix(build): align CanvasKit workspace versions
- Snap vector points, moved layers, and resized edges to geometry, objects, guides, and pixels
- Add persistent snapping preferences with browser and native menu controls
- Normalize canvas and layout guides across Scene Graph and .fig conversion
- Clear transient snapping feedback across interrupted interactions
* feat(code): isolate Design JSX execution
- Transform JSX with the existing Sucrase dependency and execute it in a disposable opaque-origin iframe worker
- Block ambient network capabilities and enforce source, timeout, output, depth, and element limits
- Validate that only bounded plain structured data returns to the application
* feat(code): add editable Design JSX
- Add a lazy CodeMirror editor with JSX syntax support, completion, diagnostics, and bounded scrolling
- Convert validated sandbox output into trusted Design JSX helpers before rendering
- Apply or insert JSX as one undoable graph transaction while preserving dirty drafts
* feat(code): localize JSX editor actions
- Add translated-message fallbacks for editing, applying, inserting, and draft state
- Document the editable JSX workflow in the unreleased changelog
* fix(code): satisfy typed sandbox validation
- Keep the sandbox document terminator literal and preserve optional selection handling under type-aware lint
* test(code): resolve sandbox probes through app aliases
* fix(code): bound sandbox results before cloning
- Enforce string, array, object, depth, element, and byte limits inside the disposable worker
- Retain host-side validation as a second structured-data boundary
* fix(code): keep JSX and HTML editing modes separate
- Switch generated Tailwind output back to OpenPencil JSX before editing
- Close the JSX editor when opening HTML/CSS import and avoid stacking both editors
* feat(code): support authored Design JSX programs
- Allow local constants, function components, arrays, conditionals, fragments, and multiple roots
- Preserve replacement positions for multiple selected roots and reject mixed-parent or locked selections
- Cover multi-root undo, redo, and all-or-nothing rollback
* feat(code): add explicit JSX view mode
- Let authors leave CodeMirror without applying a draft
- Keep the editable surface and HTML/CSS importer mutually exclusive
* feat(code): diagnose unknown JSX vocabulary
- Warn on OpenPencil elements and properties that are absent from the canonical schema
- Surface diagnostics inline through CodeMirror lint markers
* test(code): accept WebKit isolation diagnostics
- Cover the sandbox architecture against Playwright WebKit
- Accept engine-specific wording while preserving the same unavailable-window assertion
* refactor(code): consolidate Design JSX vocabulary
- Drive renderer warnings, completion, and diagnostics from one supported-property schema
- Recognize locally declared components and add focused schema and transform tests
- Replace CodeMirror basicSetup with an explicit feature set and remove the umbrella package
* fix(code): support Design JSX variable helpers
* refactor(code): unify JSX sandbox validation
* fix(code): account for complete sandbox output
* fix(code): preserve locked JSX descendants
* fix(code): preserve JSX sibling order
* fix(code): recompute JSX parent layouts
* feat(code): add live code previews
* test(code): centralize graph assertions
* fix(code): harden live preview sessions
* docs: describe live code editing
* fix(code): update editor accessibility labels
* fix(code): use theme-aware error colors
* fix(dev): stop Vite disconnect error loops
* fix(code): clarify live preview status
* fix(ui): avoid tooltip attribute warnings
* test(code): assert semantic preview status
* refactor(code): remove obsolete editor messages
* fix(code): harden preview concurrency and isolation
* fix(code): cancel stale reset previews
* feat(canvas): measure distances between layers
- Show temporary Figma-style guides while Option or Alt is held
- Support deep nested targets with Command or Control plus Alt
- Measure transformed world bounds and container padding
* fix(canvas): anchor diagonal measurement guides
- Join diagonal distances at the nearest object corners
- Separate horizontal and vertical value badges
- Crop visual coverage tightly around the measurement overlay
* fix(canvas): cover measurement edge cases
- Draw transformed target outlines and center value pills on guides
- Suppress conflicting hover overlays during measurement mode
- Cover containment, overlap, multi-selection, rotation, and fractional gaps
* fix(canvas): suppress conflicting measurement overlays
- Hide auto-layout hover visuals while distance measurements render
- Assert fractional measurement geometry with numeric tolerance
* fix(core): preserve inline SVG primitives
- Convert parsed circle, ellipse, rect, line, polyline, and polygon children through the shared SVG path pipeline
- Preserve nested presentation attributes, transforms, and JSX-style SVG attribute names
- Cover mixed and primitive-only inline SVG renders
* chore: format merged mobile navigation
* fix(core): disambiguate xmldom document types
- Alias the xmldom Document type so clean CI does not resolve it as the browser DOM type
- Guard the generated SVG document root before collecting paths
* fix(core): preserve inline SVG root styles
- Carry root presentation properties into parsed SVG child conversion
- Apply nested SVG transforms before creating vector networks
- Cover inherited root fills and transformed primitive geometry
* fix(core): scale transformed SVG strokes
- Warn once with the rejected surface dimensions and original CanvasKit error
- Disable repeated cache allocation attempts until the renderer surface is replaced
- Keep direct scene rendering as the visible fallback
- Scale retained margins to a fixed device-pixel budget on large viewports
- Fall back to direct scene rendering when CanvasKit rejects an offscreen surface
- Cover the reported wide HiDPI geometry without coupling rendering to a WebGL context
- Normalize SVG paint sentinels before creating icon vector nodes
- Keep inline outline artwork transparent instead of falling back to black
- Cover fill and stroke none values through the Design JSX renderer
Co-authored-by: Rob Coenen <753704+rcoenen@users.noreply.github.com>
- Resolve Figma path style overrides into format-neutral geometry fills
- Render and export per-path paints across normal and pattern drawing
- Preserve path fills through copying, instance scaling, and derived geometry
- Cover import, serialization, scaling, and CanvasKit output
Co-authored-by: Rob Coenen <753704+rcoenen@users.noreply.github.com>
Enable CanvasKit half-leading for solid and gradient paragraph rendering while preserving the existing font fallback system.\n\nCo-authored-by: jongwong <jongwong@aliyun.com>
Fill the three biggest gaps that blocked authoring real designs in JSX:
- mask prop on any node: <Ellipse mask> / mask="luminance" / mask="vector"
sets isMask + maskType so sibling content clips (Figma's mask model)
- <svg> element rendering inline SVG markup into vector nodes, reusing the
iconify path pipeline (extractPaths + parseSVGPath + scalePathInfos)
- Instance overrides: <Instance of="X" overrides={{ 'childName:prop': v }} />
applies child overrides by name and records them so component sync keeps them
Adds gap tests and the shared scalePathInfos/finishIconRender helpers to
avoid duplicating the iconify pipeline.
- Import and round-trip per-node variable mode overrides
- Resolve fill and stroke aliases through the nearest mode scope
- Preserve mode maps across cloning and instance synchronization
- Reject corrupt compressed Kiwi chunks instead of accepting raw garbage\n- Tolerate legacy source metadata without editedFields in renderer fallbacks\n- Align font, derived glyph, shared style, renderer mock, and ownership tests with current contracts\n- Restore clean quick and heavy unit quality gates
- Move SceneGraph-to-NodeChange conversion, text payload assembly, and blob encoding into @open-pencil/fig\n- Inject core glyph outline lookup through an explicit runtime service\n- Centralize neutral font naming in scene-graph and retain core IO/runtime orchestration
- Move component properties, symbol overrides, derived symbol data, and clone synchronization into @open-pencil/fig\n- Add the public instance-overrides subpath with package tests and packed smoke coverage\n- Remove cross-package forwarding modules and enforce direct owner imports in architecture checks
- Move paint/effect normalization and derived glyph conversion into the Fig package\n- Rewire core import and instance paths through the public node-change boundary\n- Keep static renderer evidence pointed at the new format-policy source
- Add case, justification, vertical alignment, truncation, max-lines, and OpenType controls
- Apply visual text case and measured vertical offsets in CanvasKit rendering
- Preserve nullable preview values, shared text styles, font demand, and .fig metadata
- Add panel, engine, and canvas visual coverage
- Gate ingest rendering until required faces and script fallbacks resolve
- Key CanvasKit artifacts by font registration generation and invalidate affected nodes
- Load character-aware remote subsets with cumulative coverage and exact render aliases
- Use BCP-47 language hints for shaping and CJK fallback order
- Keep baked .fig glyphs as an exhaustion-only fallback
- Resolve exact faces through registered, local, cache, and remote sources with deduplicated state transitions\n- Use CanvasKit notdef glyphs to request script fallbacks and repaint after resolution\n- Make CJK coverage analysis codepoint-safe across supplementary characters and style runs
* fix(export): prevent GUID collisions and file corruption on .fig round-trip
Nodes sharing the same imported source.id (component instance children,
cloned subtrees) silently overwrote each other on export because the
GUID assignment reused imported GUID values without checking for
duplicates. This caused data loss on reimport — only the last node
with a given GUID survived.
- Track all assigned GUID values in a Set for O(1) collision detection.
- Scan imported source.ids for both sessionID 0 and 1 before assigning
any new GUIDs, so the counter starts past every imported value.
- Fall back to counter-based GUIDs when source.id collides with an
already-assigned value.
Additional fixes in the same change set:
- cloneTree now deep-copies source.fig via structuredClone, preventing
mutations on a clone from corrupting the original node's kiwi payload.
- Removed decompressFigKiwiData sync wrapper (zero callers) and the
silent try/catch fallback in parseFigKiwiContainer that masked
corrupt data as raw bytes.
- buildFigKiwi uses Bun.zstdCompressSync when available, matching the
zstd decompression path already used on import.
- Fixed setSavedVersion ordering in read.ts — must run after
requestRender to capture the post-bump version, preventing spurious
dirty-state immediately after file reload.
Tests: GUID collision (2 and 3 node), clone isolation, parse failure,
text export zstd compatibility, gold-preview round-trip.
* fix(export): handle EXCLUDE boolean operation and BOOLEAN_OPERATION node type
The internal representation uses EXCLUDE for exclude boolean operations,
but Figma's kiwi schema uses XOR. Map EXCLUDE back to XOR on export so
round-trips through .fig files don't fail. Also add BOOLEAN_OPERATION to
VALID_NODE_TYPES and increase timeout for heavy material3 fixture test.
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
* style: format export-node.ts
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
* test: add type guard after null assertion in guid-collision test
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
* fix(clipboard): detect zstd-compressed data before zlib inflate
fflate's inflateSync silently accepts zstd-compressed data and returns
garbage instead of throwing. Check for the zstd magic bytes (28 b5 2f
fd) before attempting zlib decompression. Also revert the EXCLUDE enum
addition to the kiwi schema since the export-node.ts mapping is
sufficient.
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
* fix(clipboard): add length guard before zstd magic byte check
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
* test(scene-graph): group clone regression coverage
* ci: retrigger CI checks
* test: increase timeouts for heavy .fig fixture tests on slow CI runners
Gold-preview.fig and material3.fig parsing/export tests consistently
exceed the 5s bun:test default timeout on GitHub Actions runners.
Increase to 30s for: beforeAll codec init, clipboard roundtrip,
glyph blob roundtrip, group reclassification, and text measurement.
* test: add individual test timeouts for heavy .fig fixture tests
The beforeAll timeout helped but individual test() calls also need
explicit 30s timeouts since bun:test applies the 5s default per-test.
Fixes remaining CI flakes in glyph-blob roundtrip and clipboard
roundtrip tests.
* test: increase beforeAll timeout for render cache test
The canvas/render cache test loads gold-preview.fig AND initializes
CanvasKit (Skia WASM), which is much slower than the other fixture
tests. Use 60s timeout to account for slow CI runners.
* fix(export): reserve document GUID to prevent 0:0 namespace collision
- Add docGuid (0:0) to assignedGuidValues before processing imported
node source.ids, preventing an imported node with source.id "0:0"
from reusing the document's GUID slot
- Add regression test using session-0 source.ids to verify nodes
survive roundtrip without document GUID collision
- Remove unnecessary async keyword from synchronous component
metadata test
* fix(export): guard canvas GUID reuse with assignedGuidValues check
- Mirror getOrCreateNodeGuid() collision logic in buildCanvasEntries():
if an imported page's source.id maps to a GUID already in
assignedGuidValues, generate a fresh counter-based GUID instead
- Prevents canvas-level last-write-wins when multiple pages share
the same source.id or a page uses 0:0
* fix(test): use explicit little-endian writes and fix misleading test title
- Replace host-endian Uint32Array writes with DataView.setUint32(offset, value, true) in parse-failures.test.ts to ensure platform-independent fig-kiwi container assembly
- Rename test title from "clone clears source.id from the original" to "clone clears source.id from the clone" to accurately reflect what the assertions verify
* test(io): use file-level timeout for heavy fixture
---------
Co-authored-by: Claude Opus 4.7 <noreply@anthropic.com>
Co-authored-by: Danila Poyarkov <dev@dannote.net>
Port the timeout fixes from PR #351 that resolved the unit-test CI
timeouts. Add HEAVY_TEST_TIMEOUT_MS (30s) in tests/helpers/test-utils.ts
and apply it to the slow gold-preview.fig fixture tests/hooks:
- clipboard roundtrip
- group reclassification
- glyph blob preservation
- auto-layout text measurement
- render/canvas/cache