import React, { useCallback, useMemo } from 'react';
import { useDndBasicTableScrollModifier } from '../../../hooks/useDndBasicTableScrollModifier';
import { useDraggingCrosswalk } from '../hooks/useDraggingCrosswalk';
import { snapCenterToCursor } from '@dnd-kit/modifiers';
import { DndContext, DragOverlay } from '@dnd-kit/core';
import { CrosswalkDragPreview } from '../CrosswalkDragPreview';
import { useTableDndKit } from 'react-components/dist/Table/hooks/useTableDndKit';
export var CrosswalkDndComponent = function (_a) {
    var children = _a.children, tableRef = _a.tableRef, _b = _a.tableRowReorderingEnabled, tableRowReorderingEnabled = _b === void 0 ? false : _b;
    var _c = useDndBasicTableScrollModifier({ tableRef: tableRef }), scrollModifier = _c.scrollModifier, stopScroll = _c.stopScroll;
    var _d = useDraggingCrosswalk(), draggingCrosswalk = _d.draggingCrosswalk, onDragEndCrosswalk = _d.onDragEnd, onCrosswalkDragStart = _d.onDragStart;
    var tableDnd = useTableDndKit({
        dndColumnReorderingEnabled: false,
        dndRowReorderingEnabled: tableRowReorderingEnabled
    });
    var onDragStart = useCallback(function (event) {
        onCrosswalkDragStart(event);
    }, [onCrosswalkDragStart]);
    var onDragEnd = useCallback(function () {
        onDragEndCrosswalk();
        stopScroll();
    }, [onDragEndCrosswalk, stopScroll]);
    var dndContextModifiers = useMemo(function () { return [scrollModifier]; }, [scrollModifier]);
    var crosswalkOverlayModifiers = useMemo(function () { return [snapCenterToCursor]; }, []);
    return (React.createElement(DndContext, { sensors: tableDnd.sensors, collisionDetection: tableDnd.collisionDetection, measuring: tableDnd.measuring, autoScroll: tableDnd.autoScrollOptions, modifiers: dndContextModifiers, onDragStart: onDragStart, onDragEnd: onDragEnd },
        children,
        draggingCrosswalk ? (React.createElement(DragOverlay, { style: { width: 'max-content' }, modifiers: crosswalkOverlayModifiers, dropAnimation: null },
            React.createElement(CrosswalkDragPreview, { crosswalk: draggingCrosswalk }))) : null));
};
