mirror of
https://github.com/Comfy-Org/ComfyUI_frontend.git
synced 2026-05-11 00:10:40 +00:00
make Vue nodes' outputs/previews responsively sized and work with node resizing (#5970)
## Summary Added dedicated component for sampling previews and change all image outputs (outputs, videos, previews) to be responsive and respond to node resizing. https://github.com/user-attachments/assets/7e683d32-4914-460c-ba08-4573c40aef24 ## Changes - **What**: Implemented `LivePreview` component for mid-execution sampling visualization with responsive layout system - **Dependencies**: Added resize handle composable and transform state integration ## Review Focus Node resize interaction conflicts with canvas dragging, and image dimension calculation performance during rapid sampling updates. ┆Issue is synchronized with this [Notion page](https://www.notion.so/PR-5970-make-Vue-nodes-outputs-previews-responsively-sized-and-work-with-node-resizing-2866d73d365081508d53e6e286a9a3fe) by [Unito](https://www.unito.io) --------- Co-authored-by: DrJKL <DrJKL@users.noreply.github.com> Co-authored-by: GitHub Action <action@github.com> Co-authored-by: github-actions <github-actions@github.com>
This commit is contained in:
@@ -2,7 +2,7 @@
|
||||
<div v-if="renderError" class="node-error p-2 text-sm text-red-500">
|
||||
{{ $t('Node Content Error') }}
|
||||
</div>
|
||||
<div v-else class="lg-node-content">
|
||||
<div v-else class="lg-node-content flex h-full flex-col">
|
||||
<!-- Default slot for custom content -->
|
||||
<slot>
|
||||
<VideoPreview
|
||||
|
||||
Reference in New Issue
Block a user