DragControls exposes Group as ref, which is inconsistent with other controls. Enabling and disabling this control with Group's ref is not possible.

[AmitDigga]

Describe the feature you'd like:

1. Make DragControls ref behavior consistent with other controls like TransformControl, OrbitControl, etc.
2. Allow an easy way to enable and disable DragControls without changing the state.

Suggested implementation:

Instead of exposing Group as ref, I am exposing another prop that allows to change behaviour at the prop

export type DragControlsRef = {
    enabled: boolean
}

export const DragControlsModifed: ForwardRefComponent<DragControlsProps, DragControlsRef> = React.forwardRef<
    DragControlsRef,
    DragControlsProps
>(
    (
        {
            // ... rest
        },
        fRef
    ) => {

        const refObject = React.useRef<DragControlsRef>({ enabled: true })
        const refObjectAtStart = React.useRef<DragControlsRef>({ enabled: true })

        const bind = useGesture(
            {
                onHover: ({ hovering }) => {
                    // Some Changes here that were not handled by me
                },
                onDragStart: ({ event }) => {
                    refObjectAtStart.current.enabled = refObject.current.enabled
                    // ... rest
                },
                onDrag: ({ xy: [dragX, dragY], intentional }) => {
                    if (refObjectAtStart.current.enabled === false) return
                    // ... rest
                },
                onDragEnd: () => {
                    if (refObjectAtStart.current.enabled === false) return
                    // ... rest
                },
            },
            // ... rest
        )

        // ... rest

    }
)