Version Packages

[github-actions]

This PR was opened by the Changesets release GitHub action. When you're ready to do a release, you can merge this and the packages will be published to npm automatically. If you're not ready to do a release yet, that's fine, whenever you add more changesets to main, this PR will be updated.

Releases

@dnd-kit/abstract@0.4.0

Minor Changes

• #1923 cde61e4 Thanks @clauderic! - Batch entity identity changes to prevent collision oscillation during virtualized sorting.

  When entities swap ids (e.g. as react-window recycles DOM nodes during a drag), multiple registry updates could fire in an interleaved order, causing the collision detector to momentarily see stale or duplicate entries and oscillate between targets.

  Entity id changes are now deferred to a microtask and flushed atomically in a single batch(), ensuring:

  • The collision notifier skips detection while id changes are pending
  • The registry cleans up ghost registrations (stale keys left behind after an id swap)

• #1915 9b24dff Thanks @clauderic! - Redesign event type system to follow the DOM EventMap pattern. Introduces DragDropEventMap for event object types and DragDropEventHandlers for event handler signatures, replacing the ambiguously named DragDropEvents. Event type aliases (CollisionEvent, DragStartEvent, etc.) now derive directly from DragDropEventMap rather than using Parameters<> extraction.

  Migration guide

  • DragDropEvents has been split into two types:
    • DragDropEventMap — maps event names to event object types (like WindowEventMap)
    • DragDropEventHandlers — maps event names to (event, manager) => void handler signatures
  • If you were importing DragDropEvents to type event objects, use DragDropEventMap instead:

    // Before
    type MyEvent = Parameters<DragDropEvents<D, P, M>['dragend']>[0];
    // After
    type MyEvent = DragDropEventMap<D, P, M>['dragend'];

  • If you were importing DragDropEvents to type event handlers, use DragDropEventHandlers instead:

    // Before
    const handler: DragDropEvents<D, P, M>['dragend'] = (event, manager) => {};
    // After
    const handler: DragDropEventHandlers<D, P, M>['dragend'] = (
      event,
      manager
    ) => {};

  • The DragDropEvents re-export from @dnd-kit/react and @dnd-kit/solid has been removed. Import DragDropEventMap or DragDropEventHandlers from @dnd-kit/abstract directly if needed.
  • Convenience aliases (CollisionEvent, DragStartEvent, DragEndEvent, etc.) are unchanged and continue to work as before.

• #1938 e69387d Thanks @clauderic! - Added per-entity plugin configuration and moved feedback from the Draggable entity to the Feedback plugin.

  Draggable entities now accept a plugins property for per-entity plugin configuration, using the existing Plugin.configure() pattern. Plugins can read per-entity options via source.pluginConfig(PluginClass).

  The feedback property ('default' | 'move' | 'clone' | 'none') has been moved from the Draggable entity to FeedbackOptions. Drop animation can also now be configured per-draggable.

  Plugins listed in an entity's plugins array are auto-registered on the manager if not already present. The Sortable class now uses this generic mechanism instead of its own custom registration logic.

  Migration guide

  The feedback property has been moved from the draggable/sortable hook input to per-entity Feedback plugin configuration.

  Before:

  import {FeedbackType} from '@dnd-kit/dom';
  
  useDraggable({id: 'item', feedback: 'clone'});
  useSortable({id: 'item', index: 0, feedback: 'clone'});

  After:

  import {Feedback} from '@dnd-kit/dom';
  
  useDraggable({
    id: 'item',
    plugins: [Feedback.configure({feedback: 'clone'})],
  });
  useSortable({
    id: 'item',
    index: 0,
    plugins: (defaults) => [
      ...defaults,
      Feedback.configure({feedback: 'clone'}),
    ],
  });

  Drop animation can now be configured per-draggable:

  useDraggable({
    id: 'item',
    plugins: [Feedback.configure({feedback: 'clone', dropAnimation: null})],
  });

Patch Changes

• #1982 a5935e0 Thanks @clauderic! - fix: ensure onDragStart fires before onDragOver when an element is both draggable and droppable

• #1987 462e435 Thanks @clauderic! - fix: resolve DTS build errors with TypeScript 5.9 on Node 20

  Add explicit return type annotations to avoid [dispose] serialization failures during declaration emit, and fix useRef readonly errors for React 19 type compatibility.

• #1971 8fc1962 Thanks @clauderic! - Added LICENSE file to all published packages.

