mirror of
https://github.com/Comfy-Org/ComfyUI_frontend.git
synced 2026-04-24 00:09:32 +00:00
8dfdac3fc40543383895dd27ec208fda11c3b84d
1151 Commits
| Author | SHA1 | Message | Date | |
|---|---|---|---|---|
|
|
b4b732ad8f |
[refactor] Extract Vue node entry point logic into focused composables (#5390)
* refactor: Extract Vue node entry point logic into focused composables - Extract logic from GraphCanvas.vue (735→200 lines) into 3 composables: - useVueNodeLifecycle: Node manager initialization and cleanup - useViewportCulling: Viewport culling with transform sync - useNodeEventHandlers: Node selection, collapse, title handlers - Remove type assertions by using comfyApp.canvas instead of canvasStore.canvas - Eliminate getter anti-pattern with proper Vue reactive refs - Fix all TypeScript compatibility issues without workarounds - Maintain proper separation of concerns and Vue-idiomatic patterns * style: Remove extra comments from return statement * [auto-fix] Apply ESLint and Prettier fixes * style: Remove conversational comments - Remove temporary comments that only made sense in refactoring context - Clean up comment wording to be more permanent/professional - Keep meaningful comments about code behavior and architecture --------- Co-authored-by: GitHub Action <action@github.com> |
||
|
|
0df7a53ead |
Rework theme menu (#5161)
* Change theme "button" to sub menu of all themes * Add test for theme menu * Prevent separator being added before View * Refactor test * Update locales [skip ci] * Fix has-text vs text-is change breaking other tests --------- Co-authored-by: github-actions <github-actions@github.com> Co-authored-by: bymyself <cbyrne@comfy.org> |
||
|
|
0854194aa1 |
[refactor] Refactor rendering-related files to DDD organization (#5388)
* refactor rendering-related files to DDD organization * add to git ignore ignore revs |
||
|
|
b00952e6b3 |
[lint] Enforce custom dark-theme: prefix instead of standard dark: prefix (#5382)
- Add vue/no-restricted-class ESLint rule to catch dark: prefix usage - Fix existing violation in FormImageUpload.vue (dark: -> dark-theme:) - Ensures consistent usage of project's custom Tailwind variant - Violations will fail builds and be caught during development 🤖 Generated with [Claude Code](https://claude.ai/code) Co-authored-by: Claude <noreply@anthropic.com> |
||
|
|
9122a4758d | Implement proper invalidation on switch (#5383) | ||
|
|
0bc53eb2ad |
Fix/toolbox node detection (#5361)
* refactor: dont need will change on animations * fix: by disabling parent pointer events and forcing on child element * fix: color picker watch with immediate option * Update test expectations [skip ci] --------- Co-authored-by: Jake Schroeder <jake.schroeder@isophex.com> Co-authored-by: github-actions <github-actions@github.com> |
||
|
|
006e6bd57c |
[feat] Vue-Based Rendering System for the ComfyUI Node Graph (#4263)
* [feat] Add core Vue widget infrastructure - SimplifiedWidget interface for Vue-based node widgets - widgetPropFilter utility with component-specific exclusion lists - Removes DOM manipulation and positioning concerns - Provides clean API for value binding and prop filtering * [feat] Add Vue widget registry system - Complete widget type enum with all 15 widget types - Component mapping registry for dynamic widget rendering - Helper function for type-safe widget component resolution * [feat] Add Vue input widgets - 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 * [feat] Add Vue selection widgets - WidgetSelect: Dropdown selection with Select component - WidgetMultiSelect: Multiple selection with MultiSelect component - WidgetSelectButton: Button group selection with SelectButton component - WidgetTreeSelect: Hierarchical selection with TreeSelect component * [feat] Add Vue visual widgets - 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 * [feat] Add Vue action widgets - WidgetButton: Action button with Button component and callback handling - WidgetFileUpload: File upload interface with FileUpload component * [feat] TransformPane - Viewport synchronization layer for Vue nodes (#4304) Co-authored-by: Claude <noreply@anthropic.com> Co-authored-by: Benjamin Lu <benceruleanlu@proton.me> Co-authored-by: github-actions <github-actions@github.com> * Update locales [skip ci] * Fix TransformPane pos/size (#4826) * Update locales [skip ci] * refactor(litegraph): decouple render-time state from models for reroutes and links\n\nIntroduce RenderedLinkSegment; compute reroute render params without mutating model; render into ephemeral segments instead of writing to Reroute/LLink. * Revert "refactor(litegraph): decouple render-time state from models for reroutes and links\n\nIntroduce RenderedLinkSegment; compute reroute render params without mutating model; render into ephemeral segments instead of writing to Reroute/LLink." This reverts commit |
||
|
|
85017dbba0 |
Upgrade: Tailwind v4 (#5246)
* temp: move tailwind calls out of the layer * temp: ts tailwind config * upgrade: Tailwind v4 This got a little out of hand. Had to add a relative reference to the stylesheet in any component that uses @apply instead of the utility classes directly. * upgrade: bg-opacity is now a modifier * fix: Classic menu buttons assume a border * Update test expectations [skip ci] * fix: New preflight removal pattern * fix: Skeletons don't have skin * Update test expectations [skip ci] * fix: Missing @reference * [auto-fix] Apply ESLint and Prettier fixes --------- Co-authored-by: github-actions <github-actions@github.com> Co-authored-by: GitHub Action <action@github.com> |
||
|
|
9a7d8cdca5 |
[refactor] Enforce enum type safety by removing type assertions (#5315)
Remove type assertions (as ManagerChannel) that bypass TypeScript's type checking and replace with explicit Record typing. This ensures invalid enum values are caught at compile time rather than runtime. - Replace type assertions with Record<string, ManagerChannel> typing - Remove manual casting that bypassed TypeScript validation - Ensure enum values are validated during compilation |
||
|
|
35f5773deb |
[bugfix] Fix invalid ManagerChannel enum value in nodepack installation (#5312)
* [bugfix] Fix invalid ManagerChannel enum value in nodepack installation Fix nodepack installation failure caused by using 'stable' channel value which is not defined in the ManagerChannel enum. Changed from 'stable' to 'default' which is a valid enum value according to the backend schema. Fixes nodepack installation requests that were failing validation at /v2/manager/queue/task endpoint. 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com> * [refactor] Enforce type safety for enum values without type assertions Remove type assertions (as ManagerChannel) and use explicit Record typing to ensure compile-time validation of enum values. This prevents invalid enum values from being used by catching them during TypeScript compilation rather than runtime validation failures. - Replace type assertions with Record<string, ManagerChannel> typing - Remove manual casting that bypassed TypeScript's type checking - Ensure invalid enum values cause compilation errors --------- Co-authored-by: Claude <noreply@anthropic.com> |
||
|
|
66a76c0ee0 |
Upstream ComfyUI Manager frontend and add custom node conflict detection (#5291)
* migrate manager menu items * Update locales [skip ci] * switch to v2 manager API endpoints * re-arrange menu items * await promises. update settings schema * move legacy option to startup arg * Add banner indicating how to use legacy manager UI * Update locales [skip ci] * add "Check for Updates", "Install Missing" menu items * Update locales [skip ci] * use correct response shape * improve command names * dont show missing nodes button in legacy manager mode * [Update to v2 API] update WS done message * Update locales [skip ci] * [fix] Fix json syntax error from rebase (#4607) * Fix errors from rebase (removed `Tag` component import and duplicated imports in api.ts) (#4608) Co-authored-by: github-actions <github-actions@github.com> * Update locales [skip ci] * [Manager] "Restarting" state after clicking restart button (#4637) * [feat] Add reactive feature flags foundation (#4817) * [feat] Add v2/ prefix to manager service base URL (#4872) * [cleanup] Remove unused manager route enums (#4875) * fix: v2 prefix (#5145) * Fix: Restore api.ts from main branch after incorrect rebase (#5150) * fix: api.ts file is different with main branch * Update locales [skip ci] * fix: restore support dotprop access * fix: apply locales based on manager/menu-items-migration * fix: Add missing shortcuts translation section for CI tests - Added shortcuts section with keyboardShortcuts key - Fixes failing Playwright test looking for 'Keyboard Shortcuts' aria-label - Issue was caused by incomplete rebase from main branch 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com> * fix: Add missing versionMismatchWarning translations for CI tests - Added versionMismatchWarning section with all required keys - Added general versionMismatch related keys (updateFrontend, dismiss, etc.) - Fixes failing Playwright tests for version mismatch warnings - These keys were lost during the rebase from main branch 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com> --------- Co-authored-by: github-actions <github-actions@github.com> Co-authored-by: Claude <noreply@anthropic.com> * feat: Add loading state to PackInstallButton and improve UI (#5153) * [restore] conflict notification commits restore * [fix] Restore conflict notification work and fix tests - Fix missing footerProps property in DialogInstance interface - Add missing InstalledPacksResponse type import in tests - Add missing getImportFailInfoBulk method to test mock - Remove unused ManagerComponents import causing type error - All unit and component tests now pass successfully * [fix] Use Vue 3.5 destructuring syntax for props with defaults Remove deprecated withDefaults usage in NodeConflictDialogContent.vue and use destructuring with default values instead * [feature] dual modal supported * [fix] Fix date format in PackCard test for locale consistency * [fix] title text modified * [fix] Fix conflict red dot not syncing between components Resolve reactivity issue by sharing useStorage refs across all composable instances to ensure UI consistency. * [fix] Add conflict detection when installed packages list updates - Import useConflictDetection composable in comfyManagerStore - Call performConflictDetection after refreshing installed packages list - Ensures conflict status stays up-to-date when packages change - Follows existing codebase patterns for composable usage * fix: use selected target_branch for PR base in update-manager-types workflow * [fix] test code timeout error fixed * [chore] Update ComfyUI-Manager API types from ComfyUI-Manager@4e6f970 (#4782) Co-authored-by: viva-jinyi <53567196+viva-jinyi@users.noreply.github.com> * [types] Add proper types for ImportFailInfo API endpoints (#4783) * [fix] ci error fixed & button max-width modified * fix: node pack card width adapted * fix: prevent duplicate api calls & installedPacksWithVersions instead of installpackids * feat: run conflict detection after Apply Changes Run performConflictDetection automatically after the backend restarts from Apply Changes button to detect conflicts in newly installed packages 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com> * refactor: simplify PackInstallButton isInstalling state management - Remove isInstalling prop from PackInstallButton component - Use internal computed property with comfyManagerStore.isPackInstalling() - Remove redundant isInstalling computations from parent components - Fix test mocks for useConflictDetection and es-toolkit/compat - Clean up unused imports and inject dependencies This centralizes the installation state management in the store, reducing code duplication and complexity across components. 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com> * feat: improve multi-package selection handling (#5116) * feat: improve multi-package selection handling - Check each package individually for conflicts in install dialog - Show only packages with actual conflicts in warning dialog - Hide action buttons for mixed installed/uninstalled selections - Display dynamic status based on selected packages priority - Deduplicate conflict information across multiple packages - Fix PackIcon blur background opacity 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com> * refactor: extract multi-package logic into reusable composables - Create usePackageSelection composable for installation state management - Create usePackageStatus composable for status priority logic - Refactor InfoPanelMultiItem to use new composables - Reduce component complexity by separating business logic - Improve code reusability across components 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com> * fix: directory modified * test: add comprehensive tests for multi-package selection composables - Add tests for usePacksSelection composable - Test installation status filtering - Test selection state determination (all/none/mixed) - Test dynamic status changes - Add tests for usePacksStatus composable - Test import failure detection - Test status priority handling - Test integration with conflict detection store - Fix existing test mocking issues - Update es-toolkit/compat mock to use async import - Add Pinia setup for store-dependent tests - Update vue-i18n mock to preserve all exports --------- Co-authored-by: Claude <noreply@anthropic.com> * feat: Integrate ComfyUI Manager migration with v2 API and enhanced UI This commit integrates the previously recovered ComfyUI Manager functionality with significant enhancements from PR #3367, including: ## Core Manager System Recovery - **v2 API Integration**: All manager endpoints now use `/v2/manager/queue/*` - **Task Queue System**: Complete client-side task queuing with WebSocket status - **Service Layer**: Comprehensive manager service with all CRUD operations - **Store Integration**: Full manager store with progress dialog support ## New Features & Enhancements - **Reactive Feature Flags**: Foundation for dynamic feature toggling - **Enhanced UI Components**: Improved loading states, progress tracking - **Package Management**: Install, update, enable/disable functionality - **Version Selection**: Support for latest/nightly package versions - **Progress Dialogs**: Real-time installation progress with logs - **Missing Node Detection**: Automated detection and installation prompts ## Technical Improvements - **TypeScript Definitions**: Complete type system for manager operations - **WebSocket Integration**: Real-time status updates via `cm-queue-status` - **Error Handling**: Comprehensive error handling with user feedback - **Testing**: Updated test suites for new functionality - **Documentation**: Complete backup documentation for recovery process ## API Endpoints Restored - `manager/queue/start` - Start task queue - `manager/queue/status` - Get queue status - `manager/queue/task` - Queue individual tasks - `manager/queue/install` - Install packages - `manager/queue/update` - Update packages - `manager/queue/disable` - Disable packages ## Breaking Changes - Manager API base URL changed to `/v2/` - Updated TypeScript interfaces for manager operations - New WebSocket message format for queue status This restores all critical manager functionality lost during the previous rebase while integrating the latest enhancements and maintaining compatibility with the current main branch. 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com> * fix: Restore correct interfaces from PR #3367 - Restore original useManagerQueue, useServerLogs, and comfyManagerService interfaces - Restore original component implementations for ManagerProgressDialogContent and ManagerProgressHeader - Fix all TypeScript interface compatibility issues by using original PR implementations - Remove duplicate setting that was causing runtime errors This fixes merge errors where interfaces were incorrectly mixed between old and new implementations. * fix: Add missing IconTextButton import in PackUninstallButton Component was using IconTextButton in template but missing explicit import, causing Vue runtime warning about unresolved component. * docs: Update backup documentation with working state backup Added manager-migration-clean-working-backup entry documenting the working state after fixing runtime issues, ready for PR integration. * [feat] Add manager capability feature flags Add support for manager v4 feature flag and client UI capability: - MANAGER_SUPPORTS_V4: Server-side flag for v4 manager support - supports_manager_v4_ui: Client-side flag for v4 UI support These flags enable proper capability negotiation between frontend and backend for manager UI selection (legacy vs v4). Also fix TypeScript errors by adding @types/lodash. 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com> * [feat] Add managerStateStore for three-state manager UI logic - Create managerStateStore to determine manager UI state (disabled, legacy, new) - Check command line args, feature flags, and legacy API endpoints - Update useCoreCommands to use the new store instead of async API calls - Initialize manager state after system stats are loaded in GraphView - Add comprehensive tests for all manager state scenarios 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com> * [fix] Fix API URL prefix slash and add error handling - Update comfyManagerService to use conditional API URL prefix based on manager v4 support - Fix manager UI state handling in command menubar and workflow warning dialog - Add proper manager state detection with fallback to settings panel - Remove unused imports and variables 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com> * [docs] Update backup documentation with PR #5063 integration status - Document manager-migration-pr5063-integrated backup branch - Add comprehensive recovery verification for all integrated features - Update next steps to reflect current progress - Document successful integration of both PR #4654 and PR #5063 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com> * [fix] Fix manager button visibility when manager is disabled - Use managerStateStore instead of legacy isLegacyManager check - Initialize manager state on component mount to detect --disable-manager - Hide Install All Missing Custom Nodes button when manager is disabled - Fixes issue where buttons showed even when comfyui_manager package not installed 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com> * [fix] Correct Install All button visibility for manager UI states - Install All Missing Custom Nodes button only shows for NEW_UI state - Legacy UI state only shows Open Manager button - Disabled state shows no buttons - Matches original PR #5063 behavior exactly 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com> * feat: Complete manager migration with bug fixes and locale updates - Restore proper task queue implementation with generated types - Fix manager button visibility based on server feature flags - Add task completion tracking with taskIdToPackId mapping - Fix log separation with task-specific filtering - Implement failed tab functionality with proper task partitioning - Fix task progress status detection using actual queue state - Add missing locale entries for all manager operations - Remove legacy manager menu items, keep only 'Manage Extensions' - Fix task panel expansion state and count display issues - All TypeScript and ESLint checks pass 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com> * feat: Complete manager migration with conflict detection integration This completes the integration of ComfyUI Manager migration features with enhanced conflict detection system. Key changes include: ## Manager Migration & Conflict Detection - Integrated PR #4637 (4-state manager restart workflow) with PR #4654 (comprehensive conflict detection) - Fixed conflict detection to properly check `latest_version` fields for registry API compatibility - Added conflict detection to PackCardFooter and InfoPanelHeader for comprehensive warning coverage - Merged missing English locale translations from main branch with proper conflict resolution ## Bug Fixes - Fixed double API path issue (`/api/v2/v2/`) in manager service routes - Corrected PackUpdateButton payload structure and service method calls - Enhanced conflict detection system to handle both installed and registry package structures ## Technical Improvements - Updated conflict detection composable to handle both installed and registry package structures - Enhanced manager service with proper error handling and route corrections - Improved type safety across manager components with proper TypeScript definitions * Remove temporary error log files from commits * Remove temporary documentation files - Remove MANAGER_MIGRATION_BACKUPS.md (temporary notes) - Remove TASK_QUEUE_RESTORATION_PLAN.md (temporary notes) These were development artifacts and shouldn't be in commits. * feat: Complete manager migration cleanup and integration - Remove outdated legacy manager detection from LoadWorkflowWarning - Update InfoPanelHeader with conflict detection improvements - Fix all failing unit tests from state management transition - Clean up algolia search provider type mappings - Remove unused @ts-expect-error directives - Add .nx to .gitignore 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com> * fix: Update CustomNodesManager command to use tri-state manager system Replace legacy isLegacyManagerUI() call with new ManagerUIState system: - Use useManagerStateStore().managerUIState instead of async API call - Handle DISABLED state by showing settings dialog - Handle LEGACY_UI state with fallback to new UI on error - Handle NEW_UI state by showing manager dialog - Remove unused useComfyManagerService import 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com> * refactor: Remove no-op refreshTaskState function - Remove unused refreshTaskState function from useManagerQueue - Function was left as no-op only to make tests pass - Since queue is now push-based (WebSocket), no need to refresh state - Clean up export and remove extra blank lines 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com> * fix: Replace lodash with es-toolkit/compat in useManagerQueue Replace lodash import with es-toolkit/compat to match project standards: - Change 'lodash' import to 'es-toolkit/compat' for pickBy function - Add specific type helper for history task filtering - Update JSDoc comment to remove lodash reference - Fixes component test failures from missing lodash dependency * fix: Add missing whats-new-dismissed event emission in WhatsNewPopup During merge with main, the event emission was lost from the hide() function. - Add defineEmits for 'whats-new-dismissed' event - Emit event in hide() function to maintain test compatibility - Fixes 3 failing unit tests in WhatsNewPopup.test.ts * ci: Force CI run for Playwright tests Previous commits contained [skip ci] which prevented test execution. This empty commit ensures all CI checks run properly. * test: Temporarily disable workflow.avif test due to missing nodes dialog The workflow.avif test asset contains custom nodes that trigger the missing nodes dialog, which is outside the scope of AVIF loading functionality testing. TODO: Update test asset to use core nodes only, then re-enable the test. --------- Co-authored-by: github-actions <github-actions@github.com> Co-authored-by: Jin Yi <jin12cc@gmail.com> Co-authored-by: Claude <noreply@anthropic.com> Co-authored-by: Comfy Org PR Bot <snomiao+comfy-pr@gmail.com> Co-authored-by: viva-jinyi <53567196+viva-jinyi@users.noreply.github.com> |
||
|
|
8f7ee4e9a3 |
Re-Route Support to Zendesk (#5259)
* refactor: replace feedback command with contact support in Help Center menu * refactor: replace feedback dialog with external support link in Help menu * refactor: simplify error reporting UI by removing send report functionality * refactor: remove issue report dialog and update support contact method * refactor: remove IssueReportDialog and associated components * refactor: remove unused issue report schema * refactor: remove unused issue report types * refactor: remove unused issue report fields from localization files |
||
|
|
b091f3aa08 | Add save/save as to breadcrumb root item (#5213) | ||
|
|
f8b8b1c6ed | [feat] Enhance MultiSelect component and Storybook stories (#5154) | ||
|
|
68c41839ec |
fix: Ensure logout clears both Firebase auth and API key (#5274)
* fix: Ensure logout clears both Firebase auth and API key When logging out via the avatar dropdown, the logout function was only clearing Firebase authentication but not the stored API key. This could leave users partially authenticated with their API key still active. Updated CurrentUserPopover to use handleSignOut from useCurrentUser composable, which properly handles both authentication methods: - Clears API key if logged in with API key - Signs out Firebase if logged in with Firebase This ensures complete logout regardless of authentication method. Fixes #5261 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com> * test: Update CurrentUserPopover tests to match new logout implementation Updated test mocks to include handleSignOut from useCurrentUser composable and adjusted test expectations to verify handleSignOut is called instead of the direct logout method. 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com> --------- Co-authored-by: Claude <noreply@anthropic.com> |
||
|
|
23d0362267 | [feat] Add account deletion functionality to UserPanel component (#5216) | ||
|
|
20181195e1 |
Fix/toolbox animation (#5197)
* fix: animation state handling * fix: animation timing * refator: remove out of scope changes * refactor: remove unused types * fix: animation timing * fix: animation properties * refactor: remove unneeded transaltez/3d hack because we dont support safari * refactor: pr feedback * consistent translate functions * Update test expectations [skip ci] * Remove EditModelButton * fix: update toolbox position test bounds --------- Co-authored-by: Alexander Brown <drjkl@comfy.org> Co-authored-by: github-actions <github-actions@github.com> Co-authored-by: bymyself <cbyrne@comfy.org> |
||
|
|
e8f0ec5bb3 |
[fix] Correct WhatsNew popup arrow alignment with help center icon (#5137)
* [fix] Correct WhatsNew popup arrow alignment with help center icon The arrow positioning was not accounting for additional sidebar icons (terminal and shortcuts) that were added below the help center icon, causing misalignment. Updated the calculation to properly position the arrow relative to the help center icon's current location. Fixes #5126 * [fix] Update small sidebar arrow positioning and improve center alignment - Fixed small sidebar rule to use consistent calculation with normal sidebar - Updated positioning to use half icon height for better center alignment - Both normal and small sidebar now use dynamic CSS variable calculations Addresses feedback from review by viva-jinyi on CSS specificity and positioning accuracy. * [fix] Make sidebar CSS variables global for teleported components - Move --sidebar-width CSS variable to :root to make it accessible globally - This allows teleported components like WhatsNewPopup to reference sidebar dimensions - Adjust arrow positioning calculations for better alignment with help center icon - Add explanatory comments about why these variables need to be global 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com> * fix: icon-size should be variable --------- Co-authored-by: Jin Yi <jin12cc@gmail.com> Co-authored-by: Claude <noreply@anthropic.com> |
||
|
|
9e8db6125c | fix: Allow for leading/trailing spaces when searching settings (#5193) | ||
|
|
74b61ecfdf |
feat: Add dropdown list for additional tabs (#5046)
* feat: Add dropdown list for additional tabs * fix: workflow menu and tabs styles |
||
|
|
50e0e29016 |
[feat] Remove obsolete FirstTimeUIMessage component (#5201)
The FirstTimeUIMessage was introduced in November 2024 when the new UI became default, but after 6+ months it's no longer needed as users have adapted to the new interface. The message was confusing for new users who never experienced the old UI. Changes: - Remove FirstTimeUIMessage.vue component - Remove component usage from SettingDialogContent.vue - Remove 'firstTimeUIMessage' translation key from all locales - Keep settingStore.exists() method as it's part of the public API |
||
|
|
73f7e1108a |
Cleanup: Potpourri PR of small changes that reduce the warning noise (#5128)
* fix: [@vue/compiler-sfc] defineModel is a compiler macro and no longer needs to be imported. * fix: Duplicate name conflict/warning from unplugin-vue-components * fix: enforce correct line endings for the commonjs and esm variants via git |
||
|
|
f79a5dc6a8 |
Fix HoverDissolveThumbnail layering issue preventing dissolve effect (#5191)
* [fix] Resolve HoverDissolveThumbnail layering issue preventing dissolve effect - Fix layer stacking problem where LazyImage containers blocked overlay visibility - Restructure template with separate positioning containers for base and overlay images - Use z-index to ensure proper layering of overlay image above base image - Update CSS classes from absolute positioning on images to container-based positioning - Update test assertions to match new class structure - Ensure hover dissolve transition works correctly from opacity-0 to opacity-100 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com> * Address code review feedback - Use size-full instead of w-full h-full for cleaner Tailwind classes - Update tests to use classList approach instead of string contains - Maintain same functionality while improving code quality 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com> --------- Co-authored-by: Claude <noreply@anthropic.com> Co-authored-by: bymyself <cbyrne@comfy.org> |
||
|
|
a630caa9d5 |
Enhanced custom icon support with tailwind (#5159)
* Add support for custom iconify using tailwind plugin - Register svgs from custom icons folder - Update existing custom icons to remove padding - Swap component icons for classes in sidebar tabs - Update browse templates in menu to use custom icon * Add basic check for custom SVG icons * Remove unused iconify packages |
||
|
|
84e7102f70 |
Fix/selection toolbox reflow (#5158)
* fix: layout perf issue * feat: skip a whole host of transform issues created by the SelectionOverlay and instead allowing the canvas to render the overlay and then injecting props to the SelecitonToolbox itself * refactor: removed unused files/functionality * refactor: removed unused types * fix: z index issue * fix: PR feedback * fix: PR feedback and more perf improvements * Update test expectations [skip ci] --------- Co-authored-by: github-actions <github-actions@github.com> |
||
|
|
882506dfb1 |
Fix: Search Box Implementation for keyboard shortcut (#5140)
* refactor: Move searchbox preference to the searchboxstore * fix: Ensure that the search box uses the preferred implementation. * polish: Open at current mouse location. * [test] add basic unit tests for searchBoxStore * types/testing: Tweak the types and setup for the searchBoxStore tests --------- Co-authored-by: Arjan Singh <arjan@comfy.org> |
||
|
|
69a3239722 |
Update SidebarIcon.vue (#5105)
Remove the non-wrap nature of text labels for longer labels so they can wrap. |
||
|
|
84379d9522 |
Feature/expanded minimap (#4902)
* [feat] Add formatKeySequence function to format keybindings for commands * [feat] Add lock and unlock canvas commands with keybindings and update localization * feat: Implement canvas scale synchronization and zoom level adjustment * feat: Enhance GraphCanvasMenu with zoom controls and improved button functionality * feat: Refactor MiniMap component layout and remove unused bottomPanelStore * feat: Update zoom control shortcuts to use formatted key sequences * feat: Add tests for ZoomControlsModal and enhance GraphCanvasMenu tests * Update locales [skip ci] * Fix browser tests * ui: align minimap properly * Update locales [skip ci] * feat: focus zoom input when zoom modal loads * style: improve styling of zoom controls and add focus effect * fix styling and tests * styling: add divider to graph canvas menu * styling: position minimap properly * styling: add close button for minimap * styling: add horizontal divider to minimap * styling: update minimap toggle button text and remove old styles * Update locales [skip ci] * Update locales [skip ci] * feat: disable canvas menu in viewport settings after zoom adjustments * Update test expectations [skip ci] * fix: update canvas read-only property access to use state object * Update locales [skip ci] * fix: adjust button group and minimap positioning * feat: enhance zoom controls and adjust minimap positioning per PR comments * feat: implement zoom controls composable * feat: add timeout delays for headless tests * fix: update zoom input validation range in applyZoom function * [refactor] Update positioning and styles for GraphCanvasMenu, MiniMap, and ZoomControlsModal components * [refactor] Adjust z-index and positioning for GraphCanvasMenu, MiniMap, and ZoomControlsModal components * [style] Adjust margin for minimap button styles in GraphCanvasMenu component * [refactor] minimap should show on focus mode * [refactor] Update LiteGraphCanvasSplitterOverlay to conditionally render side and bottom panels based on focus mode * [style] Adjust right positioning for MiniMap and ZoomControlsModal components * [style] Adjust right positioning for MiniMap and ZoomControlsModal components --------- Co-authored-by: github-actions <github-actions@github.com> Co-authored-by: Christian Byrne <cbyrne@comfy.org> |
||
|
|
11f5439d29 | [feat] Add comprehensive Storybook stories for custom UI components (#5098) | ||
|
|
180f95182d |
[fix] reposition TaskItem info #4996 (#5113)
Position sidebar task items at top of tile |
||
|
|
2407748425 |
[feat] Add enhanced filter UI components with search and clear functionality (#5119)
* [feat] Add enhanced filter UI components with search and clear functionality - Add SearchBox, clear all button, and item count to MultiSelect header - Add 'fit-content' size option to button types for flexible sizing - Update SingleSelect and ModelSelector components for consistency - Add localization strings for item selection and clear all functionality Co-Authored-By: Claude <noreply@anthropic.com> * Update locales [skip ci] --------- Co-authored-by: Claude <noreply@anthropic.com> Co-authored-by: github-actions <github-actions@github.com> |
||
|
|
8d0a523ffd |
[refactor] Remove obsolete Kontext Edit Button (#5108)
* feat: Remove obsolete Kontext Edit Button Removes the 'Kontext Edit Button' and its associated code, as it has been made obsolete by the new 'Subgraphs + Partial Execution' feature. Fixes #5093 * Update locales [skip ci] --------- Co-authored-by: github-actions <github-actions@github.com> |
||
|
|
30d48f2356 |
feat: add a filter and check box to disable (#5014)
selected extensions |
||
|
|
451ef24ea6 |
[feat] Add Storybook setup and NodePreview story (#4861)
* [feat] Add Storybook setup and NodePreview story - Install and configure Storybook v9.1.1 for Vue 3 - Set up Storybook configuration with Vite integration - Add Pinia store support for Storybook environment - Create comprehensive NodePreview.stories.ts with multiple node examples: - KSampler node (complex node with multiple inputs/outputs) - CLIP Text Encode node (simple text input node) - VAE Decode node (image processing node) - Example with long markdown description - Configure project paths and aliases for Storybook - Stories demonstrate various ComfyUI node types with realistic mock data - Update tsconfig.eslint.json to include Storybook files - Fix ESLint issues with imports and number precision - Add Storybook ESLint plugin configuration 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com> * [feat] Improve Storybook configuration and setup - Add comprehensive PrimeVue theme setup with ComfyUI preset - Configure proper Vue app setup with Pinia stores, i18n, and services - Remove unused onboarding addon from Storybook dependencies - Improve Vite configuration with better chunking and alias resolution - Add proper CSS imports and styling for ComfyUI components 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com> * [docs] Add comprehensive Storybook documentation - Add README.md explaining Storybook usage, benefits, and comparison with other tools - Add CLAUDE.md with development guidelines for working with Storybook - Include best practices, troubleshooting tips, and integration notes - Address PR review feedback for better developer onboarding 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com> * [refactor] Remove ts-expect-error comment from Storybook preview 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com> * [bugfix] Fix TypeScript errors in Load3D components and GLTF test - Fix type mismatches in Load3DScene eventConfig by casting string values to proper enum types (MaterialMode, CameraType, UpDirection) - Fix Uint8Array vs ArrayBuffer type issues in GLTF test by using .buffer property - Remove unused @ts-expect-error comment in Rectangle.ts 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com> * [feat] Add Chromatic GitHub Action for Storybook visual testing - Add automated visual regression testing for Storybook components - Configure workflow to run on main branch and PRs - Auto-accept changes on main branch for baseline updates - Uses build-storybook script for optimized builds 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com> * [docs] Add Chromatic documentation to Storybook README - Document Chromatic visual testing integration - Add information about automated testing workflow - Include best practices for visual regression testing - Explain how to view and manage test results 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com> * chore(chromatic.yaml): restrict push branches to main only for better workflow management * [feat] Rebase branch onto main and update Storybook configuration - Rebase sno-storybook branch onto origin/main with latest changes - Update .storybook/main.ts with additional plugins and component configuration - Add icons and component resolvers for Storybook support - Update .gitignore with new entries - Regenerate package-lock.json after rebase conflicts 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com> * [bugfix] Fix TypeScript errors in SubgraphNode type checking Add proper type validation for subgraph node selection before calling SubgraphNode-specific methods. This prevents undefined values from being passed to functions expecting SubgraphNode parameters. 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com> * fix(vite.config.mts): correct path alias for src directory to ensure proper resolution in the project refactor(vite.config.mts): adjust templates proxy configuration for better readability and maintainability * [feat] Remove bun.lock as it's now ignored * [bugfix] Fix Storybook builder require() error by converting main.ts to main.mjs - Convert .storybook/main.ts to main.mjs to resolve ES module compatibility - Use dynamic imports instead of static imports to avoid require() errors - Add .storybook directory to tsconfig.json includes - Storybook build and dev server now work correctly 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com> * chore(storybook): replace main.mjs with main.ts for improved type safety and maintainability fix(storybook): remove unused import map plugins in Storybook configuration to prevent potential issues fix(storybook): update color palette store initialization to streamline code and improve readability * [feat] Optimize Chromatic workflow with automated PR status comments - Replace complex GitHub Script actions with edumserrano/find-create-or-update-comment@v3 - Add comprehensive PR comments showing Storybook build progress and results - Include build metrics: components, stories, visual changes, and errors - Add direct links to Chromatic builds and Storybook previews - Reduce workflow complexity by ~60 lines while maintaining functionality - Use native GitHub Actions expressions for cleaner maintainability 🤖 Generated with Claude Code Co-Authored-By: Claude <noreply@anthropic.com> * chore(chromatic.yaml): move permissions section inside the chromatic-deployment job for better organization and clarity * [fix] Resolve Vite CJS deprecation warning in Storybook config - Use dynamic import for mergeConfig to avoid CJS build warning - Replace static import with dynamic import in viteFinal function - Maintain type safety with separate type import - Fixes "The CJS build of Vite's Node API is deprecated" warning 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com> * fix(chromatic.yaml): change edit-mode from replace to append to preserve existing comments in pull request * [fix] Replace __dirname with process.cwd() in Storybook config __dirname is not available in all environments. Using process.cwd() provides better compatibility and resolves path issues in Storybook. 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com> * feature: storybook-setting (#5088) --------- Co-authored-by: Claude <noreply@anthropic.com> Co-authored-by: Jin Yi <jin12cc@gmail.com> |
||
|
|
727a3494e0 | Modal Component & Custom UI Components (#4908) | ||
|
|
7a1a2dd654 |
fix: Make bottom panel tab titles reactive to language changes (#5077)
* computed extraMenuItems * add i18n key option * underline fix * Update locales [skip ci] * restore title * Update locales [skip ci] * refactor: Extract tab title logic to helper method for better readability - Moved complex nested ternary logic from template to getTabDisplayTitle helper - Improves code readability and maintainability - Addresses review feedback about using computed/method for performance --------- Co-authored-by: github-actions <github-actions@github.com> |
||
|
|
29ae9b4483 |
[fix] Rename viewer control components to prevent unplug warnings (#5080)
Renamed Load3D viewer control components to use ViewerXxxControls naming convention to avoid conflicts with the unplug system's component name detection. This prevents false positive warnings when components are registered in the global scope. 🤖 Generated with [Claude Code](https://claude.ai/code) Co-authored-by: Claude <noreply@anthropic.com> |
||
|
|
5a35562d3d |
[refactor] Migrate minimap to domain-driven renderer architecture (#5069)
* move ref initialization to the component * remove redundant init * [refactor] Move minimap to domain-driven renderer structure - Create new src/renderer/extensions/minimap/ structure following domain-driven design - Add composables: useMinimapGraph, useMinimapViewport, useMinimapRenderer, useMinimapInteraction, useMinimapSettings - Add minimapCanvasRenderer with efficient batched rendering - Add comprehensive type definitions in types.ts - Remove old src/composables/useMinimap.ts composable - Implement proper separation of concerns with dedicated composables for each domain The new structure provides cleaner APIs, better performance through batched rendering, and improved maintainability through domain separation. * [test] Fix minimap tests for new renderer structure - Update all test imports to use new renderer paths - Fix mock implementations to match new composable APIs - Add proper RAF mocking for throttled functions - Fix type assertions to handle strict TypeScript checks - Update test expectations for new implementation behavior - Fix viewport transform calculations in tests - Handle async/throttled behavior correctly in tests All 28 minimap tests now passing with new architecture. * [fix] Remove unused init import in MiniMap component * [refactor] Move useWorkflowThumbnail to renderer/thumbnail structure - Moved useWorkflowThumbnail from src/composables to src/renderer/thumbnail/composables - Updated all imports in components, stores and services - Moved test file to match new structure - This ensures all rendering-related composables live in the renderer directory * [test] Fix minimap canvas renderer test for connections - Fixed mock setup for graph links to match LiteGraph's hybrid Map/Object structure - LiteGraph expects links to be accessible both as a Map and as an object - Test now properly verifies connection rendering functionality |
||
|
|
ceac8f3741 | Modal Standardization (#4784) | ||
|
|
4a189bdc93 |
Minor updates to subgraph breadcrumb item (#5060)
- change active item text to primary color - change rename action to behave the same as double clicking label |
||
|
|
d5d0aa52c2 |
[refactor] Refactor minimap initialization logic (#5052)
* move ref initialization to the component * remove redundant init |
||
|
|
88579c2a40 | Update menu items with a active toggle state to not close menu when clicked (#5050) | ||
|
|
ec4ad5ea92 | fix: issue #4121 (#5029) | ||
|
|
2ed1704749 |
Translated Keyboard Shortcuts (#5007)
* fix: Update command label rendering to use i18n normalization * fix: Replace deprecated with t for command label rendering * fix: Simplify command rendering check in ShortcutsList tests * fix: Add missing translation for command label in ShortcutsList tests |
||
|
|
4ca6220adf |
Refactor app menu items (#4665)
* Restructures the application menu - rename Workflow to File - move new & template items to top level - add View menu and related sub items Commands - add "active" state getter shown as checkmark in the menu Node side panel - add refresh node defs - change reset view icon Help center - change to use store for visibility Fixes - Fix bug with mouse down where if you drag mouse out, mouse up wasn't caught - Fix issue with canvas info setting not triggering a redraw on change * Fix missing translation warnings * Add separator under new * tidy * Update locales [skip ci] * fix some tests * fix * Hide icon if there is an active state within the menu item group * Update locales [skip ci] * Fix tests * Implement feedback - Remove queue, node lib, model lib, workflows, manager, help center - Add minimap, link visibility * Update locales [skip ci] * Add plus icon on "New" menu item * Update locales [skip ci] * Fix test * Fix translations * Update locales [skip ci] * Update locales [skip ci] --------- Co-authored-by: github-actions <github-actions@github.com> |
||
|
|
efc0431a5e |
Update side toolbar menu (#4946)
Side toolbar menu UI updates ## Summary - Currently the template modal is very hidden. Many users do not find it - The current icons are quite aleatory ## Changes **What**: - Add templates shortcut button - Add item label in normal size - Use custom icon Critical design decisions or edge cases that need attention: - Sidebar tabs registered using custom icons will have their associated command registed with an undefined icon (currently only string icons are accepted, not components). I couldn't see anywhere directly using this icon, but we should consider autogenerating an icon font so we can use classes for our custom icons (or locating and updating locations to support both icon types) ## Screenshots (if applicable) Normal mode: <img width="621" height="1034" alt="image" src="https://github.com/user-attachments/assets/c1d1cee2-004e-4ff8-b3fa-197329b0d2ae" /> Small mode: <img width="176" height="325" alt="image" src="https://github.com/user-attachments/assets/3824b8f6-bc96-4e62-aece-f0265113d2e3" /> ┆Issue is synchronized with this [Notion page](https://www.notion.so/PR-4946-Update-side-toolbar-menu-24d6d73d365081c5b2bdc0ee8b61dc50) by [Unito](https://www.unito.io) --------- Co-authored-by: github-actions <github-actions@github.com> |
||
|
|
db71365768 | Implement subgraph unpacking (#4840) | ||
|
|
c42c9315f4 | [refactor] Replace lodash with es-toolkit (#4935) | ||
|
|
d068b8351e | Feat: add duplicate workflow on sidebar (#4895) | ||
|
|
c7baf3c340 | [feat] Add knip for unused code detection (#4890) |