Type Definitions


Name Type Description
padding? PaddingBox Add padding around the target to increase the drag area. (default: null)
origin? boolean Whether or not the origin control box will be visible or not (default: true)
dragArea? boolean Instead of firing an event on the target, we add it to the moveable control element. You can use click and clickGroup events. (default: if group, true, else false)
passDragArea? boolean Set `pointerEvents: none;` css to pass events in dragArea.
target? SVGElement | HTMLElement | null The target(s) to indicate Moveable Control Box. (default: null)
dragTarget? SVGElement | HTMLElement | null The target(s) to drag Moveable target(s) (default: target)
container? SVGElement | HTMLElement | null Moveable Container. Don't set it. (default: parentElement)
portalContainer? HTMLElement | null Moveable Portal Container to support other frameworks. Don't set it. (default: container)
rootContainer? HTMLElement | null Moveable Root Container (No Transformed Container). (default: container)
zoom? number Zooms in the elements of a moveable. (default: 1)
transformOrigin? Array<string | number> | string | "" The default transformOrigin of the target can be set in advance. (default: "")
edge? boolean Whether to scale and resize through edge lines. (default: false)
ables? Able[] You can add your custom able. (default: [])
className? string You can specify the className of the moveable controlbox. (default: "")
pinchThreshold? number Minimum distance to pinch. (default: 20)
pinchOutside? boolean Whether the container containing the target becomes a pinch. (default: true)
triggerAblesSimultaneously? boolean Lets generate events of ables at the same time. (like Resizable, Scalable) (default: false)
checkInput? boolean Checks whether this is an element to input text or contentEditable, and prevents dragging. (default: false)
cspNonce? string add nonce property to style for CSP (default: "")
translateZ? number | string You can set the translateZ value of moveable (default: 50)
props? Record<string, any> You can use props in object format or custom props. (default: object)
  • TSInterface