diff --git a/src/renderer/extensions/vueNodes/components/NodeWidgets.vue b/src/renderer/extensions/vueNodes/components/NodeWidgets.vue index 41ad4e93e8..8b8b616568 100644 --- a/src/renderer/extensions/vueNodes/components/NodeWidgets.vue +++ b/src/renderer/extensions/vueNodes/components/NodeWidgets.vue @@ -6,7 +6,7 @@ v-else :class=" cn( - 'lg-node-widgets grid grid-cols-[min-content_minmax(80px,max-content)_minmax(125px,auto)] gap-y-1 pr-3', + 'lg-node-widgets grid grid-cols-[min-content_minmax(80px,min-content)_minmax(125px,1fr)] gap-y-1 pr-3', shouldHandleNodePointerEvents ? 'pointer-events-auto' : 'pointer-events-none' diff --git a/src/renderer/extensions/vueNodes/widgets/composables/useProgressTextWidget.ts b/src/renderer/extensions/vueNodes/widgets/composables/useProgressTextWidget.ts index c73d9bbd32..fdfdb0a934 100644 --- a/src/renderer/extensions/vueNodes/widgets/composables/useProgressTextWidget.ts +++ b/src/renderer/extensions/vueNodes/widgets/composables/useProgressTextWidget.ts @@ -1,5 +1,3 @@ -import { ref } from 'vue' - import TextPreviewWidget from '@/components/graph/widgets/TextPreviewWidget.vue' import type { LGraphNode } from '@/lib/litegraph/src/litegraph' import type { InputSpec } from '@/schemas/nodeDef/nodeDefSchemaV2' @@ -7,6 +5,7 @@ import { ComponentWidgetImpl, addWidget } from '@/scripts/domWidget' import type { ComponentWidgetStandardProps } from '@/scripts/domWidget' import type { ComfyWidgetConstructorV2 } from '@/scripts/widgets' import type { IBaseWidget } from '@/lib/litegraph/src/types/widgets' +import { useWidgetValueStore } from '@/stores/widgetValueStore' type TextPreviewCustomProps = Omit< InstanceType['$props'], @@ -24,7 +23,6 @@ export function useTextPreviewWidget( node: LGraphNode, inputSpec: InputSpec ): IBaseWidget { - const widgetValue = ref('') const widget = new ComponentWidgetImpl< string | object, TextPreviewCustomProps @@ -37,9 +35,16 @@ export function useTextPreviewWidget( nodeId: node.id }, options: { - getValue: () => widgetValue.value, + getValue: () => + useWidgetValueStore().getWidget(node.id, inputSpec.name)?.value ?? '', setValue: (value: string | object) => { - widgetValue.value = typeof value === 'string' ? value : String(value) + const widgetState = useWidgetValueStore().getWidget( + node.id, + inputSpec.name + ) + if (widgetState) + widgetState.value = + typeof value === 'string' ? value : String(value) }, getMinHeight: () => options.minHeight ?? 42 + PADDING, read_only: true