ngx-virtual-dnd 3.2.0-alpha.0 → 3.2.0-alpha.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ngx-virtual-dnd",
-  "version": "3.2.0-alpha.0",
+  "version": "3.2.0-alpha.2",
   "description": "A performant drag-and-drop library for Angular that works seamlessly with virtual scrolling",
   "keywords": [
     "angular",
@@ -21,7 +21,7 @@
     "type": "git",
     "url": "git+https://github.com/gultyayev/ngx-virtual-dnd.git"
   },
-  "homepage": "https://github.com/gultyayev/ngx-virtual-dnd#readme",
+  "homepage": "https://gultyayev.github.io/ngx-virtual-dnd/",
   "bugs": {
     "url": "https://github.com/gultyayev/ngx-virtual-dnd/issues"
   },

package/types/ngx-virtual-dnd.d.ts

@@ -351,13 +351,25 @@ interface VdndAnimationConfig {
      * @default 'cubic-bezier(0.2, 0, 0, 1)'
      */
     shiftEasing?: string;
+    /**
+     * Duration (ms) of the drop animation: on drop or cancel, the drag preview glides into
+     * the dropped item's final position instead of disappearing. `0` disables it.
+     * @default 200
+     */
+    dropDuration?: number;
+    /**
+     * CSS easing function for the drop animation.
+     * @default 'cubic-bezier(0.2, 0, 0, 1)'
+     */
+    dropEasing?: string;
 }
 /**
  * Opt-in animation configuration. When provided, items displaced by the placeholder
- * slide into their new position instead of jumping. Resolved through the element
+ * slide into their new position instead of jumping, and on drop the drag preview glides
+ * into the item's final position. Resolved through the element
  * injector, so it can be provided app-wide or per component subtree.
  *
- * The animation is skipped when the user prefers reduced motion. Values are read each
+ * Animations are skipped when the user prefers reduced motion. Values are read each
  * time an animation starts, so getters can toggle the animation at runtime.
  *
  * @example
@@ -748,6 +760,17 @@ declare class KeyboardDragService {
      * The droppable registry is managed externally.
      */
     moveToDroppable(droppableId: string, targetIndex: number, totalItemCount: number): void;
+    /**
+     * Register the callback that scrolls a droppable's placeholder into view. It runs
+     * synchronously on every keyboard move into or within that droppable, so a drop that
+     * follows before the next render still lands inside the rendered range.
+     */
+    registerRevealer(droppableId: string, reveal: () => void): void;
+    /**
+     * Unregister a droppable's reveal callback. Ignored if another callback has since been
+     * registered under the same ID.
+     */
+    unregisterRevealer(droppableId: string, reveal: () => void): void;
     /**
      * Complete the keyboard drag (Space or Enter to drop).
      */
@@ -983,6 +1006,9 @@ interface DragPreviewContext<T = unknown> {
  * so it works correctly even inside ancestors with CSS `transform` (e.g. Ionic pages).
  * It can be placed anywhere in the component tree.
  *
+ * When `VDND_ANIMATION_CONFIG` is provided, the preview stays up briefly after a drop or
+ * cancel and glides into the item's final position.
+ *
  * @example
  * ```html
  * <vdnd-drag-preview>
@@ -1004,6 +1030,12 @@ declare class DragPreviewComponent<T = unknown> implements OnDestroy {
     }>;
     /** Reference to the clone container element (cannot use ES private with viewChild) */
     private readonly cloneContainer;
+    /** The rendered preview box (cannot use ES private with viewChild) */
+    private readonly previewElement;
+    /** Whether the preview is playing the drop animation */
+    protected readonly isSettling: _angular_core.Signal<boolean>;
+    /** The item shown: the live dragged item, or the dropped one while it settles */
+    protected readonly displayedItem: _angular_core.Signal<DraggedItem | null>;
     /** The cloned element from drag state (used when no custom template is provided) */
     protected readonly clonedElement: _angular_core.Signal<HTMLElement | null>;
     constructor();
@@ -1011,10 +1043,7 @@ declare class DragPreviewComponent<T = unknown> implements OnDestroy {
     /** Whether the preview is visible */
     protected readonly isVisible: _angular_core.Signal<boolean>;
     /** Position of the preview */
-    protected readonly position: _angular_core.Signal<{
-        x: number;
-        y: number;
-    }>;
+    protected readonly position: _angular_core.Signal<CursorPosition>;
     /** Transform-based positioning for better performance (avoid layout from left/top). */
     protected readonly transform: _angular_core.Signal<string>;
     /** Dimensions of the preview */