• #1933 8115a57 Thanks @clauderic! - Fixed plugin registration order when deduplicating configured plugins.

  When a plugin was provided via Plugin.configure() alongside an internally-registered instance of the same plugin, the dedup logic would reorder it to the end of the registration list. This broke plugins like Feedback that resolve StyleInjector from the registry during construction, since StyleInjector would not yet be registered.

  This also prevented users from configuring StyleInjector with a CSP nonce without breaking drag feedback:

  plugins: (defaults) => [
    ...defaults,
    StyleInjector.configure({nonce: 'abc123'}),
  ];

• #1936 4e35963 Thanks @FreTimmerman! - Infer type of source.data object from type argument

• Updated dependencies [8fc1962]:

  • @dnd-kit/geometry@0.4.0
  • @dnd-kit/state@0.4.0

@dnd-kit/dom@0.4.0

Minor Changes

• #1909 87bf1e6 Thanks @clauderic! - Add acceleration and threshold options to the AutoScroller plugin.

  • acceleration controls the base scroll speed multiplier (default: 25).
  • threshold controls the percentage of container dimensions that defines the scroll activation zone (default: 0.2). Accepts a single number for both axes or { x, y } for per-axis control. Setting an axis to 0 disables auto-scrolling on that axis.

  AutoScroller.configure({
    acceleration: 15,
    threshold: {x: 0, y: 0.3},
  });

• #1966 521f760 Thanks @lixiaoyan! - Sortable plugins now accepts Customizable<Plugins>, allowing a function that receives the default plugins to extend them rather than replace them.

  This prevents accidentally losing the default Sortable plugins (SortableKeyboardPlugin, OptimisticSortingPlugin) when adding per-entity plugin configuration such as Feedback.configure().

  // Extend defaults
  useSortable({
    id: 'item',
    index: 0,
    plugins: (defaults) => [
      ...defaults,
      Feedback.configure({feedback: 'clone'}),
    ],
  });
  
  // Replace defaults (same behavior as before)
  useSortable({
    id: 'item',
    index: 0,
    plugins: [MyPlugin],
  });

• #1938 c001272 Thanks @clauderic! - The DropAnimationFunction context now includes source, providing access to the draggable entity for conditional animation logic.

  Feedback.configure({
    dropAnimation: async (context) => {
      if (context.source.type === 'service-draggable') return;
      // custom animation...
    },
  });

• #1923 cde61e4 Thanks @clauderic! - Batch entity identity changes to prevent collision oscillation during virtualized sorting.

  When entities swap ids (e.g. as react-window recycles DOM nodes during a drag), multiple registry updates could fire in an interleaved order, causing the collision detector to momentarily see stale or duplicate entries and oscillate between targets.

  Entity id changes are now deferred to a microtask and flushed atomically in a single batch(), ensuring:

  • The collision notifier skips detection while id changes are pending
  • The registry cleans up ghost registrations (stale keys left behind after an id swap)

• #2001 78af13b Thanks @lixiaoyan! - Support a callback form for the feedback option in the Feedback plugin, allowing the feedback type to be chosen dynamically based on the source and manager context (e.g. activator type).

  Feedback.configure({
    feedback: (source, manager) => {
      return isKeyboardEvent(manager.dragOperation.activatorEvent)
        ? 'clone'
        : 'default';
    },
  });

• #1908 1328af8 Thanks @clauderic! - Add keyboardTransition option to the Feedback plugin for customizing or disabling the CSS transition applied when moving elements via keyboard.

  By default, keyboard-driven moves animate with 250ms cubic-bezier(0.25, 1, 0.5, 1). You can now customize the duration and easing, or set the option to null to disable the transition entirely.

  Feedback.configure({
    keyboardTransition: {duration: 150, easing: 'ease-out'},
  });

• #1919 bfff7de Thanks @clauderic! - The Feedback plugin now supports full CSS transform property for compatibility with libraries like react-window v2 that position elements via transforms. Transform-related CSS transitions are filtered out to prevent conflicts with Feedback-managed properties. The ResizeObserver computes shapes from CSS values rather than re-measuring the element, avoiding mid-transition measurement errors. Sortable's animate() cancels CSS transitions on transform-related properties before measuring to ensure correct FLIP deltas.

