refactor: remove unused tooltip appendTo code (#5943)

## Summary

Remove unused tooltip appendTo positioning code.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-5943-refactor-remove-unused-tooltip-appendTo-code-2846d73d365081d99c00cd41e35eb496)
by [Unito](https://www.unito.io)

---------

Co-authored-by: Jake Schroeder <jake.schroeder@isophex.com>
This commit is contained in:
Simula_r
2025-10-06 14:45:53 -07:00
committed by GitHub
parent d69c54820f
commit 51f0f111ea
7 changed files with 20 additions and 55 deletions

View File

@@ -27,9 +27,7 @@
<script setup lang="ts">
import {
type ComponentPublicInstance,
type Ref,
computed,
inject,
onErrorCaptured,
ref,
watchEffect
@@ -86,11 +84,8 @@ const labelClasses = computed(() =>
const renderError = ref<string | null>(null)
const { toastErrorHandler } = useErrorHandling()
const tooltipContainer =
inject<Ref<HTMLElement | undefined>>('tooltipContainer')
const { getInputSlotTooltip, createTooltipConfig } = useNodeTooltips(
props.nodeType || '',
tooltipContainer
props.nodeType || ''
)
const tooltipConfig = computed(() => {

View File

@@ -118,7 +118,7 @@
<script setup lang="ts">
import { storeToRefs } from 'pinia'
import { computed, inject, onErrorCaptured, onMounted, provide, ref } from 'vue'
import { computed, inject, onErrorCaptured, onMounted, ref } from 'vue'
import type { VueNodeData } from '@/composables/graph/useGraphNodeManager'
import { toggleNodeOptions } from '@/composables/graph/useMoreOptionsMenu'
@@ -371,5 +371,4 @@ const nodeMedia = computed(() => {
})
const nodeContainerRef = ref()
provide('tooltipContainer', nodeContainerRef)
</script>

View File

@@ -101,9 +101,6 @@ const createMountConfig = () => {
updated: vi.fn(),
unmounted: vi.fn()
}
},
provide: {
tooltipContainer: { value: document.createElement('div') }
}
}
}

View File

@@ -62,7 +62,7 @@
</template>
<script setup lang="ts">
import { type Ref, computed, inject, onErrorCaptured, ref, watch } from 'vue'
import { computed, onErrorCaptured, ref, watch } from 'vue'
import IconButton from '@/components/button/IconButton.vue'
import EditableText from '@/components/common/EditableText.vue'
@@ -108,11 +108,8 @@ onErrorCaptured((error) => {
// Editing state
const isEditing = ref(false)
const tooltipContainer =
inject<Ref<HTMLElement | undefined>>('tooltipContainer')
const { getNodeDescription, createTooltipConfig } = useNodeTooltips(
nodeData?.type || '',
tooltipContainer
nodeData?.type || ''
)
const tooltipConfig = computed(() => {

View File

@@ -52,7 +52,7 @@
</template>
<script setup lang="ts">
import { type Ref, computed, inject, onErrorCaptured, ref } from 'vue'
import { computed, onErrorCaptured, ref } from 'vue'
import type {
SafeWidgetData,
@@ -98,11 +98,8 @@ onErrorCaptured((error) => {
})
const nodeType = computed(() => nodeData?.type || '')
const tooltipContainer =
inject<Ref<HTMLElement | undefined>>('tooltipContainer')
const { getWidgetTooltip, createTooltipConfig } = useNodeTooltips(
nodeType.value,
tooltipContainer
nodeType.value
)
interface ProcessedWidget {

View File

@@ -24,9 +24,7 @@
<script setup lang="ts">
import {
type ComponentPublicInstance,
type Ref,
computed,
inject,
onErrorCaptured,
ref,
watchEffect
@@ -60,11 +58,8 @@ const renderError = ref<string | null>(null)
const { toastErrorHandler } = useErrorHandling()
const tooltipContainer =
inject<Ref<HTMLElement | undefined>>('tooltipContainer')
const { getOutputSlotTooltip, createTooltipConfig } = useNodeTooltips(
props.nodeType || '',
tooltipContainer
props.nodeType || ''
)
const tooltipConfig = computed(() => {

View File

@@ -1,5 +1,8 @@
import type { TooltipDirectivePassThroughOptions } from 'primevue'
import { type MaybeRef, type Ref, computed, ref, unref } from 'vue'
import type {
TooltipDirectivePassThroughOptions,
TooltipPassThroughMethodOptions
} from 'primevue/tooltip'
import { type MaybeRef, computed, ref, unref } from 'vue'
import type { SafeWidgetData } from '@/composables/graph/useGraphNodeManager'
import { st } from '@/i18n'
@@ -77,10 +80,7 @@ function setupGlobalTooltipHiding() {
* Composable for managing Vue node tooltips
* Provides tooltip text for node headers, slots, and widgets
*/
export function useNodeTooltips(
nodeType: MaybeRef<string>,
containerRef?: Ref<HTMLElement | undefined>
) {
export function useNodeTooltips(nodeType: MaybeRef<string>) {
const nodeDefStore = useNodeDefStore()
const settingsStore = useSettingStore()
@@ -151,14 +151,7 @@ export function useNodeTooltips(
const tooltipDelay = settingsStore.get('LiteGraph.Node.TooltipDelay')
const tooltipText = text || ''
const config: {
value: string
showDelay: number
hideDelay: number
disabled: boolean
appendTo?: HTMLElement
pt?: TooltipDirectivePassThroughOptions
} = {
return {
value: tooltipText,
showDelay: tooltipDelay as number,
hideDelay: 0, // Immediate hiding
@@ -172,24 +165,16 @@ export function useNodeTooltips(
class:
'border-sand-100 bg-pure-white dark-theme:bg-charcoal-800 border dark-theme:border-slate-300 rounded-md px-4 py-2 text-charcoal-700 dark-theme:text-pure-white text-sm font-normal leading-tight max-w-75 shadow-none'
},
arrow: ({ context }) => ({
arrow: ({ context }: TooltipPassThroughMethodOptions) => ({
class: cn(
context?.top && 'border-t-sand-100 dark-theme:border-t-slate-300',
context?.bottom &&
'border-b-sand-100 dark-theme:border-b-slate-300',
context?.left && 'border-l-sand-100 dark-theme:border-l-slate-300',
context?.right && 'border-r-sand-100 dark-theme:border-r-slate-300'
context.top && 'border-t-sand-100 dark-theme:border-t-slate-300',
context.bottom && 'border-b-sand-100 dark-theme:border-b-slate-300',
context.left && 'border-l-sand-100 dark-theme:border-l-slate-300',
context.right && 'border-r-sand-100 dark-theme:border-r-slate-300'
)
})
}
} as TooltipDirectivePassThroughOptions
}
// If we have a container reference, append tooltips to it
if (containerRef?.value) {
config.appendTo = containerRef.value
}
return config
}
return {