feat: text annotations + polished templates#27
Merged
Conversation
Completely rewrote and expanded template system from 3 basic templates to 6 professional, information-dense templates with proper component library types, colored trust boundaries, and pre-populated STRIDE threats. Templates: E-Commerce Platform, Cloud Microservices, Mobile Banking, SaaS Platform, IoT Smart Building, Healthcare Data Platform. Each template now includes 12-13 elements (proper shapes: hexagons, database barrels, rectangles), 12-13 data flows with protocols and auth indicators, 3 colored trust boundaries, and 5 STRIDE threats with mitigations. Updated empty state UI to 2x3 grid with per-template Lucide icons and accent colors. Added Playwright screenshot script for visual validation. Added screenshots/ to .gitignore. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
- Widen column gaps to ~400px across all 6 templates - Trim all flow data arrays to 1 item for shorter edge labels - Add explicit handle overrides on congested nodes (API Server, FHIR Gateway, API Gateway) to fan out connectors - Fix mismatched element positions for IoT and Healthcare templates - Adjust boundary sizes to match new node positions Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
- Add z-index to edge label renderer so labels appear above connector lines instead of behind them - Change label layout from horizontal to vertical (flex-col), stacking flow number, protocol, and data on separate lines for better readability Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
- Shift Col1 to x=180 so nodes clear the left sidebar - Widen all multi-node boundaries from 220px to 280px (node names no longer clipped) - Increase column gaps to 340-380px for better label clearance - Add label_offset on 23 congested flows to prevent label overlap - Cap total template width at ~1300px so fitView keeps readable zoom Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Add a new "text" element type for placing annotation labels, callouts, and descriptions directly on the DFD canvas. Text elements are non-connectable and excluded from STRIDE analysis. Implementation: - New `textAnnotation` ReactFlow node type (borderless, no handles) - `font_size` and `font_weight` fields on Element (Rust + TS) - "text" ShapeCategory + "none" StrideCategory in component library - STRIDE engine skips elements with "none" category (TS + Rust) - Text-specific properties panel (hide irrelevant fields, add font controls) - "Text" added to palette generic items - Connection validation rejects text nodes as source/target - Context menu hides "View Threats" for text annotations - AI prompts and MCP server updated with "text" element type - 8 new tests (component library, STRIDE engine, context menu, Rust) - Docs updated with accurate component counts and text annotation refs Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
Keep text element feature plan section that was added on this branch. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
textelement type for placing labels, callouts, and descriptions on the DFD canvas. Non-connectable, excluded from STRIDE analysis, with font size/weight controls.Key changes
textAnnotationReactFlow node type (borderless, no handles, inline edit)font_sizeandfont_weightoptional fields on Element (backward-compatible)"none"STRIDE category for annotation elements (skipped in analysis)Test plan
npx vitest --run— 416/416 passcargo test— 59/59 passcargo clippy -- -D warnings— cleannpx biome check .— cleannpx tsc --noEmit— clean🤖 Generated with Claude Code