• #1915 9b24dff Thanks @clauderic! - Redesign event type system to follow the DOM EventMap pattern. Introduces DragDropEventMap for event object types and DragDropEventHandlers for event handler signatures, replacing the ambiguously named DragDropEvents. Event type aliases (CollisionEvent, DragStartEvent, etc.) now derive directly from DragDropEventMap rather than using Parameters<> extraction.

  Migration guide

  • DragDropEvents has been split into two types:
    • DragDropEventMap — maps event names to event object types (like WindowEventMap)
    • DragDropEventHandlers — maps event names to (event, manager) => void handler signatures
  • If you were importing DragDropEvents to type event objects, use DragDropEventMap instead:

    // Before
    type MyEvent = Parameters<DragDropEvents<D, P, M>['dragend']>[0];
    // After
    type MyEvent = DragDropEventMap<D, P, M>['dragend'];

  • If you were importing DragDropEvents to type event handlers, use DragDropEventHandlers instead:

    // Before
    const handler: DragDropEvents<D, P, M>['dragend'] = (event, manager) => {};
    // After
    const handler: DragDropEventHandlers<D, P, M>['dragend'] = (
      event,
      manager
    ) => {};

  • The DragDropEvents re-export from @dnd-kit/react and @dnd-kit/solid has been removed. Import DragDropEventMap or DragDropEventHandlers from @dnd-kit/abstract directly if needed.
  • Convenience aliases (CollisionEvent, DragStartEvent, DragEndEvent, etc.) are unchanged and continue to work as before.

• #1938 e69387d Thanks @clauderic! - Added per-entity plugin configuration and moved feedback from the Draggable entity to the Feedback plugin.

  Draggable entities now accept a plugins property for per-entity plugin configuration, using the existing Plugin.configure() pattern. Plugins can read per-entity options via source.pluginConfig(PluginClass).

  The feedback property ('default' | 'move' | 'clone' | 'none') has been moved from the Draggable entity to FeedbackOptions. Drop animation can also now be configured per-draggable.

  Plugins listed in an entity's plugins array are auto-registered on the manager if not already present. The Sortable class now uses this generic mechanism instead of its own custom registration logic.

  Migration guide

  The feedback property has been moved from the draggable/sortable hook input to per-entity Feedback plugin configuration.

  Before:

  import {FeedbackType} from '@dnd-kit/dom';
  
  useDraggable({id: 'item', feedback: 'clone'});
  useSortable({id: 'item', index: 0, feedback: 'clone'});

  After:

  import {Feedback} from '@dnd-kit/dom';
  
  useDraggable({
    id: 'item',
    plugins: [Feedback.configure({feedback: 'clone'})],
  });
  useSortable({
    id: 'item',
    index: 0,
    plugins: (defaults) => [
      ...defaults,
      Feedback.configure({feedback: 'clone'}),
    ],
  });

  Drop animation can now be configured per-draggable:

  useDraggable({
    id: 'item',
    plugins: [Feedback.configure({feedback: 'clone', dropAnimation: null})],
  });

• #1905 11ff2eb Thanks @clauderic! - Renamed StyleSheetManager to StyleInjector and centralized CSP nonce configuration.

  The StyleInjector plugin now accepts a nonce option that is applied to all injected <style> elements. The nonce options have been removed from the Cursor, PreventSelection, and Feedback plugin options.

  Before:

  const manager = new DragDropManager({
    plugins: (defaults) => [
      ...defaults,
      Cursor.configure({nonce: 'abc123'}),
      PreventSelection.configure({nonce: 'abc123'}),
    ],
  });

  After:

  const manager = new DragDropManager({
    plugins: (defaults) => [
      ...defaults,
      StyleInjector.configure({nonce: 'abc123'}),
    ],
  });

  The Cursor and PreventSelection plugins now route their style injection through the StyleInjector, so all injected styles respect the centralized nonce configuration.

• #1916 7489265 Thanks @clauderic! - Rewrite scrollIntoViewIfNeeded with manual offset calculations for correct behavior in nested scroll containers. The centerIfNeeded boolean parameter has been replaced with an options object accepting block and inline properties ('center', 'nearest', or 'none').

Patch Changes

• #1918 4bc7e71 Thanks @clauderic! - Animation resolution now uses last-wins semantics matching CSS composite order. getFinalKeyframe returns the last matching keyframe across all running animations instead of short-circuiting on the first match. getProjectedTransform collects the latest value per CSS property (transform, translate, scale) rather than accumulating transforms additively.

