- Add optional red border overlay showing viewport bounds with 10px inset
- Display viewport dimensions and device pixel ratio in overlay
- Enable via "Show Performance Overlay" checkbox in debug panel
- Helps visualize actual culling boundaries during development
- Chain widget callbacks to trigger immediate Vue state updates
- Remove need for RAF polling of widget values
- Add performance tracking for callback vs RAF updates
- Implement proper FPS tracking with 1-second intervals
This change makes widget updates reactive and immediate rather than
waiting for the next RAF cycle, improving responsiveness.
- Add useFeatureFlags composable for Vue nodes
- Update coreSettings with Vue nodes feature flag
- Minor typing improvements in useTransformState
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Support nodeData prop with VueNodeData interface
- Update emit types to use VueNodeData instead of LGraphNode
- Remove unnecessary imports and debug comments
- Proper color calculations for node headers
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Use SafeWidgetData interface instead of raw LiteGraph widgets
- Proper TypeScript typing without any types
- Use widget registry for component resolution
- Remove unnecessary imports and debug comments
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Map LiteGraph widget types to Vue components
- Support text, combo, number, boolean widget types
- Check if widgets should render as Vue components
- Proper TypeScript interfaces instead of any
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
Implements reactive position tracking, viewport culling, and event-driven
node management for Vue-based node rendering system.
Ready for demo and developer handoff.
- LGraphNode: Main container with transform-based positioning
- NodeHeader: Collapsible title bar with dynamic coloring
- NodeSlots: Input/output connection visualization
- NodeWidgets: Integration with existing widget system
- NodeContent: Extensibility placeholder
- Error boundaries and performance optimizations (v-memo, CSS containment)
- WidgetColorPicker: Color selection with ColorPicker component
- WidgetImage: Single image display with Image component
- WidgetImageCompare: Before/after comparison with ImageCompare component
- WidgetGalleria: Image gallery/carousel with Galleria component
- WidgetChart: Data visualization with Chart component
- WidgetInputText: Single-line text input with InputText component
- WidgetTextarea: Multi-line text input with Textarea component
- WidgetSlider: Numeric range input with Slider component
- WidgetToggleSwitch: Boolean toggle with ToggleSwitch component
- Complete widget type enum with all 15 widget types
- Component mapping registry for dynamic widget rendering
- Helper function for type-safe widget component resolution