Fix: Vue node/widget positioning and scroll issue (#5441)

* [feat] Refactor overlay compatibility into reusable composable

- Create useTransformCompatOverlayProps composable for centralized overlay prop management
- Update Select, MultiSelect, TreeSelect, and FileUpload components to use composable
- Provides appendTo='self' for transform inheritance in CSS-transformed parents
- Enables easy future additions of other transform compatibility props
- Fix duplicate v-bind attributes by combining props into single computed object

* fix: Keep the canvas container from being scrolled by children

* types: Align the appendTo type with primevue internals

* Update test expectations [skip ci]

---------

Co-authored-by: bymyself <cbyrne@comfy.org>
Co-authored-by: github-actions <github-actions@github.com>

src/renderer/extensions/vueNodes/widgets/components/WidgetTreeSelect.vue

@@ -2,9 +2,9 @@
   <WidgetLayoutField :widget="widget">
     <TreeSelect
       v-model="localValue"
-      v-bind="filteredProps"
+      v-bind="combinedProps"
       :disabled="readonly"
-      :class="cn(WidgetInputBaseClass, 'w-full text-xs')"
+      class="w-full text-xs"
       size="small"
       @update:model-value="onChange"
     />
@@ -16,14 +16,13 @@ import TreeSelect from 'primevue/treeselect'
 import { computed } from 'vue'
 
 import { useWidgetValue } from '@/composables/graph/useWidgetValue'
+import { useTransformCompatOverlayProps } from '@/composables/useTransformCompatOverlayProps'
 import type { SimplifiedWidget } from '@/types/simplifiedWidget'
-import { cn } from '@/utils/tailwindUtil'
 import {
   PANEL_EXCLUDED_PROPS,
   filterWidgetProps
 } from '@/utils/widgetPropFilter'
 
-import { WidgetInputBaseClass } from './layout'
 import WidgetLayoutField from './layout/WidgetLayoutField.vue'
 
 const props = defineProps<{
@@ -44,6 +43,9 @@ const { localValue, onChange } = useWidgetValue({
   emit
 })
 
+// Transform compatibility props for overlay positioning
+const transformCompatProps = useTransformCompatOverlayProps()
+
 // TreeSelect specific excluded props
 const TREE_SELECT_EXCLUDED_PROPS = [
   ...PANEL_EXCLUDED_PROPS,
@@ -51,7 +53,8 @@ const TREE_SELECT_EXCLUDED_PROPS = [
   'inputStyle'
 ] as const
 
-const filteredProps = computed(() =>
-  filterWidgetProps(props.widget.options, TREE_SELECT_EXCLUDED_PROPS)
-)
+const combinedProps = computed(() => ({
+  ...filterWidgetProps(props.widget.options, TREE_SELECT_EXCLUDED_PROPS),
+  ...transformCompatProps.value
+}))
 </script>