mirror of
https://github.com/Comfy-Org/ComfyUI_frontend.git
synced 2026-04-20 06:20:11 +00:00
The third PR for managing display of widgets on subgraph nodes. This is the one that actually makes the functionality usable and user visible. Adds - A right-side modal for configuring which widgets are promoted, accessed by right click or selection toolbar - This menu allows for re-arranging widget order by dragging and dropping. - Indicators inside the subgraph for which widgets have been promoted. - Context menu options for promoting or demoting widget inside of a subgraph. <img width="767" height="694" alt="image" src="https://github.com/user-attachments/assets/4f78645d-7b26-48ba-8c49-78f4807e89e8" /> <img width="784" height="435" alt="image" src="https://github.com/user-attachments/assets/7005c730-a732-481e-befb-57019a8a31a7" /> Known issues - Some preview widgets are not added to a node until a draw operation occurs. The code does not yet have a way of determining which nodes should have draw operations forced to facilitate initial widget creation. ┆Issue is synchronized with this [Notion page](https://www.notion.so/PR-5826-Add-UI-code-for-configuring-subgraphNode-widgets-27c6d73d36508146accbf395e5bcd36a) by [Unito](https://www.unito.io)
27 lines
659 B
TypeScript
27 lines
659 B
TypeScript
import SubgraphNode from '@/core/graph/subgraph/SubgraphNode.vue'
|
|
import { type DialogComponentProps, useDialogStore } from '@/stores/dialogStore'
|
|
|
|
const key = 'global-subgraph-node-config'
|
|
|
|
export function showSubgraphNodeDialog() {
|
|
const dialogStore = useDialogStore()
|
|
const dialogComponentProps: DialogComponentProps = {
|
|
modal: false,
|
|
position: 'topright',
|
|
pt: {
|
|
root: {
|
|
class: 'bg-pure-white dark-theme:bg-charcoal-800 mt-22'
|
|
},
|
|
header: {
|
|
class: 'h-8 text-xs ml-3'
|
|
}
|
|
}
|
|
}
|
|
dialogStore.showDialog({
|
|
title: 'Parameters',
|
|
key,
|
|
component: SubgraphNode,
|
|
dialogComponentProps
|
|
})
|
|
}
|