DragDropManager

const manager = new DragDropManager(input?);

const defaultPreset = {
  sensors: [PointerSensor, KeyboardSensor],
  plugins: [
    Accessibility,
    AutoScroller,
    Cursor,
    Feedback,
    PreventSelection
  ],
  modifiers: []
};

import { DragDropManager } from '@dnd-kit/dom';

const manager = new DragDropManager();

import {
  DragDropManager,
  PointerSensor,
  Accessibility,
  Feedback
} from '@dnd-kit/dom';

const manager = new DragDropManager({
  sensors: [
    // Configure sensors with options
    PointerSensor.configure({
      activationConstraints: {
        delay: 100,
        tolerance: 5
      }
    })
  ],
  plugins: [
    Accessibility,
    // Configure feedback plugin
    Feedback.configure({
      dropAnimation: {
        duration: 200,
        easing: 'ease-out'
      }
    })
  ]
});

// Disable all defaults
const manager = new DragDropManager({
  sensors: null,
  plugins: null
});

// Or selectively override
const manager = new DragDropManager({
  sensors: [PointerSensor], // Only pointer, no keyboard
  plugins: [Feedback] // Only feedback, no other plugins
});

manager.dragOperation.status; // { idle: boolean, initializing: boolean, ... }
manager.dragOperation.source; // Current draggable being dragged
manager.dragOperation.target; // Current droppable target
manager.dragOperation.position; // Current drag position
manager.dragOperation.transform; // Current transform { x, y }

manager.registry.draggables; // Collection of registered draggables
manager.registry.droppables; // Collection of registered droppables
manager.registry.plugins; // Collection of active plugins
manager.registry.sensors; // Collection of active sensors

manager.monitor.addEventListener('dragstart', handler);
manager.monitor.addEventListener('dragover', handler);
manager.monitor.addEventListener('dragend', handler);

// Typically used by sensor implementations
manager.actions.start({ event, source, coordinates });
manager.actions.move({ event, to, by });
manager.actions.stop({ event, canceled });

manager.monitor.addEventListener('dragstart', (event) => {
  console.log('Started dragging:', event.source.id);
});

manager.monitor.addEventListener('dragmove', (event) => {
  console.log('Position:', event.position);
});

manager.monitor.addEventListener('dragover', (event) => {
  console.log('Over:', event.target?.id);
});

manager.monitor.addEventListener('dragend', (event) => {
  if (event.target) {
    console.log('Dropped on:', event.target.id);
  } else if (event.canceled) {
    console.log('Drag canceled');
  }
});

manager.monitor.addEventListener('collision', (event) => {
  console.log('Collision:', event.collision);
});

manager.monitor.addEventListener('beforedragstart', (event) => {
  // Called before drag initialization
});

import {
  DragDropManager,
  Draggable,
  Droppable,
  PointerSensor,
  KeyboardSensor,
  Accessibility,
  Feedback
} from '@dnd-kit/dom';

// Create manager with custom configuration
const manager = new DragDropManager({
  sensors: [
    PointerSensor.configure({
      activationConstraints(event) {
        // Custom activation logic
        return event.pointerType === 'touch'
          ? [new PointerActivationConstraints.Delay({ value: 250, tolerance: 5 })]
          : undefined;
      }
    }),
    KeyboardSensor
  ],
  plugins: [
    Accessibility.configure({
      announcements: {
        dragstart: (event) => `Picked up ${event.source.id}`,
        dragend: (event) => event.target
          ? `Dropped on ${event.target.id}`
          : 'Drag cancelled'
      }
    }),
    Feedback.configure({
      dropAnimation: { duration: 200 }
    })
  ]
});

// Register draggables and droppables
const draggable = new Draggable(
  { id: 'item-1', element: document.getElementById('item-1') },
  manager
);

const droppable = new Droppable(
  { id: 'zone-1', element: document.getElementById('zone-1') },
  manager
);

// Listen to events
manager.monitor.addEventListener('dragend', (event) => {
  if (event.target) {
    console.log(`${event.source.id} dropped on ${event.target.id}`);
  }
});

interface Input extends DragDropManagerInput<DragDropManager> {
  plugins?: Plugins | null;
  sensors?: Sensors | null;
  modifiers?: Modifiers | null;
}

class DragDropManager<
  T extends Data = Data,
  U extends Draggable<T> = Draggable<T>,
  V extends Droppable<T> = Droppable<T>
> extends AbstractDragDropManager<U, V> {
  constructor(input?: Input);
}