@vue-dnd-kit/core 2.1.4 → 2.1.5

package/README.md

@@ -1,74 +1,74 @@
-# Vue DnD Kit - Core Package
-
-[![Release](https://img.shields.io/badge/status-release-green.svg)](https://github.com/zizigy/vue-dnd-kit)
-[![npm version](https://img.shields.io/npm/v/@vue-dnd-kit/core.svg)](https://www.npmjs.com/package/@vue-dnd-kit/core)
-
-<p align="center">
-  <a href="https://zizigy.github.io/vue-dnd-kit/">
-    <img src="https://raw.githubusercontent.com/ZiZiGY/vue-dnd-kit/v2/public/logo.svg" width="400" alt="Vue Drag & Drop Logo">
-  </a>
-</p>
-
-<p align="center">
-  Core package of the Vue Drag & Drop library with composables and provider-based API.
-</p>
-
-<p align="center">
-  <a href="https://zizigy.github.io/vue-dnd-kit/" target="_blank">
-    <img src="https://img.shields.io/badge/Documentation-Visit-blue?style=flat-square" alt="Documentation">
-  </a>
-</p>
-
-<p align="center">
-  Inspired by <a href="https://dndkit.com/" target="_blank">React DnD Kit</a>, adapted for Vue.js
-</p>
-
----
-
-## About
-
-**Vue DnD Kit** — lightweight drag & drop library for Vue 3. Built around a provider (`DnDProvider`) and composables: `makeDraggable`, `makeDroppable`, `makeSelectionArea`, `makeConstraintArea`.
-
-- **Lightweight** — small bundle size, no extra dependencies (Vue as peer only)
-- **Flexible** — works with any layout and design system
-- **Accessible** — full keyboard support (start, move, cancel, drop)
-- **TypeScript** — fully typed
-
----
-
-## Features
-
-- **Composables API** — `makeDraggable`, `makeDroppable`, `makeSelectionArea`, `makeConstraintArea`
-- **Provider-based** — `DnDProvider` + `useDnDProvider` for state access
-- **Keyboard support** — Enter/Space for start and drop, arrows for movement, Escape to cancel
-- **Modifier keys** — drag only when modifier held (e.g. Ctrl)
-- **Custom overlay** — custom drag preview via slot or `render` option
-
----
-
-## Installation
-
-```bash
-npm install @vue-dnd-kit/core
-```
-
-```bash
-yarn add @vue-dnd-kit/core
-```
-
-```bash
-pnpm add @vue-dnd-kit/core
-```
-
-**Peer dependency:** Vue 3
-
----
-
-## License
-
-[MIT](LICENSE) © [ZiZiGY](https://github.com/ZiZiGY)
-
----
-
-<p align="center">🎉 Congratulations on the official release! 🎉</p>
-<p align="center">Made with ❤️ for the Vue.js community</p>
+# Vue DnD Kit - Core Package
+
+[![Release](https://img.shields.io/badge/status-release-green.svg)](https://github.com/zizigy/vue-dnd-kit)
+[![npm version](https://img.shields.io/npm/v/@vue-dnd-kit/core.svg)](https://www.npmjs.com/package/@vue-dnd-kit/core)
+
+<p align="center">
+  <a href="https://zizigy.github.io/vue-dnd-kit/">
+    <img src="https://raw.githubusercontent.com/ZiZiGY/vue-dnd-kit/v2/public/logo.svg" width="400" alt="Vue Drag & Drop Logo">
+  </a>
+</p>
+
+<p align="center">
+  Core package of the Vue Drag & Drop library with composables and provider-based API.
+</p>
+
+<p align="center">
+  <a href="https://zizigy.github.io/vue-dnd-kit/" target="_blank">
+    <img src="https://img.shields.io/badge/Documentation-Visit-blue?style=flat-square" alt="Documentation">
+  </a>
+</p>
+
+<p align="center">
+  Inspired by <a href="https://dndkit.com/" target="_blank">React DnD Kit</a>, adapted for Vue.js
+</p>
+
+---
+
+## About
+
+**Vue DnD Kit** — lightweight drag & drop library for Vue 3. Built around a provider (`DnDProvider`) and composables: `makeDraggable`, `makeDroppable`, `makeSelectionArea`, `makeConstraintArea`.
+
+- **Lightweight** — small bundle size, no extra dependencies (Vue as peer only)
+- **Flexible** — works with any layout and design system
+- **Accessible** — full keyboard support (start, move, cancel, drop)
+- **TypeScript** — fully typed
+
+---
+
+## Features
+
+- **Composables API** — `makeDraggable`, `makeDroppable`, `makeSelectionArea`, `makeConstraintArea`
+- **Provider-based** — `DnDProvider` + `useDnDProvider` for state access
+- **Keyboard support** — Enter/Space for start and drop, arrows for movement, Escape to cancel
+- **Modifier keys** — drag only when modifier held (e.g. Ctrl)
+- **Custom overlay** — custom drag preview via slot or `render` option
+
+---
+
+## Installation
+
+```bash
+npm install @vue-dnd-kit/core
+```
+
+```bash
+yarn add @vue-dnd-kit/core
+```
+
+```bash
+pnpm add @vue-dnd-kit/core
+```
+
+**Peer dependency:** Vue 3
+
+---
+
+## License
+
+[MIT](LICENSE) © [ZiZiGY](https://github.com/ZiZiGY)
+
+---
+
+<p align="center">🎉 Congratulations on the official release! 🎉</p>
+<p align="center">Made with ❤️ for the Vue.js community</p>

package/dist/external/types/entities.d.ts

@@ -2,201 +2,203 @@ import { ComponentPublicInstance, ComputedRef, Ref, ShallowRef } from 'vue';
 import { IPlacement, IPlacementMargins } from './placement';
 import { IDragEvent } from './provider';
 import { IHoveredDraggableContext } from './operations';
-export type TDnDNode = HTMLElement | ComponentPublicInstance | null;
-export type TDnDNodeRef = Readonly<Ref<TDnDNode>>;
-export type TDragAxis = 'x' | 'y' | 'both';
-/** Factory registered on a draggable: returns [index, items] */
-export type TDraggablePayload<T = any> = () => [number, T[]];
-
-/** Factory registered on a droppable zone: returns items array */
-export type TDroppablePayload<T = any> = () => T[];
-
-// ─── Public event types ────────────────────────────────────────────────────────
-
-/** One dragged item — always carries its source array and position */
-export interface IDragItem<T = unknown> {
-  /** Index of this item in `items` */
-  index: number;
-  /** The actual object: `items[index]` */
-  item: T;
-  /** Source array (same reference as passed to the draggable payload factory) */
-  items: T[];
-  /** Custom data from the `data` option (reactive, always up-to-date) */
-  data?: unknown;
-}
-
-/** Drop zone context — present in onEnter / onDrop / onLeave */
-export interface IDropZoneContext<T = unknown> {
-  items: T[];
-  /** Cursor position relative to the zone boundary */
-  placement: IPlacement | undefined;
-  /** Custom data from the `data` option (reactive, always up-to-date) */
-  data?: unknown;
-}
-
-export interface IBaseOptions {
-  disabled?: boolean | Ref<boolean>;
-  groups?: string[] | Ref<string[]>;
-}
-
-export interface IBaseEntity {
-  disabled?: boolean;
-  groups?: string[];
-}
-
-export interface IEntities {
-  draggableMap: Map<HTMLElement, IDraggableEntity>;
-  droppableMap: Map<HTMLElement, IDroppableEntity>;
-
-  selectingArea?: HTMLElement;
-  initiatingDraggable?: HTMLElement;
-
-  selectableAreaMap: Map<HTMLElement, ISelectableAreaEntity>;
-  constraintsAreaMap: Map<HTMLElement, IConstraintsAreaEntity>;
-
-  draggingMap: Map<HTMLElement, IDraggingEntity>;
-  selectedSet: Set<HTMLElement>;
-  /** Snapshot of selectedSet taken at the start of a rubber-band selection session.
-   *  Elements in this set are preserved when the new rect doesn't cover them. */
-  selectionBase: Set<HTMLElement>;
-
-  modifiersDraggableSet: ComputedRef<Set<HTMLElement>>;
-  modifiersSelectableAreaSet: ComputedRef<Set<HTMLElement>>;
-
-  allowedDroppableSet: ComputedRef<Set<HTMLElement>>;
-  allowedDraggableSet: ComputedRef<Set<HTMLElement>>;
-
-  visibleDraggableSet: Set<HTMLElement>;
-  visibleDroppableSet: Set<HTMLElement>;
-  visibleSelectableAreaSet: Set<HTMLElement>;
-}
-
-export type TModifierMethod = 'every' | 'some';
-export type TModifierKeys = string[];
-
-export interface IModifier {
-  keys: TModifierKeys;
-  method: TModifierMethod;
-}
-
-export interface IModifierOptions {
-  keys: TModifierKeys | Ref<TModifierKeys>;
-  method: TModifierMethod | Ref<TModifierMethod>;
-}
-
-export interface ISelectableAreaEvents {
-  /** Called when selection ends (pointer up) with selected elements */
-  onSelected?: (selected: HTMLElement[]) => void;
-}
-
-export interface ISelectableAreaEntity extends IBaseEntity {
-  modifier: IModifier;
-  events?: ISelectableAreaEvents;
-}
-
-export interface IConstraintsAreaEntity {
-  axis?: TDragAxis;
-  restrictToArea?: boolean;
-}
-
-export interface IDraggableEvents {
-  /** Dragged element(s) — identifies which element is being dragged */
-  onSelfDragStart?: (event: IDragEvent) => void;
-  onSelfDragMove?: (event: IDragEvent) => void;
-  onSelfDragEnd?: (event: IDragEvent) => void;
-  onSelfDragCancel?: (event: IDragEvent) => void;
-
-  /** Element under cursor during drag — when another element is dragged over this one */
-  onDragStart?: (event: IDragEvent) => void;
-  onDragMove?: (event: IDragEvent) => void;
-  onDragEnd?: (event: IDragEvent) => void;
-  onDragCancel?: (event: IDragEvent) => void;
-
-  /** Alias / shortcut: cursor enters this draggable during drag */
-  onHover?: (event: IDragEvent) => void;
-  /** Cursor leaves this draggable during drag */
-  onLeave?: (event: IDragEvent) => void;
-}
-
-export interface IDropValidateEvent {
-  /** Items whose groups are compatible with the zone's groups */
-  validItems: IDragItem[];
-  /** Items whose groups do NOT match the zone's groups */
-  invalidItems: IDragItem[];
-  dropZone: IDropZoneContext | undefined;
-  hoveredDraggable?: IHoveredDraggableContext;
-}
-
-export interface IDroppableEvents {
-  onEnter?: (event: IDragEvent) => void;
-  /**
-   * Called before `onDrop` when `groupMatch: 'some'` and some dragged items
-   * don't match the zone's groups. Receives valid/invalid item split.
-   *
-   * Return:
-   * - `void` — drop only `validItems` (default)
-   * - `false` — decline this drop (drag stays active)
-   * - `IDragItem[]` — drop exactly these items
-   * - `Promise<...>` — async (state becomes 'pending' while waiting)
-   */
-  onValidate?: (
-    event: IDropValidateEvent
-  ) => void | false | IDragItem[] | Promise<void | false | IDragItem[]>;
-  onDrop?: (event: IDragEvent) => void | boolean | Promise<void | boolean>;
-  onLeave?: (event: IDragEvent) => void;
-}
-
-export interface IDragActivationOptions {
-  distance?:
-    | {
-        x?: number | Ref<number>;
-        y?: number | Ref<number>;
-        condition?: TCondition | Ref<TCondition>;
-      }
-    | number
-    | Ref<number>;
-  delay?: number | Ref<number>;
-}
-
-export interface IDragActivation {
-  distance?:
-    | {
-        x?: number;
-        y?: number;
-        condition?: TCondition;
-      }
-    | number;
-  delay?: number;
-  condition?: TCondition;
-}
-
-export type TCondition = 'any' | 'both';
-
-export interface IDraggableEntity extends IBaseEntity {
-  render?: Component;
-  events?: IDraggableEvents;
-  payload?: TDraggablePayload;
-  data?: () => unknown;
-  modifier?: IModifier;
-  dragHandle?: string;
-  activation?: IDragActivation;
-  /** Margins for center zone. When pointer in center and element is also droppable, zone mode is used. */
-  placementMargins?: IPlacementMargins;
-  hoveredPlacement?: IPlacement;
-}
-
-export interface IDraggingEntity extends IDraggableEntity {
-  initialHTML: string;
-  initialRect: DOMRect;
-  initialOuterHTML: string;
-}
-
-export interface IDroppableEntity extends IBaseEntity {
-  /** 'every' — all dragged items must match zone groups (default).
-   *  'some'  — zone is accessible if at least one item matches. */
-  groupMatch?: TModifierMethod;
-  events?: IDroppableEvents;
-  payload?: TDroppablePayload;
-  data?: () => unknown;
-  hoveredPlacement: IPlacement | undefined;
-}
+
+
+export type TDnDNode = HTMLElement | ComponentPublicInstance | null;
+export type TDnDNodeRef = Readonly<Ref<TDnDNode>>;
+export type TDragAxis = 'x' | 'y' | 'both';
+/** Factory registered on a draggable: returns [index, items] */
+export type TDraggablePayload<T = any> = () => [number, T[]];
+
+/** Factory registered on a droppable zone: returns items array */
+export type TDroppablePayload<T = any> = () => T[];
+
+// ─── Public event types ────────────────────────────────────────────────────────
+
+/** One dragged item — always carries its source array and position */
+export interface IDragItem<T = unknown> {
+  /** Index of this item in `items` */
+  index: number;
+  /** The actual object: `items[index]` */
+  item: T;
+  /** Source array (same reference as passed to the draggable payload factory) */
+  items: T[];
+  /** Custom data from the `data` option (reactive, always up-to-date) */
+  data?: unknown;
+}
+
+/** Drop zone context — present in onEnter / onDrop / onLeave */
+export interface IDropZoneContext<T = unknown> {
+  items: T[];
+  /** Cursor position relative to the zone boundary */
+  placement: IPlacement | undefined;
+  /** Custom data from the `data` option (reactive, always up-to-date) */
+  data?: unknown;
+}
+
+export interface IBaseOptions {
+  disabled?: boolean | Ref<boolean>;
+  groups?: string[] | Ref<string[]>;
+}
+
+export interface IBaseEntity {
+  disabled?: boolean;
+  groups?: string[];
+}
+
+export interface IEntities {
+  draggableMap: Map<HTMLElement, IDraggableEntity>;
+  droppableMap: Map<HTMLElement, IDroppableEntity>;
+
+  selectingArea?: HTMLElement;
+  initiatingDraggable?: HTMLElement;
+
+  selectableAreaMap: Map<HTMLElement, ISelectableAreaEntity>;
+  constraintsAreaMap: Map<HTMLElement, IConstraintsAreaEntity>;
+
+  draggingMap: Map<HTMLElement, IDraggingEntity>;
+  selectedSet: Set<HTMLElement>;
+  /** Snapshot of selectedSet taken at the start of a rubber-band selection session.
+   *  Elements in this set are preserved when the new rect doesn't cover them. */
+  selectionBase: Set<HTMLElement>;
+
+  modifiersDraggableSet: ComputedRef<Set<HTMLElement>>;
+  modifiersSelectableAreaSet: ComputedRef<Set<HTMLElement>>;
+
+  allowedDroppableSet: ComputedRef<Set<HTMLElement>>;
+  allowedDraggableSet: ComputedRef<Set<HTMLElement>>;
+
+  visibleDraggableSet: Set<HTMLElement>;
+  visibleDroppableSet: Set<HTMLElement>;
+  visibleSelectableAreaSet: Set<HTMLElement>;
+}
+
+export type TModifierMethod = 'every' | 'some';
+export type TModifierKeys = string[];
+
+export interface IModifier {
+  keys: TModifierKeys;
+  method: TModifierMethod;
+}
+
+export interface IModifierOptions {
+  keys: TModifierKeys | Ref<TModifierKeys>;
+  method: TModifierMethod | Ref<TModifierMethod>;
+}
+
+export interface ISelectableAreaEvents {
+  /** Called when selection ends (pointer up) with selected elements */
+  onSelected?: (selected: HTMLElement[]) => void;
+}
+
+export interface ISelectableAreaEntity extends IBaseEntity {
+  modifier: IModifier;
+  events?: ISelectableAreaEvents;
+}
+
+export interface IConstraintsAreaEntity {
+  axis?: TDragAxis;
+  restrictToArea?: boolean;
+}
+
+export interface IDraggableEvents {
+  /** Dragged element(s) — identifies which element is being dragged */
+  onSelfDragStart?: (event: IDragEvent) => void;
+  onSelfDragMove?: (event: IDragEvent) => void;
+  onSelfDragEnd?: (event: IDragEvent) => void;
+  onSelfDragCancel?: (event: IDragEvent) => void;
+
+  /** Element under cursor during drag — when another element is dragged over this one */
+  onDragStart?: (event: IDragEvent) => void;
+  onDragMove?: (event: IDragEvent) => void;
+  onDragEnd?: (event: IDragEvent) => void;
+  onDragCancel?: (event: IDragEvent) => void;
+
+  /** Alias / shortcut: cursor enters this draggable during drag */
+  onHover?: (event: IDragEvent) => void;
+  /** Cursor leaves this draggable during drag */
+  onLeave?: (event: IDragEvent) => void;
+}
+
+export interface IDropValidateEvent {
+  /** Items whose groups are compatible with the zone's groups */
+  validItems: IDragItem[];
+  /** Items whose groups do NOT match the zone's groups */
+  invalidItems: IDragItem[];
+  dropZone: IDropZoneContext | undefined;
+  hoveredDraggable?: IHoveredDraggableContext;
+}
+
+export interface IDroppableEvents {
+  onEnter?: (event: IDragEvent) => void;
+  /**
+   * Called before `onDrop` when `groupMatch: 'some'` and some dragged items
+   * don't match the zone's groups. Receives valid/invalid item split.
+   *
+   * Return:
+   * - `void` — drop only `validItems` (default)
+   * - `false` — decline this drop (drag stays active)
+   * - `IDragItem[]` — drop exactly these items
+   * - `Promise<...>` — async (state becomes 'pending' while waiting)
+   */
+  onValidate?: (
+    event: IDropValidateEvent
+  ) => void | false | IDragItem[] | Promise<void | false | IDragItem[]>;
+  onDrop?: (event: IDragEvent) => void | boolean | Promise<void | boolean>;
+  onLeave?: (event: IDragEvent) => void;
+}
+
+export interface IDragActivationOptions {
+  distance?:
+    | {
+        x?: number | Ref<number>;
+        y?: number | Ref<number>;
+        condition?: TCondition | Ref<TCondition>;
+      }
+    | number
+    | Ref<number>;
+  delay?: number | Ref<number>;
+}
+
+export interface IDragActivation {
+  distance?:
+    | {
+        x?: number;
+        y?: number;
+        condition?: TCondition;
+      }
+    | number;
+  delay?: number;
+  condition?: TCondition;
+}
+
+export type TCondition = 'any' | 'both';
+
+export interface IDraggableEntity extends IBaseEntity {
+  render?: Component;
+  events?: IDraggableEvents;
+  payload?: TDraggablePayload;
+  data?: () => unknown;
+  modifier?: IModifier;
+  dragHandle?: string;
+  activation?: IDragActivation;
+  /** Margins for center zone. When pointer in center and element is also droppable, zone mode is used. */
+  placementMargins?: IPlacementMargins;
+  hoveredPlacement?: IPlacement;
+}
+
+export interface IDraggingEntity extends IDraggableEntity {
+  initialHTML: string;
+  initialRect: DOMRect;
+  initialOuterHTML: string;
+}
+
+export interface IDroppableEntity extends IBaseEntity {
+  /** 'every' — all dragged items must match zone groups (default).
+   *  'some'  — zone is accessible if at least one item matches. */
+  groupMatch?: TModifierMethod;
+  events?: IDroppableEvents;
+  payload?: TDroppablePayload;
+  data?: () => unknown;
+  hoveredPlacement: IPlacement | undefined;
+}

package/dist/external/types/index.d.ts

@@ -1,5 +1,5 @@
-export type * from './pointer';
-export type * from './provider';
-export type * from './placement';
-export type * from './entities';
-export type * from './operations';
+export type * from './pointer';
+export type * from './provider';
+export type * from './placement';
+export type * from './entities';
+export type * from './operations';