107 commits

Author	SHA1	Message	Date
Kayshen Xu	bdf37908fd	V0.4.3 (#50) ... * chore(ai): update dependencies and enhance logging functionality - Bump version of `@github/copilot-sdk` and related packages to `0.1.32` and `1.0.7` for improved features and bug fixes. - Update Discord invite links across multiple README files to the new server. - Introduce a new logging utility in `server/utils/server-logger.ts` for better server process logging, including automatic log cleanup and directory management. - Enhance the `connect-agent.ts` and `install-agent.ts` files to improve OpenCode binary resolution and installation commands. - Refactor `resolve-claude-cli.ts` and `resolve-copilot-cli.ts` to include detailed logging for CLI binary resolution processes. This update improves dependency management, enhances user experience with updated links, and provides better insights into server operations through logging. * chore: bump version from 0.4.0 to 0.4.3 in package.json	2026-03-18 21:34:58 +08:00
Kayshen Xu	efaa56a9e4	V0.4.2 (#46) ... * feat(docker): add Docker support with multi-stage build and CI workflow - Introduced a `.dockerignore` file to exclude unnecessary files from the Docker context. - Added a `Dockerfile` for multi-stage builds, optimizing the application for production with a slim runtime. - Created a GitHub Actions workflow (`docker.yml`) to automate the building and pushing of Docker images on version tag pushes. - Enhanced the `connect-agent.ts` and `install-agent.ts` files to improve OpenCode binary resolution and installation commands. - Updated the canvas components to support new polygon shape and related functionalities, including UI adjustments for shape tools and appearance settings. This update significantly enhances the deployment process and expands the application's capabilities with Docker integration. * feat(docker): enhance Dockerfile with multi-stage builds and CLI variants - Updated the Dockerfile to include multiple image variants for different CLI tools, including Claude, Codex, OpenCode, and Copilot, alongside the base web app. - Improved the build process by separating the build stage and production stage, optimizing the final image size. - Added environment variables and commands for each variant to ensure proper execution in production. - Enhanced the README files in multiple languages to document the new Docker deployment options and usage instructions. This update significantly expands the Docker deployment capabilities, allowing users to choose the appropriate image variant based on their needs.	2026-03-17 21:07:50 +08:00
Kayshen Xu	ebe1346d24	V0.4.1 (#45) ... * feat(canvas): enhance font handling and text measurement - Introduced a new `cssFontFamily` utility to ensure proper quoting of font family names in canvas text rendering. - Updated text measurement functions to utilize `cssFontFamily`, improving compatibility with various font formats. - Added a `systemFontFamilies` set in `SkiaFontManager` to manage system fonts that cannot be loaded into CanvasKit, ensuring fallback to bitmap rendering. - Implemented a hook to enumerate system fonts, enhancing the font selection experience in the UI. - Added a new `FontPicker` component for improved font selection, integrating bundled and system fonts with search functionality. - Updated translations for new font-related UI elements across multiple languages. This update significantly improves text rendering accuracy and user experience when selecting fonts. * feat(figma): enhance clipboard data processing and font handling - Introduced a new mechanism to identify and handle known non-Google fonts, preventing unnecessary requests to the Google Fonts CDN for system and proprietary fonts. - Improved the Figma clipboard data extraction process by simplifying error handling and removing excessive debug logs, enhancing performance and readability. - Added functionality to convert unresolved image references in Figma clipboard data into placeholder rectangles, ensuring better visual fidelity when images are missing. - Enhanced instance conversion logic to merge symbol properties into instances, ensuring that clipboard data retains necessary layout and visual properties. This update significantly improves the handling of Figma clipboard data and font management, leading to a more robust user experience. * refactor(figma): enhance clipboard data processing and style resolution - Improved the Figma clipboard data extraction by adding optional HTML parsing to enrich nodes with style hints, ensuring better fidelity in text rendering. - Updated the `figmaClipboardToNodes` function to log conversion results and handle unresolved image references more effectively. - Refactored style resolution logic to ensure inline properties are correctly applied from style references, enhancing the overall rendering accuracy of Figma imports. This update significantly enhances the handling of Figma clipboard data and style management, leading to a more robust user experience. * feat(canvas): add image fill support and enhancements to fill section - Introduced support for image fills in the SkiaRenderer, allowing for dynamic image rendering with various fit modes and adjustments. - Added a new ImageFillPopover component for managing image fill properties, including exposure, contrast, and saturation adjustments. - Updated the FillSection component to include an option for image fills, enhancing the user interface for fill selection. - Improved localization for new image-related features across multiple languages. This update significantly enhances the capabilities of the canvas rendering system, providing users with more options for fill types and customization. * feat(canvas): enhance text shadow rendering and fill section UI - Implemented a new method for drawing text shadows as blurred copies of glyphs, aligning with Figma's drop-shadow behavior. - Updated the `drawText` method to incorporate shadow effects for text nodes, improving visual fidelity. - Adjusted the FillSection component to use a fixed width for better layout consistency. This update significantly enhances text rendering capabilities and improves the user interface for fill options. * refactor(figma): simplify arc ellipse conversion logic - Removed unnecessary position adjustments for flipped nodes, as the extractPosition function already computes the correct visual top-left. - Cleaned up comments to clarify the handling of arc properties without rotation adjustments, streamlining the conversion process for arc ellipses. This update enhances the clarity and efficiency of the arc ellipse conversion logic in the Figma node converters. * fix(canvas): use drawImageRect for image fill modes instead of broken shader scaling CanvasKit's Image.makeShaderOptions() fails to render when the localMatrix contains scaling factors with Clamp/Decal tile modes. Only Repeat mode works reliably with shader scaling. - Tile mode: keep shader + TileMode.Repeat (works correctly) - Fill/Fit/Crop/Stretch: use drawImageRect with canvas clipping - Add drawImageFillRect() for non-tile image fill rendering - makeFillPaint() returns optional imageFillDraw info for drawRect * fix(panels): fix image adjustment reset button not working The reset button called onAdjustmentChange in a loop, but each call spread from the same stale fill reference, so only the last adjustment was actually reset. Added onResetAdjustments callback that resets all adjustment values in a single atomic update. --------- Co-authored-by: Fini <fini.yang@gmail.com>	2026-03-16 09:33:57 +08:00
Kayshen Xu	90bbcb16fd	V0.4.0 (#44) ... * perf(canvas): bitmap cache during zoom/pan, fix save for large files - Add canvas-zoom-cache: captures pixel snapshot on first viewport change, draws cached bitmap with transform delta (~0.1ms vs ~15ms per frame). Refreshes snapshot every 200ms during continuous interaction. - Integrate zoom cache into wheel zoom and space+drag panning. - Set renderOnAddRemove: false on Fabric canvas to avoid per-object renders. - Remove depth/size LOD from viewport culling (zoom cache handles perf). - Rewrite syncCanvasPositionsToStore: single tree walk + single store set instead of per-object updateNode (was O(n²) with 200+ history pushes). - Unify save/save-as: .op files save in-place, non-.op triggers save-as. - Add Electron filePath storage for reliable native IPC saves. - Add error handling with fallback for all save paths. * feat(canvas): integrate CanvasKit for enhanced rendering and layout - Added support for CanvasKit WASM to improve rendering performance and capabilities. - Introduced a new SkiaCanvas component for rendering using CanvasKit. - Implemented spatial indexing with RBush for efficient hit testing in the Skia engine. - Enhanced text measurement and layout handling using Canvas 2D for accurate word wrapping. - Updated layout engine to accommodate badge and overlay nodes without affecting layout flow. - Bumped version from 0.3.3 to 0.3.4 to reflect these significant changes. * fix(electron): add graceful-fs to devDependencies for Node.js v25 compat (#38) * feat(figma): enhance instance override handling and derived data processing - Added support for symbol tree context in instance conversion. - Improved the application of instance overrides by filtering derived data to exclude nested instances. - Implemented a two-strategy approach for resolving overrides and derived data, accommodating both direct index mapping and expanded DFS for nested instances. - Updated FigmaSymbolOverride interface to extend FigmaNodeChange, enhancing the handling of overridable node properties. * refactor(canvas): remove loading state and enhance error handling in SkiaCanvas - Eliminated the loading state management from SkiaCanvas, simplifying the component. - Updated error handling to directly display error messages without loading indicators. - Adjusted the EditorLayout to directly render SkiaCanvas without suspense, improving performance. - Introduced drag-and-drop file handling in the canvas store for better user experience. - Enhanced Figma import dialog to auto-process pending files from drag-and-drop. * fix(ai): improve error messages for API authentication and connection issues - Updated error hints in chat.ts to provide clearer instructions for API authentication, including running "claude login" or setting the ANTHROPIC_API_KEY in settings.json. - Enhanced friendly error messages in connect-agent.ts to guide users on authentication steps when encountering connection errors. - Refactored resolve-claude-agent-env.ts to improve environment variable normalization, allowing for better handling of ANTHROPIC_CUSTOM_HEADERS and ensuring proper serialization of object values. * refactor(env): streamline environment variable reading and enhance settings handling - Renamed and refactored the function for reading Claude settings to improve clarity and maintainability. - Introduced a new function to read settings from both `settings.json` and `settings.local.json`, ensuring local settings take precedence. - Updated test setup to use the system's temporary directory for security tests, enhancing compatibility across environments. * feat(ai): add fallback models for third-party API proxies in connect-agent - Introduced FALLBACK_CLAUDE_MODELS to provide default model options when supportedModels() fails, enhancing connectivity with third-party API proxies. - Updated error handling in connectClaudeCode to return fallback models on specific connection errors, ensuring users can still connect and select a model. * chore: bump version from 0.3.4 to 0.4.0 in package.json * feat(ai): enhance prompt handling for basic-tier models - Introduced logic to inline system prompts into user messages for basic-tier models (e.g., MiniMax, GLM) to ensure proper instruction visibility. - Updated design modification and orchestrator functions to accommodate this change, improving interaction with third-party routers. - Added a utility function to strip non-standard XML-like tags from AI responses, enhancing JSON extraction reliability. * fix(server): add ESM-compatible __dirname polyfill (#42) - Add fileURLToPath/dirname polyfill to mcp-install.ts - Add fileURLToPath/dirname polyfill to mcp-server-manager.ts Fixes browser version crash with "__dirname is not defined" Fixes MCP over HTTP transport failure since v3.3 Closes #37 * fix(server): make MCP HTTP server survive parent process lifecycle (#43) ## Problem The MCP HTTP server process died when: 1. User closed the Settings/Agent dialog in the UI 2. User interacted with the editor canvas 3. Nitro server hot-reloaded or restarted 4. Electron app sent SIGTERM to Nitro on window close This made the MCP server unusable for HTTP transport, requiring users to keep the settings dialog open constantly. ## Root Cause Analysis The MCP server was spawned as a regular child process without detached mode. This created several fatal dependencies: 1. **Signal propagation**: Lines 29-34 registered handlers for SIGINT, SIGTERM, SIGHUP that killed the MCP process when the parent received these signals (e.g., Electron closing Nitro) 2. **Parent-child lifecycle binding**: Without detached mode, the child process is tied to the parent's event loop. Any parent instability (hot reload, dialog closure causing microtasks, etc.) could affect the child 3. **In-memory process tracking**: The mcpProcess variable was stored in module memory, so Nitro restarts/hot-reloads would lose track of the running server ## Solution 1. **Detached spawn mode**: Use `detached: true` + `unref()` to make the MCP process completely independent of the parent 2. **PID file persistence**: Track the process via files in /tmp instead of in-memory variables, surviving parent restarts 3. **Remove signal handlers**: Delete the SIGINT/SIGTERM/SIGHUP handlers that were killing the MCP process 4. **Cross-platform kill**: Use process.kill() instead of execSync with taskkill for safer process termination ## Testing ### Test Case 1: Settings Dialog Close - Open OpenPencil → Settings → Start MCP HTTP Server - Close settings dialog - Reopen settings → MCP server still running ✅ ### Test Case 2: Editor Interaction - Start MCP HTTP Server - Draw on canvas, create shapes, use all tools - Check MCP server status → Still running ✅ ### Test Case 3: Browser Version - Run `npx vite --port 3000` - Start MCP from browser UI - Close tab, reopen → Server still running ✅ ### Test Case 4: Electron App - Start MCP from installed app - Close app window - Reopen app → Server still running (tracked via PID file) ✅ ### Test Case 5: Stop/Restart Cycle - Start → Stop → Start again - Works correctly ✅ ## Files Changed - server/utils/mcp-server-manager.ts - Complete rewrite with detached mode - server/api/ai/mcp-install.ts - Add ESM __dirname polyfill Fixes #37 Co-authored-by: Kayshen Xu <kayshen.xu@gmail.com> * fix(canvas): respect node-level theme overrides during variable resolution (#41) Previously, resolveNodeForCanvas was called with a single activeTheme for all nodes, ignoring any per-node theme property. This meant nodes with theme: {"Mode": "Light"} would still render using Dark mode colors. This fix merges each node's theme property with the default activeTheme, allowing individual nodes to override theme axes for proper themed variable resolution. Fixes design documents where some panels need different theme variants than the default (e.g., Light mode components in a Dark mode document). Co-authored-by: Claude <noreply@anthropic.com> Co-authored-by: Kayshen Xu <kayshen.xu@gmail.com> * feat(ai): enhance text processing by stripping tool call blocks - Added a new function to strip fake tool call blocks emitted by basic-tier models, ensuring cleaner JSON extraction. - Updated the existing text processing flow to incorporate this new function, improving the handling of non-standard model artifacts. - Modified orchestrator prompts to disallow function calls and tool call syntax in JSON outputs, enhancing response consistency. * fix(server): resolve merge conflict and clean up ESM __dirname polyfill - Removed merge conflict markers from mcp-install.ts and mcp-server-manager.ts. - Ensured consistent implementation of ESM-compatible __dirname polyfill across both files. * feat(ai): add node availability check and HTTP fallback for MCP server installation - Implemented a function to check for the availability of Node.js on the system, enhancing compatibility for environments without Node.js. - Added a fallback mechanism to install the MCP server using an HTTP URL when Node.js is not found, ensuring functionality remains intact. - Updated the installation response to include a flag indicating if the HTTP fallback was used, allowing the UI to reflect the server status accurately. - Enhanced the agent settings dialog to synchronize the MCP server status when the HTTP server is auto-started. * refactor(canvas): replace Fabric.js with CanvasKit/Skia for enhanced rendering performance - Removed Fabric.js dependencies and related code, transitioning to CanvasKit/Skia as the primary canvas engine. - Updated documentation and README files to reflect the new canvas technology. - Adjusted data flow and component interactions to accommodate the new rendering engine. - Ensured backward compatibility by retaining legacy Fabric.js files for specific utilities until full removal is feasible. * refactor(canvas): update layout engine and remove Fabric.js dependencies - Enhanced the canvas layout engine by integrating Skia and CanvasKit, replacing Fabric.js references. - Improved type safety by refining type assertions and imports across various components. - Added a new function to retrieve canvas dimensions, defaulting to 800x600 if no engine is mounted. - Removed obsolete rendering logic related to Fabric.js, streamlining the layout indicator functionality. - Updated multiple components to utilize the new canvas size retrieval method, ensuring consistent behavior across the application. * fix(figma): resolve multiple .fig import rendering issues - Fix layout properties in preserve mode: only apply auto-layout (gap, padding, justify, align) for frames with stackMode, use absolute positioning for non-auto-layout frames - Reverse children order for auto-layout frames in preserve mode to match Figma's layout flow order (tree builder sorts descending for z-stacking but layout needs ascending) - Fix instance inlining: always inline symbol content when instance has no local children, regardless of override/derived data presence - Fix derived data mapping: use direct GUID matching (Strategy 0) when derived guidPath GUIDs are actual symbol node GUIDs, preventing the off-by-one size/transform misassignment from index-based mapping - Add styleIdForFill/styleIdForStrokeFill resolution: resolve fill style references to inline paints before tree building, fixing missing fills on 448+ nodes including active menu items and styled elements - Fix collectImageBlobs to detect JPEG/GIF/WebP in addition to PNG - Fix instance override application: apply overrides even when derived data is absent * fix(figma): skip opacity=0 nodes during import to fix breadcrumb visibility Nodes with opacity <= 0 are now skipped in convertChildren, along with all their descendants. This fixes the breadcrumb "Page / Page / Page" text showing through despite the parent items having opacity=0, since the Skia renderer does not propagate parent opacity to child nodes. * fix(figma): resolve styleIdForFill in instance override entries Style references (styleIdForFill, styleIdForStrokeFill) inside symbolOverrides were not being resolved to inline paints. This caused text nodes in overridden instances (e.g. "All Products" card on blue background) to retain the symbol's default colors instead of the instance-specific white fills. The resolveStyleReferences pre-processing step now iterates into each node's symbolData.symbolOverrides array and resolves style references there as well. * fix(figma): apply icon colors and fix arc rendering in .fig import - Fix donut chart missing segment: swap start/end angles when endingAngle < startingAngle instead of adding 2π, producing correct clockwise arc equivalents for counter-clockwise Figma arcs - Fix icon stroke thickness: scale strokeWeight proportionally in scaleTreeChildren, applyInstanceOverrides derived sizing, and convertVector for Lucide icons rendered smaller than 24×24 - Fix nested instance color overrides: build nestedOverrideMap from multi-guid override paths (e.g. instanceGuid/childGuid) and inject child-scoped overrides into nested INSTANCE symbolOverrides, enabling Dashboard Summary Card icons to receive white/blue stroke colors - Fix override-only instances: when derivedSymbolData is empty but symbolOverrides exist (e.g. sidebar icon instances with stroke color overrides but no size changes), fall through to direct GUID matching so stroke paints are correctly applied - Include strokePaints in hasVisualOverrides check so instances with stroke-only overrides are properly inlined with their symbol children * feat(canvas): add vector text rendering with bundled fonts for Figma import Replace bitmap text fallback with CanvasKit Paragraph API for true vector text rendering. Bundle 11 popular font families locally via @fontsource packages to ensure reliable rendering in regions where Google Fonts CDN is unavailable. Key changes: - SkiaFontManager: local-first font loading with Google Fonts fallback - Paragraph API rendering with caching, styled segments, and alignment - Fixed-width text tolerance to prevent unwanted line wrapping from font metric differences between Figma and CanvasKit - Auto-width text manual alignment offset (center/right) to avoid infinite layout width issues - Figma text mapper: support RAW lineHeight units - Figma import dialog: pre-load fonts after conversion * fix(canvas): align text centering with CanvasKit and improve font fallback - Replace Fabric.js FONT_SIZE_MULT (1.13) with actual paragraph height (fontSize * lineHeight) for cross-axis text centering, fixing icon vertical misalignment in horizontal layouts - Remove Fabric-specific optical correction (getTextOpticalCenterYOffset) since CanvasKit halfLeading handles this correctly - Add font fallback chain with separate Inter Ext family for latin-ext glyph coverage (₦ U+20A6 etc.) - Cache failed font loads to prevent repeated fetch attempts per frame - Skip Google Fonts requests for known system/proprietary fonts (PingFang SC, Microsoft YaHei, D-DIN-PRO, etc.) * fix(figma): recursive nested instance expansion and CJK font support - Fix 3 bugs in applyInstanceOverrides() that broke deeply nested Figma component instances (6+ levels): propagate multi-guid derivedSymbolData to nested instances, resolve virtual GUIDs via pkToNodeGuid map, and build nestedDerivedMap alongside nestedOverrideMap for recursive expansion - Bundle Noto Sans SC (chinese-simplified + latin subsets, 400/700 weights) for offline CJK vector text rendering without Google Fonts dependency - Add Noto Sans SC to font fallback chain for CJK glyph coverage - Add China CDN mirror (fonts.font.im) as fallback when Google Fonts is inaccessible, with 4s timeout on primary CDN - Increase .fig file size limits to 150MB compressed / 300MB decompressed * fix(canvas): enhance CJK font support and pre-load Noto Sans SC - Update SkiaEngine to pre-load Noto Sans SC alongside Inter for improved CJK glyph coverage in the font fallback chain, preventing rendering issues with system fonts. - Modify FigmaImportDialog to ensure Noto Sans SC is included when primary fonts are system fonts, ensuring proper rendering of CJK text. * refactor(figma): optimize instance override handling with full DFS strategy - Replace hybrid skip-INSTANCE and expanded DFS with a unified full DFS approach for handling all node types, including INSTANCE nodes. - Update the mapping logic to ensure correct localID assignments and improve the handling of overflow entries during instance expansion. - Enhance the overall structure and readability of the applyInstanceOverrides function by consolidating the traversal methods. * refactor(figma): improve layout mapping and instance override logic - Enhance the mapFigmaLayout function to conditionally set gap based on stackSpacing and justifyContent, ensuring compatibility with Figma's layout behavior. - Simplify the applyInstanceOverrides function by removing redundant logic and focusing on a unified full DFS approach for node mapping, improving clarity and performance. - Ensure derivedSymbolData is correctly replaced with nested data from outer instances, preventing incorrect merging of entries. * refactor(figma): enhance instance override logic with root-inclusive DFS - Introduce a root-inclusive depth-first search (DFS) to accurately detect and skip overrides targeting the symbol root during instance processing. - Update the applyInstanceOverrides function to improve clarity and performance by refining the handling of derived data and overrides. - Ensure that overrides targeting the root are excluded from child nodes, preventing incorrect application of overrides in nested instances. --------- Co-authored-by: Fini <fini.yang@gmail.com> Co-authored-by: Related8919 <191752213+Related8919@users.noreply.github.com> Co-authored-by: Hrijul Dey <44521405+hr1juldey@users.noreply.github.com> Co-authored-by: Claude <noreply@anthropic.com>	2026-03-15 10:01:35 +08:00
Kayshen Xu	4af8ef412b	V0.3.3 (#33) ... * fix(ai): add icon name aliases and fix multi-path SVG concatenation Add 55+ common icon name aliases (burger→hamburger, sushi→fish, etc.) to both client icon-resolver and server icon API for robust AI-generated icon resolution. Register Lucide's own aliases for broader coverage. Fix SVG path concatenation bug where joining multiple <path> d-values caused incorrect rendering — a standalone <path> treats initial lowercase "m" as absolute, but after concatenation it becomes relative to the previous sub-path endpoint. Now ensures each sub-path starts with absolute "M". Add tryAsyncIconFontResolution for icon_font nodes that miss local lookup — fetches from server API, caches result, and triggers canvas re-render. * fix(canvas): preserve badge/overlay absolute positioning in auto-layout Add isBadgeOverlayNode() detector for badge, indicator, notification-dot, and overlay nodes. These nodes now retain their x/y coordinates instead of being stripped by layout sanitization. Update computeLayoutPositions to exclude badge nodes from the layout flow — they keep absolute positioning and render on top (prepended for correct z-order in reverse iteration). * fix(ai): prevent duplicate canvas objects and fix emoji-to-icon pipeline Streaming path: add ensureUniqueNodeIds before inserting nodes to prevent ID collisions across multiple AI generations. Track newly inserted IDs so subsequent streaming nodes don't collide either. Canvas sync: deduplicate Fabric objects sharing the same penNodeId — keep only the one tracked in objMap, remove stale duplicates. Badge nodes: use shared isBadgeOverlayNode() for z-order insertion and skip x/y stripping in layout parents. Fix emoji-to-icon pipeline: re-run applyIconPathResolution after applyNoEmojiIconHeuristic converts emoji text nodes to path nodes, so the icon resolver can match by name (e.g. "Pizza Emoji Path" → pizza). * fix(canvas): add async icon resolution fallback for icon_font nodes When lookupIconByName fails locally, queue tryAsyncIconFontResolution to fetch from server API. Cache result in ICON_PATH_MAP and trigger canvas re-render via store update. Store iconFontName and iconStyle on Fabric object for sync tracking. * fix(ai): strengthen emoji ban in prompts and improve orchestrator defaults Update all AI prompts to explicitly ban emoji characters with concrete examples and redirect to icon_font nodes instead of the previously incorrect "path nodes" guidance. Add z-order rule to orchestrator prompt: overlay elements must come before content they overlap. Add padding support to OrchestratorPlan rootFrame type. Default mobile root frame gap to 16 for consistent spacing. * feat(electron): add publisher name to Windows build configuration Updated the `electron-builder.yml` to include a publisher name for Windows builds, enhancing the identification of the application during installation. Additionally, revised the README files across multiple languages to reflect the new project description and features, emphasizing OpenPencil as the world's first AI-native open-source vector design tool with concurrent agent teams and design-as-code capabilities. --------- Co-authored-by: Fini <fini.yang@gmail.com>	2026-03-11 21:18:49 +08:00
Kayshen Xu	669c0dd38d	V0.3.3 (#32) ... * fix(ai): add icon name aliases and fix multi-path SVG concatenation Add 55+ common icon name aliases (burger→hamburger, sushi→fish, etc.) to both client icon-resolver and server icon API for robust AI-generated icon resolution. Register Lucide's own aliases for broader coverage. Fix SVG path concatenation bug where joining multiple <path> d-values caused incorrect rendering — a standalone <path> treats initial lowercase "m" as absolute, but after concatenation it becomes relative to the previous sub-path endpoint. Now ensures each sub-path starts with absolute "M". Add tryAsyncIconFontResolution for icon_font nodes that miss local lookup — fetches from server API, caches result, and triggers canvas re-render. * fix(canvas): preserve badge/overlay absolute positioning in auto-layout Add isBadgeOverlayNode() detector for badge, indicator, notification-dot, and overlay nodes. These nodes now retain their x/y coordinates instead of being stripped by layout sanitization. Update computeLayoutPositions to exclude badge nodes from the layout flow — they keep absolute positioning and render on top (prepended for correct z-order in reverse iteration). * fix(ai): prevent duplicate canvas objects and fix emoji-to-icon pipeline Streaming path: add ensureUniqueNodeIds before inserting nodes to prevent ID collisions across multiple AI generations. Track newly inserted IDs so subsequent streaming nodes don't collide either. Canvas sync: deduplicate Fabric objects sharing the same penNodeId — keep only the one tracked in objMap, remove stale duplicates. Badge nodes: use shared isBadgeOverlayNode() for z-order insertion and skip x/y stripping in layout parents. Fix emoji-to-icon pipeline: re-run applyIconPathResolution after applyNoEmojiIconHeuristic converts emoji text nodes to path nodes, so the icon resolver can match by name (e.g. "Pizza Emoji Path" → pizza). * fix(canvas): add async icon resolution fallback for icon_font nodes When lookupIconByName fails locally, queue tryAsyncIconFontResolution to fetch from server API. Cache result in ICON_PATH_MAP and trigger canvas re-render via store update. Store iconFontName and iconStyle on Fabric object for sync tracking. * fix(ai): strengthen emoji ban in prompts and improve orchestrator defaults Update all AI prompts to explicitly ban emoji characters with concrete examples and redirect to icon_font nodes instead of the previously incorrect "path nodes" guidance. Add z-order rule to orchestrator prompt: overlay elements must come before content they overlap. Add padding support to OrchestratorPlan rootFrame type. Default mobile root frame gap to 16 for consistent spacing. --------- Co-authored-by: Fini <fini.yang@gmail.com>	2026-03-11 21:10:07 +08:00
Kayshen Xu	2b35c86618	V0.3.2 (#28) ... * feat(electron): update electron-builder.yml to specify artifact naming convention for Windows builds. This change enhances clarity and consistency in the build output. * feat(electron): implement a file logger for the main process - Added a new logger module that writes logs to `{userData}/logs/main.log` with daily rotation and retains logs for the last 7 days. - Integrated logging functionality into the main process, replacing console error messages with log entries for better error tracking and debugging. - Introduced IPC handlers to retrieve the log directory path for user access. - Updated the preload and main files to utilize the new logging system, enhancing overall application reliability and maintainability. * feat(mcp): introduce layered design workflow and selection management - Added a new layered design workflow with tools: `design_skeleton`, `design_content`, and `design_refine` for improved multi-section design generation. - Implemented segmented prompt retrieval in `get_design_prompt` to allow focused access to design knowledge. - Created new API endpoints for managing canvas selection state with `selection.get` and `selection.post`, enabling real-time updates and synchronization. - Enhanced document management with live selection fetching and improved node operations for better design content handling. - Updated README and CLAUDE.md to reflect new features and usage guidelines for the layered design process.	2026-03-10 21:55:47 +08:00
Kayshen Xu	a671c38785	V0.3.1 (#25) ... * feat(mcp): enhance document management and design tools - Updated `openDocument` to always re-fetch the live canvas, ensuring user edits are captured. - Introduced new tools: `get_design_prompt` for retrieving design guidelines and `batch_design` for executing multiple design operations using a DSL. - Improved `handleInsertNode` and `handleUpdateNode` to include validation for node data and return the final node state after operations. - Enhanced design prompt with detailed PenNode schema and layout rules for better AI-generated designs. - Added validation functions to ensure node data integrity during CRUD operations. - Updated `handleOpenDocument` to provide context-aware design prompts based on document content. * feat(electron): enhance build configuration and auto-update functionality - Updated `electron-builder.yml` to include artifact naming conventions for Windows and Linux builds. - Enhanced NSIS installer settings to create desktop and start menu shortcuts. - Improved path handling for GUI applications on Windows to ensure proper environment variable inheritance. - Refactored auto-update logic in `main.ts` to streamline update checks and improve error handling. - Added new IPC handlers for managing pending file paths and improved file handling during application startup. - Updated `use-electron-menu` hook to handle additional menu structures and improve document loading logic. * chore: bump version to 0.3.1 and update project description - Updated version in package.json to 0.3.1. - Enhanced project description to highlight OpenPencil as the world's first open-source AI-native vector design tool featuring concurrent Agent Teams and Design-as-Code capabilities. - Refactored auto-updater to utilize constants for GitHub repository details, improving maintainability. - Introduced a new constants file to centralize shared values for the Electron application, enhancing code clarity and reducing duplication. - Updated various components to use new constants for port file handling and window dimensions, ensuring consistency across the application. * feat(ai): clarify mobile design guidelines and mockup usage - Updated design guidelines to emphasize that "mobile" requests should generate actual mobile-sized screens (375x812) instead of desktop mockups. - Added critical notes regarding the use of phone mockups, specifying they should only be used for marketing showcases and not for functional mobile screens. - Enhanced clarity on sizing and layout rules for mobile and web designs to ensure consistent application of design principles. * fix(canvas): improve text centering, layout inference, and Pencil format rendering - Resolve fit-content parent dimensions in computeLayoutPositions instead of using 0 (which caused negative available space and broken child positioning) - Reduce text width estimation minimum from 20px to 1px to fix centering of narrow single-character text in fixed-size centered frames - Add inferLayout() to detect padding-only frames as layout containers, so padding offsets are applied to children (fixes badge text ignoring padding) - Use Fabric's fontSize * 1.13 for single-line text height in centering calculations instead of fontSize * lineHeight - Add fontWeight propagation to text width/height estimation functions - Refine defaultLineHeight() tiers for better Pencil format compatibility - Support Pencil's singular `effect` property alongside `effects` array - Handle plain color strings in fill/stroke resolution for Pencil format - Add directional stroke rendering as synthetic border rectangles - Add icon_font node type rendering via lookupIconByName - Fix z-order reconciliation to use fresh canvas object map after text recreation - Fix canvas initialization race: defer reference tracking until canvas is ready - Resolve $variable references with circular reference guards * feat(types): add icon_font node type with panel and store support - Add IconFontNode type to pen.ts for icon_font nodes storing iconFontName - Extend property panel and icon section to recognize icon_font nodes - Add icon_font type icon in layer panel - Support icon_font in document tree utilities * feat(ai): improve design generation accuracy and validation - Add pre-validation pass to fix text with explicit pixel height to fit_content - Enhance validation tree dump with textGrowth and lineHeight fields - Update orchestrator prompts with structural patterns from Pencil analysis - Simplify role-resolver defaults to match Pencil conventions - Only force textGrowth=fixed-width on text >15 chars in streaming insertion * feat(ai): optimize generation pipeline and fix streaming layout - Disable LLM validation layer (pre-validation heuristics still run) - Remove visual-ref pipeline (3 fewer LLM calls per generation) - Compress sub-agent prompt and design principles (~70% smaller) - Remove width>480 guards so mobile gets root frame height expansion - Add gap field to orchestrator rootFrame format and guidance - Default icon_font nodes to lucide family in generation heuristics * feat(ai): load full Lucide icon set and default icon_font to lucide - Load all 1,729 Lucide icons as primary set (replaces 286 hand-picked) - Keep Feather as fallback for unmatched names - Default iconFontFamily to 'lucide' during .pen file normalization * feat(codegen): add icon_font support to all 8 code generators Output Lucide icon references instead of 'Unknown node' comments. React/RN use component syntax, HTML/Vue/Svelte use data-lucide, Flutter/SwiftUI/Compose use framework-native icon APIs. * feat(panels): replace product card quick action with food app homepage * feat(electron): implement preferences management and app storage abstraction - Introduced a new preferences management system in Electron, replacing localStorage with a JSON-based preferences file. - Added IPC handlers for getting, setting, and removing preferences, ensuring data persistence across sessions. - Created an app storage utility to provide a consistent API for accessing preferences in both Electron and web environments. - Updated various components and stores to utilize the new app storage system for improved data handling and synchronization. - Enhanced the initialization process to load preferences at startup, ensuring a seamless user experience. --------- Co-authored-by: Fini <fini.yang@gmail.com>	2026-03-09 22:02:43 +08:00
Kayshen Xu	ca1b5370ae	V0.3.0 (#24) ... * feat(boolean-operations): implement boolean operations in the editor - Added a new BooleanToolbar component for union, subtract, and intersect operations. - Integrated boolean operations into the layer context menu and keyboard shortcuts. - Enhanced the editor layout to include the boolean toolbar for improved user interaction. - Updated internationalization support with new translation keys for boolean operations. - Bumped version to 0.3.0 to reflect the addition of these features. * refactor(editor): update editor layout and panels for improved functionality - Replaced the PropertyPanel with a new RightPanel that includes both Property and Code panels. - Removed the CodePanel from the main editor layout and integrated it into the RightPanel. - Updated keyboard shortcuts to switch the right panel to the code tab. - Enhanced the LayerPanel with a resizable width feature for better user experience. - Added internationalization support for new right panel labels and code panel features. - Introduced new code generation capabilities for various frameworks in the CodePanel. - Improved overall layout structure for better responsiveness and usability. * feat(electron): implement .op file association and enhance file handling - Added support for .op file association in electron-builder, allowing OpenPencil documents to be opened directly from the file system. - Implemented IPC handlers for opening and reading .op files, ensuring proper loading of document content. - Enhanced the main process to handle file opening events on macOS and single-instance locking on Windows/Linux. - Updated the renderer to listen for file open events and load documents accordingly. - Improved README to reflect new file association feature. * fix(canvas): improve layout accuracy for AI-generated designs - Unify lineHeight default via canonical defaultLineHeight() function - Unify text measurement by removing duplicate estimators in generation-utils - Fix optical centering formula to scale proportionally with fontSize - Round layout positions to whole pixels to prevent sub-pixel artifacts - Recursively sanitize nested x/y in streaming layout containers - Fix input trailing icon alignment using fill_container instead of space_between * feat(canvas): right-align agent badge and add breathing glow border - Agent badge now right-aligned to frame's right edge instead of after label - Added breathing glow border around agent-owned frames during generation - Glow border uses same color and lifecycle as the agent badge - Removed unused BADGE_GAP constant and useDocumentStore import * feat(code-panel): enhance tab scrolling functionality and add scrollbar utility - Introduced left and right scroll buttons for tab navigation in the CodePanel, improving user experience for navigating long tab lists. - Added a custom utility to hide scrollbars for a cleaner interface. - Updated styles for better responsiveness and usability in the CodePanel layout. * fix(docs): update Discord invite links in multiple README files - Replaced outdated Discord invite links with the new link across all language-specific README files. - Ensured consistency in the documentation for community engagement. * feat(code-panel): enhance system prompt for responsive design - Updated the ENHANCE_SYSTEM_PROMPT to emphasize the importance of responsive design in code rewriting. - Added detailed guidelines for converting fixed pixel widths to relative units and using responsive Tailwind breakpoints. - Ensured that the output remains visually faithful on desktop while adapting gracefully across screen sizes. * feat(docs): add WeChat group information to README.zh.md and include group image - Introduced a new section in the Chinese README to provide details about the WeChat group for community engagement. - Added an image representing the WeChat group for better visibility and user interaction. * feat(electron): enhance theme management and title bar overlay for Windows/Linux - Updated the `setTheme` method in the Electron API to accept custom colors for the title bar overlay, improving theme synchronization across platforms. - Adjusted title bar overlay colors for Windows and Linux to ensure proper visibility and aesthetics. - Enhanced the top bar component to read computed CSS colors and apply them dynamically, ensuring a consistent user interface. - Improved handling of theme changes in the application to support background and foreground color customization. * fix(screenshot): update screenshot image for improved clarity and quality * fix(docs): update WeChat group image path in README.zh.md for consistency * fix(ai): fix post-generation validation pipeline and text centering - Fix Agent SDK validation: save temp screenshots inside project dir (.openpencil-tmp/) so Claude Code plan mode can read them, instead of /tmp/ which is outside the project sandbox - Enrich validation tree dump with fill colors, stroke, fontSize, fontWeight, textAlign, cornerRadius, opacity for comprehensive visual analysis - Add multi-round validation with quality scoring (threshold 8/10), 500ms stabilization delay between rounds - Add detailed debug logging to applyValidationFixes showing which nodes were found/skipped and property changes - Fix canvas sync needsTextbox check to also account for textAlign (matching isFixedWidthText in factory), preventing IText↔Textbox thrashing on every sync tick - Auto-center text in vertical+center layouts by expanding to full container width and injecting textAlign:'center' - Force Textbox for non-left-aligned text so textAlign is respected (IText ignores width and computes its own) * fix(canvas): use precise text width estimation for fit-content layout Remove the 14% safety factor from text width estimation when computing fit-content/natural-width text dimensions. IText auto-computes its own width and ignores our setting, so the safety margin only inflated the layout allocation, making text appear left-shifted within its container. * fix(canvas): center fit-content text in horizontal layouts For text nodes with fit-content width in horizontal layouts, set textAlign:'center' to compensate for width estimation inaccuracy. The estimated box is typically wider than the actual rendered text, causing left-aligned text to appear visually shifted. Centering distributes the estimation error evenly on both sides. * feat(ai): show validation details in checklist panel - Accumulate validation log (screenshot, analysis, fixes) instead of overwriting status messages, so the full process is visible - Preserve step thinking content in buildFinalStepTags (was discarded) - Add details field to pipeline items and render in checklist UI - Each validation step now shows: screenshot captured, issues found, quality score, fixes applied * feat(ai): add visual reference pipeline types and integration hooks - Add DesignSystem and VisualReference types to ai-types - Add 'visual-ref' mode to AIDesignRequest and SubTask.htmlReference - Detect visual-ref candidates in chat handlers (landing pages, websites) - Wire visual-ref mode in design-generator and orchestrator - Inject HTML reference snippets into sub-agent prompts * feat(ai): add modular design principles for sub-agent context - Add design-principles module with topic files: color, typography, spacing, composition, components - Selectively load relevant principles based on prompt content - Inject design principles into sub-agent system prompts * feat(ai): implement visual reference pipeline - Add design-system-generator: generates color/typography/spacing tokens - Add design-code-generator: generates HTML/CSS from design system - Add html-renderer: renders HTML to screenshot via html2canvas - Add visual-ref-orchestrator: coordinates the full pipeline (design system → HTML code → screenshot → enrich subtasks) - Add html2canvas dependency for client-side HTML rendering * feat(mcp): default filePath to live canvas and fix cross-platform issues - Default all MCP tool filePath to live://canvas when omitted, so tools operate on the real-time canvas instead of stale files - Remove filePath from required params in all tool schemas (21 interfaces) - Fix mcp-server-manager.ts using process.cwd() which fails in Electron production on Linux — now checks ELECTRON_RESOURCES_PATH first - Fix stopMcpHttpServer using SIGTERM on Windows — use taskkill instead - Force new children reference in applyExternalDocument to ensure canvas sync subscriber always detects MCP-pushed document updates * feat(mcp): enhance design prompt with semantic roles, CJK typography, and layout rules Add comprehensive design knowledge to MCP design prompt for better AI-generated designs: design type detection (mobile vs desktop), full semantic role reference with context-aware defaults, CJK typography rules, expanded text/layout/form guidelines, and detailed post-processing documentation. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * feat(ai): implement intent classification for chat handlers - Replace hardcoded keyword matching with a lightweight LLM call to classify user intent in chat messages. - Introduce a new function `classifyIntent` to determine if the request is for design generation or conversation. - Update design request handling in `useChatHandlers` to utilize the new classification method. - Enhance design prompt documentation to reflect changes in design type detection based on intent rather than keywords. * fix(ai): handle string qualityScore in validation response parsing The LLM sometimes returns qualityScore as a string (e.g. "8" instead of 8), causing it to fall through to 0. Also hide misleading "quality: 0/10" display when the score couldn't be determined, and log raw response for debugging. * fix(ai): increase validation timeout to 90s and fix quality score parsing Agent SDK validation requires spawning a process, reading the image, and analyzing it — 30s was consistently timing out. Also handle string qualityScore values from LLM responses and hide misleading 0/10 display. * fix(ai): fix validation timeout and response parsing - Increase validation timeout from 30s to 180s (Agent SDK needs time for subprocess spawn + OAuth auth + multi-turn image reading) - Strip <tool_use> XML blocks from Agent SDK response before extracting JSON — the tool call XML was confusing the regex, causing qualityScore to parse as 0 despite valid JSON being present - Handle string qualityScore values and hide misleading "quality: 0/10" - Revert unnecessary direct API key approach for validation * fix(ai): prevent node ID collisions between generations When generating new content on a canvas with existing nodes, AI-generated IDs (e.g. brand-spacer) would collide with previous generations. Now captures pre-existing node IDs at generation start and checks against them during upsert sanitization. Remapped IDs are tracked in generationRemappedIds so progressive streaming updates can still find their nodes. * fix(ai): require styleGuide in orchestrator plan and fix validation detail icons - Add fallback default styleGuide when orchestrator LLM omits it - Strengthen prompt to mark styleGuide as REQUIRED - Replace emoji icons in validation details with [done]/[pending]/[error] markers for consistent styling with the checklist design system * feat(server): add port file plugin for server instance discovery - Introduce a new Nitro plugin that writes a port file on server startup to allow the MCP server to discover the running instance, whether it's a development server or Electron. - Implement error handling in the Electron main process for writing the port file, logging any failures. - Update Vite configuration to include additional external dependencies in the rollup configuration. * feat(electron): implement IPC for retrieving pending file paths - Added a new IPC handler `file:getPending` to retrieve and clear the pending file path when the React app mounts. - Updated the Electron API to include `getPendingFile` for renderer access. - Enhanced the `useElectronMenu` hook to load any pending file on application startup. - Updated UI components to reflect changes in file handling and improved user experience. * fix(panels): replace emoji icons with styled icons in validation checklist - Parse [done]/[pending]/[error] prefixes in detail lines and render as styled circle icons matching the parent checklist design system - Replace remaining emoji markers in design-validation.ts with text prefixes - Fix isApplied detection to recognize new [done] Applied marker * refactor(electron): update settings path to use platform-standard app data directory - Changed the settings file path to utilize Electron's user data directory for better cross-platform compatibility. - Updated the settings writing function to ensure the user data directory is created if it doesn't exist. - Added comments to clarify the storage location for different operating systems. - Implemented a fixed partition for localStorage/cookies to maintain data across server port changes. * feat(ai): enhance validation with pre-checks, structural fixes, and border detection - Add design-pre-validation.ts: pure code checks before LLM validation - Invisible container detection (same fill as parent → auto-add border) - Sibling consistency (majority-rule for height/cornerRadius) - Add structural fixes to validation: addChild/removeNode operations - Icon injection via lookupIconByName with server fallback - autoFixParentLayout with child count guard to prevent layout breakage - Add strokeColor/strokeWidth to safe fix properties for border fixes - Simplify intent classification: all design requests use visual-ref pipeline - Fix checklist: "Found N issues" now shows [done] instead of [pending] - Fix qualityScore: only update when > 0 to preserve valid round scores * fix(ai): cherry-pick safe validation improvements, drop aggressive pre-checks Keep: stroke tree dump bug fix (object not array), qualityScore=0 false positive detection, fit_content→fixed safety guard, empty path removal, type-specific sibling consistency, repeated fix filtering, screenshot extraction to design-screenshot.ts. Drop: detectForcedFixedHeight (destroyed input/button heights), MAX_VALIDATION_ROUNDS 5 (too many rounds), removal of quality threshold early stop, section regeneration phase. --------- Co-authored-by: Fini <fini.yang@gmail.com> Co-authored-by: Claude Opus 4.6 <noreply@anthropic.com>	2026-03-08 11:55:35 +08:00
Kayshen Xu	5e13f48be1	V0.2.1 (#23) ... * feat(ai): integrate GitHub Copilot support and enhance agent management - Added GitHub Copilot as a new AI provider, including connection and installation handling. - Updated agent settings to include Copilot in the configuration options. - Enhanced the chat API to support Copilot as a provider, allowing for model selection and streaming responses. - Implemented installation instructions for Copilot CLI within the application. - Updated UI components to display Copilot status and connection options. - Enhanced internationalization support with new translations for Copilot-related terms. Bump version to 0.2.1. * feat(electron): enhance theme management for Windows/Linux - Added support for dynamic title bar overlay based on theme selection for Windows and Linux platforms. - Implemented auto-hide menu bar functionality for improved user experience on Windows/Linux. - Updated Electron API to include a new `setTheme` method for theme synchronization. - Modified top bar component to trigger theme changes via the new API, ensuring consistent UI across platforms. * feat(electron): add Linux window controls detection and styling - Implemented a function to detect the position of window controls on Linux, supporting both left and right placements based on desktop environment settings. - Updated the main window styling to adjust control padding dynamically for Linux and Windows platforms, ensuring a consistent user interface across operating systems. - Modified the top bar component to include specific class names for better control layout management. * fix(electron): update title bar overlay color and height for consistency - Changed title bar overlay color to transparent (rgba(0,0,0,0)) for improved aesthetics. - Adjusted height of the title bar from 40 to 36 pixels to enhance visual alignment across platforms. * fix(editor): adjust position of update ready banner for improved visibility - Moved the update ready banner from top-5 to top-12 to enhance its visibility and prevent overlap with other UI elements.	2026-03-06 21:00:42 +08:00
Kayshen Xu	3fb029d9a7	V0.2.0 (#21) ... * feat(ai): add agent identity system with visual indicators for concurrent generation - Agent identity: assign unique colors and names to each sub-agent - Canvas indicators: breathing glow border + name pill above streaming nodes - Preview effect: outline appears 500ms before element materializes - Screen grouping: subtasks with same `screen` field share one root frame, fixing multi-page apps being split into too many frames - Screen-level parallelism: subtasks within same screen run sequentially (preserving section order), different screens run in parallel * fix(canvas): make agent indicator visual effect much more dramatic - Outer glow: 8px soft border for visible halo effect - Inner border: 2.5px sharp crisp border at high alpha - Preview fill: 10-15% alpha (was ~1% before, essentially invisible) - Breathing: faster cycle (400ms), higher range [0.35, 0.95] - Name pill: larger font (11px), bold 700, drop shadow - Pill dedup: only draw one name pill per agent (not per node) - Rounded rect helper for polished pill rendering * fix(canvas): use globalThis for agent indicator state to prevent module isolation Vite module splitting can create separate module instances for the same file when imported from different chunks. This causes the indicator Map written by the orchestrator (services/ai/) to be a different instance than the one read by the canvas hook (canvas/). Using globalThis guarantees a single shared instance across all chunks. * feat(i18n): enhance internationalization support by integrating i18next for translation in various components. Added new dependencies: i18next, i18next-browser-languagedetector, and react-i18next. Updated UI elements in the editor, toolbar, and status bar to utilize translation keys for improved localization. Enhanced README with language options for better accessibility. * feat(auto-update): implement auto-update functionality with settings management - Added auto-update feature to check for updates at app startup and periodically while running. - Introduced settings for enabling/disabling auto-update, stored in a JSON file. - Integrated IPC handlers to manage auto-update settings from the renderer process. - Created new API endpoints for managing MCP server status, including start/stop functionality. - Enhanced the UI to support theme presets, allowing users to save and load variable presets. - Updated internationalization support for new UI elements related to auto-update and presets. * feat(ai): add element boundaries to orchestrator subtask planning Orchestrator now outputs an "elements" field per subtask listing the specific UI elements it owns. Sub-agent prompts display these boundaries so each agent knows exactly what to generate and what belongs to other sections, preventing content duplication across subtasks. Also includes: sequential cascade reveal animation, agent indicator recursive tagging, delayed indicator removal, single-agent identity for sequential mode, model name truncation fix. --------- Co-authored-by: Fini <fini.yang@gmail.com>	2026-03-05 21:14:50 +08:00
Kayshen Xu	ced993c388	V0.1.2 (#19) ... * Security hardening: fix critical and high-severity vulnerabilities (#18) * feat(mcp): add sanitizeObject utility to strip prototype pollution keys Recursively removes __proto__, constructor, and prototype keys from parsed JSON objects to prevent prototype pollution attacks via malicious .op files or batch_design DSL input. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * fix(electron): validate file path in saveToPath IPC handler Prevent path traversal attacks by checking for null bytes and restricting file extensions to .op and .pen only. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * fix(mcp): guard against prototype pollution in document parsing and batch design Sanitize JSON.parse output in openDocument() and parseJsonArg() to strip __proto__, constructor, and prototype keys before processing. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * fix(ai): sanitize debug logs and harden temp file handling Filter credential patterns from debug tail before sending to client. Set restrictive 0o700 permissions on temp directory. Validate attachment media types against allowlist to prevent extension spoofing. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * fix(ai): restrict environment variables passed to codex subprocess Replace full process.env with explicit allowlist of PATH, HOME, TERM, LANG, SHELL, TMPDIR, and OPENAI_*/CODEX_* prefixed vars only. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * fix(figma): add decompression size limits to prevent zip bombs Enforce 100MB total unzipped size and 50MB per-image limits during .fig file extraction to guard against malicious archives. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * fix(canvas): add dangerous SVG tags to skip list and fix ReDoS in getAttr Strip script, foreignObject, animate, animateMotion, and set elements during SVG import. Escape regex-special characters in style attribute name lookup to prevent ReDoS. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * test(security): add unit tests for security hardening fixes 27 tests covering: sanitizeObject prototype pollution stripping, document-manager sanitization, batch-design DSL sanitization, codex env allowlist, debug tail credential filtering, media type validation, SVG skip tags, and ReDoS safety. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> --------- Co-authored-by: Claude Opus 4.6 <noreply@anthropic.com> * feat(mcp): add live canvas sync and HTTP transport support Introduce real-time MCP ↔ renderer sync via SSE (server/api/mcp endpoints, use-mcp-sync hook, mcp-sync-state). Add StreamableHTTPServerTransport for HTTP and dual stdio+http modes. Electron writes ~/.openpencil/.port for MCP discovery. New design_prompt tool. Agent settings dialog gains transport mode selector. Security: restrict Electron file writes to home/temp dirs. Bump version to 0.1.2. --------- Co-authored-by: RolandSherwin <RolandSherwin@protonmail.com> Co-authored-by: Claude Opus 4.6 <noreply@anthropic.com>	2026-03-03 21:08:52 +08:00
Kayshen Xu	3eca24ac5a	V0.1.1 (#17) ... * chore(electron): update mac build scripts for improved artifact handling - Modified the `electron:build:mac-arm64` script to rename the generated YAML file for better clarity. - Adjusted the `electron:build:mac-both` script to run builds sequentially without file renaming logic, ensuring consistent output. * chore(electron): enable notarization for macOS builds and update build workflow secrets - Added notarization support in `electron-builder.yml` for enhanced security. - Updated GitHub Actions workflow to include necessary Apple credentials for notarization. * chore(electron): add additional secrets for macOS notarization in build workflow - Included CSC_LINK and CSC_KEY_PASSWORD in the GitHub Actions workflow to support code signing for macOS builds. * feat(types): add ImageFitMode type and objectFit to ImageNode Support fill/fit/crop/tile image scaling modes, matching Figma's image fill behavior. Default is 'fill' (cover) for backward compat. * feat(canvas): render images per fill mode with native crop Add computeImageTransform helper supporting fill/fit/crop/tile modes. Fill/crop uses FabricImage native cropX/cropY instead of clipPath to avoid conflict with parent frame clipping. Tile mode creates a Rect with Pattern fill. Detect mode changes via __needsRecreation flag for object recreation when switching between tile and non-tile modes. * feat(panels): add image fit mode dropdown to property panel New ImageSection component with Fill/Fit/Crop/Tile dropdown for image nodes. Wired into PropertyPanel between icon and appearance sections. * feat(figma): preserve image scale mode from Figma import Map Figma imageScaleMode (FIT/FILL/TILE) to objectFit property on imported ImageNodes so fill mode is preserved across import. * fix(canvas): fix zoom-to-fit bounds inflated by clipped children computeDocBounds was recursing into frame children, inflating the bounding box beyond visible frame bounds. Now only recurses into groups. Also use double-RAF in Figma import for reliable timing. * feat(figma): implement Figma clipboard paste functionality - Added a new hook, useFigmaPaste, to handle pasting Figma clipboard data into the canvas. - Integrated clipboard data extraction and processing to convert Figma nodes into PenNodes. - Enhanced keyboard shortcuts to attempt reading Figma data from the system clipboard as a fallback. - Introduced utility functions for decoding and processing Figma clipboard HTML data. - Updated editor layout to utilize the new Figma paste functionality. * feat(figma): implement Figma clipboard support for pasting nodes - Added a new hook, `useFigmaPaste`, to handle Figma clipboard data extraction and processing. - Integrated Figma clipboard support into the editor layout and keyboard shortcuts for seamless pasting. - Updated README to reflect changes in file format from `.pen` to `.op`. - Refactored AI service methods to route to appropriate provider SDK based on the `provider` field, enhancing flexibility in AI interactions. * fix(figma): preserve imported node order and disable openpencil auto layout Prevent imported/generated nodes from being prepended in auto-layout containers, which could reverse visual order during progressive insertion. Hide the unfinished OpenPencil auto-layout path from the import dialog to avoid selecting a mode that is not ready yet. * fix(ai): enforce explicit provider and model routing Pass selected provider and model through design generation, orchestration, sub-agent, and validation flows. Disable provider/model fallback and remove model retry-without-selection behavior so requests fail fast instead of silently routing to Claude. * chore(package): bump version to 0.1.1 --------- Co-authored-by: Fini <fini.yang@gmail.com>	2026-03-02 22:26:09 +08:00
Kayshen Xu	80636b0d5b	V0.1.0 (#13) ... * feat(editor): implement Figma import functionality - Added a new FigmaImportDialog component for importing .fig files. - Integrated file processing and conversion logic to handle Figma files. - Enhanced the editor layout to include a button for opening the Figma import dialog. - Introduced page tabs for better navigation between document pages. - Updated various components to utilize active page children for rendering and interactions. - Added new dependencies: fzstd and kiwi-schema for improved functionality. * fix(ai): harden Claude agent env variable resolution - Filter empty strings and object values from settings.json env - Validate ANTHROPIC_CUSTOM_HEADERS is valid JSON before passing - Remove incorrect ANTHROPIC_CUSTOM_HEADERS auto-generation from auth token * refactor(ai): remove silent fallback logic, surface errors in AI panel - Remove direct-stream fallback in generateDesign, delegate to orchestrator - Remove orchestrator planner fallback plan (buildFallbackPlanFromPrompt) - Remove sub-agent retry logic, minimal mode retry, and placeholder insertion - Throw on sub-agent error instead of silently degrading - Call updateLastMessage in catch block so errors display immediately - Clean up unused imports, functions, and console.log/warn statements * fix(ai): add 30s API connect timeout for faster error detection - Set maxRetries: 0 on Anthropic SDK to prevent retry delays on 429 - Add AbortController-based 30s timeout for initial API connection - If the provider doesn't respond within 30s, abort and send SSE error - Refactor streamViaAnthropicSDK with shared send() helper * fix(editor): improve Figma import visual fidelity - Extract image files from .fig ZIP archive and resolve by SHA-1 hash - Map Figma textCase property (UPPER/LOWER/TITLE) to text content - Convert ellipse nodes with image fills to image nodes - Decode Figma vector paths and match icons via Lucide icon registry - Fix z-order: move background rectangles behind content layers - Set clipContent=true for Figma frames (default clip behavior) - Unwrap single-artboard pages to use artboard as root frame * fix(canvas): preserve clipPath during async image load and invalidate cache - Copy clipPath from placeholder rect to FabricImage in onload callback - Set obj.dirty=true after applying/removing clipPath so Fabric.js re-renders with the updated clip region instead of using stale cache * fix(ai): use page-aware empty frame detection and place new designs as siblings - Fix isCanvasOnlyEmptyFrame() to use getActivePageChildren() instead of document.children which is empty after page migration - When canvas is empty, replace default frame (existing behavior restored) - When canvas has content, add generated frame as top-level sibling positioned to the right with 100px gap - Track generationRootFrameId so height adjustment targets correct frame - Add WIDTH SELECTION rule: app screens use 375x812 mobile dimensions - Include selected node dimensions in AI context string * feat(electron): implement application menu with native actions - Added a native application menu for macOS and Windows, including File, Edit, View, and Window menus. - Integrated menu actions for creating, opening, saving files, and editing operations like undo/redo. - Enhanced the editor layout to handle Electron menu actions through a custom hook. - Updated icon components in the toolbar and top bar for consistent styling. - Refactored padding and layout components for improved structure and readability. * fix(canvas): use page-aware children for selection depth resolution getSelectableNodeIds() used doc.children which is empty under the pages architecture. Switch to getActivePageChildren() so canvas selection correctly syncs to the layers panel. * fix(panels): adjust property panel sections for image nodes Hide fill/stroke sections (not applicable to images) and show corner radius section for image elements. * feat(canvas): implement image corner radius via clipPath FabricImage does not support rx/ry natively. Use a rounded-rect clipPath instead, with objectCaching disabled to ensure immediate re-render on radius changes. * fix(canvas): use page-aware forcePageResync for canvas re-sync The old pattern { ...doc, children: [...doc.children] } only touched root-level children which are empty under pages architecture. Extract forcePageResync() into canvas-sync-utils and replace all 7 occurrences across canvas-object-modified, drag-into-layout, and layout-reorder. * fix(canvas): preserve image corner radius clipPath during drag Three issues caused corner radius loss on image drag: 1. Scale baking in object:modified changed FabricImage width from natural to display dimensions, creating a clipPath size mismatch. Exclude images from scale baking (like paths/polygons). 2. object:moving unconditionally cleared all clipPaths to avoid stale frame clipping. Now only clears absolutePositioned (frame) clips, preserving object-level clips like image corner radius. 3. Post-drag re-sync overwrote the corner radius clipPath with the parent frame clip. Now skips frame clip when the object already has its own non-absolutePositioned clipPath. * feat(ai): enhance chat functionality with image attachments support - Added support for image attachments in chat messages, allowing users to send images alongside text. - Implemented temporary file handling for attachments, ensuring they are accessible to the AI processing. - Updated chat message structure to include attachments, and modified the prompt building logic to reference these images. - Enhanced the chat panel UI to allow users to select and preview images before sending. - Introduced a new state management for pending attachments in the AI store. - Refactored related components to accommodate the new attachment feature, improving user experience and interaction. * feat(multi-page): introduce multi-page architecture and enhance agent settings UI - Added multi-page architecture to the document structure, allowing for page CRUD actions such as add, remove, rename, reorder, and duplicate. - Implemented `activePageId` state management in the canvas store for better page handling. - Enhanced the top bar with an `AgentStatusButton` to display connected AI providers and their statuses. - Updated the agent settings dialog to improve the UI for managing AI integrations, including better layout and connection indicators. - Refactored related components for improved usability and visual consistency. * docs(README): add contributors section with dynamic contributor image * feat(ai): improve chat streaming and error handling - Added functionality to hide the checklist when streaming stops with no completed items. - Implemented abort controller management to handle user-initiated stops during chat generation. - Enhanced error handling to prevent displaying errors for user-initiated stops while preserving partial content. - Updated orchestration and design generation functions to support abort signals, improving responsiveness during streaming. * fix(canvas): align z-order with layer panel convention (top = front) Establish consistent z-order: children[0] = top of layer panel = frontmost on canvas. This matches the standard design tool convention (Figma, Sketch). - Reverse flattenNodes iteration so children[0] is added last to canvas - Add z-order reconciliation via moveObjectTo after each sync pass - Figma import: sort children descending so front items are at children[0] - addNode defaults to prepend (index 0) so new items appear at top - duplicateNode inserts clone above original (at idx instead of idx+1) - drag-reparent inserts at index 0 (frontmost) instead of childCount - Async image loading preserves z-order via insertAt instead of add - Add FigmaImportLayoutMode toggle (preserve vs openpencil auto-layout) * chore: resolve .gitignore merge conflict * fix(canvas): clamp corner radius to half the element height * chore: update version to 0.1.0 and modify mac artifact naming in electron-builder configuration --------- Co-authored-by: Fini <fini.yang@gmail.com>	2026-03-01 09:33:52 +08:00
Kayshen Xu	9f89645b0d	V0.0.3 (#12) ... * feat(editor): add github releases auto update flow Enable desktop auto-update checks and install prompt so packaged apps can update from published GitHub Releases. * fix(canvas): keep frame labels aligned during zoom Draw labels in viewport space with zoom-aware positioning so frame titles stay anchored while panning and zooming. * fix(ai): disable chat interactions when no models connected Prevent sending and shortcut actions when provider models are unavailable, and show a concise model picker hint to avoid false-available UI states. * docs: refresh readme community and demo section Embed the product demo video inline, add a styled Discord community entry, and update media assets for clearer README presentation. * chore: update nitro external dependency settings Align SSR bundling with current runtime usage by removing the unnecessary @opencode-ai external entries. * feat(electron): enhance macOS build process and update auto-updater - Added a new build script for macOS that allows building for both arm64 and x64 architectures. - Updated GitHub Actions workflow to support separate build arguments for macOS arm64 and x64. - Implemented a custom GitHub update provider for macOS to handle versioning based on architecture. - Introduced a new icon for the electron app and removed the old logo image. * feat(editor): enhance update ready banner with additional states and UI improvements - Added new state management for checking updates and dismissed status. - Improved visibility logic for the update banner based on update states. - Enhanced UI to display current and latest version information, download progress, and error messages. - Updated layout and styling for better user experience and accessibility. * docs: replace stripped video embed with clickable cover link GitHub sanitizes README HTML video tags, so the embedded demo player does not render on repository pages. Use a clickable poster image and explicit watch link to preserve the demo entry point across GitHub README rendering. --------- Co-authored-by: Fini <fini.yang@gmail.com>	2026-02-26 21:47:42 +08:00
Kayshen Xu	346389559a	V0.0.3 (#11) ... * feat(editor): add github releases auto update flow Enable desktop auto-update checks and install prompt so packaged apps can update from published GitHub Releases. * fix(canvas): keep frame labels aligned during zoom Draw labels in viewport space with zoom-aware positioning so frame titles stay anchored while panning and zooming. * fix(ai): disable chat interactions when no models connected Prevent sending and shortcut actions when provider models are unavailable, and show a concise model picker hint to avoid false-available UI states. * docs: refresh readme community and demo section Embed the product demo video inline, add a styled Discord community entry, and update media assets for clearer README presentation. * chore: update nitro external dependency settings Align SSR bundling with current runtime usage by removing the unnecessary @opencode-ai external entries. * feat(electron): enhance macOS build process and update auto-updater - Added a new build script for macOS that allows building for both arm64 and x64 architectures. - Updated GitHub Actions workflow to support separate build arguments for macOS arm64 and x64. - Implemented a custom GitHub update provider for macOS to handle versioning based on architecture. - Introduced a new icon for the electron app and removed the old logo image. --------- Co-authored-by: Fini <fini.yang@gmail.com>	2026-02-26 21:33:48 +08:00
Kayshen Xu	8dde4c43e0	V0.0.2 (#9) ... * chore(docs): add video demo to README.md for enhanced project visibility * refactor(ai): centralize Claude Agent SDK env resolution with debug logging and model retry Extract shared buildClaudeAgentEnv() and getClaudeAgentDebugFilePath() into resolve-claude-agent-env.ts to eliminate duplicated env setup across all server endpoints. Add model fallback retry logic (retry without explicit model on exit code 1) and diagnostic hints from debug log tail on failures. * fix(canvas): normalize layout justify/align values from CSS aliases AI-generated nodes may use CSS-style values like "flex-start", "space-between", "middle" etc. Add normalizeJustifyContent and normalizeAlignItems to map these to internal enum values in both the layout engine and the property panel. * fix(canvas): improve text and path rendering accuracy - Remove icon-specific bounding box override on path scaling to prevent pathOffset drift that visually offsets icons in logo containers - Only use Textbox for explicit fixed-width text modes instead of any node with width > 0, preventing unwanted word wrapping on auto-width text - Add widthSafetyFactor for Latin text estimation (1.14x vs 1.06x CJK) to reduce accidental line wraps from font width variation * feat(ai): add input icon affordance rules and trailing icon alignment Prompt AI to include semantic icons in form inputs (search, password, email). Add normalizeInputTrailingIconAlignment post-pass in role-resolver to auto-set justifyContent="space_between" on input frames with a trailing icon node. * feat(ai): persist model selection across sessions via localStorage Add preferredModel and selectModel to ai-store with localStorage read/write. Hydrate on mount to restore user's last chosen model. Add isHydrated flag to agent-settings-store to prevent race conditions during provider list construction. --------- Co-authored-by: Fini <fini.yang@gmail.com>	2026-02-26 09:38:48 +08:00
Fini	76f58ad239	feat(ai): resolve brand icons during streaming with immediate fetch fallback ... - icon-resolver: refactor ICON_PATH_MAP with shared IconEntry constants and s()/f() helpers to eliminate duplicate path strings; fix timer and pencil icon paths which were incorrectly aliased to clock/edit - icon-resolver: remove BRAND_PLACEHOLDER_MAP — brand icons now go straight to async resolution (simple-icons) without a Feather placeholder - icon-resolver: add tryImmediateIconResolution() — fires a 600ms-timeout fetch during streaming so brand icons appear without waiting for post-stream resolution; pending queue remains as fallback on timeout - design-canvas-ops: normalize gradient stops in insertStreamingNode to catch AI-generated nodes before they reach the store - design-canvas-ops: call resolveAllPendingIcons() after all non-streaming apply paths (applyNodesToCanvas, animateNodesToCanvas)	2026-02-24 04:06:44 +08:00
Fini	2c0406e0bf	feat(ai): remove OpenPencil built-in icon picker collection ... All icons in icon-resolver.ts now carry iconId (e.g. feather:search), so after AI generation each node automatically maps to the correct library in the property panel picker. The built-in "OpenPencil" collection in the picker is no longer needed. Removes BUILTIN_ICONS import, BUILTIN_ICON_MAP, buildBuiltinSvg, getIconColorRaw, and all openpencil-specific branches from the dialog.	2026-02-24 04:06:27 +08:00
Fini	241f81508a	fix(ai): normalize gradient stop offsets to prevent NaN display ... AI sometimes omits the offset field on gradient stops, causing Math.round(undefined * 100) = NaN in the UI. Fix at two layers: - normalize-pen-file.ts: auto-distribute missing offsets evenly across [0,1] and convert percentage-format offsets (>1) to 0-1 range - fill-section.tsx: defensive guard in the stop percentage display	2026-02-24 04:06:19 +08:00
Fini	ddff9ffc5e	fix(ai): add line/polyline/polygon parsing to Feather icon bundler ... featherBodyToPathD was missing <line>, <polyline>, and <polygon> support. Feather icons heavily use these elements — e.g. arrow-right, menu, check, x all use <line> or <polyline>. Without this support, many common icons returned d=null and were never added to ICON_PATH_MAP, causing them to fall back to async Iconify fetch or the generic star placeholder instead of rendering correctly. Now all 286 Feather icons are fully parsed and available offline.	2026-02-24 01:44:01 +08:00
Fini	c67d976593	feat(ai): guarantee icon usage from bundled Feather set ... - Export AVAILABLE_FEATHER_ICONS list from icon-resolver - Add findPrefixFallback() for compound icon name resolution - Fix rawName="" edge case when node is named exactly "Icon" - Inject full Feather icon list into AI prompts so the model only picks names guaranteed to resolve locally without network	2026-02-24 01:27:32 +08:00
Fini	862881c330	feat(ai): bundle all 286 Feather icons for instant offline icon resolution ... Install @iconify-json/feather and populate ICON_PATH_MAP at module init time by parsing the bundled SVG body strings (handles <path>, <circle>, <ellipse>, <rect> elements). Both kebab-case ("arrow-right") and normalized ("arrowright") keys are registered so the icon name resolver finds them immediately without any Iconify API calls.	2026-02-24 01:18:46 +08:00
Fini	f1ad0dcae2	feat(ai): expand built-in icon map and fix empty rawName edge case ... - Add ~40 more common Lucide icons to ICON_PATH_MAP (phone, calendar, clock, bookmark, edit, trash, chat, shield, zap, camera, chart, filter, etc.) so they resolve instantly without relying on the Iconify async fetch - Fix rawName="" bug: when a node is named exactly "Icon" or "Logo", stripping the suffix leaves an empty string causing the async queue guard to silently skip it; now falls back to the full normalized name for the queue key	2026-02-24 01:11:33 +08:00
Fini	564d98e98c	fix(canvas): ensure icon selection box is always square with centered content ... For icon nodes (PathNode with iconId), expand Fabric's logical bounding box to the declared w×h so selection handles always form a perfect square, while the path content remains centered via Fabric's natural pathOffset.	2026-02-24 00:50:23 +08:00
Fini	19a38a7623	feat(panels): add icon section with library picker and in-place path replacement ... - Add IconSection panel shown when a path node with iconId is selected - Add IconPickerDialog: anchored popover with collection browsing, search, current icon highlight, and outside-click/Escape to close - Add iconId field to PathNode to track Iconify icon identity - Fix canvas path sync to update d in-place (no object recreation/focus loss) - Fix multi-element SVG icons: convert circles, rects, lines to path commands so shapes like emoji face circles are not dropped during icon replacement - Filter invisible bounding-box paths (Tabler's M0 0h24v24H0z) before merging - Preserve original node width/height on icon replace; carry over display color - Populate iconId in AI icon resolver and server-side Iconify proxy	2026-02-24 00:25:49 +08:00
Kayshen-X	f6747cea32	feat(canvas): enhance canvas functionality with new layout engine, node creation, and object modification features ... - Introduced a layout engine for auto-layout computation, including padding resolution and fit-content size calculations. - Added a node creator for various drawing tools (rectangle, frame, ellipse, line, text) to streamline object creation. - Implemented object modification handling to sync changes back to the document store, improving interaction with Fabric.js. - Enhanced text measurement utilities for better width and height estimation, including support for CJK characters. - Added new API endpoints for AI icon retrieval and validation, supporting multimodal content analysis.	2026-02-23 13:22:17 +08:00
Fini	11b28de0fe	feat(ai): add text layout direction awareness, dense card protection, and centered column context ... - Differentiate text defaults by parent layout direction in insertStreamingNode (vertical=fill, horizontal=fit_content) - Add shouldDemoteHorizontalTextFillInLayout to prevent short labels from stretching in horizontal rows - Add countVisibleChildren utility for accurate sibling-aware text demotion - Add isLikelyCenteredColumnContext, shouldCenterTextInCenteredColumn, shouldCenterButtonRowInContext - Add isDenseCardPrimaryVisualCandidate to protect primary visual icons during dense card compaction - Integrate text demotion and centered column logic into Fix 1 and applyTextFillContainerInLayout - Apply shouldCenterButtonRowInContext in Fix 11 and applyFormChildFillContainer	2026-02-23 00:15:33 +08:00
Fini	cd67b62fa1	feat(ai): add table detection, badge/pill/button classification, and compact control heuristics ... - Add isTableLikeFrame/isTableRowLikeFrame detection to skip text-fill and form-fill heuristics for table structures - Propagate table context through applyGenerationHeuristics and applyTreeFixesRecursive - Consolidate button marker regex (isExplicitButtonMarker, isCtaLikeLabel, isLikelyActionFrame) - Add inline info pill detection (isInlineInfoPillFrame/isInlineInfoPillLikeFrame) and sizing heuristic - Tighten badge char limits (CJK <=8 / Latin <=16), add clause separator rejection - Expand isCompactControlFrame to cover inline pills and generic compact controls - Add Fix 13.5 (inline info pill post-tree sizing) and Fix 13.6 (compact control width clamping) - Add Fix 11.5: expand fit_content columns with long text in horizontal content rows - Guard button spacing, button width, and form-child-fill heuristics against non-action frames	2026-02-23 00:15:12 +08:00
Fini	3996bd8c6d	feat(ai): add phone mockup placeholder label support in design generator ... - Allow one centered text label inside phone placeholder frames instead of stripping all children - Add Fix 8.5: migrate sibling placeholder labels into the closest phone frame - Add phone label detection, creation, and normalization utilities - Update screenshot heuristic to preserve normalized label content	2026-02-23 00:13:52 +08:00
Fini	77cc97dfd2	feat(ai): refine prompts for text layout direction, badge limits, phone labels, and hero layout ... - Differentiate text width strategy: vertical layouts use fill_container, horizontal rows use fit_content - Tighten badge/chip char limits (CJK <=8 / Latin <=16), reject longer text for badge style - Allow one centered placeholder label inside phone mockup frames instead of forcing empty - Add hero+phone two-column layout hint for desktop - Add prompt optimizer detectors for dense cards, table structure, and hero phone layout - Inject native dense-card, table, and hero instructions into sub-agent prompts	2026-02-23 00:13:24 +08:00
Fini	7e40461e57	feat(ai): add dense card compaction, inner wrapper flattening, and layout heuristic refinements ... - Add dense card row compaction (5+ cards): aggressively shorten text, limit to 2 text blocks per card, remove non-essential decorative elements - Flatten redundant single "Inner" wrapper layers to keep hierarchy shallow - Add phone placeholder and divider frame detection and normalization - Add isCompactButtonLikeFrame/isCompactControlFrame to prevent badge heuristics from mis-targeting buttons and CTA elements - Improve text width promotion logic with shouldPromoteTextWidthToFillInLayout - Add long-text padding adjustment to prevent excessive horizontal padding from squeezing body text in narrow containers - Simplify horizontal overflow fix: remove fit_content strategy, prefer parent expansion - Reduce minimum section padding from 40px to 24px for desktop layouts - Tune CJK lineHeight defaults (body 1.55, heading 1.35) and auto-height estimation with paragraph-aware line wrapping - Add shallow hierarchy and dense card row rules to AI prompts	2026-02-22 20:35:59 +08:00
Fini	3bcee037ba	fix(canvas): filter invisible nodes in layout, fix fill_container fallback, and layer order ... - Skip invisible nodes (visible=false) in layout computation, flattenNodes, and document bounds calculation - Add getRootFillWidthFallback() to resolve fill_container width when parent is unavailable, preventing frames from collapsing to content width - Increase CJK glyph width estimate from 1.08 to 1.12 for more accurate sizing - Pass parentAvail through fitContentWidth for better nested width resolution - Remove reverse() in layer panel tree rendering to fix display order	2026-02-22 20:35:47 +08:00
Fini	c445ec5c84	fix(canvas): recreate path objects on d change and refine badge detection ... - Use invisible fallback path (M0 0 L0 0) instead of dot for empty d attr - Track __sourceD on path objects to detect d changes requiring recreation - Generalize textRecreated to objectRecreated for path recreation support - Tighten isBadgeLikeFrame: max height 40px, max 3 children, 1 icon max, exclude explicit button names, width cap 260px, CJK label limit 10 chars - Use full capsule radius (height/2) instead of clamped range for badges	2026-02-22 16:33:49 +08:00
Fini	120630a662	feat(ai): add copywriting guidelines to design generation prompts ... Add COPYWRITING section to CHAT_SYSTEM_PROMPT, DESIGN_GENERATOR_PROMPT, and SUB_AGENT_PROMPT enforcing concise text in generated designs: headlines 2-6 words, descriptions ≤20 words, no 3+ sentence paragraphs.	2026-02-22 16:04:25 +08:00
Fini	7eba9f20ba	feat(canvas): improve CJK text rendering, badge styling, and path safety ... - Add splitByGrapheme for CJK text to enable natural character-level wrapping - Add optical vertical centering offset for single-line text in horizontal layouts - Use fallback path data when SVG d attribute is empty to prevent render errors - Fix stroke-only path detection to check for visible stroke (non-zero width) - Add isBadgeLikeFrame heuristic for badge/chip/tag detection - Enhance badge sizing: auto corner-radius, icon normalization, CJK-aware padding - Fix fill-style icon resolution to always apply visible fill color - Add dot/bullet/point/circlefill to icon path map	2026-02-22 16:04:18 +08:00
Fini	9623e7cee2	fix(canvas): improve text width and height estimation for CJK and multi-line content ... Refactor text measurement to use per-glyph width estimation with distinct ranges for CJK, uppercase, lowercase, and digits. Add letter-spacing support and paragraph-aware line wrapping to fix under-estimated text dimensions.	2026-02-22 15:19:15 +08:00
Kayshen-X	e0d8e4dea8	feat(mcp): implement OpenPencil file format and MCP server integration ... - Introduce support for .op file format alongside .pen - Add MCP server functionality for document management and tool operations - Implement batch processing tools for design and variable management - Enhance save and open dialogs to accommodate new file format - Update dependencies and scripts for MCP server compilation and execution	2026-02-22 11:48:52 +08:00
Fini	1f1de83bf7	feat(ai): enhance orchestrator with style guide and prompt optimizer ... - Pass style guide from orchestrator plan to sub-agent prompts - Add orchestrator-prompt-optimizer for context-aware prompt tuning - Improve parallel sub-task generation and error recovery	2026-02-22 08:19:08 +08:00
Fini	cf5f4410e2	feat(ai): improve design generator with typography defaults and phone placeholder ... - Set default lineHeight on text nodes (1.2 for headings, 1.5 for body) - Expand phone/mockup placeholder detection with shape-based fallback - Flatten nested phone-shaped frames in post-streaming tree fixes - Increase CJK character width estimation and button padding buffer	2026-02-22 08:19:07 +08:00
Fini	ffdbcffc86	feat(ai): enhance streaming service with runtime config and thinking modes ... - Extract timeout constants to ai-runtime-config.ts - Add thinking mode control (adaptive/disabled/enabled) to stream options - Add StyleGuide interface for orchestrator visual consistency - Add ping timeout and first-text timeout options	2026-02-22 08:19:07 +08:00
Fini	930585d96c	feat(ai): integrate text typography properties into design prompts ... - Add textGrowth, lineHeight, letterSpacing, textAlignVertical, fontStyle to PEN_NODE_SCHEMA and sub-agent prompt - Add typography scale guidelines with lineHeight/letterSpacing defaults - Update examples with lineHeight, clipContent, fill_container usage - Add phone placeholder and clipContent rules	2026-02-22 08:19:07 +08:00
Fini	90e40c05bf	feat(codegen): add textGrowth, textAlignVertical and clipContent to code generation ... - textGrowth: auto → whitespace-nowrap, fixed-width-height → overflow-hidden - textAlignVertical: middle/bottom → vertical-align CSS - clipContent: true → overflow-hidden on containers	2026-02-22 08:19:07 +08:00
Fini	6a99edde23	fix(panels): improve AI chat panel overflow and color picker styling ... - Fix chat panel overflow with proper flex layout and min-h-0 - Cap checklist height with scrollable overflow - Adjust color picker input sizing	2026-02-22 08:19:07 +08:00
Fini	f2267992af	feat(panels): improve layer panel with auto-collapse and scroll-to-selection ... - Collapse all layers by default, auto-collapse newly added nodes - Auto-expand ancestor layers when a child is selected on canvas - Scroll selected layer item into view after expansion	2026-02-22 08:19:07 +08:00
Fini	aaa1d603d7	feat(panels): rewrite layout-section with full Flex Layout panel ... - 3x3 alignment grid with context-aware behavior per layout direction - Gap section with numeric/space-between/space-around radio modes - Multi-mode padding: single, 2-axis (V/H), 4-individual (T/R/B/L) with gear popover - Dimensions (W/H) and sizing checkboxes (fill/hug/clip) integrated into layout panel	2026-02-22 08:19:06 +08:00
Fini	8df0b27d2b	feat(panels): split text Layout and Typography into separate sections ... - Add readOnly prop to NumberInput for non-editable dimension display - Extract text Layout section (dimensions, fill/hug, resizing toggles) into text-layout-section.tsx - Enhance Typography section with line height, letter spacing, vertical alignment controls - Reorder property panel: Size → Layout → Appearance → Fill → Stroke → Typography → Effects - Add hideWH prop to SizeSection to avoid duplicate W/H inputs	2026-02-22 08:19:06 +08:00
Fini	154b4a57a4	feat(canvas): wire letterSpacing, textGrowth and clipContent to Fabric.js ... - Convert letterSpacing (px) to Fabric charSpacing (1/1000 em) in factory and sync - Select IText vs Textbox based on textGrowth mode, restore canvas selection after text object recreation - Add multi-line text height estimation with CJK character support - Honor clipContent flag in clipping logic	2026-02-22 08:19:06 +08:00
Fini	38f3f706fa	feat(types): add clipContent to ContainerProps ... Allow frames to explicitly clip overflowing children, essential for cards with cornerRadius + image children.	2026-02-22 08:19:05 +08:00
Kayshen-X	62728f45ed	feat(uikit): introduce UIKit browser and component management features ... - Add a new ComponentBrowserPanel for browsing and managing UI components. - Implement ComponentBrowserGrid and ComponentBrowserCard for displaying components. - Integrate UIKit store for managing component kits, search queries, and active categories. - Enhance editor layout to support toggling the UIKit browser with keyboard shortcuts. - Include import/export functionality for UIKit components.	2026-02-21 21:11:15 +08:00