File tree Expand file tree Collapse file tree 1 file changed +10
-1
lines changed
packages/core/useDraggable Expand file tree Collapse file tree 1 file changed +10
-1
lines changed Original file line number Diff line number Diff line change @@ -41,6 +41,13 @@ export interface UseDraggableOptions {
41
41
*/
42
42
draggingElement ?: MaybeRefOrGetter < HTMLElement | SVGElement | Window | Document | null | undefined >
43
43
44
+ /**
45
+ * Element for calculating bounds (If not set, it will use the event's target).
46
+ *
47
+ * @default undefined
48
+ */
49
+ containerElement ?: MaybeRefOrGetter < HTMLElement | SVGElement | null | undefined >
50
+
44
51
/**
45
52
* Handle that triggers the drag event
46
53
*
@@ -107,6 +114,7 @@ export function useDraggable(
107
114
initialValue,
108
115
axis = 'both' ,
109
116
draggingElement = defaultWindow ,
117
+ containerElement,
110
118
handle : draggingHandle = target ,
111
119
} = options
112
120
@@ -134,7 +142,8 @@ export function useDraggable(
134
142
return
135
143
if ( toValue ( exact ) && e . target !== toValue ( target ) )
136
144
return
137
- const rect = toValue ( target ) ! . getBoundingClientRect ( )
145
+ const container = toValue ( containerElement ) ?? toValue ( target )
146
+ const rect = container ! . getBoundingClientRect ( )
138
147
const pos = {
139
148
x : e . clientX - rect . left ,
140
149
y : e . clientY - rect . top ,
You can’t perform that action at this time.
0 commit comments