• #1948 532ae9b Thanks @clauderic! - Fix Feedback plugin placeholder not repositioning when siblings are moved around a stationary source element.

  When a VDOM framework (e.g., Preact, Vue) reorders sibling elements during a drag operation, the source element and placeholder may remain in the DOM but no longer be adjacent. The existing documentMutationObserver only handled cases where the source or placeholder itself was re-added to the DOM. This adds a fallback adjacency check after processing all mutation entries, ensuring the placeholder stays next to the source element regardless of how siblings are rearranged.

• #1968 267c97c Thanks @clauderic! - Fix clone feedback placeholder dropping inline SVG children during mutation sync.

  The element mutation observer used innerHTML to sync child changes from the dragged element to its placeholder. This text-based serialization loses SVG namespace information, causing inline SVG elements (e.g. icon components) to be stripped from the placeholder. The placeholder then measures with incorrect dimensions, producing a misaligned drop animation.

  Replaced innerHTML with replaceChildren(...element.cloneNode(true).childNodes), which performs a namespace-aware deep clone.

• #1987 462e435 Thanks @clauderic! - fix: resolve DTS build errors with TypeScript 5.9 on Node 20

  Add explicit return type annotations to avoid [dispose] serialization failures during declaration emit, and fix useRef readonly errors for React 19 type compatibility.

• #1971 8fc1962 Thanks @clauderic! - Added LICENSE file to all published packages.

• #1983 88d5ef9 Thanks @clauderic! - Fixed memory leak in Listeners class where the bind cleanup function did not remove entries from the internal entries set, causing detached DOM nodes to be retained in memory.

• #1934 688e00f Thanks @clauderic! - Fixed setPointerCapture error on touch devices caused by stale pointer activation.

  When a touch was released during the activation delay and followed by a quick re-touch, the pending delay timer from the first touch could fire with a stale pointerId, causing setPointerCapture to throw. The PointerSensor now properly aborts the activation controller during cleanup to cancel pending delay timers, and defensively handles setPointerCapture failures.

• #1953 cdaebff Thanks @ImBaedin! - Fix sortable type narrowing so isSortable(event.operation.source) narrows to a sortable draggable with access to initialIndex, and re-export the drag event type aliases from @dnd-kit/vue.

• #1946 5a2ed80 Thanks @mattersj! - recalculate AutoScroller options in the effect to avoid stale data

• Updated dependencies [cde61e4, a5935e0, 462e435, 9b24dff, 8fc1962, 8115a57, e69387d, 4e35963]:

  • @dnd-kit/abstract@0.4.0
  • @dnd-kit/collision@0.4.0
  • @dnd-kit/geometry@0.4.0
  • @dnd-kit/state@0.4.0

@dnd-kit/helpers@0.4.0

Minor Changes

• #1915 9b24dff Thanks @clauderic! - Redesign event type system to follow the DOM EventMap pattern. Introduces DragDropEventMap for event object types and DragDropEventHandlers for event handler signatures, replacing the ambiguously named DragDropEvents. Event type aliases (CollisionEvent, DragStartEvent, etc.) now derive directly from DragDropEventMap rather than using Parameters<> extraction.

  Migration guide

  • DragDropEvents has been split into two types:
    • DragDropEventMap — maps event names to event object types (like WindowEventMap)
    • DragDropEventHandlers — maps event names to (event, manager) => void handler signatures
  • If you were importing DragDropEvents to type event objects, use DragDropEventMap instead:

    // Before
    type MyEvent = Parameters<DragDropEvents<D, P, M>['dragend']>[0];
    // After
    type MyEvent = DragDropEventMap<D, P, M>['dragend'];

  • If you were importing DragDropEvents to type event handlers, use DragDropEventHandlers instead:

    // Before
    const handler: DragDropEvents<D, P, M>['dragend'] = (event, manager) => {};
    // After
    const handler: DragDropEventHandlers<D, P, M>['dragend'] = (
      event,
      manager
    ) => {};

  • The DragDropEvents re-export from @dnd-kit/react and @dnd-kit/solid has been removed. Import DragDropEventMap or DragDropEventHandlers from @dnd-kit/abstract directly if needed.
  • Convenience aliases (CollisionEvent, DragStartEvent, DragEndEvent, etc.) are unchanged and continue to work as before.

Patch Changes

• #1954 e5b153e Thanks @thexeromin! - fix: correct JSDoc comment for arraySwap

• #1971 8fc1962 Thanks @clauderic! - Added LICENSE file to all published packages.

• Updated dependencies [cde61e4, a5935e0, 462e435, 9b24dff, 8fc1962, 8115a57, e69387d, 4e35963]:

  • @dnd-kit/abstract@0.4.0

