mirror of
https://github.com/Comfy-Org/ComfyUI_frontend.git
synced 2026-04-20 06:20:11 +00:00
fix: Vue slot rename — match font size, prevent error sound, fix reactivity
- Add .prevent on enter/escape keydown to suppress error beep - Use text-[length:inherit] leading-[inherit] to match span font size - Add right-click on connection dot to start rename - Defer isRenaming=false to nextTick so label propagates before re-render
This commit is contained in:
@@ -31,6 +31,7 @@
|
||||
@click="onClick"
|
||||
@dblclick="onDoubleClick"
|
||||
@pointerdown="onPointerDown"
|
||||
@contextmenu.stop.prevent="startRename"
|
||||
/>
|
||||
|
||||
<!-- Slot Name -->
|
||||
@@ -39,10 +40,10 @@
|
||||
v-if="isRenaming"
|
||||
ref="renameInputRef"
|
||||
v-model="renameValue"
|
||||
class="m-0 w-full border-none bg-transparent p-0 text-node-component-slot-text outline-none"
|
||||
class="m-0 w-full truncate border-none bg-transparent p-0 text-[length:inherit] leading-[inherit] text-node-component-slot-text outline-none"
|
||||
@blur="finishRename"
|
||||
@keydown.enter="finishRename"
|
||||
@keydown.escape="cancelRename"
|
||||
@keydown.enter.prevent="finishRename"
|
||||
@keydown.escape.prevent="cancelRename"
|
||||
@click.stop
|
||||
@pointerdown.stop
|
||||
/>
|
||||
@@ -176,20 +177,31 @@ function startRename() {
|
||||
|
||||
function finishRename() {
|
||||
if (!isRenaming.value) return
|
||||
isRenaming.value = false
|
||||
|
||||
const newLabel = renameValue.value.trim()
|
||||
if (!newLabel || newLabel === displayLabel.value) return
|
||||
if (!newLabel || newLabel === displayLabel.value) {
|
||||
isRenaming.value = false
|
||||
return
|
||||
}
|
||||
|
||||
const node = app.canvas?.graph?.getNodeById(props.nodeId ?? '')
|
||||
const slot = node?.inputs?.[props.index]
|
||||
if (!slot) return
|
||||
if (!slot) {
|
||||
isRenaming.value = false
|
||||
return
|
||||
}
|
||||
|
||||
slot.label = newLabel
|
||||
node?.graph?.trigger('node:slot-label:changed', {
|
||||
nodeId: node.id,
|
||||
slotType: NodeSlotType.INPUT
|
||||
})
|
||||
app.canvas?.setDirty(true, true)
|
||||
|
||||
// Defer hiding the input until after Vue propagates the label update
|
||||
nextTick(() => {
|
||||
isRenaming.value = false
|
||||
})
|
||||
}
|
||||
|
||||
function cancelRename() {
|
||||
|
||||
Reference in New Issue
Block a user