refactor(NodeHeader): use v-model:is-editing and doubleClickToEdit, remove handlers

This commit is contained in:
Alexander Brown
2026-01-15 22:22:05 -08:00
parent 565263aac6
commit ff59ee317d

View File

@@ -16,7 +16,6 @@
opacity: useSettingStore().get('Comfy.Node.Opacity') ?? 1 opacity: useSettingStore().get('Comfy.Node.Opacity') ?? 1
}" }"
:data-testid="`node-header-${nodeData?.id || ''}`" :data-testid="`node-header-${nodeData?.id || ''}`"
@dblclick="handleDoubleClick"
> >
<div class="flex items-center justify-between gap-2.5 min-w-0"> <div class="flex items-center justify-between gap-2.5 min-w-0">
<!-- Collapse/Expand Button --> <!-- Collapse/Expand Button -->
@@ -53,11 +52,11 @@
> >
<div class="truncate min-w-0 flex-1"> <div class="truncate min-w-0 flex-1">
<EditableText <EditableText
v-model:is-editing="isEditing"
:model-value="displayTitle" :model-value="displayTitle"
:is-editing="isEditing"
:input-attrs="{ 'data-testid': 'node-title-input' }" :input-attrs="{ 'data-testid': 'node-title-input' }"
double-click-to-edit
@edit="handleTitleEdit" @edit="handleTitleEdit"
@cancel="handleTitleCancel"
/> />
</div> </div>
</div> </div>
@@ -242,23 +241,13 @@ const handleCollapse = () => {
emit('collapse') emit('collapse')
} }
const handleDoubleClick = () => {
isEditing.value = true
}
const handleTitleEdit = (newTitle: string) => { const handleTitleEdit = (newTitle: string) => {
isEditing.value = false
const trimmedTitle = newTitle.trim() const trimmedTitle = newTitle.trim()
if (trimmedTitle && trimmedTitle !== displayTitle.value) { if (trimmedTitle && trimmedTitle !== displayTitle.value) {
// Emit for litegraph sync
emit('update:title', trimmedTitle) emit('update:title', trimmedTitle)
} }
} }
const handleTitleCancel = () => {
isEditing.value = false
}
const handleEnterSubgraph = () => { const handleEnterSubgraph = () => {
emit('enter-subgraph') emit('enter-subgraph')
} }