@dnd-kit/react@0.4.0

Minor Changes

• #1915 9b24dff Thanks @clauderic! - Redesign event type system to follow the DOM EventMap pattern. Introduces DragDropEventMap for event object types and DragDropEventHandlers for event handler signatures, replacing the ambiguously named DragDropEvents. Event type aliases (CollisionEvent, DragStartEvent, etc.) now derive directly from DragDropEventMap rather than using Parameters<> extraction.

  Migration guide

  • DragDropEvents has been split into two types:
    • DragDropEventMap — maps event names to event object types (like WindowEventMap)
    • DragDropEventHandlers — maps event names to (event, manager) => void handler signatures
  • If you were importing DragDropEvents to type event objects, use DragDropEventMap instead:

    // Before
    type MyEvent = Parameters<DragDropEvents<D, P, M>['dragend']>[0];
    // After
    type MyEvent = DragDropEventMap<D, P, M>['dragend'];

  • If you were importing DragDropEvents to type event handlers, use DragDropEventHandlers instead:

    // Before
    const handler: DragDropEvents<D, P, M>['dragend'] = (event, manager) => {};
    // After
    const handler: DragDropEventHandlers<D, P, M>['dragend'] = (
      event,
      manager
    ) => {};

  • The DragDropEvents re-export from @dnd-kit/react and @dnd-kit/solid has been removed. Import DragDropEventMap or DragDropEventHandlers from @dnd-kit/abstract directly if needed.
  • Convenience aliases (CollisionEvent, DragStartEvent, DragEndEvent, etc.) are unchanged and continue to work as before.

• #1938 e69387d Thanks @clauderic! - Added per-entity plugin configuration and moved feedback from the Draggable entity to the Feedback plugin.

  Draggable entities now accept a plugins property for per-entity plugin configuration, using the existing Plugin.configure() pattern. Plugins can read per-entity options via source.pluginConfig(PluginClass).

  The feedback property ('default' | 'move' | 'clone' | 'none') has been moved from the Draggable entity to FeedbackOptions. Drop animation can also now be configured per-draggable.

  Plugins listed in an entity's plugins array are auto-registered on the manager if not already present. The Sortable class now uses this generic mechanism instead of its own custom registration logic.

  Migration guide

  The feedback property has been moved from the draggable/sortable hook input to per-entity Feedback plugin configuration.

  Before:

  import {FeedbackType} from '@dnd-kit/dom';
  
  useDraggable({id: 'item', feedback: 'clone'});
  useSortable({id: 'item', index: 0, feedback: 'clone'});

  After:

  import {Feedback} from '@dnd-kit/dom';
  
  useDraggable({
    id: 'item',
    plugins: [Feedback.configure({feedback: 'clone'})],
  });
  useSortable({
    id: 'item',
    index: 0,
    plugins: (defaults) => [
      ...defaults,
      Feedback.configure({feedback: 'clone'}),
    ],
  });

  Drop animation can now be configured per-draggable:

  useDraggable({
    id: 'item',
    plugins: [Feedback.configure({feedback: 'clone', dropAnimation: null})],
  });

Patch Changes

• #1987 462e435 Thanks @clauderic! - fix: resolve DTS build errors with TypeScript 5.9 on Node 20

  Add explicit return type annotations to avoid [dispose] serialization failures during declaration emit, and fix useRef readonly errors for React 19 type compatibility.

• #1971 8fc1962 Thanks @clauderic! - Added LICENSE file to all published packages.

• #1924 8e3e5ee Thanks @clauderic! - Fix useDeepSignal calling flushSync from within a React lifecycle method.

  When signal updates are triggered synchronously from a React effect (e.g. during a useEffect batch), calling flushSync directly violates React's internal invariant. The synchronous re-render is now deferred to a microtask via queueMicrotask, which runs after the current React batch completes but before the next paint.

• Updated dependencies [4bc7e71, 87bf1e6, 521f760, c001272, cde61e4, 78af13b, 1328af8, 532ae9b, 267c97c, bfff7de, a5935e0, 462e435, 9b24dff, 8fc1962, 88d5ef9, 8115a57, 688e00f, cdaebff, e69387d, 11ff2eb, 7489265, 4e35963, 5a2ed80]:

  • @dnd-kit/dom@0.4.0
  • @dnd-kit/abstract@0.4.0
  • @dnd-kit/state@0.4.0

