@vue-dnd-kit/core/dist/internal/sensors/sensor.d.ts

Core functionality for Vue DnD Kit - a lightweight Vue 3 library for building performant and accessible drag and drop interfaces

import { IBoundingBox } from '../utils/geometry';
import { IDnDProviderInternal } from '../types/provider';
/**
 * Collision detection function signature.
 * Returns sorted lists of colliding elements and zones.
 *
 * IMPORTANT: When implementing custom sensors, use:
 * - `provider.entities.allowedDroppableSet` for zones (visible + filtered by groups)
 * - `provider.entities.allowedDraggableSet` for draggedItems (visible + filtered by groups)
 * OR use helper functions from `steps.ts`: `allowedVisibleZones()` and `visibleElements()`.
 */
export type CollisionDetectionFn = (provider: IDnDProviderInternal) => {
    elements: HTMLElement[];
    zones: HTMLElement[];
};
export type TContainerFn = (provider: IDnDProviderInternal) => HTMLElement | null;
export type TContainerBoxFn = (provider: IDnDProviderInternal) => IBoundingBox;
export type TCandidatesFn = (provider: IDnDProviderInternal) => Iterable<HTMLElement>;
export type TFilterFn = (node: HTMLElement, provider: IDnDProviderInternal) => boolean;
export type TCollisionContext = {
    containerBox: IBoundingBox;
    pointer: {
        x: number;
        y: number;
    };
};
export type TCollisionCheckFn = (nodeBox: IBoundingBox, ctx: TCollisionContext) => boolean;
export type TSortCompareFn = (a: {
    node: HTMLElement;
    box: IBoundingBox;
    meta: ICollisionMeta;
}, b: {
    node: HTMLElement;
    box: IBoundingBox;
    meta: ICollisionMeta;
}, ctx: {
    containerBox: IBoundingBox;
    pointer: {
        x: number;
        y: number;
    };
}) => number;
/** Merge strategy: how to combine elements and zones into final result */
export type TMergeStrategy = 'separate' | 'unified-closest';
export interface ICollisionMeta {
    isPointerInElement: boolean;
    overlapPercent: number;
    depth: number;
    centerDistance: number;
}
export interface ISensorBuilder {
    container(fn: TContainerFn): ISensorBuilder;
    containerBox(fn: TContainerBoxFn): ISensorBuilder;
    elements(fn: TCandidatesFn): ISensorBuilder;
    zones(fn: TCandidatesFn): ISensorBuilder;
    filterElements(fn: TFilterFn): ISensorBuilder;
    filterZones(fn: TFilterFn): ISensorBuilder;
    collision(fn: TCollisionCheckFn): ISensorBuilder;
    sortElements(fn: TSortCompareFn): ISensorBuilder;
    sortZones(fn: TSortCompareFn): ISensorBuilder;
    mergeStrategy(strategy: TMergeStrategy): ISensorBuilder;
    /** Pick closest between first zone and first element by distance to pointer */
    pickClosestBetweenFirst(enable: boolean): ISensorBuilder;
    /** Filter by minimum overlap percent (0-100). Applied after collision check. */
    minOverlapPercent(percent: number): ISensorBuilder;
    build(): CollisionDetectionFn;
}
export declare const createSensor: () => ISensorBuilder;