8000 feat(useDraggable): allowing calculations of bounds with fixed elemen… · vueuse/vueuse@c08e5e0 · GitHub
[go: up one dir, main page]
More Web Proxy on the site http://driver.im/
Skip to content

Commit c08e5e0

Browse files
authored
feat(useDraggable): allowing calculations of bounds with fixed element (#3335)
1 parent 8acdb47 commit c08e5e0

File tree

1 file changed

+10
-1
lines changed

1 file changed

+10
-1
lines changed

packages/core/useDraggable/index.ts

Lines changed: 10 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -41,6 +41,13 @@ export interface UseDraggableOptions {
4141
*/
4242
draggingElement?: MaybeRefOrGetter<HTMLElement | SVGElement | Window | Document | null | undefined>
4343

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+
4451
/**
4552
* Handle that triggers the drag event
4653
*
@@ -107,6 +114,7 @@ export function useDraggable(
107114
initialValue,
108115
axis = 'both',
109116
draggingElement = defaultWindow,
117+
containerElement,
110118
handle: draggingHandle = target,
111119
} = options
112120

@@ -134,7 +142,8 @@ export function useDraggable(
134142
return
135143
if (toValue(exact) && e.target !== toValue(target))
136144
return
137-
const rect = toValue(target)!.getBoundingClientRect()
145+
const container = toValue(containerElement) ?? toValue(target)
146+
const rect = container!.getBoundingClientRect()
138147
const pos = {
139148
x: e.clientX - rect.left,
140149
y: e.clientY - rect.top,

0 commit comments

Comments
 (0)
0