@dnd-kit/solid@0.4.0

Minor Changes

• #1915 9b24dff Thanks @clauderic! - Redesign event type system to follow the DOM EventMap pattern. Introduces DragDropEventMap for event object types and DragDropEventHandlers for event handler signatures, replacing the ambiguously named DragDropEvents. Event type aliases (CollisionEvent, DragStartEvent, etc.) now derive directly from DragDropEventMap rather than using Parameters<> extraction.

  Migration guide

  • DragDropEvents has been split into two types:
    • DragDropEventMap — maps event names to event object types (like WindowEventMap)
    • DragDropEventHandlers — maps event names to (event, manager) => void handler signatures
  • If you were importing DragDropEvents to type event objects, use DragDropEventMap instead:

    // Before
    type MyEvent = Parameters<DragDropEvents<D, P, M>['dragend']>[0];
    // After
    type MyEvent = DragDropEventMap<D, P, M>['dragend'];

  • If you were importing DragDropEvents to type event handlers, use DragDropEventHandlers instead:

    // Before
    const handler: DragDropEvents<D, P, M>['dragend'] = (event, manager) => {};
    // After
    const handler: DragDropEventHandlers<D, P, M>['dragend'] = (
      event,
      manager
    ) => {};

  • The DragDropEvents re-export from @dnd-kit/react and @dnd-kit/solid has been removed. Import DragDropEventMap or DragDropEventHandlers from @dnd-kit/abstract directly if needed.
  • Convenience aliases (CollisionEvent, DragStartEvent, DragEndEvent, etc.) are unchanged and continue to work as before.

• #1938 e69387d Thanks @clauderic! - Added per-entity plugin configuration and moved feedback from the Draggable entity to the Feedback plugin.

  Draggable entities now accept a plugins property for per-entity plugin configuration, using the existing Plugin.configure() pattern. Plugins can read per-entity options via source.pluginConfig(PluginClass).

  The feedback property ('default' | 'move' | 'clone' | 'none') has been moved from the Draggable entity to FeedbackOptions. Drop animation can also now be configured per-draggable.

  Plugins listed in an entity's plugins array are auto-registered on the manager if not already present. The Sortable class now uses this generic mechanism instead of its own custom registration logic.

  Migration guide

  The feedback property has been moved from the draggable/sortable hook input to per-entity Feedback plugin configuration.

  Before:

  import {FeedbackType} from '@dnd-kit/dom';
  
  useDraggable({id: 'item', feedback: 'clone'});
  useSortable({id: 'item', index: 0, feedback: 'clone'});

  After:

  import {Feedback} from '@dnd-kit/dom';
  
  useDraggable({
    id: 'item',
    plugins: [Feedback.configure({feedback: 'clone'})],
  });
  useSortable({
    id: 'item',
    index: 0,
    plugins: (defaults) => [
      ...defaults,
      Feedback.configure({feedback: 'clone'}),
    ],
  });

  Drop animation can now be configured per-draggable:

  useDraggable({
    id: 'item',
    plugins: [Feedback.configure({feedback: 'clone', dropAnimation: null})],
  });

Patch Changes

• #1971 8fc1962 Thanks @clauderic! - Added LICENSE file to all published packages.

• Updated dependencies [4bc7e71, 87bf1e6, 521f760, c001272, cde61e4, 78af13b, 1328af8, 532ae9b, 267c97c, bfff7de, a5935e0, 462e435, 9b24dff, 8fc1962, 88d5ef9, 8115a57, 688e00f, cdaebff, e69387d, 11ff2eb, 7489265, 4e35963, 5a2ed80]:

  • @dnd-kit/dom@0.4.0
  • @dnd-kit/abstract@0.4.0
  • @dnd-kit/state@0.4.0

@dnd-kit/svelte@0.4.0

Minor Changes

