429 commits
| Author | SHA1 | Message | Date | |
|---|---|---|---|---|
Vitali sharp8n
|
0ea0b1b4f0 |
chore: merge upstream/master into upstream-sync-2026-10
Some checks failed
Build native contracts CI image / Publish native contracts image (push) Has been cancelled
Bring the fork up to upstream v0.15.1 (637 commits). Conflicts resolved by re-targeting the W4C delta onto upstream's restructured code and dropping superseded changes: - i18n: upstream split dialogs.json per feature; re-added webFontLoadFailed to the new fonts.json in all locales. - automation: upstream moved the bridge into the MCP runtime and deleted EditorView.vue; re-added the served-build opt-in (?automation=1 / VITE_OPENPENCIL_AUTOMATION) with ?automationWs= and ?automationToken= via connectServedAutomation(), wired in WorkspaceView. - fonts: kept the /__font-proxy fetch wrapper on top of upstream's browserWebFontFetch and re-enabled the Google provider in the web build. - recovery/embed: kept auto-recover mode discarding snapshots (no dialog, no close prompt) and openFileReusingMatchingTab() for host pushes. - io/capability: folded the cross-origin subframe guard into supportsFileSystemAccess()/pickBrowserSaveFile(). - embed bridge installed from boot.ts; MCP browserToken/tcpHost re-applied. |
||
|
Danila Poyarkov
|
9081c4b1d6
|
fix(preview): toggle controls both ways and keep islands in step with the canvas (#982)
* fix(preview): keep a control's layer path when its variant switches Preview finds a control by its layer path, built from layer names. Swapping an instance named after its variant renamed it to the new variant, as Figma does for a real swap, so a switch or checkbox inside a frame lost its path after one click and could not be toggled back. swapInstanceComponent takes keepName, and preview's private graph keeps every instance's name. * refactor(preview): build preview's private graph with the shared page extractor Preview copied its island and the components its instances show with its own closure and copier, a second version of the extractor the AI preview, history, and export use. extractPageContext takes componentSets, which brings every variant of an instance's set so it can switch, and shareTables, which reads the document's variables and images instead of copying them for a view rebuilt on each state. The extractor now also indexes instances by component, which syncing and swapping an extracted graph need. * test: group scene-graph's instance swap test under instances * fix(preview): move islands with the frames the canvas draws Islands followed the pane's live pan and zoom, which change on every wheel event, while the canvas draws once per animation frame or later on a slow frame. Panning and zooming fast, the islands ran ahead of the drawing and settled back when it caught up. useCanvas reports each drawn frame's view through onFrame, and the islands follow the scene's last drawn frame, so both move in the same frame. * test: release the held canvas even when the island sync test fails * docs: point private document copies at the shared page extractor The Core guide says previews, history snapshots, and exports copy part of a document with the extractor in io/subgraph.ts and its componentSets and shareTables options, and the preview guide says where an island's private graph comes from. |
||
|
Danila Poyarkov
|
3289649da8
|
fix: repair the app e2e suite and the bugs it was hiding (#968)
* fix(code): evaluate behaviour parts such as Switch.Root in the Code tab Behaviour parts are named through a namespace, and the sandbox passed every element name to new Function as a parameter. A dotted name is not one, so every Design JSX evaluation in the Code tab failed with "Arg string terminates parameters early". Dotted elements are now members of their namespace object, as JSX reads the tag. * fix(properties): show a fill's whole hex value The hex input used 12 px text in a field sized for 11 px, so six digits needed 45 px of the 38 px left beside the opacity and variable controls, and the last digit was cut off. The value now uses the field's 11 px text, and the opacity field gives up the space its suffix did not use. * test: answer the desktop app's startup commands in the Tauri mock The app now reads credential status and sets native menu checkmarks on startup, and the mock threw on both, failing every spec that simulates the desktop app. * test: wait for the clipboard write and the previous menu in rich copy Copy writes once the document is encoded, so reading right after the click found an empty clipboard or one that changed mid-read. Reopening Edit while the menu used for Copy still animated lost the click. openAppMenu waits for every menu to go before clicking a trigger. * test: follow current settings, page, and picker behaviour in e2e specs Specs had fallen behind the app: Media settings open a provider editor with its own Save, adding a page opens it, the variable picker's search is a textbox, a reverted reply is no longer dimmed by opacity, and the zoom spec addressed a fixed port instead of the configured server. * fix(properties): show the whole opacity beside the variable button A number field with a unit kept the unit's right padding and then the variable button added its own, so Appearance opacity showed "1… %" in the 83 px column. The unit now leaves the spacing to the trailing control. * test: refresh panel and canvas baselines verified against their changes Every baseline was compared with its previous image and each difference traced to a merged change: stored colors drawn exactly after color management (#716), stored page backgrounds kept (#949), themed section fills and node-owned section corners (#931, #940), frame names on every top-level frame (#930), Design Check markers (#804), .pen frames laid out horizontally by default (#652), no-rulers honored, stacked W and H fields, Clip content on new frames, and the whole hex and opacity values from this branch. * docs: note the clipped paint and opacity values in the changelog * test: open menus through the shared menu driver in menu specs |
||
|
Danila Poyarkov
|
7ee621ec41
|
feat: import and export W3C design tokens (#964)
* feat(core): read and write W3C design tokens Variables export as DTCG 2025.10 token files, one per collection mode in the shape Figma imports, with text and effect styles as typography and shadow tokens and a resolver document that combines them. OpenPencil's own token fields ride in a dev.openpencil extension, so an export reads back as it was. Import reads plain mode files, resolver documents, and Tokens Studio themes, plans what it would add, update, or skip against the document without changing it, and applies the plan as one undo step: values merge into variables by name, nothing is deleted, and an updated style updates the layers that use it. * feat: import and export design tokens from the variables dialog The stylesheet menu exports the document's variables and styles as a zip of W3C design tokens, and Import design tokens reads token files, folders, or a zip into a dialog that shows where each collection and mode goes, what would be added, updated, or skipped and why, before applying it as one undo step. * feat: import and export design tokens from tools and the CLI openpencil tokens --format dtcg --out <folder> writes the token files, design_to_tokens takes the same format, and import_design_tokens imports token files into a document for AI, MCP, and openpencil tool call. The editor and these paths share one apply step behind a target interface: the editor makes each change undoable, a headless document takes them directly. Re-importing an export changes nothing it does not need to: values that match are left alone, layers that use an updated style are changed only outside instances, where they follow their component, and collections that share a name keep their own files apart. * perf(core): index token lookups when planning an import Resolving each reference scanned every token and variable, which made importing a large design system quadratic. A resolver now also finds files picked without their folders by name. * docs: document design token import and export * test: type the design token result in the tokens command test * fix: lay out the design token import dialog as a mapping list Each collection and mode sits beside the picker for where it goes, in one bordered list, so the pickers no longer read as headings. Skipped tokens use AppCollapsible, file problems AppAlert, and the counts move to the footer. * fix: keep durations, variable metadata, and style edits through design token import A duration Figma's format writes in seconds goes back into a variable that holds milliseconds. Tokens without OpenPencil's extension leave an updated variable's unit, scopes, and code syntax as they are. A style token whose value was edited in another tool takes that edit instead of the stale exact fields its extension still carries. Aliases to a repeated collection name resolve within one collection, a collection named Styles no longer collides with the resolver's styles set, and the dialog plans again when the document changes and right before applying. The editor imports the apply step directly rather than the whole format barrel. * fix: keep effect order and explicit alias targets in design token import Edited shadows take the places of the shadows they replace, so blurs keep their positions. An alias whose Figma data names a collection that is left out or absent is missing rather than bound to the same path in another collection. The resolver reserves the Styles set name only when there is a styles file. * perf(cli): print token stylesheets without loading every page A CSS or Tailwind stylesheet reads only variables, which load with the document, so tokens skips populating and laying out every page as variables already does. On an 85 MB design kit this takes the command from about seven minutes to seconds. |
||
|
Danila Poyarkov
|
e17f74991b
|
feat(storybook): generate Radix UI components for React stories (#971)
* refactor(dom-css): share the generated component's markup and bindings The component model now holds the element tree every framework writes: each layer's behaviour part, design tag, state class, and attributes, and the root's typed bindings (the two-way value, disabled, and each variant prop as a data attribute). The Vue generator only maps parts to Reka components and writes each binding its way, so another framework is a mapping table and a printer. * feat(emit): print TSX modules with namespaced tags and spreads jsx.printModule prints an es template filled with JSX as one TSX module, quoting every string the same way. Dotted tags such as Switch.Root print as JSX member expressions, and jsx.spread passes an object on as attributes. fill now fills holes inside the annotation it keeps on a filled identifier, which left $Props unfilled in a parameter's type. * feat(storybook): generate Radix UI components for React stories With --framework react, a component set whose behaviour is a Button, Switch, Checkbox, Toggle, or Collapsible exports as a component on the radix-ui package with its state styles in a CSS module. Its props extend the Radix root's, so checked, defaultChecked, onCheckedChange, and disabled come from Radix, and each other variant property is a prop set as a data attribute. Its stories use Radix's uncontrolled value so a play function can operate it. The browser spec now runs the same Switch and Collapsible checks for Vue and React. * refactor(storybook): let generators say how stories import their component The stories printer named each framework to know its Storybook package, how to import the component, and which prop sets its value. A generator now returns its files with the import path, whether the export is named, and the value's arg, and the Storybook packages come from the one table static stories use, so the printer is framework-neutral and exportStorybook looks generators up instead of branching. * fix(storybook): keep a caller's class on React roots and run stories' play functions The generated class came after the spread props, so a className passed to a generated React component was dropped. The root now joins its classes with the caller's. The browser spec mounts each framework's Default story and runs its exported play function with Storybook's own within and userEvent, checking the switch ends up on, and checks a caller's class stays on the root. emit shares one isNode guard. |
||
|
Danila Poyarkov
|
7e9e293305
|
feat(storybook): generate Reka UI components for Vue stories (#969)
* feat(emit): print Vue templates and single-file components
Generated Vue components need a template printer alongside the TypeScript and JSX ones. vue builds elements, text, static and bound attributes, and v-model, and prints a single-file component with script setup, template, and scoped style. Text escapes &, <, and { and attribute values escape & and ", which Vue decodes only after it parses interpolations and attributes; tests render printed templates with Vue's own compiler and server renderer. objectType takes optional members for defineProps.
* feat(storybook): generate Reka UI components for Vue stories
A component set whose behaviour is a Button, Switch, Checkbox, Toggle, or Collapsible now exports with --framework vue as a single-file component on Reka UI: its parts become Reka components, its variants become a scoped stylesheet from its state styles, its value a defineModel, and every other variant property a prop set as a data attribute. Its stories render the component, with a play function that clicks the control and checks its state. The native button reset moves to dom-css so preview and generated components share it.
* test: run generated Vue components in a browser
Exports a Switch and a Collapsible to Vue stories, serves each generated component with Vite and Vue's plugin, and checks in Chromium that clicking flips Reka's state, the state styles move the thumb and change the fill, a disabled switch ignores clicks, and a collapsible shows its content when opened.
* refactor(emit): escape Vue templates with entities
Text and attribute values are escaped as HTML by entities' escapeText and escapeAttribute, which follow the HTML spec, instead of hand-written tables. Text still writes { as an entity, since Vue reads {{ as an interpolation before it decodes entities.
* fix(emit): keep Vue text adjacent and raw blocks closed where they end
An element with text content printed each child on its own line, which Vue renders as a space between text and an element. It now prints its children inline. A closing tag inside a script string or a style value, which can come from an imported design, ended the block early; it is written <\/, which JavaScript strings and CSS read back as </.
|
||
|
Danila Poyarkov
|
4eb3449b0c
|
fix(app): keep a closing tab's canvas off the next document (#958)
* fix(app): keep a closing tab's canvas off the next document Tab components read the editor through useEditorStore, which resolves to whichever tab is active at each call. When a tab closed, the next tab became active before the closing canvas finished, so the canvas registered its renderers with that document and its cleanup removed them from the wrong one. Every closed document's renderers, WebGL canvases, and detached editor DOM stayed in the remaining tab: about 1,200 DOM nodes, 320 listeners, and 2.5 MB of heap per open and close in a production build. EditorWorkspace now provides its tab's store to app components as it already did for the SDK's useEditor, and useEditorStore returns it inside the tab. App-level menus, shortcuts, and services outside any tab keep following the active tab. Over eight open and close cycles, DOM nodes, listeners, and the remaining tab's renderers stay flat. * fix(app): bind the workspace itself to its tab's store Vue resolves an injection from the parent, so EditorWorkspace could not inject the store it provides and its own template kept following the active tab, reading the next document while its tab closed. It now takes its tab's store directly. * refactor(app): pass the workspace its tab as a prop EditorWorkspace read the active tab once during setup and relied on WorkspaceView keying it by tab to keep that choice. WorkspaceView now passes the tab, the workspace uses its store directly, and provides it to the components below, so the binding is explicit in the template. * test: keep the light-page setup from leaving documents unsaved CanvasHelper switches a fresh document to Figma's light page so canvas specs draw on it in the dark theme. Setting the page color counts as an edit, so every spec's document started unsaved, and closing a tab asked to save changes nobody made: both tab-close specs hit that dialog. The store now exposes markDocumentSaved, which reload and save already use, and the helper takes the light page as the saved state. * test: wait for a closing menu before opening the next one A menu stays in the page while it animates out, and a click on a menubar trigger then is lost, so menu specs failed depending on which tests ran before them. They now open menus through one helper that waits for the previous menu to go and for the named menu to appear. * test: configure storage through the current settings form Storage settings moved the connection fields behind the provider row and save them with one Save button, so the workspace spec timed out looking for an Endpoint field that was not shown. |
||
|
Danila Poyarkov
|
cb075b3e1a
|
perf: speed up opening large pages (#953)
* perf(canvas): find guide owners from an index instead of walking the page Drawing and hit-testing guides visited every layer of the page on each frame to find the few that carry guides; on a large page that took about 1.2s of a load's rendering. The graph now keeps the set of layers with guides current from its node events, and both read it. * perf(layout): write only changed geometry and request one render per layout pass Layout wrote every laid-out layer's geometry whether or not it changed, so each pass over a large page notified every graph listener for every layer; a page load spent about 1s handling those updates. Layout now writes only the fields that changed, and the updates a layout pass makes ask for a single render, queued for before the next frame, instead of bumping the editor's reactive versions once per layer. * test(canvas): drop the graph double the guide tests no longer use * perf(fig): copy an opened file once on the main thread instead of three times Opening a .fig in the browser copied the file for a main-thread fallback the caller's buffer already served, then copied it twice more for the worker, which parses from one and keeps the other as the original archive. A 109MB file briefly took over 400MB on the main thread. The fallback now reuses the caller's buffer, and the worker receives one copy and makes its archive copy itself. * docs(changelog): note faster large-page loads * fix(app): run recovery and autosave after edits, not redraws Recovery and autosave watched sceneVersion, a render counter that every requestRender bumps: opening a file, layout passes, fonts, and each layer a page loads. Safari has no File System Access API, so its opened files have no writable source and always get recovery snapshots. Loading a page also invalidated the original archive, so a snapshot encoded the whole document again; on the Preline UI kit's CMS page that ran about 100 s on the main thread in WebKit before failing. Recovery, autosave, and saved versions now follow the content revision of createDocumentChanges. A page's layers loading from the opened file, which runs inside applyImportedStateDuring on both the worker and main-thread paths, no longer counts as an edit for that revision or for the original archive, and asks for one render rather than one per layer. In WebKit the CMS page switch drops from 105-133 s to 21 s, and its longest main-thread stall from 90-117 s to 1.4 s. * refactor(app): stop storing a version with recovery snapshots Adopting a snapshot now protects the document's current content revision, so nothing reads the version a snapshot was taken at. Snapshots saved by earlier versions carry a sceneVersion field instead; dropping the field keeps the metadata type true for both. Tests tell snapshots apart by the bytes they were built with. |
||
|
Danila Poyarkov
|
974905289a
|
fix(canvas): keep image-heavy documents within CanvasKit memory (#963)
* fix(canvas): bound image decoding for large Figma documents * test(canvas): update lifecycle fixture for image caches * test(canvas): align image regressions with contribution guides Use native wheel zoom in the browser regression instead of inline store access. Keep export state restoration in the existing raster suite and explicitly format the new image tests omitted by the root format script. * fix(harness): pin patched proxy address dependency Override the transitive proxy-addr dependency with 2.0.8 to fix IPv4-mapped IPv6 trust subnet checks and pass the critical dependency audit (GHSA-jqcg-44mw-7w3h). * build: drop the proxy-addr override master already resolves Master's lockfile has proxy-addr 2.0.8 since the advisory was fixed upstream, so the override this branch added is redundant. * perf(canvas): encode image previews as WebP PNG previews of photos ran to several megabytes each, so a page of them filled the 64 MiB preview cache and evicted itself: page 2 of the #924 reproduction held 48 MB of PNG previews against 7.3 MB as WebP. Browsers that cannot encode WebP hand back PNG. Co-authored-by: sableangle <sableangle@gmail.com> * perf(canvas): decode four image previews at once The browser decodes previews off the main thread, so one at a time left a page of photos filling in for seconds: page 2 of the #924 reproduction took 4.6 s to finish and now takes 2.0 s. Co-authored-by: sableangle <sableangle@gmail.com> * refactor(canvas): decide on image previews once per document size needsImagePreviews replaces useViewportImageRendering, which was not a Vue composable, names its two thresholds, and keeps its answer per document and image count instead of summing every image on each frame. Choosing a preview by zoom carries a lint exception: preview mode draws the scene uncached. Co-authored-by: sableangle <sableangle@gmail.com> * docs: describe the image memory fix in the changelog Co-authored-by: sableangle <sableangle@gmail.com> * fix(canvas): let go of a document's image previews when the document changes Switching to a document that needs no previews left the preview cache holding the previous graph and its encoded images, often hundreds of megabytes, until previews were used again. The renderer now releases them when its document changes, keeping the decoder for the next one. --------- Co-authored-by: sableangle <sableangle@gmail.com> |
||
|
Danila Poyarkov
|
6a9b69f677
|
fix: keep bound text and visibility in step with their variables (#954)
* fix: keep bound text and visibility in step with their variables Text bound to a string variable was resolved only when a .fig file was read, and visibility bound to a boolean never, so editing the value or switching a mode left them showing the old one. The binding reconcile, renamed reconcileVariableBindings, now resolves text and visibility with numbers, scoped the same way, and .fig export writes them resolved in each collection's default mode. A bound font family is left as stored, since changing it needs the font loaded. * fix: keep text and visibility an instance overrides over their bindings Typing in a bound layer inside an instance or toggling its eye records an override but keeps the binding, so the next value edit or mode switch replaced what was typed or hidden. An overridden text or visibility now keeps its value, as an overridden width or height does. |
||
|
Danila Poyarkov
|
759f9eb611
|
feat: show controls in a prebuilt demo and fix what saving it to .fig lost (#938)
* feat: show controls in the demo and tidy the component panels The demo gains a Controls page: a switch, checkbox, slider, tabs, text field, and a button with interaction states, written as Reka-named design JSX, and a settings card of their instances to try in preview. Go to main component and Detach instance move into the instance's panel header as icon buttons. The Behaviour section's "Still needed" line is a status rather than a button that only moved focus, and the rows it names are marked instead. The DOM projection writes flex-start for auto layout's start alignment: CSS stretches children by default, so a hugging button in a column filled its card in preview and HTML export. The paint page snapshot catches up with the frame names #930 draws. * perf: open the demo as a prebuilt .fig instead of generating it /demo built every page in the browser and laid them all out in one task, which froze the page for about six seconds. The demo's content moves to tools/generate/demo, which builds public/demo.fig headlessly, before Vite serves or bundles the app and only when its inputs changed; /demo opens that file like any other, off the main thread and behind the loader. The document is now lint-clean: small captions are 12 px, and the badge and disabled button text meet contrast. Opening the demo from .fig showed three bugs in saving and reading files, fixed here: - A layer's blend mode was never written, so Multiply and Screen reopened as pass-through. - Underlines drawn from saved glyphs ran to the text box edge; glyphs now keep their advance, read from and written to .fig, and the underline ends where the text does. - A frame laid out on its own because of a saved hug size ignored the width its parent stretched it to, so centred content moved to the start. * feat(design-jsx): write Reka elements in TSX The Reka element names were only part of the JSX string grammar, so code that builds trees in TypeScript had to assemble strings by hand, unchecked. @open-pencil/design-jsx now exports each Reka namespace as typed element functions (Switch.Root, Slider.Thumb, Tabs.Trigger, …), derived from the same table the string renderer reads, with props typed as the behaviour props a root binds. The demo's controls are TSX built with them. * fix(canvas): draw a component set's editing border at the live zoom A component set without a stroke got its dashed border in the scene, sized by dividing by the zoom. The scene is cached as retained pictures and scaled while navigating, so the border was recorded at one zoom and grew into thick dashes when zooming in, until the page was redrawn. It is editor chrome, so it now comes from the overlay pass, which draws every frame at the live zoom, as slot outlines do. The label cache tracks every component set on the page for it, and image export no longer includes the border. * test: fit the P3 paint page to the canvas size it is captured at The P3 test zoomed to the paint page while the wide-gamut notice still took space, then dismissed it, so the first capture fit a shorter canvas than the second and the two only matched by timing. focusPaintEffects waits for the canvas to take a window resize, the test focuses again after the notice goes, and the snapshot shows the demo as it now opens. * refactor(canvas): fill sections and sets through one helper Without its own fallback border, a component set fills and strokes its rounded bounds the way a section does; fillRoundedBounds fills them for both. * test: check the demo controls on their own page and type pixel reads The demo test built and round-tripped the whole four-page document to check the controls, which took six seconds on CI and timed out; it now builds the Controls page alone through the same measured-text setup the build uses. The underline test reads CanvasKit pixels as any number array, since readPixels may return floats. * fix(canvas): measure long text extents without spreading glyphs Spreading every glyph into Math.min/max overflows the argument limit on long texts. * fix(demo): keep a tab touched while the demo loads and report a failed load A file opened or a layer drawn during the fetch keeps the tab; a failed fetch shows the open-file error instead of an unhandled rejection. * test: check a component set border stays one pixel wide when zoomed |
||
|
Danila Poyarkov
|
f8d2dbc7e6
|
feat(chat): attach dropped images and style tables, menus, and link prompts in replies (#955)
* feat(chat): attach images by dropping them on the chat Images could be attached with the attach button or by pasting, but a drop on the chat did nothing: the window's document drop handler left images to the canvas, so they were dropped silently. Images dropped anywhere on the chat panel now attach, through the same path as the attach button and paste, with the same limits and errors. While images are dragged over the panel, an outline over the composer says where they go, or why they cannot be attached while a reply runs or four images are already attached. SVG images are drawn as PNGs, since vision models take raster images. A drag without images, such as a .fig, is left to the window, which opens documents. The canvas and the chat share AppDropOverlay, a typed feedback component with a light tint over surfaces and a cover over fields. * fix(chat): style tables, menus, and link prompts in AI replies vue-stream-markdown drew tables with semibold, filled rows at 14px, with copy, download, and fullscreen buttons above each; its tooltips doubled with the browser's, and the link confirmation it teleports out of the message had no app colors, since the token mapping sat on the message element only. The token mapping now lives in markdown.css on the renderer's .stream-markdown elements, so teleported dialogs and menus use app colors. Tables use regular weight, a light header, and the chat density's size, with copy as their only action; task items show their checkbox in place of the bullet; the copy menu and link prompt follow the app's menus and dialogs. Hover labels use the app's tooltip, while click menus keep the renderer's. Links no longer request each site's favicon. * fix(chat): keep an SVG drawn after sending out of the next message Drawing a dropped SVG as PNG takes a moment. A message sent or cleared meanwhile no longer gets the image added to the following draft: each draft has a generation that sending and clearing advance, and an image finished for an earlier one is dropped. |
||
|
Danila Poyarkov
|
1717d8d19d
|
fix: meet WCAG AA contrast and name controls for screen readers (#952)
* fix: meet WCAG AA contrast and name controls for screen readers Storybook's axe addon reported violations in 69 stories, mostly text below 4.5:1, and the story test ignored its reports. Every story now passes axe in both themes and the test fails on any violation. Contrast comes from the theme tokens. The dark accent fill takes the light theme's #2563eb so white text reads on it; accent-colored text moves to primary and solid focus rings to panel-focus, which keep the lighter blue. Dark component, slot, and error colors are lighter; light muted, primary, and issue-warning are darker. The follow bar picks black or white for the followed person's color through a new readableForeground, which canvas labels now share. Listbox names move to the element with role="listbox", the layer and page rename fields get labels, and disabled picker options and checkbox cards expose aria-disabled, which Reka's ListboxItem leaves out. Axe exemptions stay narrow and explained: vue-stream-markdown's code-block landmarks, Reka's toast focus guards, drag placeholders, reverted replies, Design Check's sample of the document's own failing colors, and the Behaviour demo that shows several sections at once. * chore(storybook): title stories by the folders that own them Design System stories follow the families under src/components/ui (Actions, Inputs, Selection, Feedback, Overlays, Layout, Lists, Navigation, Paint), app stories sit under App/<area>, and titles use Title Case. Editor navigation leaves Design System, and the sidebar order drops entries for stories that no longer exist. * fix: keep dimmed rows and reverted replies readable Fading a selected hidden layer's row faded its blue highlight with the white name, down to 2.76:1 on the light panel, so selected rows dim only their icon. A reverted reply dims its text to the muted color instead of fading to half opacity, so it reads at 4.5:1 and stays in the axe scan, including the tool-call disclosure inside it. The Markdown landmark exemption now covers only the stories that render code blocks. |
||
|
Danila Poyarkov
|
85d8c69ccc
|
fix(app): keep opened documents saved until they are edited (#945)
* fix(app): keep opened documents saved until they are edited Opening a .fig file lays out its first page, and every node:updated counted as a change, so the recomputed auto-layout sizes and positions marked the document unsaved right after it was marked saved. Updates made while the graph applies layout no longer count: layout only derives geometry, and an edit that relays out a page has already counted. A unit test runs a real layout pass, and an E2E test opens an auto-layout file and closes it without a save prompt. * test(app): reach the fixture through testPath |
||
|
Danila Poyarkov
|
cff091bc6a
|
test: resolve repository files without climbing directories (#946)
* test: resolve repository files without climbing directories
Twelve tests and helpers reached shared fixtures, package assets, and workers with ../.. paths from import.meta, which the import rule does not see. They now go through repoPath and testPath, a workspaceRoot() that finds the root by its lockfile, the core package's own root, or the #core alias through import.meta.resolve. The root finder derives its folder from import.meta.url, so Playwright specs running under Node can use the helpers too. open-pencil/no-deep-parent-relative-paths rejects climbing two levels in new URL(…, import.meta.url) and in path calls that start from import.meta.
* fix(lint): catch Windows separators and wrapped import.meta paths, and stop at template expressions
The path rule missed '..\..' and a base such as dirname(fileURLToPath(import.meta.url)), and read `../${folder}` followed by '..' as climbing two levels.
|
||
|
Danila Poyarkov
|
11e708de39
|
fix(layout): size each axis on its own and lay out before geometry reads (#942)
* fix(figma-api): lay out pending edits before geometry reads Scripts read x, y, width, height, transforms, and bounds as they were before the script ran until the tool finished and laid out its changes. Figma lays out on read, so a hugging parent reports its new size right after a child is added. The graph now records the scope of edits outside layout application, and the geometry getters lay that scope out first through the same runner tools use after a call. One recorder exists per graph; a new FigmaAPI starts it afresh because the editor lays out its own edits. * fix(layout): size each axis on its own, as Figma does Fill is stored on the child, as layoutGrow along the parent's primary axis and STRETCH across it, with a grid laid out like a row; primaryAxisSizing and counterAxisSizing only fix or hug. A shared layoutSizing helper in scene-graph reads and writes per-axis sizing, and layout, the Figma API, the properties panel, design JSX, DOM/CSS export, and .pen import use it. This fixes grid children filling both axes when set to fill one, auto-layout children that stretch but kept a fixed size, the Figma API writing Fill to a frame's own sizing (which .fig export dropped), and JSX and HTML exports losing grid and cross-axis fill. Behavior was checked against live Figma, and imported layouts were compared with the geometry stored in material3.fig and nuxtui.fig. * fix(layout): keep pending edits until laid out and opt out of inherited stretch A new FigmaAPI cleared the edits recorded on its graph, so after a script failed before its tool laid out its changes, the next script read stale geometry; edits now stay recorded until a read lays them out, and return to the record if that layout throws. Setting a child to Fixed or Hug across a parent that stretches every child left it filling; it now opts out with MIN, as frame presets do. |
||
|
Danila Poyarkov
|
4faccd047d
|
feat(canvas): select auto layout frames by their gaps and dot their children, as in Figma (#943)
* fix: select top-level auto layout frames by their empty area Checked against Figma desktop 126 with real pointer input. The gaps and padding of a top-level frame with auto layout (any direction or grid, filled or not, on the page or in a section) select, highlight, and drag the frame, while clicks on its layers still select those layers. A plain top-level frame's empty area stays background, as #900 recorded; its oracle scenarios only used frames without auto layout. Auto layout frames are hit by their bounds even without a fill, and a press on such a frame's empty area no longer starts a marquee. * feat(canvas): outline auto layout children with dotted lines, as in Figma Hovering a horizontal or vertical auto layout frame outlines its visible direct children, and a single selected layer dots the border of its auto layout parent, in the container's outline color. Grid and plain frames, grandchildren, and multi-selections show none. Line weight and dash were measured from Figma 126 screenshots: 1 px with 1.75 px dashes and 1.25 px gaps in screen space. The editor gains a transforming flag that canvas input sets while layers move, resize, or rotate; the outlines and the padding and gap markers of a selected auto layout frame hide while it is set, as Figma's do. The children outline a selected auto layout frame drew under the pointer now uses the same stroke, and the dash effect is freed after each draw. * fix(canvas): select unfilled frames by their empty area only on a click Live Figma 126, with real pointer input on a top-level card holding an unfilled auto layout row and an unfilled plain frame, with and without auto layout on the card: a click on either frame's empty area selects that frame, while a ⌘-click looks through it to the card. Only top-level auto layout frames now own their empty area in hit testing, so a deep hit no longer stops at a nested unfilled auto layout frame. A click that ends on an open container selects the frame child under the point by its bounds, filled or not, which plain frames did not get before; boards that open by themselves keep their empty area as background. * fix(canvas): select an empty unfilled frame on the page by its bounds Live Figma 126: a click inside an empty frame without a fill selects it, on the page and in a section. The section case already did after the previous commit; on the page the click found nothing, since an unfilled frame without children is not hit. A click that hits nothing now looks for a frame under the point among the scope's children, which skips boards that hold layers, as their empty area stays background. * refactor(scene-graph): read the containers the selection opens in their own helper * fix(canvas): open a selected container, so repeated clicks reach deeper layers In Figma, clicking again at the same point inside a selected frame, component, or instance selects the layer under the pointer, so repeated clicks walk down to a text in a nested component such as shadcn's calendar. The click hit test opened only the ancestors of the selection, so a selected nested container stopped the walk at itself and only a double-click went deeper. A selected container with layers now opens like its ancestors; groups and booleans stay closed, as in Figma. Pressing inside the selection still drags it, and its empty area keeps it selected. |
||
|
Victor Wads
|
690c1247e4
|
feat(collab): show MCP agents, follow streamed JSX, and follow your agents as they work (#725)
* feat(MCP): follow agent activity in canvas * feat(collab): show MCP, ACP, and harness sessions as agents MCP clients worked on the document unseen: only the built-in chat had a presence, and following agent activity meant a separate setting that moved the viewport after every MCP tool. Each MCP session now shows as an agent with a callsign in its owner's color, like the chat: the MCP server forwards the session and the client's name with each tool call, the app's own ACP and Pi harness chats mark their sessions with a header, and the agent points at the layers each call reads or changes on their page. It rests after a quiet spell, leaves when its session ends or the server disconnects, and collaborators see it through awareness. Following it works like following anyone else, from the avatars, so the default-on follow setting and its viewport fitting go. Co-authored-by: Victor Wads <victor@wads.dev> * feat(ai): move the chat's agent through JSX as it streams While the built-in chat streamed a render call, its preview grew on the canvas but the agent stood still until the tool finished. The preview now reports, after each update, the element that appeared last and the bounds of what the JSX builds; the agent's cursor follows that element and its outline traces the preview, for collaborators too, until the tool runs and the agent outlines the real layers. Peers' outlines are validated and capped like their selections. Co-authored-by: Victor Wads <victor@wads.dev> * feat(collab): glide cursors and the followed view instead of jumping People's and agents' cursors jumped to each new point, which with throttled awareness and an agent streaming JSX made them stutter, and following re-centered the view in one jump on every update. Cursors now ease to each new point from wherever they are drawn, and following pans and zooms the view there the same way, stopping in place when you take over. With animations off or reduced motion, both move at once. Each cursor carries an id so it keeps its glide between updates. Co-authored-by: Victor Wads <victor@wads.dev> * test(collab): cover MCP agents and the streaming agent in the browser Test runs send MCP requests through the bridge's own command handler, so a browser test can show an MCP session as an agent to the editor and to a collaborator without a separate server. The streaming JSX test checks that the chat's agent cursor and outline follow the newest element. Co-authored-by: Victor Wads <victor@wads.dev> * docs: describe agent sessions, streaming cursors, and gliding follow Co-authored-by: Victor Wads <victor@wads.dev> * fix(ai): keep the streaming agent's name off the text it writes The chat's agent sat at the newest streamed element's top-left corner, so its name label covered the text being written. It now sits at the element's trailing corner, where content grows. Co-authored-by: Victor Wads <victor@wads.dev> * fix(collab): end only a closed connection's own MCP sessions When the app's connection to the MCP server closed, every MCP session's agent left, including sessions that never came over that connection, such as a second editor's. The bridge now remembers the sessions each connection carried and ends only those. Co-authored-by: Victor Wads <victor@wads.dev> * feat(ai): follow your agents automatically while they work Agents spun up from the chat or an MCP client worked out of sight and then went idle, so people had to find what changed, and the agent skill told agents to move the user's view and selection after every edit. A Follow agents toggle in the AI panel's header, on by default, now has the view follow our agents from the start of each run: whichever starts first, then the next one at work once the followed agent rests. Leaving the page, moving the view, Escape, or Stop following leaves that agent alone until it rests; people are never followed this way. The skill no longer asks agents to select and zoom to their work. Co-authored-by: Victor Wads <victor@wads.dev> * fix(collab): keep an MCP agent when a restarted bridge carries its session Restarting MCP disconnects the old bridge and opens a new one at once, but the browser reports the old socket's close only after its close handshake. A tool call that reached the new connection in between was undone by that close, which ended the session and removed its agent. Sessions now record every connection their calls came over, across bridges, and end only when the last of them closes. The docs no longer say that following an agent keeps it from editing out of sight: following moves your view, and the stale variables and follow bullets the changelog's union merge brought back are removed. Co-authored-by: Victor Wads <victor@wads.dev> * test(collab): record what the bridge sends instead of an empty fake method Co-authored-by: Victor Wads <victor@wads.dev> --------- Co-authored-by: Danila Poyarkov <dev@dannote.net> |
||
|
Danila Poyarkov
|
76988569b0
|
fix: match Figma's panel X, Y, rotation and themed page backgrounds (#940)
* fix(core): start new layers with Figma's defaults in the editor and plugin API The plugin API created bare nodes: frames, components, and shapes without fills, and lines and vectors without strokes, so scripts written for Figma drew nothing. Drawn lines also had a black fill instead of a stroke and were invisible. Both paths now share newLayerDefaults, recorded from Figma desktop 126: frames and components white with frames clipping their content, shapes #D9D9D9, lines and vectors a black 1 px stroke, text black. A stroke a script adds gets the 1 px default weight, and an empty vector has no render bounds. * fix(core): combine variants as Figma does from the canvas and from scripts The plugin API and the editor command each built component sets their own way, both with 40 px of padding and a grey fill. Figma's command pads the variants by 20 and outlines the set with a 1 px dashed #8A38F5 stroke; its plugin API wraps them exactly with no fill or stroke. One variantSetProps now places and styles the set for both, with a canvas or script style, and applyVariantProperties derives variant properties for both. * fix(core): report group children in their container's space in the plugin API Figma's plugin API places children of groups and booleans relative to the nearest real container and refits a group whenever a script changes one of its children. Ours reported group-relative positions and never refit, so scripts placing layers inside groups landed them in the wrong place. x, y, and relativeTransform now map through the groups around a node, and geometry changes, appendChild, insertChild, and remove refit the surrounding groups. The refit moves to Scene Graph as fitEnclosingGroups, shared by the canvas (with undo) and the plugin API. * test(core): pass script-style strokes and typed components in parity tests * test(e2e): expect Figma's default shape grey in the scene freshness spec * fix(vue): draw lines by length and angle as Figma does The Line tool sized a line as the box spanned by the drag. With the stroke a new line now gets, that box drew as a rectangle outline. A line now starts at the press point with the drag length as its width, no height, and the drag angle as its rotation, as Figma's Line tool makes it; Shift snaps the angle to 45° steps, as the docs already described, and a click makes a 100 px horizontal line. * fix(core): give each new layer its own copy of the default paints The defaults spread each paint shallowly, so every layer shared the colour object of the module-level default and editing one layer's colour in place changed the next new layer. Copy the paints with the Scene Graph copy helpers. * fix(core): group, ungroup, and combine layers through shared code in the plugin API The plugin API wrapped layers, ungrouped, made booleans, and made components from layers with its own code. Ungroup moved the children to the top of the stack, booleans were named "Boolean union", and a component made from a frame cloned its children under new ids. These now run through the editor's shared wrap, ungroup, and boolean functions, with the placement and defaults recorded in Figma desktop 126: a group or boolean without an index goes on top, ungrouped children take the group's place, booleans are named after the operation and filled with the default grey, a frame becomes a component in its place with its children, and any other layer is wrapped in a white component named after it. Undoing a wrap in the editor now returns each layer to its own place in the stack. * fix(core): group, frame, combine, and make components from the canvas as Figma does Recorded in Figma desktop 126: a container made from the canvas takes the topmost selected layer's place, Frame selection adds no fill and does not clip, a component wrapped around layers is white and takes a single layer's name, and a boolean is filled like its topmost operand, or its base for Subtract, without strokes. The canvas commands and the plugin API now share the wrap parent check, stack ordering, component rules, and boolean paints, and the plugin API's createComponentFromNode converts groups in place as Figma does. Undoing a boolean returns each operand to its own place in the stack. * refactor(core): reuse translate when centering pasted layers * fix: match Figma's transforms, strokes, booleans, sections, and names Each behaviour was recorded in Figma desktop 126 with the same script, or from its canvas, and both the editor and the plugin API now share it. - Scripts turn a layer counterclockwise about its top-left corner, read x and y as that corner, keep it in place on resize, can set relativeTransform, and get absoluteBoundingBox around the turned layer. appendChild and insertChild keep x, y, and rotation in the new parent instead of the canvas position, which the create and reparent tools inherit. - A layer keeps its stroke weight and alignment without strokes, in the model and through .fig export and import. strokeWeight and strokeAlign apply to every stroke, and a stroke added from the panel or a script takes the layer's. - Booleans size to their result when a renderer can measure it, from the canvas, from scripts, and when an operand moves. - New sections take Figma's fill for the interface theme, a faint white stroke, and 2 px corners; sections and component sets draw with their own radius. - Layers drawn on the canvas and the containers it wraps layers in are numbered past the highest number on the page; scripts keep plain names. * test(core): dispose the editor in the canvas boolean bounds test Attaching CanvasKit installs a global text measurer, and the test left it installed, so later text measurement tests in the same process found it. * fix(core): undo a boolean's group refit and clamp dashed set corners Sizing a boolean to its result also refits the groups around it, and undo left them refitted, so the operands came back displaced. createBooleanOperation returns the fit, and undo reverses it first. A component set's dashed outline now clamps its radius to its bounds as the fill does, and a script's resize refits the enclosing groups once, after the corner is restored. * fix: show and edit X, Y, and rotation as Figma's properties panel does Recorded in Figma desktop 126: the panel's X and Y are the top-left of a turned layer's box on the canvas, measured from its frame or page through any groups, rotation is counterclockwise with a flip reading as 180, a typed rotation turns the layer about its center, and a typed X or Y moves its box. The panel showed our clockwise angle and the unturned box. The conversions live in @open-pencil/core/geometry beside figmaRotation, which the plugin API now shares, and the position controls preview a change worked out for each selected node. * fix: start new pages on Figma's background for the interface theme Recorded in Figma desktop 126: a page made in the dark theme is #1E1E1E and in the light theme #F5F5F5, from the canvas and from scripts. New documents, pages the editor adds, and figma.createPage now store that background; existing pages keep theirs. The unused OS-scheme helper getDefaultCanvasBgColor goes. Playwright runs the app in its dark theme, so CanvasHelper keeps fresh documents on the light page the canvas snapshots were drawn on, and a dedicated spec covers both themes. * test(e2e): switch the theme through the app module in the page background spec Writing localStorage directly breaks the no-direct-storage-access rule. The spec now sets the light theme the way the chat harness does, reloads, and checks the theme took effect before reading the page color. |
||
|
Danila Poyarkov
|
af18eec514
|
fix(ai): polish chat history and stabilize chat tests (#923)
* fix(ai): confirm deleting a conversation in the standard dialog Deleting a conversation asked inside the chat panel's header, unlike every other destructive confirmation, which uses AppConfirmationDialog. It now opens that dialog, which names the conversation; Cancel keeps it and Delete removes it. * feat(ai): dim a reverted reply's content A reverted reply still showed its tool cards with their success marks and its text as if the edits were there; only the line below said otherwise. Its content is now dimmed, while the Changes reverted or Restore changes line and the other actions stay at full strength. * ci: typecheck the test suites in Code quality bun run check runs check:test-types, but PR CI did not, so tests that no longer type-checked could merge and break bun run check on master, as the grid fixtures from #866 did. It runs as a step of Code quality, which already builds the package declarations it needs; the check takes about two seconds, less than a separate job's setup. * test(ai): time the reasoning auto-close with the fake clock The test slept 1200 ms of real time past the 1000 ms auto-close to show that a manually opened block stays open, which was timing-dependent under load. It now advances Playwright's clock past the timer. With manual opening ignored, it fails. * test(ai): skip file identity on Playwright's bundled Chromium on macOS There, reading a FileSystemFileHandle back from IndexedDB closes the page before any app code runs, so the test always failed locally on a Mac. Installed Google Chrome on the same machine reads and compares the handle correctly, and the app's resolveFile returns one ID for twelve concurrent calls there. The skip is limited to the bundled build on macOS. * fix(settings): keep a model picker open while the editor slides in The models panel focused the editor's first field after its enter transition, even when focus had already moved into the editor, closing a picker opened during the animation. It now leaves focus alone once it has moved since the editor opened. * test: serve a fixed model catalog and wait for the editor before Settings shortcuts Chat tests fetched the live models.dev catalog, so the model list changed under them; they now get a small fixed one. The credentials test pressed the Settings shortcut before the editor was ready. * fix(settings): move drill-in focus with Reka's FocusScope The drill-in focused the detail's first field after its slide-in ended, found by querying the DOM, and restored focus by hand, so a picker opened during the slide closed. FocusScope now focuses the detail as it mounts and returns focus to what opened it. A caller can prevent open-auto-focus to focus its own field, which the models panel does for the profile name through the editor's exposed focus(). * test(ai): answer the Vision model's request in chat tests A message with images is analyzed by the Vision model, which calls OpenRouter directly rather than the mocked chat transport. With the test key the request failed, and since #916 a failure before dispatch takes the message back, so the WebKit history test never got a reply. The chat fixture now answers that request with fixed findings. * test(ai): check that deletion persists and reverted replies dim The delete test passed even if the conversation stayed in storage, since the panel clears its messages before the store removes it; it now reloads and checks the history. The revert test checked only data-reverted; it now checks the rendered opacity too. |
||
|
Danila Poyarkov
|
8bf71bd92f
|
feat(ai): add guided AI setup for providers, coding agents, and Pi (#916)
* feat(storybook): prototype guided AI setup and task assignments * refactor(storybook): adopt shared control foundations * refactor(storybook): build AI setup on current settings foundations Move the prototype to settings/ai-setup and compose SettingsSection, SettingsGroup, SettingsRow, AppAlert, AppBadge, and AppCheckbox instead of local section, status, and badge markup. Replace the nonexistent danger color and raw amber with the error and warning tokens. * feat(ui): add a shared radio group AppRadioGroup wraps the Reka radio group with typed options, labels each radio by its option text with any description as its accessible description, and supports all arrow keys unless an orientation is set. The AI setup wizard uses it for the spending choice, named by the step heading, and shares the choice card style with its checkboxes. * fix(ui): draw unchecked checkboxes on the field background AppCheckbox filled its box with the surface (text) color, so unchecked boxes were nearly black in the light theme and nearly white in the dark theme. Use the panel field background and accent hover border shared with the radio group and switch. * refactor(storybook): drop the simplified AI connections panel AI setup has two modes: skippable guided onboarding for most people and the existing advanced settings for power users, both editing the same model settings. Remove the third, simplified connections and tasks panel. The wizard's Advanced settings action and the returning-user screen now stand in for ModelsPanel, which offers Run guided setup. Removing Gateway's own Back button also fixes the blank screen it led to. * feat(ai): plan guided AI setup from the model catalog planOnboarding proposes design and vision models from the access a person already has, using the real provider and agent catalog, and falls back to OpenRouter only when pay-as-you-go is allowed. applyOnboardingPlan merges a confirmed plan into the model settings, reusing matching connections and profiles, keeping roles it was not asked about, and dropping only the empty fresh-install profile. * refactor(ai): share model provider display names Move the provider, agent, and Pi display-name lookup out of the model settings workflow so guided setup can reuse it. * feat(ai): offer guided AI setup over the real model settings Guided setup asks what AI should help with, what access the person already has, and whether pay-as-you-go models are allowed, then proposes design and vision models from the provider and agent catalog. Connections reuse the provider key field and connection test, keys are saved through the credential manager, and the confirmed plan is merged into the model settings, keeping anything configured by hand. Saving reports saved, partial, or failed like the profile editor. A fresh install whose model settings are still the empty placeholder is offered setup once with a skippable welcome; existing setups never see it. Settings → AI & agents can run it again, and Advanced settings hands off to the model editor. The Storybook fixtures for agents, OpenRouter sign-in, Vercel AI Gateway, and the local server are replaced by the real flow, with all copy translated. Browser tests start with the offer dismissed through the shared Playwright storage state; the first-run spec clears it. * fix(ai): keep configured models and credentials safe in guided setup Running guided setup again planned from the catalog defaults, so it replaced hand-configured design and vision models and dropped their settings; it now keeps a configured model while its access is still selected or onboarding cannot offer that provider, and keeps vision when nothing new covers it. Reused profiles must have the capabilities the plan relies on, and an explicit vision assignment without image input is cleared. A server's saved key and its status now apply only to the connection at the address being entered, and its connection test uses that connection's API type. Entered keys are copied before saving, so closing setup mid-save no longer drops them, and the Models list refreshes key status after setup saves a key. Servers that do not check keys get a hint to enter any value, and a step that only keeps configured models says so instead of showing nothing. * test(ai): check key status right after guided setup The Models list must show a key saved by guided setup as connected without reopening Settings. * feat(ai): sign in to OpenRouter from guided setup OpenRouter can now be connected with its OAuth PKCE flow instead of a pasted key. In the browser, sign-in opens in a popup that returns to a static callback page on the app's origin, which relays the redirect to the editor over a BroadcastChannel, so the editor never navigates away. The desktop app opens the system browser and receives the redirect on a one-shot 127.0.0.1 listener, the localhost callback OpenRouter documents. Either way the editor checks the state, exchanges the code for a key directly with OpenRouter, fills it in, and runs the connection test. Waiting, blocked pop-ups, cancellation, expiry, and failures are reported in the step, which keeps the pasted-key path. Setup no longer offers Clear for a saved key, since removing keys belongs to the advanced settings, and the service worker leaves /oauth/ pages to the network. * fix(settings): report unreadable model keys as unavailable A saved key the browser credential store could not read, for example one left from an older session on the same origin, rejected the model status refresh and the startup credential check, which surfaced as a global error toast. Each read failure now marks only that connection as unavailable. * feat(ai): map every role in guided setup and verify OpenRouter sign-in Guided setup now proposes a model for design, vision, review, and fast work, and the review step is a map of those roles with every suitable model from the connected providers and a "Use recommended setup" shortcut. Fast work defaults to the provider's catalog model tagged as fast; behind an agent, review and fast work use the API model chosen for vision. Review and fast work are never asked about, so a configured choice, including none, stays unless it follows a design model it can no longer follow. The pay-as-you-go question only appears when the access already selected leaves a requested role without a model, so choosing OpenRouter or another account no longer asks it. After signing in with OpenRouter, setup checks the key with OpenRouter's key endpoint, which costs no credits, instead of a text generation test. The step then says it is signed in, names the key, warns when the account has no credits yet, and offers another account in place of the key field and test button. * feat(ai): offer OpenRouter only for goals nothing selected covers The separate pay-as-you-go step asked an abstract question even when the selected access already covered every goal. The connect step now names a goal nothing selected can cover, such as visual review behind a coding agent or a local server, and offers to add OpenRouter for it; once added, it says OpenRouter fills the gap and can be removed again. Setup can finish without visual review, but not without a design model. A local or company server can be marked as able to read images, which lets it cover visual review and makes it the preferred vision model over a paid account. * feat(ai): show provider logos and more providers in guided setup Guided setup shows monochrome logos for coding agents, API accounts, and local servers, from LobeHub's MIT-licensed static SVG set loaded as an `ai` icon collection, so they follow the theme like Lucide icons. DeepSeek, Z.ai, and MiniMax are offered under "More providers", and a local server can start from the Ollama or LM Studio address instead of typing it. * feat(ai): guide coding agent setup in guided setup Choosing Claude Code, Codex, or Gemini CLI in the desktop app now checks whether the agent's ACP program and OpenPencil's MCP server, which agents use to reach the canvas, are installed. An allowlisted agent_lookup command finds the program on the same widened PATH as the MCP lookup. The card shows install commands only for what is missing, checks again on request, links a new setup guide, and copies a prompt that asks an agent the person already uses to install both, confirm they are on PATH, and sign in. In the browser, the agent section links to the desktop app. * fix(ai): space the More providers toggle like a group heading The toggle sat flush against the account cards above and below it; it now reads as a group heading with the same rhythm as the other sections. * feat(ai): detect and install coding agents in guided setup Adopt the local agent discovery from #847. A desktop agent_lookup command reports each agent's own CLI, its ACP adapter, npm, and OpenPencil's MCP server on the widened PATH without starting any of them, and the app can install a missing adapter or the MCP server with npm, limited by the shell capability to those exact packages and the MCP version that matches the app. Guided setup now tells "installed but the OpenPencil adapter is missing" apart from "not installed", offers one-click installs, links each vendor's own setup guide, and keeps the manual commands and setup prompt for the browser, missing npm, or a failed install. Codex install instructions move to @agentclientprotocol/codex-acp, which replaces @zed-industries/codex-acp. Kiro CLI support from the same pull request is left for a separate change, since it needs ACP transport work. Co-authored-by: GitttHomie <134371845+GitttHomie@users.noreply.github.com> * build(app): resolve LobeHub icons with import.meta.resolve The architecture lint forbids createRequire in ESM build code. * test(app): seed AI setup specs through storageState Follows the storage seeding used by other browser specs and the import type rule. * feat(ai): set up Pi with its own sign-ins in guided setup Pi now runs with the providers signed in to in the Pi CLI and Pi's default model. The Harness companion reuses ~/.pi/agent; the app reads only Pi's settings.json for the default model and never auth.json. A saved key is still used as an AI Gateway key. Guided setup offers Pi next to the other coding agents. On the desktop it checks the Harness companion, the MCP server, and Pi's default model, and installs the companion with one click through npm. Agent discovery now reads the installed versions of the MCP server and the Harness companion from their package.json without starting them. Setup flags a version that does not match the app and shows the update command for the package manager that installed it, instead of reporting the server as installed and failing at the first message. * feat(ai): check agent companions before a chat starts A Pi chat without the Harness companion, or any agent chat whose companion or MCP server version does not match the app, failed when the process started and showed only the generic request error. The chat now checks the companions through agent discovery first and names the fix, with an action that opens guided setup. Pi sign-in and model problems use the same path. The Pi model editor shows the same companion, MCP server, and default model status as guided setup, and no longer requires a model ID, since Pi falls back to the default model set in Pi. Supersedes the companion detection in #566, which ran the companion to read its version and required an exact version match. * fix(harness): start Pi sessions with MCP tools and keep unsent messages Pi chats in the desktop app always configure OpenPencil's MCP server, and three companion problems stopped them: - @ai-sdk/harness-pi imports pi-mcp-adapter, which publishes TypeScript sources. Node refuses to strip types under node_modules, so the companion now strips them through a module load hook limited to TypeScript dependencies. Bun runs them as is. - pi-mcp-adapter imports @earendil-works/pi-tui, declared only as an optional peer, so npm left it out. The companion depends on it at the version pi-coding-agent uses. - Pi reports live-process resume, yet the service handed it state saved by an earlier session, and the just-bash sandbox cannot resume, so every later session with that ID failed. Live-process backends now start fresh and drop saved state. When a chat cannot start, the composer now keeps the typed message instead of discarding it. * fix(harness): keep companion stdout for protocol messages Pi prepares the packages listed in a person's Pi settings with npm, which inherits the companion's stdout, and libraries log through console.log. Both landed in the JSONL protocol stream, where the app discarded them with warnings. The companion now keeps the real stdout for protocol messages, sends other stdout writes to stderr, and quiets npm on success through its environment. The type-stripping hook no longer prints Node's experimental warning, and the app logs companion stderr as diagnostics rather than errors, since failures arrive as protocol errors. Document Pi in the coding agents guide, the AI chat page, and the README: guided setup installs the companion, Pi uses the Pi CLI's sign-ins and default model, an AI Gateway key is optional, and the companion needs Node.js 22.15 or later. * test(harness): keep the pi-tui pin in step with pi-coding-agent The companion depends on pi-tui only because pi-mcp-adapter imports it while declaring it optional (nicobailon/pi-mcp-adapter#805). Upgrading @ai-sdk/harness-pi moves pi-coding-agent, and a pin left behind would make npm install a second, mismatched pi-tui. The test fails until the pin matches. * test(ai): follow the model catalog in guided setup tests The plan and apply tests repeated catalog default and fast model IDs, so master's model update broke them without any change in setup behavior. They now read those models from the catalog. * test(ai): keep the model catalog helper with the shared test helpers Unit test homes under tests/app accept only *.test.ts files, so the onboarding tests' catalog helper moves to tests/helpers/ai. * docs: tighten the guided setup and Pi changelog entries Name every provider and server preset guided setup offers, describe the role step as it now works, and shorten the Pi entry. * test(ai): type the guided setup test stubs for the test typecheck Master now typechecks the test suites: fetch fakes go through fetchStub, the chat ref is shallow like the real one, and mocks declare the arguments the tests inspect. * test: type the tabs module in the closed-documents spec The spec imported the tabs module by its served URL without a type, which fails the test type check on master. * test(ai): assert outcomes instead of copy in guided setup tests Drop the setup-prompt test, which checked prompt prose, the onboarding wrapper cases that restated discovery, and the coversGoals case. Story plays and the OpenRouter E2E flow now assert controls and saved models instead of sentences and catalog model names, and the fast-model helper checks the planned model's catalog entry instead of recomputing the choice. tests/AGENTS.md states the rule. * feat(ai): return desktop OpenRouter sign-in through a deep link The desktop app ran a hand-written HTTP server on a localhost port to receive OpenRouter's redirect, and OpenRouter labels apps with a localhost callback by host and port. OpenRouter now redirects to a page on the web app that opens openpencil://oauth/openrouter with the same query, and the desktop shell forwards that link to the webview as an oauth-callback event. The attempt that started sign-in checks the state and exchanges the code with its PKCE verifier, which never leaves the app. * feat(ai): ask OpenPencil's companions for their version The desktop app read a companion's version by following its executable's symlink up to a package.json. That only worked for the Unix npm and bun layouts: Windows .cmd and .exe shims and version-manager shims such as Volta and mise are not links into the package, so the version was always unknown and an outdated companion went unreported. The MCP server, stdio bridge, and Harness companion now print their version for --version, and the app runs each installed one with --version --help under a timeout. A release older than --version prints its help or exits without a version line, which reads as outdated. A bun global install on Windows now gets the bun update command too. * fix(ai): ask for a Pi sign-in when Pi has none readPiAccount returned an account whenever a home folder existed, so a chat with no Pi sign-in reached the Harness and failed with a provider error instead of the guided pi-sign-in fix. It now reports whether Pi's auth.json exists, without reading it, and the capability allows that one check. * fix(ai): keep the attachments of a message that was not sent A message that never reached the chat came back to the composer as text only: its image previews were revoked and its referenced layers dropped. The composer now takes back the whole submission, or releases the previews when newer text replaced it. A message counts as sent once the chat holds it, so a failure after that no longer hands it back to be sent twice. * refactor(app): read the app version from one constant Four modules each derived the app version from the build define with the same test fallback. * refactor(ai): report chat submission errors from their own module Reverting turns from master and keeping unsent drafts together took useChatSubmission past the composition-root limit. The test for reverted turns now passes the setup messages the submission reports. * refactor(app): keep the app version with the runtime config Tools typecheck src/constants.ts through app imports without the Vite defines, so the version constant moves to src/app/runtime/version.ts. * test(desktop): check npm installs of the companions at the app's release version The scope test named the companion packages and version literally, so it would keep passing if the app requested something else. It now builds them from the app's package names and the release version a build embeds. * refactor(ai): parse OpenRouter, Pi, and sign-in callback data with Valibot The OpenRouter key info and code exchange checked their JSON with typeof chains, Pi's settings parsed JSON in a try before validating it, and the desktop sign-in trusted the shell's callback payload as typed. Each now goes through one schema. * fix(ai): take back a message whose images could not be prepared A message with images appears in the chat before its images are prepared, so a preparation failure counted as sent: the draft did not come back and its previews were already revoked. A message now counts as sent once it is dispatched; a failure before that removes the shown message and hands the draft back, and the composer's previews are revoked only after dispatch. * fix(ai): restore an unsent message only in its own conversation Switching conversations while a message was being sent could restore it into the newly opened one. The draft now comes back only if the conversation is unchanged, and its previews are released otherwise. * refactor(app): keep one app version constant The update window added an APP_VERSION to src/constants.ts beside the one in src/app/runtime/version.ts. The tools typecheck reaches src/constants.ts without the Vite defines, so the update window now reads the runtime one. --------- Co-authored-by: GitttHomie <134371845+GitttHomie@users.noreply.github.com> |
||
|
Danila Poyarkov
|
7992516d81
|
fix: match Figma's transforms, strokes, booleans, sections, and names (#931)
* fix(core): start new layers with Figma's defaults in the editor and plugin API The plugin API created bare nodes: frames, components, and shapes without fills, and lines and vectors without strokes, so scripts written for Figma drew nothing. Drawn lines also had a black fill instead of a stroke and were invisible. Both paths now share newLayerDefaults, recorded from Figma desktop 126: frames and components white with frames clipping their content, shapes #D9D9D9, lines and vectors a black 1 px stroke, text black. A stroke a script adds gets the 1 px default weight, and an empty vector has no render bounds. * fix(core): combine variants as Figma does from the canvas and from scripts The plugin API and the editor command each built component sets their own way, both with 40 px of padding and a grey fill. Figma's command pads the variants by 20 and outlines the set with a 1 px dashed #8A38F5 stroke; its plugin API wraps them exactly with no fill or stroke. One variantSetProps now places and styles the set for both, with a canvas or script style, and applyVariantProperties derives variant properties for both. * fix(core): report group children in their container's space in the plugin API Figma's plugin API places children of groups and booleans relative to the nearest real container and refits a group whenever a script changes one of its children. Ours reported group-relative positions and never refit, so scripts placing layers inside groups landed them in the wrong place. x, y, and relativeTransform now map through the groups around a node, and geometry changes, appendChild, insertChild, and remove refit the surrounding groups. The refit moves to Scene Graph as fitEnclosingGroups, shared by the canvas (with undo) and the plugin API. * test(core): pass script-style strokes and typed components in parity tests * test(e2e): expect Figma's default shape grey in the scene freshness spec * fix(vue): draw lines by length and angle as Figma does The Line tool sized a line as the box spanned by the drag. With the stroke a new line now gets, that box drew as a rectangle outline. A line now starts at the press point with the drag length as its width, no height, and the drag angle as its rotation, as Figma's Line tool makes it; Shift snaps the angle to 45° steps, as the docs already described, and a click makes a 100 px horizontal line. * fix(core): give each new layer its own copy of the default paints The defaults spread each paint shallowly, so every layer shared the colour object of the module-level default and editing one layer's colour in place changed the next new layer. Copy the paints with the Scene Graph copy helpers. * fix(core): group, ungroup, and combine layers through shared code in the plugin API The plugin API wrapped layers, ungrouped, made booleans, and made components from layers with its own code. Ungroup moved the children to the top of the stack, booleans were named "Boolean union", and a component made from a frame cloned its children under new ids. These now run through the editor's shared wrap, ungroup, and boolean functions, with the placement and defaults recorded in Figma desktop 126: a group or boolean without an index goes on top, ungrouped children take the group's place, booleans are named after the operation and filled with the default grey, a frame becomes a component in its place with its children, and any other layer is wrapped in a white component named after it. Undoing a wrap in the editor now returns each layer to its own place in the stack. * fix(core): group, frame, combine, and make components from the canvas as Figma does Recorded in Figma desktop 126: a container made from the canvas takes the topmost selected layer's place, Frame selection adds no fill and does not clip, a component wrapped around layers is white and takes a single layer's name, and a boolean is filled like its topmost operand, or its base for Subtract, without strokes. The canvas commands and the plugin API now share the wrap parent check, stack ordering, component rules, and boolean paints, and the plugin API's createComponentFromNode converts groups in place as Figma does. Undoing a boolean returns each operand to its own place in the stack. * refactor(core): reuse translate when centering pasted layers * fix: match Figma's transforms, strokes, booleans, sections, and names Each behaviour was recorded in Figma desktop 126 with the same script, or from its canvas, and both the editor and the plugin API now share it. - Scripts turn a layer counterclockwise about its top-left corner, read x and y as that corner, keep it in place on resize, can set relativeTransform, and get absoluteBoundingBox around the turned layer. appendChild and insertChild keep x, y, and rotation in the new parent instead of the canvas position, which the create and reparent tools inherit. - A layer keeps its stroke weight and alignment without strokes, in the model and through .fig export and import. strokeWeight and strokeAlign apply to every stroke, and a stroke added from the panel or a script takes the layer's. - Booleans size to their result when a renderer can measure it, from the canvas, from scripts, and when an operand moves. - New sections take Figma's fill for the interface theme, a faint white stroke, and 2 px corners; sections and component sets draw with their own radius. - Layers drawn on the canvas and the containers it wraps layers in are numbered past the highest number on the page; scripts keep plain names. * test(core): dispose the editor in the canvas boolean bounds test Attaching CanvasKit installs a global text measurer, and the test left it installed, so later text measurement tests in the same process found it. * fix(core): undo a boolean's group refit and clamp dashed set corners Sizing a boolean to its result also refits the groups around it, and undo left them refitted, so the operands came back displaced. createBooleanOperation returns the fit, and undo reverses it first. A component set's dashed outline now clamps its radius to its bounds as the fill does, and a script's resize refits the enclosing groups once, after the corner is restored. |
||
|
Danila Poyarkov
|
55d8c57822
|
feat(desktop): show updates in a Software Update window (#936)
* refactor(app): share Markdown rendering outside chat Move the vue-stream-markdown wrapper, inline code, token mapping, and styles out of chat into components/markdown and theme/markdown, so other surfaces can render Markdown without importing chat components. A density attribute selects the compact chat styles or a comfortable reading size, and Shiki highlighting is opt-in. ChatMarkdown keeps its streaming render key and wraps the shared component. * refactor(ui): extract AppProgress from the toast The toast drew its own progress track, fill, and label. Move them into AppProgress in ui/feedback, built on Reka's Progress so the bar reports its value and indeterminate state, with an accent tone for panels and a current-colour tone for coloured surfaces. ToastProgress becomes the shared ProgressAmount. AppPlaceholder also accepts an h1 label for placeholders that stand for a whole window. * feat(desktop): show updates in a Software Update window The update prompt passed the release's CHANGELOG section to the native confirm dialog, which cannot format Markdown or scroll, so the 0.15.1 notes showed raw headings and pushed the buttons off screen. When the main window finds an update it now opens a small `updater` webview loading its own `updater.html` entry, which never boots the editor. The window renders the notes with the shared Markdown component in a scrolling box and links to the full release page. Installing is split into stages. The download shows progress and can be cancelled; Tauri cannot abort it, so Cancel detaches and a later Install reuses the running download. On macOS and Linux the update then installs and the window offers Restart Now or Later. A restart, and on Windows the installer that quits the app, first asks the editor window to run the same unsaved-documents approval as Quit. Failed checks, downloads, installs, and restarts keep the release visible and can be retried. The window's capability grants only update, restart, close, and link opening. Closes #743 * fix(desktop): stop waiting for a restart reply from a closed editor The Software Update window waited for the editor's answer with no bound, so an editor closed mid-request left Restart Now, and the Windows install, stuck. Treat the editor window's destruction as approval: it ran its own unsaved-changes prompt and holds no documents. A timeout would instead fail people still answering that prompt. |
||
|
Danila Poyarkov
|
22d5dfe6b5
|
fix: refuse risky desktop writes and run every Storybook play function (#933)
* fix(desktop): refuse writes where a written file would run The fs scope let the webview write, create folders, and delete anywhere. Documents may still be saved anywhere, but the global scope now denies login items and startup folders, PowerShell profiles, and the global package and executable folders where coding agents and OpenPencil's companions live, and writes to the MCP discovery files agents trust. requireLiteralLeadingDot keeps hidden files and folders, such as shell profiles and agent settings, out of ** on Windows as Tauri already does on macOS and Linux. A native test saves a document and is refused a LaunchAgents file, a home dotfile, and the discovery file. * fix(ui): draw segmented controls at panel field height Panel fields moved to 24px when sizing tokens became plain utilities, but segmented control items stayed 22px inside a 2px padding, so the Typography and resizing controls stood 2px taller than the fields beside them. The panel foundation story renders its inputs at the panel size and checks 24px. * test(storybook): run every story and its play function No test ran the play functions, and five had gone stale: the layer tree example labelled a wrapper with the same name as its row, the chat composer's label gained an ellipsis, the MCP failure story queried a test id attribute the app does not use, and the property primitives story still collapsed sections whose titles are static now. bun run test:storybook now renders every story and fails on a story or play function that throws. * fix(desktop): deny protected folders themselves and writable opens of the discovery files Each protected folder is denied alongside its contents, so a recursive remove cannot target the folder itself, and the MCP discovery files are denied to open as well as write, since opening with truncate would empty them. The native test opens the discovery file for writing without truncating, and removes only files it created. The story test waits for storyFinished, which follows afterEach, and judges exceptions and non-accessibility reports. * test(desktop): run the file scope check only on macOS Its protected paths are macOS ones, so other platforms skip it rather than pass for another reason. * docs: note that documents opened from hidden folders can still be saved |
||
|
Danila Poyarkov
|
710e1a3ac1
|
fix(ai): keep saving chat history in Safari Private Browsing (#920)
WebKit's IndexedDB cannot store Blobs in private contexts and aborts the write with 'Error preparing Blob/File data to be stored in object store'. Attachment previews and tool change images are Blobs, so after the first image or document-changing reply every save of the conversation failed. Messages are now stored with each Blob as its type and bytes, converted before the transaction opens and back on read; Blobs saved earlier still read as they are. A WebKit test, which runs in a private context, fails without this and passes with it. |
||
|
Danila Poyarkov
|
e0716a3a38
|
feat: behaviours and preview mode (#893)
* feat: author behaviours on main components
A main component or component set can behave as a Switch, Checkbox,
Slider, or Tabs, after Reka UI's primitives. The behaviour lives in
OpenPencil plugin data: boolean values bind to variant or boolean
properties with the values meaning on and off, a number keeps its own
range since Figma has no number property, and the control's
subcomponents bind to the component's slots. A Behaviour section in the
properties panel adds, binds, and removes it, each as one undo step,
and flags required bindings that are missing. The canvas-only layout's
pill becomes a component that preview will reuse.
* feat: preview instances with behaviours on the canvas
View > Preview (Cmd+Alt+Enter) puts the canvas in preview: a lone canvas
switches to the canvas-only layout with a Previewing pill, and a split
canvas previews on its own side. Clicking a Switch or Checkbox flips it,
dragging a Slider moves its thumb and range, and clicking a Tabs trigger
shows its panel. Preview keeps its state on copies of the instances it
touched, in a private graph with the document's ids, and the canvas
draws those copies in place of the originals, so the document, undo,
autosave, and collaborators never see it. Escape or the pill leaves
preview, Reset restores every control, and editing shortcuts, labels,
and outlines stay off while previewing.
* feat: translate behaviour and preview strings; cover preview with an e2e flow
* refactor(vue): reuse VariantDefinitionControl for behaviour property options
* refactor: split variant actions and preview interactions by domain
Variant authoring was one 706-line closure; it is now graph queries
(model), undo snapshots (history), property definition edits
(definitions), and the editor facade (index). Preview interactions move
into play/kinds, one module per control, registered by behaviour kind so
a new kind cannot ship without its contract and interaction. Behaviour
contracts are keyed by kind. In the Vue SDK, slot and variant authoring
controls get their own folders beside component-props and behaviour,
and the app's variant section joins slot/ and behaviour/.
* refactor: keep the behaviour model in scene-graph's plugin-data registry
Master now defines every OpenPencil plugin-data key in one typed registry
in scene-graph. The behaviour schema registers there as a field, and the
model and contracts move beside slots, exported from the package root;
the @open-pencil/core/behaviours subpath is gone.
* feat: interaction states and keyboard focus in preview
A behaviour can bind a variant property to the default, hover, pressed,
focus, and disabled states; binding it maps values named like those
states. Preview switches the instance's copy to the matching variant as
the pointer hovers, presses, and releases, keeps other values when the
set draws the combination and falls back to rest otherwise, and skips
disabled instances. Tab moves visible keyboard focus between controls,
Space, Enter, arrows, Home, and End use the focused one, and Escape
takes visible focus off before leaving preview. A Button kind covers
controls that only have states.
* feat: toggle, radio, group, progress, collapsible, and accordion behaviours
Radio group, toggle group, and accordion hold their items in a slot;
each item is an instance with its own behaviour, so a press inside the
slot goes to the group, which turns the pressed item on and the others
off through the item's own interaction. Progress shares the slider's
number handling through rangeControl, and a collapsible shows and hides
its content slot from its trigger, remembering its open state even
when no property draws it. Tabs and groups share arrow-key navigation.
* feat: text field, textarea, and number field behaviours
A behaviour value can now be text, bound to a text property, so
preview types into a copy of the field through the same property path
the editor uses. A bound Filled value switches to the placeholder
variant when the field empties. A number field keeps its own range,
shows its value through a text property, and steps from its increment
and decrement slots and the arrow keys. Text fields show focus from a
click, and the focused control receives every key; Option still types,
and only Cmd or Ctrl combinations stay shortcuts.
* fix: keep behaviour bindings when saving as .fig
Saving as .fig gives component properties new GUIDs, but behaviours
kept the old ids in their plugin data, so every binding read as missing
after reopening. The export now renames the ids behaviours bind with
the same GUIDs, on its own copy of the document.
* fix: let previewed controls resize layout imported from .fig
Layers from a .fig keep the sizes Figma computed, and auto layout
prefers them, so an opened collapsible or accordion item kept its
closed height in preview. When preview shows, hides, or retypes a
layer in a copy, it drops those sizes from the layer's copied ancestors
so auto layout sizes them again; untouched layers keep Figma's sizes.
* fix: publish behaviours and other plugin content with library assets
Every OpenPencil plugin-data field now declares its role: content that
exists only as plugin data (behaviours, OkHCL picks), format copies of
node fields written for files, or bookkeeping about where a document
or node came from. Library snapshots keep a node's content plugin data,
including other plugins' entries, and drop the rest; the asset hash
counts the same entries, so a behaviour-only change is offered as an
update while a .fig round trip still changes nothing.
* feat: name behaviour rows by meaning and create what they need
The Behaviour section named every main value "Value" under a "Values"
heading, and a component without matching properties left an empty
picker with no way forward. Rows are now named for the control (On,
Checked, Pressed, Text), rows the control needs or already uses come
first, and the optional rest folds under More options; a button keeps
its states in view. An empty row creates what it needs in one undo
step: a text layer and text property, Off and On variants on a set, or
a slot frame for a part. The missing chip names the row it means and
takes you there.
* fix(dom-css): position free layers, hug content, and round ellipses
HTML and Tailwind export stacked the layers of frames without auto
layout in block flow, wrote fixed pixel sizes for auto layout frames
set to Hug and for auto-sizing text, and drew ellipses as boxes. Layers
a parent does not lay out are now absolutely positioned at their
coordinates inside a relative frame, hugging axes are left to the
content, and ellipses get a 50% radius.
* feat: run preview as live Reka UI islands over the canvas
Preview simulated controls on the canvas: copies of instances, a
handler per kind, its own key routing, and append-only text. It now
runs them as real components. Each top-level layer that holds an
instance with a behaviour becomes an island: its layers are projected
to DOM through dom-css into a shadow root laid over the pane at its pan
and zoom, and each behaviour mounts its Reka UI primitives on its
layers, so text fields are real inputs and focus, keys, and layout are
the browser's. Core's resolvePlayState shows instances in a state on a
private graph, so the component's variants draw it, and controls are
keyed by layer path so a variant switch keeps their DOM. The canvas
leaves island layers to the islands, and the canvas play runtime and
its key routing are gone.
* fix: derive variant properties from Property=Value component names
figma.combineAsVariants and Combine as variants only derived variant
properties from slash-separated names, so components named as Figma
names variants, such as State=On, Size=Large, became a set with no
properties. Both now derive each named property and its values, after
the slash form.
* feat: script and tool access to behaviours by name
Behaviour contracts follow Reka UI's anatomy: tabs keep their triggers
in the list slot and their content panels in a panels slot, and a slot
of repeated parts names the Reka part of its children. A behaviour
spec names component properties and slots instead of ids and resolves
to the stored behaviour and back, with errors that list what the
component has.
Scripts get an `openpencil` global next to `figma`, in the Figma API's
style: setBehaviour, getBehaviour with bindValue, bindPart, states,
and missing, behaviourKinds, and createSlot. The eval tool, the CLI,
and app automation compile scripts through one compileScript, so the
CLI now returns the last expression as the others do. MCP and AI chat
get set_behaviour, get_behaviour, and create_slot.
* feat: write controls in design JSX with Reka UI's element names
`<Switch.Root modelValue="State">` renders a main component, or a set
when its children are variants, that behaves as a switch, and
`<Switch.Thumb>` the slot that draws its thumb, one slot across the
set's variants. Inputs become the text property of a field, tab
triggers and panels go in their List and Panels slots, and a group's
items are `<RadioGroup.Item of={…} />` instances in its Items slot.
JSX export writes components with behaviours the same way, so they
render back unchanged. The authoring reference documents controls, and
the codegen and chat prompts now include it verbatim instead of
dedenting its code examples.
* chore: format the CLI export test
* docs: document slots, behaviours, preview, and the openpencil API
The components guide covers slots, behaviours, and preview with its
shortcut; scripting covers the openpencil global and eval's last-
expression result; the MCP and AI chat pages list the new tools; the
features overview, README, and roadmap mention working controls. The
chat prompt says how to build a control, and the codegen prompt builds
components with behaviours on their Reka UI primitives.
* chore: format the eval CLI test
* docs: explain behaviours and preview islands, and guide the openpencil API
A development page explains the behaviour model, the four authoring
surfaces, how preview islands turn a control's state into live Reka UI
components, and how to add a kind; the architecture page links it. The
Core guide sets the rules for OpenPencilAPI: Figma-only `figma`,
OpenPencil features on `openpencil` in the same style, one
compileScript, names over ids, and docs with every member. Package
READMEs mention the openpencil global, PlayIslands, Reka-named JSX, and
the behaviour model. Design JSX's behaviour modules move into a
behaviours folder instead of a suffixed sibling.
* refactor: center pasted layers through translate
centerNodesAt repeated translate's loop, which test:dupes reports on
master too.
* fix: validate behaviour ranges and guess on and off by name
A number value now needs max above min and a positive step: the schema,
specs, and the panel reject a range a slider cannot step through. Binding
a variant property guesses on and off by value name, as specs do, and a
boolean property gets no on/off pair. Part bindings are read through
partBinding, a replaced document restarts preview from its designed
state, and the e2e preview shortcut uses ControlOrMeta.
* feat: make the Behaviour section say what to do next
A slider's range fields now carry inline Min, Max, Step, and Start labels.
States offers Add state variants, which adds a Default, Hover, Pressed,
Focus, and Disabled variant and binds them; Add Off and On variants and
Add state variants turn a lone main component into a component set first,
and a part's slot can be added to a set, in every variant under one slot
id. Rows that could do nothing are gone: no empty pickers and no hints to
combine variants by hand, and an unbound Disabled is left to the states.
A warning line names what is still needed and replaces the missing chip,
and the Switch's main value is called Checked.
* fix: keep each slot to one part and keep creating slots at hand
A slot draws one part, so the Behaviour section no longer offers a slot
another part uses, and specs (the openpencil API, tools, and JSX) reject
binding one slot to two parts. A part's picker keeps an action to add a
new slot in its footer, so adding the first slot no longer hides it for
the other parts.
|
||
|
Danila Poyarkov
|
6c6f24409e
|
feat: let a collection name the attribute its modes switch by (#913)
* feat: let a collection name the attribute its modes switch by Manually switched modes were always selected by data-<collection name>, so a collection called New wrote data-new and a codebase already using data-color-scheme could not be matched. A collection can now name its attribute in the inspector, validated so a stylesheet can select it as is. The stylesheet and exported code use it, setting it is undoable, and .fig files keep it in the collection's plugin data. * fix: show the switch attribute only where there are modes to switch * fix: return to the list after committing the switch attribute * fix: keep a collection's switch attribute when a new one is refused setModeAttribute cleared the attribute when given a name a stylesheet cannot select on; it now leaves the current one, and only an empty name restores the default. In the inspector, Enter on a refused name keeps the focus so it can be corrected. * docs: describe the switch attribute in the mode conditions The Switched manually row still said the attribute is named after the collection. The changelog had collected four copies of the variables dialog entry through rebases; one remains, with the switch attribute in it. |
||
|
Danila Poyarkov
|
03b70328bf
|
feat: edit variables as tokens in the variables dialog (#907)
* feat: prototype the design tokens panel Undoable editor actions for token fields and mode conditions, a token view model, and table, inspector, collection and stylesheet panels shown in a Storybook story with a real editor. * feat: lay the tokens panel out for mobile Below the mobile breakpoint the collection tabs become a select, the list shows one chosen mode with the CSS name under each token, and the token, the modes, and the stylesheet each open over the list behind Back. CodeViewer can fill its container for the full-screen stylesheet. * feat: share drill-in navigation and put tokens on a listbox PanelDrillIn gives detail views one back control that names where it returns, a slide preset from theme/motion, and focus that moves into the detail and back to what opened it. The Settings model editor and the tokens panel's mobile views use it. The token list is a Reka Listbox with arrow-key navigation and labelled groups, and the inspector and stylesheet swap with a short fade under the motion policy. * feat: lay the tokens panel out by container width The panel switches to the compact drill-in by its own measured width, and the list's columns follow the list's width through container queries, so the panel adapts inside dialogs and split views, not only on phones. src/AGENTS.md now says when to use container queries, measured size, and viewport breakpoints. * test(core): group the variable undo tests in a domain folder * feat: edit variables as tokens in the variables dialog The variables dialog now hosts the tokens panel: a grouped token list with CSS names, an inspector for each token and for the collection and its modes, and the live stylesheet. It keeps adding variables by type, search, collection and mode management, and copying the document's stylesheet, and lays out by its own width down to phones. useVariables().collections returns copies, so components given a collection see modes added or renamed in place, and addVariable returns the new ID so the panel can open it. * fix: satisfy the type-aware lint in token updates and panel stories * docs: describe the tokens panel in the translated variables guides * feat: say when each mode applies in plain words A mode's condition was a raw CSS field that designers could not read. Each non-default mode now picks when it applies (switched manually, system dark or light mode, high contrast, reduced motion, screen or container width, or custom CSS), with the CSS it writes shown underneath and a note on how the mode behaves on the canvas and in exported code. Presets only write the condition string modes already store, so files round-trip unchanged. Column headers name the condition in words, and deleting the collection moves into a menu beside its name. * feat: bring the variables dialog up to Figma's The dialog now covers what Figma's variables dialog offers: collections and groups in a sidebar with counts, a group, search and type filter, type icons, names and values edited in place, drag to reorder, multi-select with a context menu, the Delete key and a side panel to duplicate, group and delete, aliases chosen from a variable picker and detached back to the value they showed, hiding from publishing, and an expand toggle. It opens from View → Variables… and the command palette as well as the Design panel. It also fixes review findings: a single-mode collection labels its value Value, column titles share one font, a CSS name is typed after a fixed -- and checked by the CSS parser before it is saved, and the stylesheet previews CSS with the format chosen when copying. AppInput applies an instance's input classes last so they can override adornment padding. * feat: undo and redo inside the variables dialog Canvas shortcuts stop while any dialog is open, so Cmd+Z did nothing in the variables dialog although every edit there is on the editor's history. Undo and redo now take a document scope: they also run when the topmost layer is a dialog that edits the document, which the variables dialog marks, while menus, pickers and Settings still hold them back and a field with uncommitted text keeps its own undo. Enter commits a field and returns focus to the list. The panel drops selections, group filters and collections that undo removed. A color picker session undoes as one step through a coalesce key on updateVariableValue, and undoing a deletion puts the variable back in its place. * feat: search variables like the command palette The variables search matched a substring of the name only, so a CSS name, a hex color or a description found nothing, and the palette, AppPicker and AppCombobox each spelled out the same Fuse.js options. One helper in @open-pencil/vue now owns the matching: fuzzySearch ranks results for lists people pick from, and fuzzyFilter keeps a list's own order for lists people arrange. The panel searches names, CSS names, descriptions and every mode's value, alias names included; useVariables() searches names and descriptions. * fix: say a token group once when its name repeats it Kits that mirror Tailwind classes name tokens like Gap/gap-1, which derived --gap-gap-1. A group the next segment repeats is now said once, giving --gap-1. * fix: keep the add variable menu under its button after a resize The toolbar swaps the icon button for the labelled one when the dialog widens. Reka keeps the anchor it mounted with, so the menu opened at the window corner; keying the trigger remounts it with the new button. * fix: leave bound layers alone when variables are added or reordered Adding, copying, or reordering variables re-resolved every bound layer in the document. In the shadcn kit two Avatar instances are saved at 24 while their binding gives 40, so adding a number resized them and relaid out about 7,800 layers, freezing the browser for seconds. These changes alter no bound value and now only request a render, as renaming already did. * refactor: let the variables dialog own its undo shortcuts Undo and redo in the dialog went through a document scope in the global shortcut registry, which decided whether the dialog was on top by querying Reka's dismissable layers in DOM order. The dialog now listens on its own content with a tinykeys handler built from the command keybindings: menus and pickers it opens portal elsewhere, so their keys never reach it, and the registry is back to one scope. * refactor: read mode conditions with css-tree Presets were recognized by normalizing the condition with regular expressions and matching another. css-tree, which Core already ships through unifont, now parses the condition into its media or container feature, so spacing, case and comments are handled as CSS does, and a non-breaking space, which CSS does not treat as whitespace, no longer turns a custom condition into a preset. * refactor: take the mode attribute hint from modeAttribute The hint for a manually switched mode cut the brackets off its selector with a regular expression. It now reads the attribute name and value from modeAttribute, which the selector is built from. * fix: keep a refused CSS name in focus and color picker sessions apart Enter on a CSS name the parser refuses no longer hands the keyboard back to the list, so the name can be corrected. The typed name is read with parseCSSName instead of stripping a leading -- by hand, so a pasted var(--name) works too. Each color picker session takes a random undo key; a counter restarted when the inspector remounted, so two sessions on the same token could merge into one undo step. * fix: keep token expressions and cleared fields in step with their variable Editing a number left its CSS expression recording the old number, so reopening the file dropped the expression as edited elsewhere. A number now updates its expression, and an alias drops it, in the same undo step. Undoing a token field that had been unset kept the key with an undefined value; it is now removed. * fix: preview and detach aliases in their own mode An alias in the Dark column showed, and detached to, what its target gives in the mode the canvas is in. Both now resolve in the column's mode. * fix: drop tokens a filter hides from the selection A search, group, or type filter could hide selected tokens that stayed selected, so the inspector, the bulk actions, and the Delete key still acted on rows the list no longer showed. * fix: keep a drill-in's list out of the tab order while its detail slides The list stayed focusable until the detail finished sliding in, and became focusable again under a detail sliding out. It is now inert from the moment the detail opens and the departing detail is inert. A detail with no field focuses its back control, and hidden inputs are skipped. * docs: drop a duplicated Stroke entry from the changelog Two merges left the Stroke-extends-Fill breaking change twice; the copy that still said strokes render solid only is outdated, since gradient and image strokes now import and render. |
||
|
Danila Poyarkov
|
b0e0b321e9
|
fix: share Figma's creation and grouping between editor and plugin API (#919)
* fix(core): start new layers with Figma's defaults in the editor and plugin API The plugin API created bare nodes: frames, components, and shapes without fills, and lines and vectors without strokes, so scripts written for Figma drew nothing. Drawn lines also had a black fill instead of a stroke and were invisible. Both paths now share newLayerDefaults, recorded from Figma desktop 126: frames and components white with frames clipping their content, shapes #D9D9D9, lines and vectors a black 1 px stroke, text black. A stroke a script adds gets the 1 px default weight, and an empty vector has no render bounds. * fix(core): combine variants as Figma does from the canvas and from scripts The plugin API and the editor command each built component sets their own way, both with 40 px of padding and a grey fill. Figma's command pads the variants by 20 and outlines the set with a 1 px dashed #8A38F5 stroke; its plugin API wraps them exactly with no fill or stroke. One variantSetProps now places and styles the set for both, with a canvas or script style, and applyVariantProperties derives variant properties for both. * fix(core): report group children in their container's space in the plugin API Figma's plugin API places children of groups and booleans relative to the nearest real container and refits a group whenever a script changes one of its children. Ours reported group-relative positions and never refit, so scripts placing layers inside groups landed them in the wrong place. x, y, and relativeTransform now map through the groups around a node, and geometry changes, appendChild, insertChild, and remove refit the surrounding groups. The refit moves to Scene Graph as fitEnclosingGroups, shared by the canvas (with undo) and the plugin API. * test(core): pass script-style strokes and typed components in parity tests * test(e2e): expect Figma's default shape grey in the scene freshness spec * fix(vue): draw lines by length and angle as Figma does The Line tool sized a line as the box spanned by the drag. With the stroke a new line now gets, that box drew as a rectangle outline. A line now starts at the press point with the drag length as its width, no height, and the drag angle as its rotation, as Figma's Line tool makes it; Shift snaps the angle to 45° steps, as the docs already described, and a click makes a 100 px horizontal line. * fix(core): give each new layer its own copy of the default paints The defaults spread each paint shallowly, so every layer shared the colour object of the module-level default and editing one layer's colour in place changed the next new layer. Copy the paints with the Scene Graph copy helpers. * fix(core): group, ungroup, and combine layers through shared code in the plugin API The plugin API wrapped layers, ungrouped, made booleans, and made components from layers with its own code. Ungroup moved the children to the top of the stack, booleans were named "Boolean union", and a component made from a frame cloned its children under new ids. These now run through the editor's shared wrap, ungroup, and boolean functions, with the placement and defaults recorded in Figma desktop 126: a group or boolean without an index goes on top, ungrouped children take the group's place, booleans are named after the operation and filled with the default grey, a frame becomes a component in its place with its children, and any other layer is wrapped in a white component named after it. Undoing a wrap in the editor now returns each layer to its own place in the stack. * fix(core): group, frame, combine, and make components from the canvas as Figma does Recorded in Figma desktop 126: a container made from the canvas takes the topmost selected layer's place, Frame selection adds no fill and does not clip, a component wrapped around layers is white and takes a single layer's name, and a boolean is filled like its topmost operand, or its base for Subtract, without strokes. The canvas commands and the plugin API now share the wrap parent check, stack ordering, component rules, and boolean paints, and the plugin API's createComponentFromNode converts groups in place as Figma does. Undoing a boolean returns each operand to its own place in the stack. * refactor(core): reuse translate when centering pasted layers |
||
|
Danila Poyarkov
|
00da4678ad
|
feat(ai): refine tool change and run views (#858)
* fix(app): animate menus, selects, and popovers as they open The shared menu, select, and combobox content and the chat history and profile popovers appeared without motion; only tooltips and dialogs used the motion presets. A shared floating preset fades and scales them out of their trigger's side, and respects reduced motion. They still close at once: during an exit animation the closing content kept focus, so a shortcut pressed right after choosing, such as undo, never reached the editor. * feat(ai): compare a tool change's images with a split divider The before and after images used a range input under a drawn line, and a second Compare/Highlight tab bar sat under the Changes/Input/Output one. A Reka splitter with the shared splitter handle now divides the two images, each drawn at the full width so the divider reveals one or the other, and highlighting the changed pixels is a toggle beside the changed-pixel share. * feat(ai): name a run's earlier tool steps in its folded row The folded row said only how many earlier steps a run took. It now lists them by name on one truncated line, with a count badge and a failure badge; its accessible name keeps the count. * fix(ai): open tool calls to their full height at once Reka measures a collapsible's content when it opens, but CodeMirror lays out its lines a frame later, and on the first call it was still loading. Every call animated to its height without the code and then snapped open, the first one further. LazyCodeViewer reserves the viewer's height from the line count before CodeMirror renders, and the card starts loading CodeMirror on hover or focus. |
||
|
Danila Poyarkov
|
a6a87035da
|
fix(canvas): show every top-level frame's name and select frames by it (#930)
* fix(canvas): show every top-level frame's name and select frames by it Since clicks follow Figma's depth, the empty part of a top-level frame that holds layers selects nothing, but a frame's name was drawn and hit-tested only while that frame was already selected. Once a top-level frame held layers it could not be selected from the canvas, as when one frame is dragged into another and the outer frame is then out of reach. Every frame on the page or in a section now shows its name, faded in the canvas's text color and in the selection color while selected or hovered, from the same viewport-culled label catalog as section and component labels. Its name is a hit target whether or not the frame is selected, so clicking it selects the frame, dragging it moves the frame, and hovering it highlights the frame; locked frames stay out of reach. SkiaRenderer.hitTestFrameTitle no longer takes the selected IDs. * fix(canvas): draw and hit labels whose node is just outside the view Label catalogs culled nodes by their own bounds, but frame, section, and component names sit outside the node, so a node just below the view hid a name that was on screen and could not be clicked. Label lookups now use the viewport widened by how far labels reach. Presses and hover also test component labels, then section titles, then frame names, the reverse of the order they are drawn, so overlapping labels pick the one on top. |
||
|
Danila Poyarkov
|
e77eeff11c
|
fix(fig): write text glyphs from the layout the renderer draws (#928)
* fix(fig): write text glyphs from the layout the renderer draws Text without saved glyphs was written to .fig with outlines from a character-by-character fallback: one unwrapped line at y = lineHeight, no alignment, advances in pixels. Figma lays saved text out from that data, so every wrapped OpenPencil label opened in Figma on one line, and since saved glyphs now draw before the paragraph, OpenPencil did the same after a reopen (#914). The Figma clipboard had a second writer with its own shaping that matched outlines to characters by index. One builder in @open-pencil/fig now writes derivedTextData for both. It keeps glyphs a layer already has and otherwise asks the export runtime to shape the text. Core shapes with the paragraph the renderer draws, so lines, alignment, and baselines match, and takes each outline from the glyph ID CanvasKit chose, so ligatures and contextual forms keep their shapes. CanvasKit does not say which font drew a run, so outlines are written only when the run's own font covers it; otherwise the layout is written without outlines and readers lay the text out themselves. Advances are in em units and the character offset map has one entry per character, as in Figma's files. The reader drops glyphs the earlier fallback wrote, recognised by its offset map one entry longer than the text with every glyph on the one written baseline, and any glyph set with a missing outline. * fix(scene-graph): reflow resized text instead of stretching its glyphs Resizing scaled a text layer's saved glyphs into the new box. That suits path text, whose glyphs follow its path, but flat text reflows, and with saved glyphs drawn before the paragraph a resized Figma text layer was drawn stretched. Scale glyphs only for path text, including baked path text that kept only rotated glyphs, and let the width change drop the rest. * docs(fig): describe how derived text is written Figma draws saved text from derivedTextData even when it has the font, so the export docs record which glyphs the shared writer keeps, shapes, or leaves without outlines, and the units it writes. The README names the runtime service by what it now does. * fix(fig): write text without glyphs when shaping fails Glyphs are derived data, so a shaper error must not fail the .fig save or Figma clipboard copy that writes them. The builder now writes the layer without glyphs and logs a warning; the clipboard used to swallow the error silently, which hid a font-provider mismatch. |
||
|
Danila Poyarkov
|
9dce9fdcbc
|
feat(collab)!: sync layer trees as a CRDT and open each room in its own tab (#902)
* fix: stop ancestor walks from hanging on a parent cycle A collaborator's concurrent reparent can leave two layers as each other's parent. isDescendant, the design check's pageOf, and component sync walked parentId without a bound, so applying such a change froze the editor. Add SceneGraph.closest(), a bounded nearest-ancestor lookup, and use it for these walks so bad data ends the walk instead of the tab. * fix(collab): sync layer moves without parent cycles or stale child lists Remote changes assigned each layer's synced parentId and childIds as plain properties. Two peers moving layers into each other made them each other's parent, a moved layer stayed listed under its old parent, reorders never synced, and concurrent additions ended up in different orders or missing from the parent's list. Apply the tree after a change's properties: move layers to their synced parents, skip a move that would make a layer its own ancestor and write the layer's current parent and position back so every peer settles on it, and derive each touched parent's childIds from its synced order followed by unlisted children by id. Locally, a parent's child list syncs once after each edit that adds, removes, moves, or reorders its children. Fixes #888 Fixes #889 * refactor(scene-graph)!: move sibling order keys to scene-graph Collaboration needs the same fractional keys as .fig export to order siblings, and the app must not depend on @open-pencil/fig for them. Move fractionalPosition, orderKeyBetween, and siblingOrderKeys to @open-pencil/scene-graph/order-keys. orderKeyBetween now always returns a key: when no printable key fits it returns one above lo, which hasOrderKeyBetween detects, so callers no longer branch on null. It takes an optional suffix, and siblingOrderKeys can request one per key, so two peers inserting at one spot get distinct keys. .fig export keeps its keys. * fix(scene-graph): report instance child reorders as graph events Instance sync sorted an instance's children in place, so nothing that listens to graph events saw the new order; in a shared room the order never reached other peers. Move each child that changes position with insertChildAt, which reports the reorder. * feat(collab): resolve the layer tree from each layer's parent history Add a pure LayerTree for the shared document: each layer records every parent it was moved under with a move counter and an order key. A layer sits under its newest parent, ties broken by parent id; when concurrent moves close a loop, the latest move in the loop falls back to the layer's next entry until none is left, and a layer no parent can take goes to its page (Evan Wallace's mutable tree hierarchy CRDT). The result depends only on the entries, and resolution revisits only changed, orphaned, and displaced layers. Seeded random runs check that peers converge and that the incremental result matches a full one. * fix(collab): sync layer moves as parent history and order keys Each layer's shared map now records every parent it was moved under with a move counter from a document-wide Lamport clock, and its order key among siblings, instead of parentId and childIds. Every peer derives parentId and childIds from these with LayerTree, so concurrent moves, reorders, and additions merge, a loop from concurrent moves undoes its latest move, and a layer whose new parent was deleted meanwhile returns to its previous one. A local edit's graph events are written once after the edit, in one transaction. It records a parent entry for each layer whose parent changed, a new entry for displaced layers on the touched paths so a move cannot pull them back, and keys between the moved layers' neighbours with a random suffix, so concurrent inserts at one spot get distinct keys. Remote changes find their layers through each event's path, resolve only what they touch, and move and sort layers through insertChildAt. This replaces the childIds merge and the write-back of rejected moves: a rejected move now resolves the same way on every peer from the shared history, so nothing needs to be written back. Fixes #888 Fixes #889 * feat(collab)!: convert saved rooms and keep mismatched builds apart A room saved by an earlier build records parentId and childIds. When a change brings in such layers, from this browser's storage or a peer, convert them in one transaction: each layer's synced parent becomes its only entry with counter 0, its position in the parent's synced childIds becomes an order key, and the old fields go. The result depends only on the document, so two peers converting at once write the same values, and converting again writes nothing. The document's meta map records treeFormat 2. Builds that record the tree differently would corrupt each other's rooms, so the collaboration namespace becomes openpencil/2 for Trystero and the test relay alike, and each peer publishes its treeFormat in awareness for future version messages. * fix(collab): send a layer whose parents were all deleted back to its own page Each layer's shared map records the page it was last placed on, and the layers under a frame moved to another page are re-recorded. A layer whose parent chain was deleted goes back to that page, falling back to the first page only when the recorded one is gone. Saved rooms record pages when they are converted. * fix(collab): keep one root per room when peers edit their own documents Joining a room keeps the joiner's earlier document in its graph, and an undo or an edit made before the room arrived could still reach it. That edit shared the joiner's root, every peer adopted it, and the room's pages disappeared. The room now records its root as claims in meta, each with the time it was made, and every peer follows the earliest. Sharing claims the room, and so does the first edit in a room nobody has shared, which now shares the whole document as Share does. A peer shares only layers under the room's root. Converted rooms claim the root with the most children. Move counters must also be safe integers, so an oversized counter from another peer cannot stop the move clock from advancing. * fix(collab): rank root claims by how they were made, not by clocks Root claims carried the claiming peer's wall-clock time, so a guest whose clock ran behind the sharer's could still win the room with an edit made before the room reached them. A claim now records whether it came from Share or a converted room, or from the first edit in an unshared room; a shared root outranks an edited one, and the lower id breaks a tie. A claim also replaces an invalid value already stored for its root. * fix(collab): keep every root claim through concurrent writes A root claim was one key per root holding its kind, so two peers claiming the same root by Share and by an edit at once kept only one of the two values, and the shared claim could be lost. Each kind of claim on a root is now its own key. Converting a saved room also claims its root unless a shared claim exists, so a guest's earlier edited claim no longer keeps the converted room from outranking it. * fix(collab): mint layer IDs under a session of each editor window Every editor window started its IDs at 0:1 from the same counter, so two people adding layers to a shared room at once could mint the same IDs, and one person's layers replaced the other's in the room. A joiner's starting page also took the sharer's page ID and stayed in their list. SceneGraph's default IDs now carry a session set with setIdSession, as in Figma's sessionID:localID GUIDs. The editor picks a random 32-bit session at startup, as Yjs does for each document's clientID; headless tools keep session 0, so the CLI and MCP server give a file's layers the same IDs on every run. * fix(collab): let only Share set a room's root A guest's first edit in a room whose contents had not arrived claimed the room and wrote the guest's whole open document into it, images included, and adopting the sharer's root later only hid it. Every room starts with someone sharing a document, so a guest has nothing to claim: only Share, or converting a saved room, now sets the room's root, as a single value in meta, and a peer writes nothing until the root is known. Unbinding a room also writes an edit still waiting to be sent, so a move or deletion made just before leaving reaches the room. * feat(collab)!: open each room in a tab of its own Joining a room bound it to whatever tab was active, so a pasted link could turn a saved file into the room's document, and a share link first showed an editable blank document. A room is now a document: joining always opens it in a new tab, or switches to the tab already showing it, and only Share puts an existing tab's document into a room. Every room tab owns its session (src/app/collab/rooms.ts and session.ts), so several rooms can be live at once and keep syncing in the background. The collaboration panel, presence, following, and the /share/<id> address follow the active tab, and a canvas publishes its cursor and selection only to its own tab's room. A room tab derives its state: joining while its saved copy loads, then waiting, with an explanation, while nobody who has the file is online; live with others, or alone on this device's copy. Until the document arrives the room's screen replaces the editor. Reloading a share link rejoins it; leaving a room you joined keeps its file as a local unsaved copy. "Connected" now means another peer answered. Pasted links and IDs are normalised and validated, and invalid ones say so. People join right away under a generated name such as "Teal Fox", with a hint to set one; the one app-wide name is set in the share panel or in Settings. On a phone, Share copies the room's link instead of making a new room, and the presence popover shows the room's state. * feat(desktop): open rooms from openpencil://join links and Home The desktop app could not receive a share link: links point at the web app, and openpencil:// only opened files. openpencil://join?room=<id> now opens the room in a tab of its own. The native parser refuses anything but a room ID, queues rooms for the frontend through take_pending_rooms, and a second launch on Windows and Linux forwards its link through the single-instance handler. In a browser on a computer, the room's screen and the share panel offer Open in desktop app, a link the browser hands to the app on click; it never opens the app by itself. Home gains Join room…, which takes a pasted room link or ID and opens the room in a new tab. * feat(collab): set your name on the room screen The room screen told someone joining under a generated name to set their name but offered nowhere to do it before the file arrived. It now has the same name field as the room panel. * feat(collab): offer the desktop download beside Open in desktop app A browser on a computer offers a room's openpencil://join link, which does nothing where the app is not installed. The room screen and panel now link to the latest release beside it. * docs: describe joining rooms in the German, Polish, and Russian guides Bring the translated collaboration pages up to the English one: Share as the only way into a room, joining in a tab of its own, the waiting screen, leaving with a local copy, and how layer moves merge. The English page now names the panel's Leave room button. * fix(collab): lay out the room screens like the app's empty states The joining and waiting screens were a left-aligned card with a stray spinner, a primary Copy link button beside an outline button and a bare link, and a name field on a screen that lasts seconds. They now use AppPlaceholder, centred over the tab: a heading, the explanation, the two hints, secondary Copy link and Leave, a 'You'll appear as' line whose Change opens a small rename popover, and the desktop handoff on one muted line. The room panel lines its status dot up with wrapped text, no longer selects the room link when it opens, and puts the desktop links and Leave room on one footer line. * fix(collab): show what a room tab is doing instead of a timed guess A joined tab said nobody with the file was online five seconds after it opened, whether or not it had reached the signaling service or met the people already in the room. Its state now follows what the tab can observe: connecting until the service answers, looking for people for as long as that transport takes to introduce everyone, getting the file from someone who says they have it, waiting when nobody who has it showed up (naming other guests waiting too), and a can't-connect screen when the service cannot be reached. Each peer says in its presence whether it has the room's file. * fix(collab): list other waiting guests with the explanation The line naming other guests who are waiting too is information, not an action, so it follows the hints above the buttons. Peers' hasFile flag is optional, as older builds do not send it. * fix(collab): send a canvas's cursor and selection to its tab's room again Canvases read the editor through a proxy that follows the active tab, and the room lookup by store never matched it, so pointer moves and selections stopped reaching the room: collaborators lost each other's cursors, selections, and page markers. The canvas now looks up its room by its tab's own store, and its selection listener ends when the canvas unmounts instead of piling up across tab switches. * feat(collab): one avatar stack for the toolbar, the mobile pill, and pages The toolbar, the page list, and the mobile HUD each drew the people in a room their own way, and the mobile pill read 'Online: 3' in hard-coded English beside a status dot too small to render. AvatarStack now draws people overlapping with their agent counts and '+N', and every place uses it: the toolbar wraps each avatar in its menu or hover card, the mobile pill shows the room's state dot and the stack with a translated name, and hovering a page with people on it opens a card with the stack and who is there, with their agents, to follow. The mobile list is the shared presence list, so it is translated and can follow agents too. * docs: note the page hover card and mobile avatars in the changelog * fix(collab): stop listening to a room once its tab leaves it A session left its Yjs observers and its awareness listener attached after dispose, relying on destroy() and the order of teardown not to touch the tab again. It now removes them explicitly and clears its peer list. Also fix a missing comma in the Polish collaboration guide. |
||
|
Danila Poyarkov
|
8d1ad54193
|
feat(ai): revert, regenerate, and edit chat turns (#844)
* feat(core): add visual diff and patch apply tools diff_visual renders two nodes at one scale through the existing raster export, compares them with pixelmatch, and returns the diff PNG with the changed ratio and region in source-node coordinates. It takes export_image's scale and maxEdge inputs. FigmaAPI gains a CanvasKit-backed raster codec and a pageId export option, so the app and headless CLI decode pixels and render nodes off the current page. diff_apply applies diff_create and diff_show patches through the Figma API, validates every node before changing any, and supports dryRun and force. diff_show now simulates changes on a detached copy with the same property code. One serializer and parser back all three. diffDocuments compares two documents page by page by name path. Image tool results now reach models as media with their metadata as text, for any tool rather than export_image alone. diff_create, diff_jsx, and diff_visual join the default AI tool set, and the diff tools are no longer hidden from WebMCP. * feat(ai): show what each AI edit changed in its tool call Reviewing an AI run meant reading tool output or undoing steps to see what moved. Each document-changing call now rebuilds its page before and after from snapshots taken around it, and diffs each top-level layer's JSX with jsdiff, the same patch diff_jsx returns, to find the layers it changed. After the call returns, the changed region renders in both states at one size and pixelmatch highlights the difference. The tool card opens on a Changes view with a before/after slider, the pixel highlight, and a CodeMirror merge view of the JSX. Records are saved with the conversation next to attachments. Calls snapshot their page individually instead of through one shared variable, so concurrent calls in a step no longer overwrite each other's undo state. Core gains graphFromPageSnapshot for rebuilding a past page state, diffPageLayersJSX and jsxPatch (now shared with diff_jsx), renderRegionToImage for rendering two states of one region pixel for pixel, and comparePNGs on the raster codec. Settings > Chat > Change previews sets the stored image size or turns images off. * feat(cli): add diff commands and agent diff guidance openpencil diff create, jsx, show, apply, and visual run the Core diff tools on a file or the running app; apply writes back with --write or --output like eval. diff files compares two documents page by page and exits 1 when they differ. The chat prompt asks the agent to edit in place and to verify risky edits against a reference copy with diff_jsx, diff_create, and diff_visual. The skill, CLI reference, MCP tool table, and a new Comparing Designs page document the commands and tools. * feat(ai): render tool calls as summarized, highlighted cards Every tool call showed only a status and its output as a JSON string, so render calls hid their JSX, export_image dumped base64, and long runs filled the transcript with identical rows. A call now shows a one-line summary read from its input and chips that select and zoom to the layers it touched, switching to the run's page when needed. Expanded, it shows the JSX or script it wrote and its JSON input and output in a read-only CodeMirror view, and exported images inline. Render calls can be expanded while their input streams, so the JSX appears alongside the canvas preview. Consecutive calls beyond three fold into one row that keeps the latest call visible. CodeMirror loads with the first expanded call. The code theme gains a monospace fallback because the editor font variable is not always emitted. * feat(ai): let the chat AI diff its run against the starting state The diff tools compare two nodes, so checking an edit meant cloning a reference first, which the agent rarely did. diff_changes compares the current page, or one node under it, with the page as it was before the run first edited it, in diff_create's patch format. The app keeps that page snapshot per run and exposes it through FigmaAPI.changeBaseline; MCP and WebMCP have no run, so the tool is offered only to the AI chat, where it is enabled by default and the prompt asks for it before reporting. * feat(ai): revert, regenerate, and edit chat turns A reply that went wrong could only be undone step by step from the Edit menu, and asking again meant typing a new message on top of the old edits. Each run now keeps the undo entries its document edits push, and the reply offers Revert changes while those entries are still the newest on the undo stack, so it never undoes an edit made since. The last reply can be regenerated, and the last message without attachments edited and sent again; both undo the replaced reply's edits first when they can. UndoManager gains peekUndo so a caller can tell whether its entries are still on top, and turn state follows the store's history:changed event. The submission's chat dependency narrows to the members it uses. * feat(core): diff and patch node trees as JSX attributes diff_create, diff_show, diff_apply, and diffDocuments used a hand-rolled `key: value` property format that covered about fifteen properties, matched children by name path, and could not see moves. Nodes are now projected to the attributes the JSX export prints, and jsondiffpatch matches children (by ID or by name path) and detects moves. Patches list `-`/`+` attribute lines per node plus moved, added, and removed children. diff_apply checks every hunk first, applies attribute changes through the renderer's prop handling, and changes only the fields an attribute moves, so IDs, instance links, and other state survive. diff_show takes JSX attributes instead of a JSON props object. design-jsx gains sceneNodeAttributes, parseJSXAttributes, and jsxNodeFields for this, and the export round-trip property table is shared so every case is also diffed and applied. `diff files` loads its documents in order so node IDs, and so its patches, are deterministic. * feat(ai): report diff_changes as a patch diff_apply can replay diff_changes printed a unified diff of the JSX, which agents could read but not apply. It now diffs the run's baseline against the live page with the patch engine, matching nodes by ID, so a rename is a changed name and the output replays on the starting state with diff_apply. The chat's Changes view keeps the JSX line diff, which is for people. * chore: format the merged AI tool exports * fix(core): keep diff_apply atomic and diff files honest about differences - Added nodes render before anything else changes; if one fails, for example on a missing component, the rendered ones are deleted and nothing else is committed. - A hunk with an attribute the renderer ignores fails instead of reporting "unchanged". - diffDocuments reports `changed` from page statuses, and a page only one document has gets its status but no patch, since patches do not add or remove pages. diff files uses it, so an added empty page no longer reads as a match. - diff files rejects a --page neither document has and a --depth that is not a non-negative integer, exiting 2; diff_create's depth is validated the same way. * refactor(ai): drop the unused tool JSON slot and place the JSX summary comment * refactor(ai): find a tool change's clipping region with jsdiff clipChangedJSX scanned both JSX sources character by character for their common start and end. diffLines gives the unchanged lines before the first change and after the last; the app now declares the diff dependency Core already uses. * fix(ai): keep a turn revertable when it ends with a view change Every mutating AI tool pushes an undo entry, but a turn recorded only those of tools that change the document. A run that closed with viewport_zoom_to_fit left that entry on top of the undo stack, outside the turn, so Revert changes never appeared and Regenerate did not undo the reply. The turn now records every entry its run pushes. * test(ai): give the fake chat Chat's sendMessage signature The test type check added in #896 rejects a fake whose sendMessage requires text; Chat's takes an optional message, and the fake reads only its ID. * feat(ai): keep reverted replies marked and tell the model about them Reverting a reply undid its edits and hid the button, so the chat still read as if the edits were there, and the model's next request still carried the tool calls and results that made them, so it could build on nodes that no longer existed. A reverted reply is now marked in its message metadata, which conversations store, and shows Changes reverted. The next request carries a hidden note, in the way referenced nodes are passed, for each revert no request in the history has reported; a resent message reports again what the message it replaces reported. Edit > Redo bringing the edits back removes the mark. The revert bookkeeping lives in submission/reverts.ts, and ChatInstance moves to submission/types.ts beside ChatSubmission. * fix(ai): keep reverted replies cloneable so the chat still saves Marking a reply copied the chat's reactive message, so the copy carried proxied parts and saving the conversation failed with DataCloneError on the revert and on every save after it. The message is unwrapped before it is copied. The unit test's chat now keeps messages in a deep ref like @ai-sdk/vue's Chat and saves them synchronously like the history does, which reproduces the error. A new browser test drives the app's own tool loop with a scripted model: it reverts a real render, checks the mark, the note in the next request, that the chat saves without errors, and that the mark is still there after reopening the conversation. * feat(ai): restore a reverted reply's changes from the chat A reverted reply only said Changes reverted, so bringing its edits back meant Edit > Redo. While nothing has been edited since the revert, the reply now offers Restore changes, which redoes exactly its edits; the existing Redo listener then removes the mark. Once other edits close Redo, the reply stays marked. UndoManager.peekRedo mirrors peekUndo, so a turn can tell its entries are the next Redo applies. |
||
|
Danila Poyarkov
|
1c66fed8da
|
test: type the tabs module in the closed-documents spec (#917)
The spec imported the tabs module by its served URL without a type, which fails the test type check on master. |
||
|
Danila Poyarkov
|
f465da8b81
|
fix: release documents when their tabs close (#904)
* fix(vue): release CanvasKit WebGL contexts when canvases go away GetWebGLContext registers a canvas's context in CanvasKit's global table, and the surface manager only called deleteContext on a failed setup. Every destroyed canvas, and every surface rebuilt after a resize or color-space change, stayed registered, and through the canvas element CanvasKit kept the closed editor's component tree, store, and graph alive. The manager now keeps the handle and releases it on rebuild and destroy. deleteContext also leaves CanvasKit holding the last current context, so when the released context was current, a parking context on a 1x1 offscreen canvas becomes current instead. * fix(core): uninstall an editor's text measurer when it closes setCanvasKit installed a global text measurer that closed over the editor and its renderer, and nothing uninstalled it, so the last editor to set up a canvas stayed alive after its tab closed and layout kept measuring with its destroyed renderer. installTextMeasurer returns an uninstall function; an editor uninstalls its measurer when disposed or when its last renderer goes, and the most recent measurer still installed takes over. * fix(app): give editor stores their own effect scope The first store is created during WorkspaceView's setup, so effects created while building it joined the view's scope. Their cleanups stayed registered there after the store was disposed and kept the startup document alive for the life of the app. Stores now build inside a detached effect scope that dispose stops. * fix(app): follow the active tab in app-level editor subscriptions App.vue provided a proxy that resolved to whichever store was active when a property was read, so app-level composables such as the menu and keyboard commands subscribed once to the startup store. They missed events from later documents and kept that store alive, and Undo and Redo availability came from the first document's history. The app-level editor now moves event subscriptions to the active store, and each tab's editor UI gets its own store through EditorTabScope, so per-tab components stay bound to their document when it closes. Selection capabilities read the undo history lazily instead of capturing the first store's manager. * fix(app): stop keeping closed documents in chat history and startup The chat history kept the last editor it served only to compare it with the next one; it now holds it weakly. WorkspaceView's first tab was a top-level setup binding, which Vue keeps on the instance; it is now block-scoped. * test(app): check that documents closed in tabs are released Opens a document in a new tab three times, closes each with discard, forces garbage collection, and checks that weak references to the closed graphs clear. On master all three graphs stay alive. * refactor(app): provide the tab's store from a tab-keyed editor view EditorTabScope existed only to provide a tab's store to its editor UI. WorkspaceView now keys EditorWorkspace by tab, whose contents were already remounted per tab, so the view provides the tab's store in its own setup and the wrapper component goes away. * fix(app): stop a store's effect scope when building the store throws Effects created before the throw would otherwise stay alive with the partial store, which no caller can dispose. * test(app): avoid empty callbacks in the store scope tests |
||
|
Danila Poyarkov
|
7c4d9aa20d
|
feat: open documents dropped onto the window (#906)
* feat: open documents dropped onto the window Dropping a .fig, .pen, or other readable document did nothing: the canvas drop handler places only images and SVG files and swallowed everything else. The workspace now opens dropped documents in new tabs through the same path as File → Open, passing the file handle where the browser provides one, and reports files it cannot open instead of ignoring them. Images and SVG files dropped on the canvas are still placed. * fix: classify each dropped file instead of matching File identities DataTransferItem.getAsFile() may return a new File, so checking it against the canvas files from dataTransfer.files could miss images and SVG files and open them as documents in engines other than Chromium. Each extracted file is now classified on its own; a spec checks that an SVG dropped on the canvas is placed without opening a tab. |
||
|
Danila Poyarkov
|
aa86873dd7
|
test: typecheck the test suites and fix what that found (#896)
* build: typecheck the test suites Tests were in no TypeScript program: no tsconfig included tests/** or packages/*/tests/**, and bun strips types without checking them, so a fixture could drop a required field and keep passing until something read it. @types/bun moves to the root because it was installed per package only, and #cli-tests/* joins the paths the root config already carries. * test: fix the type errors the test suites were hiding Typechecking the tests turned up 1123 errors. Most were ordinary strictness, but some were real: `NodeChange` bound to Figma's plugin typings rather than the Kiwi codec in thirteen .fig tests, materializeInstance was called with six arguments against five so the blobs and source children were dropped, CanvasKit pixels were written to a plain object that never reached WASM, and assertions were made through accessors that do not exist, so they asserted nothing. Fixtures that had quietly lost a required field now carry it, nullable results are narrowed through the existing expectDefined helper rather than assumed, and stand-ins for CanvasKit and the editor go through one named helper instead of an unexplained cast at each site. No test was deleted, skipped, or weakened, and no `any`, non-null assertion, or ts-expect-error was introduced. * docs: record what typechecking the tests established Pins the app program's global types with an assertion rather than a note, since an unpinned types list lets any root @types package decide which platform src/** is judged against. The two environment faults that look like code regressions — Vite's dependency pre-bundle outliving a package rebuild, and heavy .fig suites failing under load — go to the development docs, where an explanation belongs. * fix: align @types/bun and keep node types resolvable when extended The root manifest declared a newer @types/bun than every package, which check:monorepo rejects, and pinning the app program's types left them unresolvable from a config that extends this one out of tree. * fix: fail the test typecheck when the compiler itself fails The gate matched diagnostics by substring, so a compiler or config failure that named no test file printed a pass while having checked nothing. Diagnostics are now split by whether they name a file: an unscoped one is the run failing and stops the gate, a test file's is a finding, and a source file's stays out by design. Also drops the parameter planComponentConstruction never read, and makes the inner-shadow verification script exit non-zero when it renders no image instead of logging and succeeding. * chore: merge master into tests-typecheck |
||
|
Danila Poyarkov
|
24db186ac8
|
feat: select layers at Figma's click depth (#900)
* feat: select layers at Figma's click depth Checked against Figma desktop 126 with the same pointer input in both editors. A click walks from the page down to the deepest layer under the cursor and stops at the first layer that is not open: top-level frames (on the page or in a section) and sections that hold layers, component sets, and every ancestor of the selection are open. So a click inside a top-level frame selects its direct child, the empty part of a top-level frame or section selects nothing, and a selected layer's siblings and cousins are one click away. Double-click goes one level deeper and Cmd/Ctrl-click reaches the deepest layer. A marquee started inside a top-level frame or section selects that container's layers; from the page, a frame or section holding layers is selected only when fully enclosed. * fix(vue): compare marquee hits by canvas bounds A marquee scoped to a rotated frame mapped only two corners into its space, and page-level enclosure used a frame's unrotated rectangle. Both now compare each layer's axis-aligned canvas bounds with the marquee, so rotated frames and their children are selected by what is drawn. |
||
|
Danila Poyarkov
|
69dbc36a7e
|
fix: match Figma when dragging, drawing, duplicating, and pasting (#894)
* fix: match Figma when dragging, drawing, duplicating, and pasting Checked against Figma desktop 126 with real pointer input. A dragged layer lands in the topmost unlocked frame, section, component, or instance under the cursor, following rotation and clipping, and leaves its frame as soon as the cursor does; groups, boolean operations, component sets, and locked frames never take a drop, and a layer stays in its group unless it lands on another frame. Space keeps parents, Shift locks an axis, and Control drops into auto layout as an absolute-positioned layer. Locked layers stay put. New shapes go into the frame under the start point, frames and sections take in the unlocked siblings they fully cover, duplicates land in place (top-level frames to the right), and paste keeps the copied position, centering an axis that does not fit the selected frame. * fix: match Figma for drag edge cases with components, groups, and auto layout A second round of checks against Figma desktop 126, replaying the same pointer input in both editors. A component set takes back only its own variants, and components never go into other components. Groups and booleans refit their children after a move or nudge, and a group whose last layer leaves is removed. Pressing inside a selected frame, group, or component set drags it instead of the layer under the cursor. Auto layout children dragged out land where they are dropped, drawing inside auto layout adds to the end of the flow, and wrapped frames insert on the line under the cursor. Duplicates keep their names, and a main component duplicates as an instance with Cmd+D or Alt-drag; a multi-layer duplicate stays in place, and a lone frame in a section counts as top-level. * fix(core): refuse new shapes in the locked part of an instance createShape redirected a refused parent through acceptingParent while keeping coordinates in the original parent's space, and still inserted the layer when the slot claim failed. It now takes the given parent, claims a slot when needed, and throws when the parent refuses children; drawing skips such parents before creating anything. |
||
|
Danila Poyarkov
|
c8d68acc9e
|
chore: prefer es-toolkit helpers and lint the mechanical cases (#898)
* chore: prefer es-toolkit helpers and lint the mechanical cases AGENTS.md now names the es-toolkit helpers to reach for instead of hand-written equivalents, and the exceptions: a single clear native call or a measured hot path. The new open-pencil/prefer-es-toolkit rule rejects filter(Boolean) and Set round trips on arrays, the two cases that need no type information, and the existing 45 sites use compact and uniq. tools/ci/policy runs before dependencies are installed, so the rule is off there. * refactor: deduplicate diagnostic categories with uniq * fix: keep es-toolkit out of serialized Playwright callbacks The codemod rewrote a filter(Boolean) inside a page.evaluate callback, which Playwright runs in the page where the compact import does not exist. The spec filters there again, and the rule now skips callbacks passed to evaluate, $eval, $$eval, evaluateHandle, addInitScript and waitForFunction, and filter calls on iterators from values, keys, entries and matchAll, which compact cannot take. * test: write the prefer-es-toolkit cases like the other rule tests Short standalone snippets, as in the base64 and JSON rule tests, instead of a declaration prefix on every case and inline object types. |
||
|
Danila Poyarkov
|
a50444c265
|
feat(app): record runtime errors in diagnostics and make events readable (#874)
* feat(app): record runtime errors in diagnostics with their stack
Uncaught errors and unhandled rejections only showed a toast, Vue component errors after boot only reached the console, and a failed chat kept just its error name, so a failure like WebKit's 'Attempting to define property on object that is not extensible.' left nothing to diagnose. They now record a runtime.error, and chat.failed its code, message, and stack. Messages and stacks are scrubbed of URL queries, key- and token-like strings, and home folder names and bounded; AI SDK and provider errors keep no message, since it can quote prompts or responses. Copied diagnostics start with the app version, shell, browser, and language.
* feat(app): label, filter, and page diagnostics events
Every row in Settings → Diagnostics read 'Technical event': the summary looked labels up under diagnostics-prefixed keys the messages do not have, and only a few event kinds had labels at all. Each event now has a specific label and a short detail, such as 'Tool: render · 162 ms', 'Model step · <model>', or an error's message, expands to its recorded fields and stack, and the list filters by level and category and grows a page at a time. The copy action passes the environment header, which moves out of the recorder so tooling that compiles it needs no build-time globals.
* test(app): stream a reasoning reply in WebKit without page errors
Errors such as WebKit's "not extensible" TypeError appear only in that engine, so run a streamed reasoning reply there and fail on any page or console error.
* fix(app): scrub queries on bare paths in diagnostic errors
Only URLs had their query removed, so a message like 'Failed to load /Designs/app.fig?token=…' kept the token.
* fix(app): count diagnostics recorded before Settings opens
The event count and size updated only on new events, so the panel showed 0 events beside a full list.
* feat(app): record failed AI tool calls as problems, with the stack of engine errors
A tool catches what it throws and returns only the message to the model, so diagnostics saw a failed tool as an info event without details. The adapter now passes the thrown value to the tool log. A failed call is a warning; a TypeError, ReferenceError, or RangeError, which comes from a bug in OpenPencil rather than a wrong call, is an error with its message and stack. Other tool errors keep only their name, since their messages quote layer names and arguments.
* fix(core): log tool calls that return an error as failed
Most tools report a failure by returning { error } rather than throwing, such as describe with an unknown node, so the tool log and diagnostics counted them as successful calls while the chat showed them failed.
* feat(app): scrub cloud keys, JWTs, private keys, URL credentials, and emails from diagnostics
The scrubber caught keys by shape only, so 20-character AWS access key IDs, user:pass@ in URLs, and emails reached the log, and a JWT's payload survived because its dots split it into short runs. It moves into its own module with rules grouped by what they protect. The added credential formats follow gitleaks; keys the shape rules already catch, such as GitHub, OpenAI, Anthropic, and Stripe ones, get no separate rule. No maintained browser library fits: secretlint needs Node built-ins and adds at least 23 KB gzipped, and the PII redactors miss tokens. The scrubber is 0.8 KB gzipped.
* refactor(app): name how a tool call is recorded and import diagnostics from its index
* fix(app): record demo document loads in diagnostics
The preparation event's schema listed its kinds, phases, cancel reasons, and failure codes by hand and lacked demo-load, so every demo load failed validation and was dropped. The schema now validates against the same lists the preparation types derive from.
* feat(app): label document preparation events in Settings diagnostics
Preparation events showed their raw name, editor.preparation.finished, because the summary had no label for them. They now read as their kind, such as Switch page, with the outcome and duration below. Event names are a typed union and the labels a map keyed by it, so recording a new event without a label fails type-checking; names stored by older versions still fall back to the raw name.
* fix(app): keep source paths and scrub provider stacks, auth headers, and spaced home folders
Review follow-up. A provider error's message was dropped but repeated on its stack's first line, so it is now removed there too. The long-run rule redacted source paths of 40 or more characters, losing the failing file; a run with slashes now loses only its key-like segments. The bare-path query rule cut optional chaining such as a.b?.c and now needs name= after the question mark. Authorization header values in any scheme, credential assignments such as api_key= or password:, and home folder names with spaces are now scrubbed.
* fix(app): suppress repeats of alternating runtime errors
Repeat suppression compared each error only with the previous one, so a loop alternating between two errors recorded every occurrence. Recent errors are now kept in a small bounded map.
* test(app): validate copied diagnostics and wait for the copy to finish
Master now rejects JSON.parse with a type assertion, so the copied report is read through a Valibot schema. The uncaught-error test read the clipboard before its copy finished and could see the previous test's report; it now waits for the confirmation, as the export test does.
|
||
|
Danila Poyarkov
|
01e58a3ad0
|
feat: write variables as a CSS token stylesheet (#856)
* feat: write variables as a CSS token stylesheet Copy a collection as CSS custom properties or a Tailwind v4 theme from the variables dialog, print it with openpencil tokens, and rebuild design_to_tokens on the same generator. Default modes go in :root or @theme, other modes override under their condition, and aliases are declared again in each mode scope so they follow it. * fix: give modes that slug alike their own selector and variant Two modes in one collection whose names reduce to the same slug, such as Dark and dark!, shared one default selector and Tailwind variant, so the later mode silently overrode the earlier one. Slugs are now numbered in mode order, as variable names already are. |
||
|
Danila Poyarkov
|
7ad6475e2b
|
feat: create, fill, and edit slots (#862)
* feat(app): add slot property controls and a shared picker AppPicker is a searchable, grouped list that opens beside the properties panel, built on Reka's popover and listbox so search keeps arrow-key navigation. It has comfortable rows with a thumbnail and description and compact rows for plain names, plus an optional footer action. The slot property row shows whether an instance's slot is Default or Modified, its item count, its limits with a checklist popover, Add instances on AppPicker, and Reset slot and Delete contents. These are presentational; wiring them to the editor follows. Strings are English only until the locale files catch up. * feat(app): open variable, style, and instance-swap choices in the shared picker The variable binding picker, the shared style fields, and instance-swap properties now open AppPicker: a titled panel beside the properties panel with search that keeps arrow-key navigation, a check on the current choice, and footer actions. Variable binding keeps its detach and create-variable actions. Instance-swap choices list the property's preferred components first; instanceSwapOptions keeps the preferred flag it already computed. AppPickerField gives select-shaped fields the same picker with a combobox trigger. * feat(core): edit instance slot content Only an instance's slots take layers now. slotScope classifies a parent as free, a slot of an instance, or the locked rest of an instance. Moves, reorders, layer-panel drops, paste, duplicate, and instance creation claim an untouched slot first, as Figma does on the first edit, and refuse the locked part; drops over it land in the instance's parent. Claiming keeps the layers but unlinks them from the component and moves the instance's overrides on nested instances onto those instances. Reset slot, Delete contents, and Add instance are editor actions, each one undo step that restores the instance's subtree. A canvas drop or reorder that claims a slot undoes together with the move. * feat(app): show and edit slot properties of the selected instance The component properties section lists each slot of the selected instance with its state, item count and limits, and adds instances, resets or clears its content through the editor's slot actions. The slot model lives in the Vue SDK as useSlotProperties. * feat(app): outline slots on the canvas and mark them in the layers panel Hovering or selecting a component, an instance, or a layer inside a slot draws its slots with a dashed pink outline and tints empty ones. Slot frames are selected and hovered in pink and show a dashed-square icon in the layers panel. * test(app): cover slot outlines with canvas snapshots * feat(app): translate slot and picker strings * docs: note slot editing and the shared picker * refactor: share slot test and story setup * refactor(app): name the picker's header prop heading * feat(core): create, configure, and remove slots on main components A frame of a main component becomes a slot through a SLOT property named after it; other sibling layers are first wrapped in an auto layout frame. Slot settings and removal are single undo steps. Instances now follow the component's property bindings on sync, so a slot created or removed on the component reaches existing instances. Slot helpers move to a slots domain folder in Scene Graph and Core. * feat(app): create and configure slots from the menu and properties panel Create slot joins the canvas context menu for layers of a main component. A Slots section on main components and their frames renames slots, sets their description, layer limits, and preferred components, and removes them. * fix: keep slot claims in the same undo step and refuse wraps inside instances Creating an instance and pasting HTML now batch the slot claim with the edit. Undoing an added slot instance restores the previous selection. Grouping or wrapping layers in the locked part of an instance is refused, and a section that cannot move no longer claims a slot. The picker clears its search however it closes, and its close and slot actions labels are translated. * feat(core): create and inspect slots through the plugin API component.createSlot() adds a 100x100 frame named Slot, Slot 2, and so on, bound to a new SLOT property, as live Figma does. Slot frames read type SLOT, resetSlot() restores an instance slot's component content, and limitViolations reports BELOW_MIN, ABOVE_MAX, and HAS_NON_PREFERRED for instance slots. addComponentProperty and editComponentProperty take a description and slotSettings, a cloned slot is a plain frame, and componentPropertyReferences uses property keys in both directions. The limit checks move to Scene Graph so the Vue SDK and the plugin API share them. * fix: keep nested slot content across swaps and read nested instance properties A nested instance points at the instance it was cloned from, so its component properties resolved to nothing. Properties now resolve through those links to the main component, and a swap or variant switch parks the slot content nested instances own and restores it into nested instances of the same names, as live Figma does. Plugin appendChild and insertChild claim the slot they add to and refuse the locked part of an instance with Figma's error. * test(core): record resetSlot on a main component slot; fix the Slots roadmap row * fix(core): refuse deleting layers outside an instance's slots As in Figma, delete and plugin remove() leave an instance's own layers and its slot frames alone, while removing slot content claims the slot in the same undo step as the delete. * test(app): wait for the bulk rename dialog to close before the next shortcut * feat(app): unify add, remove, and settings controls in the properties panel A section's + adds an item and a row's - removes it everywhere: grid tracks and variant properties now follow the fill and effect lists, and the header + of a component set adds Property 1 ready to rename instead of an inline form. Removing a variant is Delete, as for any layer. Row settings share the sliders icon, the variables button opens with its own icon, every icon button requires a label, and the instance header buttons use sentence case. Create Slot joins the app menu. * docs: note the unified properties panel controls * feat(app): animate floating panels alike and share the severity icon Popovers, menus, selects, comboboxes, and pickers now fade and grow in from the side they open on and fade out on close, from one motion preset that respects reduced motion; tooltips keep the tooltip preset. SeverityIcon and its colours move from the design check to shared feedback UI, and slot limits use them, so a broken limit reads like a design-check warning. * docs: note consistent popover and menu animation * feat(app): give every floating panel one surface and close it at once Popovers, menus, selects, comboboxes, pickers, presence cards, chat history, and the issue tooltip share one rounded surface with a 1px ring that outlines it in both themes; one-line tooltips keep a compact shape with the same edge. The select theme's radius and elevation options and local shadow overrides are gone. Panels still grow in from their side but now close immediately: a fading modal menu kept blocking the canvas and shortcuts until it unmounted. * fix(app): keep a reopened context menu open and name option-drag undo Duplicate Closing the canvas menu hands focus back to the canvas; when that landed just after a quick reopen, the new menu closed as focus moved outside it. Shortcuts no longer wait for a panel that is already closing, and an option-drag duplicate that claims a slot is undone as Duplicate rather than Move. * test(app): wait for menus and popovers to close before the next key |
||
|
Danila Poyarkov
|
e2a3aa3f80
|
fix: validate parsed JSON at untrusted boundaries with Valibot (#855)
* fix: validate parsed JSON at untrusted boundaries with Valibot Clipboard HTML, library revisions from shared storage, MCP and automation WebSocket messages, the MCP discovery file, sidecar output and AI/MCP tool arguments were JSON.parse'd and cast to their expected types, so a malformed payload reached the document or crashed paste. They now go through v.pipe(v.string(), v.parseJson(), Schema), which reports bad JSON and a wrong shape as the same validation failure. The path_set tool rejects an invalid VectorNetwork and shares its parser with create_vector. The CLI library catalog validates its files and runs revisions through the same size, identity and content-hash checks as the app; reading image bytes as index-keyed records also stops them coming back empty. Hand-rolled typeof readers for plugin data, document metadata, caches and preferences become schemas with their behaviour preserved, and readCacheJSON takes a schema for its payload. open-pencil/no-unvalidated-json-parse rejects type assertions on JSON.parse results other than `as unknown` in src and packages/*/src. * refactor: validate parsed JSON in tests and tooling Extend open-pencil/no-unvalidated-json-parse beyond source: tests, helpers and repo tooling now parse JSON through Valibot schemas instead of asserting a type. The shared fixture reader returns a validated object; its old array annotation never matched the fixtures. * fix: validate clipboard geometry bytes, library images and model catalogs Clipboard geometry blobs and library image bytes must be bytes at contiguous indexes, so out-of-range or gapped values are rejected instead of silently becoming different geometry or images; serialized library nodes must carry source metadata. The models.dev and OpenRouter responses are validated like their cached copies, and activate-tab rejects a CDP frame it cannot read instead of hanging. * refactor: extend the JSON validation lint to .json() results no-unvalidated-json-parse now also rejects type assertions on Response, Bun.file and shell .json() results, the same unchecked parse in another form. MCP server tests read /health through a validated readHealth helper and discovery files through parseDiscoveryInfo; the remaining tooling reads its JSON through schemas. * test: validate the RPC request body in the CLI app export test * test: validate CLI JSON output in the tool and app command tests * test: compare the malformed models.dev fallback with the curated list |
||
|
Danila Poyarkov
|
d2e380ea9d
|
fix(core): draw gradient and image strokes as the paint they are (#868)
* fix(core): draw gradient and image strokes as the paint they are A stroke carried the paint vocabulary already, but nothing read it: the .fig reader sent every stroke paint through resolvedPaintColor, which returns black for a gradient or image, the renderer set a flat color on strokePaint, and the writer emitted a SOLID paint. Strokes now go through the same conversion fills do in both directions, and applyGradientFill and applyImageFill take the target Paint so a stroke reuses the fill shader path instead of growing a second one. forVisibleStrokes is the single place every stroke draw passes through, so the shader is set and cleared there rather than threaded through each draw helper. Closes #797 for rendering and .fig; authoring a gradient stroke from the stroke panel is still to come. * feat(app): author gradient and image strokes from the stroke panel StrokeSection opened a solid-only colour picker and synthesised a fake fill for the swatch, so a stroke could never be anything but one flat colour. It now opens FillPicker like the fill panel does, and applyStrokePaint keeps the stroke's weight, align, cap, join and dashes across a paint change. Completes #797. * fix(core): let a gradient stroke reach vector outlines and arrowheads A vector stroke draws its outline as a filled shape with fillPaint, a dashed one strokes the path, and arrowheads are filled shapes of their own; each cleared the shader first, so a gradient or image stroke on a vector drew black. The stroke pass now configures both paints and owns clearing them, and those helpers keep what it set. Resolve each gradient stop against the stroke's own colour binding rather than the stop's position, which looked up another stroke's. Reported in review of #868. * fix(core): release the shaders a paint no longer owns Every gradient and image shader was handed to a paint and then leaked: the paint takes its own reference, so the caller's handle has to go or WASM memory grows with each redraw. Only the diamond branch did this. A gradient stroke now configures two paints, which doubled the leak. Reported in review of #868. * test(render): model a shader handle the caller deletes The pattern shader double returned a plain string, so deleting the handle the paint no longer owns threw instead of passing. |
||
|
Danila Poyarkov
|
f2485d6926
|
fix(desktop): allow reading recent .fig files for thumbnails (#872)
* fix(desktop): allow reading recent .fig files for thumbnails
The recent-files thumbnail loader stats a .fig file, opens it, and seeks
and reads its thumbnail entry, but the desktop capability granted none of
those fs commands, so the WebView rejected the first call ("fs.stat not
allowed") and no thumbnail ever loaded. Grant stat and open with the same
path scope as read-file, plus the handle commands they lead to.
A native spec runs the loader's command sequence on a real .fig file.
* test(desktop): check the bytes the recent-file thumbnail read returns
The native spec discarded the read result, so a read returning nothing would pass. Assert the zip signature and the byte count the fs plugin appends, through a bytes variant of the native invoke helper.
|
||
|
Danila Poyarkov
|
bb69735d27
|
feat(lint): suggest group-to-frame and hidden-layer fixes; keep canvas edits in code previews (#870)
* feat(lint): suggest converting groups to frames and deleting hidden layers no-groups and no-hidden-layers now carry suggestions the Lint panel, the lint_fix tool and editor.applyLintFixes can apply. A group becomes a frame in place, keeping its id, children, bounds and look; a hidden layer is deleted with its children. Neither is offered for locked layers or inside components and instances, and both are checked again when applied. The editor gains convertGroupToFrame and deleteNodes, which deleteSelected now uses, and applies lint fixes through a bridge so structure changes and property updates share one undo step. lint_fix becomes a document mutation because atomic tools cannot remove layers. * fix(code): keep canvas edits made while replaced code waits to render Replacing all the code drops its layer links until the preview links it again, so a canvas edit in the preview delay could not be patched into the code and the preview drew over it. Edits made while code waits to render are now applied again once the preview has linked the code, in the same undo step, and reach the code like any other canvas change. * fix(figma-api): default paint opacity and visibility like Figma Plugin scripts may leave out a paint's opacity and visible; Figma reads them back as 1 and true. The fills and strokes setters stored the paint as given, so the Design panel received an undefined opacity. * build(dev): forward only errors from the browser console Vite forwards browser logs when an agent starts the dev server. Serializing a Vue warning's component props walks the editor state and freezes the tab, so warnings stay in the browser console. * fix(code): follow values while they are dragged or scrubbed Live previews change layers without a new scene version, so the code kept the old value until the gesture ended. The Code tab now follows preview updates once per frame, as the Design panel does, and goes back when the gesture is cancelled. * fix(code): keep canvas edits when the replaced code fails to preview A failed preview took the canvas edits waiting for it and dropped them, and stopped recording new ones, so correcting the code drew over them. The edits now wait for the next preview. |
||
|
Danila Poyarkov
|
6a3960a5d4
|
feat(code): link the Code tab to canvas layers and sync both ways (#805)
* feat(code): link code to canvas layers and underline design issues
Code in the Code tab and layers on the canvas were unrelated: finding the
element behind a layer, or the layer behind an element, meant reading names.
Generated Design JSX and Tailwind JSX report the layer behind each element
in the order elements open, and edited Design JSX keeps the source line of
every element through the sandbox and renderer, so hovering an element
highlights its layer, Cmd/Ctrl-click brings it into view without changing
the selection the code shows, and errors and warnings from the design check
are underlined on the property that causes them.
* feat(code): explain the Code tab when nothing is selected
With no selection the editor showed a starter frame that read like a real
layer. The tab now says it shows the selected layers' code and offers Write
JSX, which opens the editor focused on the starter template.
* refactor(code): group code-to-layer linking into its own domain
Layer link types, issue mapping, and the hover and reveal behavior move
from the Code panel and a component file into src/app/code/layers, with
useCodeLayers as the panel's entry point, so app code no longer imports
types from components.
* fix(code): underline off-scale gaps after the spacing rule renamed its property
* feat(code): mark the layer of the element around the cursor
Hover highlighting and ⌘-click reveal replaced by one model: the element
around the cursor marks its opening and closing tag names and outlines its
layer on the canvas while the editor has focus. ⌘-click also collided
with CodeMirror's add-a-cursor gesture. Read-only Tailwind JSX now takes a
cursor so it links the same way.
Leaving the editor now ends a live Design JSX edit as one undo step.
Before, canvas edits made after typing never reached the code until the
tab was reopened, and their undo entries landed before the edit's.
* feat(code): sync the Code tab and the canvas both ways by patching
Canvas edits now patch the Design JSX a person wrote instead of waiting
for them to leave the editor: each linked element remembers the layer as
Design JSX last wrote it, and a canvas change rewrites only the attributes,
text and child elements that differ from that base, as CodeMirror changes
that keep the cursor, comments, formatting and history. Attributes written
as expressions are never overwritten; the code marks them when the canvas
now differs. Untouched code is regenerated with a minimal text change.
Code edits update layers in place: the new render is reconciled into the
existing layers (reconcileRenderedLayers), which keep their ids, so links,
selection and canvas edits survive typing. Each edit is one coalesced undo
step, replacing the restore-and-rerender preview and the commit on blur.
* feat(code): patch reordered layers and aliased properties in edited code
Reordering layers on the canvas now moves their elements in code a person
wrote: each child element and the blank lines and comments above it form a
block kept as written, and the children are written again in the new
order, staying linked. Children that cannot move safely, such as a loop
between them, keep their order and are marked.
Properties accepted under several names now come from one alias table in
the Design JSX schema, which the renderer resolves through and the patcher
and issue underlines use, so a canvas change to `w` patches `width` where
the person wrote that, instead of adding a second attribute.
* feat(code): keep the cursor in moved code and patch values written in style
A reorder rewrites the children span in one change, which collapsed a
cursor or out-of-sync marker inside a moved element to the span's edge.
The patch now carries where each block moved and places selections and
markers inside it at their new position.
Properties the renderer also reads from style={{ … }} come from a table in
the Design JSX schema instead of a hand-written list, keeping the rule
that an attribute under any of its names wins. The patcher uses it to
update a value written in style where it is, as a number or a px string
as written; values the renderer cannot read, such as '50%', are marked.
The layer patcher is split by concern: syntax helpers, attribute and
style patches, child patches, out-of-sync state and transaction assembly.
* feat(code): show the code's layer on the canvas as a tinted box
The layer of the element around the cursor used the canvas hover slot, so
moving the pointer over the canvas replaced it and the two read the same.
It now has its own shared editor state, codeFocusNodeId, drawn as the hover
outline over a light tint in every pane: hover stays an outline and the
selection keeps its handles, without borrowing the dashed outlines that
already mean component sets, drag parents and ghosts.
* fix(code): write added and removed layers when a reorder cannot move the code
When children could not be moved, such as two written on one line, the
patch marked the order and returned before adding or removing elements,
so a layer created in the same change never reached the code. It now
marks the order and still writes additions and removals.
* refactor(design-jsx): format the rebased layer description and stroke aliases
* feat(code): mount the layer-linked code editor through useCodeMirror
Master moved the code editor onto the shared useCodeMirror composable.
Its layer links, issue underlines, canvas patches, minimal text updates,
autofocus and read-only cursor now sit on that composable instead of a
hand-mounted view.
|
||
|
Danila Poyarkov
|
f6848434ec
|
feat: check designs live with a Lint panel, canvas markers, and fixes (#804)
* feat: check designs live with a Check panel and canvas issue markers Design lint only ran from the CLI and AI tools, and its rules were too noisy to show continuously: on a real imported page 786 of 888 layers had a warning. The rules now report where a finding is actionable (a hardcoded color only when a variable matches it, nesting only where the limit is crossed, instance sublayers through their main component) and carry structured data, and Recommended keeps warnings for likely problems. The app checks the current page after edits settle. The Check tab groups issues by rule with hover highlighting, reveal on click, and one-step variable binding. Errors and warnings are marked on the canvas with clustered markers that roll up to visible ancestors when zoomed out; markers explain themselves on hover, open Check on click, and toggle with View > Design issues. * fix: keep the right panel and markers stable The Check tab made the right-panel tab row overflow at common window widths, so focusing the zoom menu scrolled the row and shifted the panel. Code and AI tabs now drop their labels to screen readers when the row is narrow. Touch target names are matched as whole words: "Rectangle" contained "cta" and marked every rectangle. Markers also stay drawn during interactive edits instead of blinking while a value is scrubbed. * fix(ui): show right panel tab labels whenever they fit * fix(ui): name the design check tab Lint and keep panel tabs consistent The tab was an unlabelled icon between labelled Code and AI tabs. It is now Lint, with the same icon and label anatomy as its neighbours, and its icon takes the severity color instead of a count badge. All labelled tabs show their labels when the row fits and drop them together when it does not. * refactor(ui): build the Lint panel from shared components Issue groups use AppCollapsible, actions use AppButton, and the severity filters are a Reka toggle group with keyboard navigation. Issue rows no longer nest a button inside a button. Panel state, visibility and the focused-issue scroll live in useDesignCheckPanel, the rules menu is its own component, and rule preferences change through preference actions. Severity ordering reuses Core's ranking, detail numbers follow the app language, and the check debounce uses useTimeoutFn. * fix(lint): check the WCAG AA touch target size in the Recommended preset Recommended flagged a 394 × 39 input because it required the 44 × 44 AAA size. It now checks the 24 × 24 AA minimum through a minSize option; Strict and Accessibility keep 44 × 44. * feat(lint): fix design issues from rules, the Lint panel, the CLI, and agents Rules attach fixes as data: a safe fix keeps the design as it looks (bind a color to the variable it matches, round subpixel geometry that layout does not own), a suggestion changes values (snap radius and spacing to the scale, raise small text to the minimum). One Core applier re-validates each fix against the current graph and merges changes per layer. The Lint panel offers a fix per row and Fix all for safe fixes as one undo step; openpencil lint --fix writes the fixed document; the lint and lint_fix tools expose the same to MCP and AI chat. The design-check spec's Close button is now 24 x 20: at 24 x 24 it passes the WCAG AA touch target size that Recommended checks. * feat(lint): pin issues outside the view to the canvas edge Errors and warnings on layers outside the viewport had no marker, so a check could report issues nobody could see. They are now pinned to the canvas edge where a ray from the viewport center toward them leaves it, with a chevron pointing their way; pins in one direction merge like markers. Hovering lists them under the direction they lie in, and clicking reveals and opens the most severe, nearest one. Pins keep clear of UI floating over the canvas: the toolbar marks itself with data-canvas-obstacle, and canvases report such rectangles to the renderer through getOverlayObstacles each frame. * feat(lint): mark layers with design issues in the Layers panel Like an IDE marks files with problems and the folders holding them, a layer with errors or warnings shows the most severe as an icon, and a collapsed layer with issues inside it shows a dot in that color. Suggestions stay in the Lint panel, as on the canvas, and the marks follow the View → Design issues toggle. * feat(lint): show issues per page and across the document Loaded pages beyond the current one are now checked in the background, one page at a time while the editor is idle, and checked again only when an edit touches them; pages a large .fig file has not loaded are left alone until opened rather than forced in. The page list shows each page's errors and warnings like an IDE's problem count, and the Lint panel gains a Document scope that lists every page's issues, tags the ones on other pages, and switches to a row's page when it is opened. * test(lint): use the core-tests alias and no comma operator in lint tests Master now rejects ../../ imports and the comma operator in tests. * refactor(app): create the Lint session with the editor store modules The composition root passed its line budget once master added recent pages; the Lint session belongs with the other per-editor services that the modules factory creates and disposes. * docs(changelog): keep master's latest Unreleased entries |