import { useCallback, useEffect, useMemo, useRef } from 'react';
import { useNodeRef } from '@dnd-kit/utilities';
import { useDndContext } from './useDndContext';
export var useDraggable = function (props) {
    var _a = useDndContext(), draggableNodesRef = _a.draggableNodesRef, onDragStart = _a.onDragStart, onDragEnd = _a.onDragEnd;
    var onChangeNode = useCallback(function (newElement) {
        if (newElement) {
            newElement.setAttribute('data-test-dnd-drag-id', props.id);
        }
    }, [props.id]);
    var _b = useNodeRef(onChangeNode), node = _b[0], setNodeRef = _b[1];
    var onChangeActivatorNode = useCallback(function (newElement) {
        if (newElement) {
            newElement.setAttribute('data-test-dnd-activator-id', props.id);
        }
    }, [props.id]);
    var _c = useNodeRef(onChangeActivatorNode), setActivatorNodeRef = _c[1];
    var data = useRef(props.data);
    useEffect(function () {
        draggableNodesRef.current.set(props.id, { id: props.id, data: data, node: node });
        return function () {
            var node = draggableNodesRef.current.get(props.id);
            if (node) {
                draggableNodesRef.current.delete(props.id);
            }
        };
    }, [props.id]);
    var listeners = useMemo(function () {
        return props.disabled
            ? {}
            : {
                onMouseDown: function () {
                    onDragStart(props.id);
                },
                onMouseUp: function () {
                    onDragEnd();
                }
            };
    }, [props.id, onDragStart, onDragEnd, props.disabled]);
    return {
        attributes: {},
        listeners: listeners,
        setNodeRef: setNodeRef,
        setActivatorNodeRef: setActivatorNodeRef
    };
};