• #1915 9b24dff Thanks @clauderic! - Redesign event type system to follow the DOM EventMap pattern. Introduces DragDropEventMap for event object types and DragDropEventHandlers for event handler signatures, replacing the ambiguously named DragDropEvents. Event type aliases (CollisionEvent, DragStartEvent, etc.) now derive directly from DragDropEventMap rather than using Parameters<> extraction.

  Migration guide

  • DragDropEvents has been split into two types:
    • DragDropEventMap — maps event names to event object types (like WindowEventMap)
    • DragDropEventHandlers — maps event names to (event, manager) => void handler signatures
  • If you were importing DragDropEvents to type event objects, use DragDropEventMap instead:

    // Before
    type MyEvent = Parameters<DragDropEvents<D, P, M>['dragend']>[0];
    // After
    type MyEvent = DragDropEventMap<D, P, M>['dragend'];

  • If you were importing DragDropEvents to type event handlers, use DragDropEventHandlers instead:

    // Before
    const handler: DragDropEvents<D, P, M>['dragend'] = (event, manager) => {};
    // After
    const handler: DragDropEventHandlers<D, P, M>['dragend'] = (
      event,
      manager
    ) => {};

  • The DragDropEvents re-export from @dnd-kit/react and @dnd-kit/solid has been removed. Import DragDropEventMap or DragDropEventHandlers from @dnd-kit/abstract directly if needed.
  • Convenience aliases (CollisionEvent, DragStartEvent, DragEndEvent, etc.) are unchanged and continue to work as before.

• #1938 e69387d Thanks @clauderic! - Added per-entity plugin configuration and moved feedback from the Draggable entity to the Feedback plugin.

  Draggable entities now accept a plugins property for per-entity plugin configuration, using the existing Plugin.configure() pattern. Plugins can read per-entity options via source.pluginConfig(PluginClass).

  The feedback property ('default' | 'move' | 'clone' | 'none') has been moved from the Draggable entity to FeedbackOptions. Drop animation can also now be configured per-draggable.

  Plugins listed in an entity's plugins array are auto-registered on the manager if not already present. The Sortable class now uses this generic mechanism instead of its own custom registration logic.

  Migration guide

  The feedback property has been moved from the draggable/sortable hook input to per-entity Feedback plugin configuration.

  Before:

  import {FeedbackType} from '@dnd-kit/dom';
  
  useDraggable({id: 'item', feedback: 'clone'});
  useSortable({id: 'item', index: 0, feedback: 'clone'});

  After:

  import {Feedback} from '@dnd-kit/dom';
  
  useDraggable({
    id: 'item',
    plugins: [Feedback.configure({feedback: 'clone'})],
  });
  useSortable({
    id: 'item',
    index: 0,
    plugins: (defaults) => [
      ...defaults,
      Feedback.configure({feedback: 'clone'}),
    ],
  });

  Drop animation can now be configured per-draggable:

  useDraggable({
    id: 'item',
    plugins: [Feedback.configure({feedback: 'clone', dropAnimation: null})],
  });

• #1976 a78e9db Thanks @clauderic! - Remove OptimisticSortingPlugin from Svelte adapter defaults to prevent conflicts with Svelte 5's {#each} reconciliation. The plugin physically reorders DOM elements during drag, which breaks Svelte's internal effect linked list, causing incorrect mutations or an infinite loop when state is updated.

  Visual sorting during drag is now achieved by calling move() in an onDragOver handler, which routes all DOM reordering through Svelte's own reconciler. Update your sortable components to use the snapshot pattern:

  let snapshot = [];
  
  function onDragStart() { snapshot = items.slice(); }
  function onDragOver(event) { items = move(items, event); }
  function onDragEnd(event) { if (event.canceled) items = snapshot; }

Patch Changes

• #1971 8fc1962 Thanks @clauderic! - Added LICENSE file to all published packages.

• #1974 5323c96 Thanks @clauderic! - fix: guard element cleanup in sortable attach functions to prevent clearing element references during active drag operations

• #1975 4114b29 Thanks @clauderic! - fix: sync collisionDetector property in createSortable reactive effect

• Updated dependencies [4bc7e71, 87bf1e6, 521f760, c001272, cde61e4, 78af13b, 1328af8, 532ae9b, 267c97c, bfff7de, a5935e0, 462e435, 9b24dff, 8fc1962, 88d5ef9, 8115a57, 688e00f, cdaebff, e69387d, 11ff2eb, 7489265, 4e35963, 5a2ed80]:

  • @dnd-kit/dom@0.4.0
  • @dnd-kit/abstract@0.4.0
  • @dnd-kit/state@0.4.0

@dnd-kit/vue@0.4.0

Minor Changes

