Comfy-Org/ComfyUI_frontend
1
0
Fork 0
mirror of https://github.com/Comfy-Org/ComfyUI_frontend.git synced 2026-03-12 08:30:08 +00:00
Code Issues Packages Projects Releases Wiki Activity
6,271 Commits 811 Branches 581 Tags
6a1da7a7afbda0f1be1d274d449e3fadbb7931cc
Commit Graph

151 Commits

Author SHA1 Message Date
Terry Jia
6a1da7a7af fix: image compare height mismatch between before and after images (#7931) 
## Summary

Add relative and size-full classes to the inner container div to ensure
both images share the same positioning context and size constraints.

fix https://github.com/Comfy-Org/ComfyUI_frontend/issues/7928

## Screenshots (if applicable)
before
<img width="666" height="369" alt="image"
src="https://github.com/user-attachments/assets/2118685c-412a-4689-aac4-c0e592e47678"
/>

after
<img width="500" height="505" alt="image"
src="https://github.com/user-attachments/assets/c773147a-a28a-4145-a26a-6f19dafad50f"
/>

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-7931-fix-image-compare-height-mismatch-between-before-and-after-images-2e36d73d365081b69b49dfdd63d242a9)
by [Unito](https://www.unito.io)
 2026-01-09 16:02:32 -05:00
Terry Jia
92f21c14d4 fix: remove negative margin from legacy widget canvas (#7925) 
## Summary

Removes mt-[-13px] from WidgetLegacy canvas to fix legacy widgets
overlapping with output slots in vueNodes mode.

## Screenshots
before
<img width="2560" height="939" alt="image"
src="https://github.com/user-attachments/assets/cbee2bee-b6b2-4d21-b1b6-78d1a8e09949"
/>

after
<img width="1213" height="920" alt="image"
src="https://github.com/user-attachments/assets/a3a26514-b425-4771-b234-06da65f525bc"
/>

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-7925-fix-remove-negative-margin-from-legacy-widget-canvas-2e36d73d36508113aea4f2301cccff3c)
by [Unito](https://www.unito.io)
 2026-01-08 23:22:40 -05:00
AustinMroz
99cb7a2da1 Fix linked asset widget promotion in vue (#7895) 
Asset widgets resolve the list of models by checking the name of the
node the widget is contained on. When an asset widget is linked to a
subgraph node, a clone is made of the widget and then the clone is used
to initialize an asset widget in vue mode. Since the widget no longer
holds any form of reference to the original node, asset data fails to
resolve.

This is fixed by storing the original nodeType as an option on the
cloned widget when an asset widget is linked to a subgraph input.

| Before | After |
| ------ | ----- |
| <img width="360" alt="before"
src="https://github.com/user-attachments/assets/345f9cc1-da04-44ab-8fed-76379c8528de"/>
| <img width="360" alt="after"
src="https://github.com/user-attachments/assets/88d1ddaa-56fb-41b3-8d5d-0ded02aaa7d2"
/>|

See also #7563, #7560

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-7895-Fix-linked-asset-widget-promotion-in-vue-2e26d73d365081e5b295f6236458b978)
by [Unito](https://www.unito.io)
 2026-01-08 09:12:02 -08:00
Terry Jia
b3d87673ec feat: display label_on/label_off for boolean widgets in vueNodes mode (#7894) 
## Summary

Add support for displaying custom on/off labels for boolean toggle
widgets, matching the behavior in litegraph mode.

## Screenshots
before - litegraph
<img width="1232" height="600" alt="image"
src="https://github.com/user-attachments/assets/aae91acd-4b6b-4a89-aded-c5445e352006"
/>
before - vueNodes
<img width="869" height="584" alt="image"
src="https://github.com/user-attachments/assets/a69dc71e-45f7-4941-911f-f037a2b1c5c2"
/>

after - vueNodes
<img width="1156" height="608" alt="image"
src="https://github.com/user-attachments/assets/818164a6-826b-4545-bc20-e01625f11d7d"
/>

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-7894-feat-display-label_on-label_off-for-boolean-widgets-in-vueNodes-mode-2e26d73d365081a3b938c87dd4cf23aa)
by [Unito](https://www.unito.io)
 2026-01-07 23:04:47 -05:00
Terry Jia
2356b0bc9e fix: prevent image preview resize issues when switching to vueNodes mode (#7868) 
## Summary
- Fix duplicate rendering issue for image preview nodes when switching
from litegraph to vueNodes mode by setting canvasOnly: true on
ImagePreviewWidget

## Problem

When switching from litegraph to vueNodes mode, image preview nodes
(LoadImage, PreviewImage) had two issues:

1. Node becoming longer: The ImagePreviewWidget was being rendered twice
- once as a WidgetLegacy canvas (with stale computedHeight from
litegraph mode) and once as Vue's ImagePreview component

## Solution

1. Set canvasOnly: true for ImagePreviewWidget so it won't render as
WidgetLegacy in Vue mode (Vue's ImagePreview.vue already handles image
display)


## Screenshots (if applicable)
before


https://github.com/user-attachments/assets/925c4fb4-bc9a-4da5-b8ae-3557c2d3836b


after


https://github.com/user-attachments/assets/5faa6878-c56d-44dd-86f5-728bff9ad58a

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-7868-fix-prevent-image-preview-resize-issues-when-switching-to-vueNodes-mode-2e16d73d36508106a058da2f8d17c410)
by [Unito](https://www.unito.io)
 2026-01-06 19:15:20 -07:00
Alexander Brown
10feb1fd5b chore: migrate tests from tests-ui/ to colocate with source files (#7811) 
## Summary

Migrates all unit tests from `tests-ui/` to colocate with their source
files in `src/`, improving discoverability and maintainability.

## Changes

- **What**: Relocated all unit tests to be adjacent to the code they
test, following the `<source>.test.ts` naming convention
- **Config**: Updated `vitest.config.ts` to remove `tests-ui` include
pattern and `@tests-ui` alias
- **Docs**: Moved testing documentation to `docs/testing/` with updated
paths and patterns

## Review Focus

- Migration patterns documented in
`temp/plans/migrate-tests-ui-to-src.md`
- Tests use `@/` path aliases instead of relative imports
- Shared fixtures placed in `__fixtures__/` directories

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-7811-chore-migrate-tests-from-tests-ui-to-colocate-with-source-files-2da6d73d36508147a4cce85365dee614)
by [Unito](https://www.unito.io)

---------

Co-authored-by: Amp <amp@ampcode.com>
Co-authored-by: GitHub Action <action@github.com>
 2026-01-05 16:32:24 -08:00
Terry Jia
4c955f6725 fix: Improve legacy widget compatibility in vueNodes mode (#7766) 
## Summary
- Fix widget callback signature to pass node as 3rd parameter for
extensions like Impact Pack
- Add triggerDraw call to update all legacy widgets when any widget
value changes
- Support computeLayoutSize for dynamic widget height calculation
- Set node.canvasHeight for extensions that rely on this property
- Use step/10 for number input buttons to match litegraph behavior

Fixes display and interaction issues with Impact Pack's Mask Rect Area
nodes.

fix https://github.com/Comfy-Org/ComfyUI_frontend/issues/7615 and
https://github.com/Comfy-Org/ComfyUI_frontend/issues/7616

it also requires Impact pack PR
https://github.com/ltdrdata/ComfyUI-Impact-Pack/pull/1167

## Screenshots
Before


https://github.com/user-attachments/assets/eb890f7c-c1a0-4c7b-a8d7-dde304de83e4


After


https://github.com/user-attachments/assets/dad65b52-d71e-4c19-92c0-367b7dcafed0

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-7766-fix-Improve-legacy-widget-compatibility-in-vueNodes-mode-2d56d73d365081b18d83f4a41ff0f377)
by [Unito](https://www.unito.io)
 2026-01-01 21:35:08 -05:00
Terry Jia
f5e51d0339 fix: PrimitiveNode combo widget value not persisting in vueNodes mode (#7782) 
## Summary
- Add missing v-model binding to WidgetWithControl in WidgetSelect.vue
- Trigger callback after setting widget value in PrimitiveNode to update
linked widgets

The combo widget value was lost because PrimitiveNode creates combo
widgets with controlWidget (via addValueControlWidgets), causing it to
use the WidgetWithControl branch which was missing v-model binding.

fix https://github.com/Comfy-Org/ComfyUI_frontend/issues/7694 and
https://github.com/Comfy-Org/ComfyUI_frontend/issues/7696

## Screenshots
before

https://github.com/user-attachments/assets/0a0dc668-eb71-4072-b5f7-0c20483fc1ff

after

https://github.com/user-attachments/assets/dfd2274c-8ebf-4105-821a-946063d87e9a
 2025-12-30 14:12:29 -05:00
Alexander Brown
7b68b19f11 Component: The Rest of the PrimeVue buttons (#7649) 
## Summary

Automated initial change, cleaned up manually.

Please check the screenshot changes.

Includes a11y updates to icon buttons.

Doesn't hit the buttons in Desktop.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-7649-WIP-Component-The-Rest-of-the-PrimeVue-buttons-2ce6d73d365081d68e06f200f1321267)
by [Unito](https://www.unito.io)

---------

Co-authored-by: GitHub Action <action@github.com>
Co-authored-by: github-actions <github-actions@github.com>
Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com>
 2025-12-29 15:03:34 -08:00
Terry Jia
59af15961f feat: add ImageCompare node (#7538) 
## Summary

add ImageCompare node, which is high demand among custom nodes, such as
rgthree, we should support as core node

Need BE change https://github.com/comfyanonymous/ComfyUI/pull/11343

## Screenshots (if applicable)



https://github.com/user-attachments/assets/a37bdcd0-de59-4bdd-bfc7-1adbe92f5298

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-7538-feat-add-ImageCompare-node-2cb6d73d36508163a7d5f4807aece01a)
by [Unito](https://www.unito.io)
 2025-12-26 13:27:44 -07:00
AustinMroz
0977e6e751 Fix buttons displayed behind images in litegraph (#7627) 
#7394 caused a regression with preview image buttons showing behind the
image in litegraph. This is fixed by also deferring button draws

| Before | After |
| ------ | ----- |
| <img width="360" alt="before"
src="https://github.com/user-attachments/assets/4c3b02e0-4951-403d-98b8-b01a01512d21"/>
| <img width="360" alt="after"
src="https://github.com/user-attachments/assets/7a4fb8e4-8caa-47f3-939d-8d8ddc0e71b4"
/>|

---------

Co-authored-by: github-actions <github-actions@github.com>
 2025-12-20 14:14:58 -07:00
Alexander Brown
2c26fbb550 Component: Button Migration 3: IconTextButton (#7603) 
## Summary

Replace all the `IconTextButton`s with `Button`

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-7603-WIP-Component-Button-Migraion-3-IconTextButton-2cd6d73d365081b7b742fa2172dc2ba8)
by [Unito](https://www.unito.io)
 2025-12-18 16:09:56 -08:00
AustinMroz
6396eb6fa3 Fix promoted assets not being assets in vue (#7576) 
- Fixes asset widgets which have been promoted failing to display as
asset widgets and having red names in vue mode.
- Fixes promoted subgraph widgets failing to resolve inputSpec for use
in vue mode.

| Before | After |
| ------ | ----- |
| <img width="360" alt="before"
src="https://github.com/user-attachments/assets/6c2d2763-6ac3-4769-82c5-b1ab1cc5e945"/>
| <img width="360" alt="after"
src="https://github.com/user-attachments/assets/742e218b-ec42-411a-b5a2-021820031e2a"
/>|

I'm not excited that this creates further bloat of SimplifiedWidget.

Known issue
- Similar to #7550, subgraph widgets will have an incorrect callback and
will fail to update value on a fresh reload. This can be "fixed" (made
worse) by entering and exiting the subgraph. Since this creates a
'leaked' widget callback which will then be called.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-7576-Fix-promoted-assets-not-being-assets-in-vue-2cc6d73d3650814b8734f69b225b0228)
by [Unito](https://www.unito.io)
 2025-12-17 19:48:32 -07:00
Rizumu Ayaka
3e111bd75c fix: expand assets dropdown body to show entire "no results placeholder" (#7586) 
Currently, when the assets dropdown has no assets available, the "No
Results Placeholder" text is not fully visible because the dropdown body
doesn't expand to accommodate the full message.

Make the body of the assets dropdown expand to show the entire "No
Results Placeholder" message when there are no assets present.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-7586-fix-expand-assets-dropdown-body-to-show-entire-no-results-placeholder-2cc6d73d365081f4a142e927621f936d)
by [Unito](https://www.unito.io)
 2025-12-17 13:53:43 -07:00
AustinMroz
ab76d02823 Fix doubled control application (#7550) 
With reactivity fixed, control widgets would apply twice. This is fixed
by using the litegraph implementation.

Also adds control widget support for combos

Followup to #7539.

Known Issue:
- Primitive node do not have litegraph callbacks properly setup. As a
result, they will display an updated value when modified by control
widgets. Fixing this will requires a larger, separate PR

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-7550-Fix-doubled-control-application-2cb6d73d365081739a2fc40fdfb3630e)
by [Unito](https://www.unito.io)
 2025-12-16 18:42:02 -08:00
Alexander Brown
d448421263 Fix: Restore assets API short-circuit in WidgetSelectDropdown (#7563) 
## Summary

Removed in #6985, but breaks the dropdown loading on Cloud.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-7563-Fix-Restore-assets-API-short-circuit-in-WidgetSelectDropdown-2cb6d73d365081778a8dc65418d9f6be)
by [Unito](https://www.unito.io)
 2025-12-16 19:34:55 +00:00
Christian Byrne
6391bd89bf feat: auto-focus the searchbox in asset dropdowns (#7554) 
## Summary

On the assets dropdown in Vue Nodes loader nodes (e.g., Load Checkpoint,
Load Video, Load Image), focus the search box first.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-7554-feat-auto-focus-the-searchbox-in-asset-dropdowns-2cb6d73d3650812bbe3eef406864e034)
by [Unito](https://www.unito.io)
 2025-12-16 13:39:42 -05:00
AustinMroz
5d745c952a Feat: Fixed option for control after/before generate (#7517) 
Followup to #7510.
- Makes `Fixed` a full option with description and swaps to radio
buttons
- Sorts the options to be the same order as litegraph
- Removes the "Edit control settings" button

| Before | After |
| ------ | ----- |
| <img width="360" alt="before"
src="https://github.com/user-attachments/assets/e0e4acda-ba02-4a25-aeca-dd7f1adea0fb"
/>| <img width="360" alt="after"
src="https://github.com/user-attachments/assets/5c4c0fbf-a949-4ce1-83e9-5acdeac3b81a"
/>|

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-7517-Austin-vue-fixed-2ca6d73d3650817ca845fb948bee73ac)
by [Unito](https://www.unito.io)
 2025-12-15 16:31:31 -08:00
AustinMroz
42a292932e Support fixed seed in vue (#7510) 
A small change pulled out of #7095 to make disabling the current control
option swap to 'fixed' instead of doing nothing.

Resolves #7468

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-7510-Support-fixed-seed-in-vue-2ca6d73d365081b0a723ebc97b921305)
by [Unito](https://www.unito.io)
 2025-12-15 14:15:12 -05:00
AustinMroz
b22ba97a13 Support "control after generate" in vue (#6985) 
Continuation of #6034 with
- Updated synchronization for seed
- Properly truncates the displayed widget value for the button
- Synchronizes control after generate state with litegraph and allows
for serialization

Several issues from original PR have not (yet) been addressed, but are
likely better moved to future PR
- fix step value being 10 (legacy system)
- ensure it works with COMBO (Fixed in #7095)
- ensure it works with FLOAT (Fixed in #7095)
- either implement or remove the config button functionality - think it
should open settings?

<img width="280" height="694" alt="image"
src="https://github.com/user-attachments/assets/f36f1cb0-237d-4bfc-bff1-e4976775cf98"
/>

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-6985-Support-control-after-generate-in-vue-2b86d73d365081d8b01ce489d887ff00)
by [Unito](https://www.unito.io)

---------

Co-authored-by: bymyself <cbyrne@comfy.org>
Co-authored-by: github-actions <github-actions@github.com>
 2025-12-13 05:23:56 -07:00
AustinMroz
f2a0e5102e Cleanup app.graph usage (#7399) 
Prior to the release of subgraphs, there was a single graph accessed
through `app.graph`. Now that there's multiple graphs, there's a lot of
code that needs to be reviewed and potentially updated depending on if
it cares about nearby nodes, all nodes, or something else requiring
specific attention.

This was done by simply changing the type of `app.graph` to unknown so
the typechecker will complain about every place it's currently used.
References were then updated to `app.rootGraph` if the previous usage
was correct, or actually rewritten.

By not getting rid of `app.graph`, this change already ensures that
there's no loss of functionality for custom nodes, but the prior typing
of `app.graph` can always be restored if future dissuasion of
`app.graph` usage creates issues.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-7399-Cleanup-app-graph-usage-2c76d73d365081178743dfdcf07f44d0)
by [Unito](https://www.unito.io)
 2025-12-11 23:37:34 -07:00
Alexander Brown
18b133d22f Style: Larger Node Text, More Sidebar Alignment (#7223) 
## Summary

See what it looks like. How it feels. What do you think?

- Also was able to unify down to a single SearchBox component.

## Changes

- Bigger widget / slot labels
- Smaller header text
- Unified Searchboxes across sidebar tabs

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-7223-Style-prototype-with-larger-node-text-2c36d73d365081f8a371c86f178fa1ff)
by [Unito](https://www.unito.io)

---------

Co-authored-by: github-actions <github-actions@github.com>
 2025-12-11 19:47:28 -08:00
Terry Jia
91adcaf276 fix: work around Chrome GPU bug causing severe lag when dragging links (#7394) 
## Summary

When Chrome is maximized with GPU acceleration and high DPR, calling
drawImage(canvas) + drawImage(img) in the same frame causes severe
performance degradation (FPS drops to 2-10, memory spikes ~18GB).

Defer image preview rendering using queueMicrotask to separate the two
drawImage calls into different tasks.

### Problem
Severe performance degradation in ComfyUI when dragging connection lines
in litegraph mode:
- FPS drops from 60 to 2-10
- Memory spikes from 36GB to 54GB (~18GB increase)
- CPU jumps from 2% to 15%
- Other Chrome tabs (e.g., YouTube) also stutter

### Environment
- Affected: Chrome with GPU acceleration, maximized/fullscreen window,
high DPR (1.75)
- Not affected: Firefox (WebRender), Chrome in windowed mode, Chrome
with GPU acceleration disabled

### Problem only occurs with:
- GPU acceleration enabled
- Chrome maximized/fullscreen
- An image loaded on canvas (e.g., LoadImage node with preview)

### Root cause: The bug is triggered when two drawImage() calls execute
in the same frame on the same canvas:
- ctx.drawImage(bgcanvas, ...) - copying background canvas to foreground
- ctx.drawImage(img, ...) - rendering image preview in node widget

## Screenshots (if applicable)
Before

https://github.com/user-attachments/assets/76005c10-3430-4d75-a7ed-58f61d18688c

After

https://github.com/user-attachments/assets/5a15b0f9-3935-4428-879b-e55390abff22

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-7394-fix-work-around-Chrome-GPU-bug-causing-severe-lag-when-dragging-links-2c66d73d365081469d73d98bf1aa421a)
by [Unito](https://www.unito.io)
 2025-12-11 20:38:00 -05:00
AustinMroz
6156e22bac Implement widget borders in vue (#7322) 
Adds support for displaying the "promoted" and "advanced" border
indicators when in vue mode.

Requires some (hopefully minor and generally beneficial) styling changes
to make sure that the widgets are contained within their border.

Note that the 'advanced' functionality sees minimal use and is likely to
be revamped in the future.

<img width="372" height="417" alt="image"
src="https://github.com/user-attachments/assets/8ea1e66b-2a4e-4a16-996f-289a26e39708"
/>

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-7322-Implement-widget-borders-in-vue-2c56d73d36508187b881f97e373d433b)
by [Unito](https://www.unito.io)

---------

Co-authored-by: github-actions <github-actions@github.com>
 2025-12-10 17:23:59 -08:00
Alexander Brown
72b5444d5a Devex: Linter updates (#7309) 
## Summary

Updates for the linter/formatter deps, turning on some more rules.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-7309-WIP-Linter-updates-2c56d73d36508101b3ece6bcaf7e5212)
by [Unito](https://www.unito.io)

---------

Co-authored-by: GitHub Action <action@github.com>
Co-authored-by: Christian Byrne <cbyrne@comfy.org>
 2025-12-10 11:08:47 -08:00
Alexander Brown
5139e0564e Style: Font Consistency (#7220) 
## Summary

Reduce lower level font definitions in most places. Default to Inter.

See #6912 

## Review Focus

Comic Sans is still an option...

## Screenshots (if applicable)

<!-- Add screenshots or video recording to help explain your changes -->

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-7220-Style-Font-Consistency-2c26d73d365081348f2dd8909dd9bb8f)
by [Unito](https://www.unito.io)

---------

Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com>
Co-authored-by: github-actions <github-actions@github.com>
 2025-12-08 19:48:11 -07:00
Johnpaul Chiwetelu
7b11510f9f fix: autofocus filter input in Select dropdowns to prevent shortcut triggers (#7253) 
## Summary
- Adds `auto-filter-focus` prop to Select component when filtering is
enabled
- When the dropdown opens, the filter input is automatically focused
- This prevents keystrokes from triggering global shortcuts while the
user is trying to filter options

## Root Cause
When a user opens a Select dropdown with a filter and starts typing
without explicitly clicking the search box, the filter input doesn't
have focus. Keystrokes are then captured by global shortcut handlers
(e.g., pressing "R" triggers "refresh nodes") instead of filtering the
options.

## Solution
PrimeVue's Select component has an `auto-filter-focus` prop that
automatically focuses the filter input when the dropdown opens. By
enabling this whenever filtering is enabled (`selectOptions.length >
4`), users can immediately start typing to filter without needing to
click the search box first.

## Test plan
- [ ] Open a Select dropdown with more than 4 options (e.g., Load
Checkpoint's ckpt_name)
- [ ] Verify the filter input is automatically focused when the dropdown
opens
- [ ] Type a character and verify it filters the list instead of
triggering shortcuts
- [ ] Verify no console errors when opening/closing the dropdown

Fixes #7221

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-7253-fix-autofocus-filter-input-in-Select-dropdowns-to-prevent-shortcut-triggers-2c46d73d365081feacd1f3301aa3b413)
by [Unito](https://www.unito.io)
 2025-12-09 02:21:23 +01:00
Alexander Brown
bca7a435ed fix: Button color and default ordering (#7199) 
## Summary

Small fixes for the button and Modal sorting.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-7199-fix-Button-color-and-default-ordering-2c16d73d3650812a8a08f8e8fcd7fd55)
by [Unito](https://www.unito.io)
 2025-12-06 13:24:58 -08:00
Alexander Brown
f74c176423 Cleanup: Properties Panel (#7137) 
## Summary

- Code cleanup
- Copy, padding, color, alignment of components
- Subgraph Edit mode changes
- Partial fix for the Node Info location (need to do context menu still)
- Editing node title

### Still to-do

- Bi-directionality in values

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-7137-WIP-Cleanup-Properties-Panel-2be6d73d3650813e9430f6bcb09dfb4d)
by [Unito](https://www.unito.io)

---------

Co-authored-by: github-actions <github-actions@github.com>
 2025-12-05 21:33:52 -08:00
Alexander Brown
57523a0c57 Design: Model management (#7190) 
## Summary

Assorted updates to the components involved in uploading personal
models.

## Changes

- Standardize Import buttons
- Let the images fill the space on the card
- Order by recent by default
- Nicer display on the model select popover

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-7190-Design-Model-management-2c06d73d365081e7b9fed7a83b730c0f)
by [Unito](https://www.unito.io)
 2025-12-05 15:53:28 -07:00
Kelly Yang
dbda8b47e8 Fix Load Audio nodes (#7175) 
### Fix: Fail to load audio node

## Summary
When using Modern Node Design (Nodes 2.0), the Load Audio node is able
to work as expected.
https://github.com/Comfy-Org/ComfyUI_frontend/issues/7155

## Changes

Aligned `Load Audio` node appearance with the `Load Image`
(/src/renderer/extensions/vueNodes/components/NodeWidgets.vue) node for
consistency.

## Screenshots 

<img width="674" height="464" alt="zzzzw"
src="https://github.com/user-attachments/assets/a7bf6a81-00e3-41a8-962b-560e7acb5c41"
/>

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-7175-Fix-issue-No-7155-Nodes-2-0-Load-Audio-node-is-broken-2c06d73d365081ae9ab3c2ea20f061a4)
by [Unito](https://www.unito.io)
 2025-12-05 04:09:02 +01:00
Alexander Brown
fe2676e8cd A11y: Focus ring for widgets (#7167) 
## Summary

Addresses #7165

Add focus state to widget inputs (including textarea)


## Screenshot
<img width="912" height="688" alt="image"
src="https://github.com/user-attachments/assets/329b1747-1c16-499c-9a17-58332d731c35"
/>


<!-- Add screenshots or video recording to help explain your changes -->

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-7167-A11y-Focus-ring-for-widgets-2bf6d73d365081b9805ef5921c1d9b6e)
by [Unito](https://www.unito.io)

---------

Co-authored-by: github-actions <github-actions@github.com>
 2025-12-05 00:11:34 +00:00
Rizumu Ayaka
39d305df86 test: fix test for form select button (#7128) 
┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-7128-test-fix-test-for-form-select-button-2be6d73d365081f3a889d51d2c4b3358)
by [Unito](https://www.unito.io)
 2025-12-03 00:32:41 -07:00
Rizumu Ayaka
68274134c8 feat: right side panel (#6952) 
<img width="1183" height="809" alt="CleanShot 2025-11-26 at 16 01 15"
src="https://github.com/user-attachments/assets/c14dc5c3-a672-4dcd-917d-14f16310188e"
/>

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-6952-feat-right-side-panel-2b76d73d36508112b121c283a479f42a)
by [Unito](https://www.unito.io)

---------

Co-authored-by: github-actions <github-actions@github.com>
 2025-12-02 22:55:24 -07:00
Alexander Brown
2bf45f23dc Feat: add floating label to textarea (#7121) 
## Summary

Adds the label/name of the widget as a floating label.

## Screenshots

<img width="543" height="469" alt="image"
src="https://github.com/user-attachments/assets/99d70e0b-f7b7-4b62-bf15-a2db8437c886"
/>


<!-- Add screenshots or video recording to help explain your changes -->

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-7121-Feat-add-floating-label-to-textarea-2be6d73d3650819c958efa893e0e304a)
by [Unito](https://www.unito.io)

---------

Co-authored-by: github-actions <github-actions@github.com>
 2025-12-02 19:34:41 -08:00
Alexander Brown
497bafcaeb Fix: Widget sizing with multiple expanding items (#7118) 
## Summary

Textarea/Markdown/3D pieces grow, other widget rows size to their
contents.

## Screenshots (if applicable)
<img width="564" height="420" alt="image"
src="https://github.com/user-attachments/assets/35aeb9bf-a44d-4e3f-b2cd-a9f3604a7778"
/>

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-7118-Fix-Widget-sizing-with-multiple-expanding-items-2be6d73d3650816c8153ff3f1e49176d)
by [Unito](https://www.unito.io)

---------

Co-authored-by: Simula_r <18093452+simula-r@users.noreply.github.com>
Co-authored-by: github-actions <github-actions@github.com>
 2025-12-02 18:49:45 -08:00
Alexander Brown
a5f1eb0b92 Feat: Add model import button to Vue model list popover. (#7085) 
## Summary

Adds a button to trigger the model upload on the Asset dropdown.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-7085-Feat-Add-model-import-button-to-Vue-model-list-popover-2bd6d73d365081958c8ef23de55a341e)
by [Unito](https://www.unito.io)
 2025-12-01 19:19:23 -08:00
AustinMroz
202dc3bbb2 Support on slot click listeners in vue (#7059) 
Adds support for the `node.onInputDblClick` and `node.onInputClick`
callbacks in vue
- Fixes vue link drop code so that a link which is not dropped on the
canvas does not fallback to the dropped on canvas code.

![input-double-click_00001](https://github.com/user-attachments/assets/8b138a6e-e569-4a5d-b59a-cd688ff062e6)

Resolves #7037

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-7059-Support-on-slot-click-listeners-in-vue-2bb6d73d3650812993fdef244e91683b)
by [Unito](https://www.unito.io)
 2025-12-01 14:34:43 -08:00
Christian Byrne
3ee921119d fix: loader node widget value shows placeholder instead of filename on cloud (#7005) 
Fixes issue on cloud where the Loader node dropdowns showed placeholder
values (after refresh) in the widget UI despite a value being loaded.

Cloud loader dropdowns hydrate via `useAssetWidgetData(nodeType)`, so
`dropdownItems` stays empty until the Asset API returns friendly
filenames. Meanwhile `modelValue` already holds the saved asset and the
watcher only tracks `modelValue`:
df653d6ce1/src/renderer/extensions/vueNodes/widgets/components/WidgetSelectDropdown.vue (L215-L226)

This watcher runs before assets load, fails to find a match, clears
`selectedSet`, and the placeholder persists:


df653d6ce1/src/renderer/extensions/vueNodes/widgets/components/WidgetSelectDropdown.vue (L222-L224)

Once the assets API resolves, `dropdownItems` recomputes but nothing
resyncs because the watcher never sees that change. Desktop doesn’t hit
this because it still reads from `widget.options.values` immediately.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-7005-fix-loader-node-widget-value-shows-placeholder-instead-of-filename-on-cloud-2b86d73d36508125a16de5c9e366b014)
by [Unito](https://www.unito.io)
 2025-11-29 18:13:32 -07:00
Johnpaul Chiwetelu
b9cb335255 [fix] Add fraction digits props to number input widget (#7033) 
Add min-fraction-digits and max-fraction-digits props to InputNumber
component to allow typing decimal values. Without these props, users
could not manually type values like "0.8" even though the increment
buttons worked correctly.

This aligns the input-only variant with the slider variant which
already had these props configured.

fix https://github.com/Comfy-Org/ComfyUI_frontend/issues/7016
## Screenshots (if applicable)



https://github.com/user-attachments/assets/fa205023-13c4-45ac-874b-b241808cf56d



┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-7033-fix-Add-fraction-digits-props-to-number-input-widget-2b96d73d36508124ac65e466802bbb0c)
by [Unito](https://www.unito.io)

---------

Co-authored-by: github-actions <github-actions@github.com>
 2025-11-29 15:10:04 -07:00
Johnpaul Chiwetelu
3acf9aae0a fix: add filter for combo widgets (#6999) 
This pull request introduces a minor enhancement to the
`WidgetSelectDefault.vue` component. The change conditionally enables
the filtering feature in the select dropdown when there are more than
four options, improving usability for larger lists.


<img width="932" height="622" alt="Screenshot 2025-11-27 160239"
src="https://github.com/user-attachments/assets/76f6080f-13c7-4fa9-a813-2799af15363e"
/>

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-6999-fix-add-filter-for-combo-widgets-2b86d73d365081f994e5caf78e64a196)
by [Unito](https://www.unito.io)
 2025-11-27 13:06:22 -07:00
Simula_r
4b87b1fdc5 fix: remove LOD from vue nodes (#6950) 
## Summary

Refactor to remove LOD from vue nodes. Also, hide Litegraph LOD settings
in vue nodes to prevent confusion / stale setting. Keep litegraph LOD
the exact same.

## Changes

- **What**: settings, all LOD related code in vue nodes

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-6950-fix-remove-LOD-from-vue-nodes-2b76d73d365081568723f8cbc7be7e17)
by [Unito](https://www.unito.io)

---------

Co-authored-by: github-actions <github-actions@github.com>
 2025-11-26 12:26:05 -07:00
Alexander Brown
8b5cfe7e55 Lint: Adding more checks for non internationalized strings (#5625) 
## Summary

Catch more user visible (or audible) text that isn't
internationalizable.

## Changes

- **What**: Linter now checks other attributes for raw text.

## Review Focus

What other properties have leaked English text to non-English locales
that aren't in here?
 2025-11-24 21:55:47 -08:00
Alexander Brown
d58a464c9c Style: Widget spacing and Markdown padding (#6902) 
## Summary

Less padding, looks nice.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-6902-Style-Widget-spacing-and-Markdown-padding-2b66d73d365081cca409dbabc7b883bb)
by [Unito](https://www.unito.io)

---------

Co-authored-by: github-actions <github-actions@github.com>
 2025-11-24 18:31:21 -08:00
Johnpaul Chiwetelu
a21c813d11 Style button widgets (#6900) 
This pull request introduces improvements to widget customization and UI
consistency in the application. The most notable changes are the
addition of support for icon classes in widget options, updates to
button rendering logic, and enhanced visual consistency for button
components.

Widget customization enhancements:
* Added an optional `iconClass` property to the `IWidgetOptions`
interface in `widgets.ts`, allowing widgets to specify custom icons.

UI and rendering updates:
* Updated `WidgetButton.vue` to render the widget label and, if
provided, an icon using the new `iconClass` option. Also standardized
button styling and label usage.
* Improved button styling in `WidgetRecordAudio.vue` for better visual
consistency with other components.
<img width="662" height="534" alt="Screenshot 2025-11-25 at 01 36 45"
src="https://github.com/user-attachments/assets/43bbe226-07fd-48be-9b98-78b08a726b1b"
/>


┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-6900-Style-button-widgets-2b66d73d3650818ebeadd9315a47ba0f)
by [Unito](https://www.unito.io)
 2025-11-25 01:12:30 +00:00
Alexander Brown
c06a7279e2 Style: Grid for widgets (#6891) 
## Summary

Keeps the controls and widgets a consistent width, but lets the size be
more flexible

## Screenshots

<!-- Add screenshots or video recording to help explain your changes -->

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-6891-Style-Grid-for-widgets-2b56d73d365081a29c30d337f3be1af6)
by [Unito](https://www.unito.io)

---------

Co-authored-by: github-actions <github-actions@github.com>
 2025-11-24 11:46:24 -08:00
Alexander Brown
6d41e8b6e4 Feat: Load Image (from Outputs) support in Vue Nodes (#6836) 
## Summary

Expose the Auto-refresh and manual refresh controls.
Fixes an issue with the Dropdown where it was index dependent so wasn't
updating correctly as new items came in.

## Screenshots

<!-- Add screenshots or video recording to help explain your changes -->

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-6836-Feat-Load-Image-from-Outputs-support-in-Vue-Nodes-2b46d73d365081f1b44fcf2054d653da)
by [Unito](https://www.unito.io)
 2025-11-22 23:59:00 -08:00
Alexander Brown
c1e237255a Fix: TextArea context menu (#6834) 
## Summary

Allow the default browser context menu within textareas on Vue Nodes.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-6834-Fix-TextArea-context-menu-2b36d73d3650814e9706e76163dda59a)
by [Unito](https://www.unito.io)
 2025-11-22 15:18:04 -08:00
Alexander Brown
a8d6f7baff Feat: Show Progress Text on Vue Nodes, Markdown for Preview as Text (#6805) 
## Summary

Maps the progressText / text preview to a readonly Markdown widget.

## Review Focus

Anything else to tweak about this while I'm in here?

## Screenshots
<img width="1107" height="593" alt="image"
src="https://github.com/user-attachments/assets/a445c07a-2fcb-480c-976e-bda6ff343f14"
/>

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-6805-Feat-Show-Progress-Text-on-Vue-Nodes-2b26d73d3650814d93c4f2fbf0e00095)
by [Unito](https://www.unito.io)
 2025-11-21 13:54:53 -08:00
Alexander Brown
e563c1be75 hotfix: Stop clicks on the textarea from propagating to the node itself (#6788) 
## Summary

Selecting text shouldn't drag the node.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-6788-hotfix-Stop-clicks-on-the-textarea-from-propagating-to-the-node-itself-2b16d73d3650819c8d0dc427d5758580)
by [Unito](https://www.unito.io)
 2025-11-20 21:05:24 -07:00