• #1915 9b24dff Thanks @clauderic! - Redesign event type system to follow the DOM EventMap pattern. Introduces DragDropEventMap for event object types and DragDropEventHandlers for event handler signatures, replacing the ambiguously named DragDropEvents. Event type aliases (CollisionEvent, DragStartEvent, etc.) now derive directly from DragDropEventMap rather than using Parameters<> extraction.

  Migration guide

  • DragDropEvents has been split into two types:
    • DragDropEventMap — maps event names to event object types (like WindowEventMap)
    • DragDropEventHandlers — maps event names to (event, manager) => void handler signatures
  • If you were importing DragDropEvents to type event objects, use DragDropEventMap instead:

    // Before
    type MyEvent = Parameters<DragDropEvents<D, P, M>['dragend']>[0];
    // After
    type MyEvent = DragDropEventMap<D, P, M>['dragend'];

  • If you were importing DragDropEvents to type event handlers, use DragDropEventHandlers instead:

    // Before
    const handler: DragDropEvents<D, P, M>['dragend'] = (event, manager) => {};
    // After
    const handler: DragDropEventHandlers<D, P, M>['dragend'] = (
      event,
      manager
    ) => {};

  • The DragDropEvents re-export from @dnd-kit/react and @dnd-kit/solid has been removed. Import DragDropEventMap or DragDropEventHandlers from @dnd-kit/abstract directly if needed.
  • Convenience aliases (CollisionEvent, DragStartEvent, DragEndEvent, etc.) are unchanged and continue to work as before.

• #1938 e69387d Thanks @clauderic! - Added per-entity plugin configuration and moved feedback from the Draggable entity to the Feedback plugin.

  Draggable entities now accept a plugins property for per-entity plugin configuration, using the existing Plugin.configure() pattern. Plugins can read per-entity options via source.pluginConfig(PluginClass).

  The feedback property ('default' | 'move' | 'clone' | 'none') has been moved from the Draggable entity to FeedbackOptions. Drop animation can also now be configured per-draggable.

  Plugins listed in an entity's plugins array are auto-registered on the manager if not already present. The Sortable class now uses this generic mechanism instead of its own custom registration logic.

  Migration guide

  The feedback property has been moved from the draggable/sortable hook input to per-entity Feedback plugin configuration.

  Before:

  import {FeedbackType} from '@dnd-kit/dom';
  
  useDraggable({id: 'item', feedback: 'clone'});
  useSortable({id: 'item', index: 0, feedback: 'clone'});

  After:

  import {Feedback} from '@dnd-kit/dom';
  
  useDraggable({
    id: 'item',
    plugins: [Feedback.configure({feedback: 'clone'})],
  });
  useSortable({
    id: 'item',
    index: 0,
    plugins: (defaults) => [
      ...defaults,
      Feedback.configure({feedback: 'clone'}),
    ],
  });

  Drop animation can now be configured per-draggable:

  useDraggable({
    id: 'item',
    plugins: [Feedback.configure({feedback: 'clone', dropAnimation: null})],
  });

Patch Changes

• #1971 8fc1962 Thanks @clauderic! - Added LICENSE file to all published packages.

• #1953 cdaebff Thanks @ImBaedin! - Fix sortable type narrowing so isSortable(event.operation.source) narrows to a sortable draggable with access to initialIndex, and re-export the drag event type aliases from @dnd-kit/vue.

• #1985 ed65220 Thanks @tenianon! - fix: preserve DragDropProvider emits type in built declaration files

• Updated dependencies [4bc7e71, 87bf1e6, 521f760, c001272, cde61e4, 78af13b, 1328af8, 532ae9b, 267c97c, bfff7de, a5935e0, 462e435, 9b24dff, 8fc1962, 88d5ef9, 8115a57, 688e00f, cdaebff, e69387d, 11ff2eb, 7489265, 4e35963, 5a2ed80]:

  • @dnd-kit/dom@0.4.0
  • @dnd-kit/abstract@0.4.0
  • @dnd-kit/state@0.4.0

@dnd-kit/collision@0.4.0

Patch Changes

• #1971 8fc1962 Thanks @clauderic! - Added LICENSE file to all published packages.

• Updated dependencies [cde61e4, a5935e0, 462e435, 9b24dff, 8fc1962, 8115a57, e69387d, 4e35963]:

  • @dnd-kit/abstract@0.4.0
  • @dnd-kit/geometry@0.4.0

@dnd-kit/geometry@0.4.0

Patch Changes

• #1971 8fc1962 Thanks @clauderic! - Added LICENSE file to all published packages.

• Updated dependencies [8fc1962]:

  • @dnd-kit/state@0.4.0

@dnd-kit/state@0.4.0

Patch Changes

• #1971 8fc1962 Thanks @clauderic! - Added LICENSE file to all published packages.