@angular/cdk-experimental - npm Package Compare versions

Comparing version 6.4.3 to 6.4.5

bundles/cdk-experimental-drag-drop.umd.js

@@ -114,21 +114,23 @@ /**
 var /** @type {?} */ activeEventOptions = platform.supportsPassiveEventListeners() ? { passive: false } : false;
+// unsupported: template constraints.
 /**
- * Service that keeps track of all the `CdkDrag` and `CdkDrop` instances, and
- * manages global event listeners on the `document`.
+ * Service that keeps track of all the drag item and drop container
+ * instances, and manages global event listeners on the `document`.
  * \@docs-private
+ * @template I, C
  */
-var CdkDragDropRegistry = /** @class */ (function () {
-    function CdkDragDropRegistry(_ngZone, _document) {
+var DragDropRegistry = /** @class */ (function () {
+    function DragDropRegistry(_ngZone, _document) {
         var _this = this;
         this._ngZone = _ngZone;
         /**
-         * Registered `CdkDrop` instances.
+         * Registered drop container instances.
          */
         this._dropInstances = new Set();
         /**
-         * Registered `CdkDrag` instances.
+         * Registered drag item instances.
          */
         this._dragInstances = new Set();
         /**
-         * `CdkDrag` instances that are currently being dragged.
+         * Drag item instances that are currently being dragged.
          */
@@ -142,3 +144,3 @@ this._activeDragInstances = new Set();
          * Emits the `touchmove` or `mousemove` events that are dispatched
-         * while the user is dragging a `CdkDrag` instance.
+         * while the user is dragging a drag item instance.
          */
@@ -148,3 +150,3 @@ this.pointerMove = new rxjs.Subject();
          * Emits the `touchend` or `mouseup` events that are dispatched
-         * while the user is dragging a `CdkDrag` instance.
+         * while the user is dragging a drag item instance.
          */
@@ -164,52 +166,76 @@ this.pointerUp = new rxjs.Subject();
     }
+    /** Adds a drop container to the registry. */
     /**
-     * @param {?} instance
+     * Adds a drop container to the registry.
+     * @param {?} drop
      * @return {?}
      */
-    CdkDragDropRegistry.prototype.register = /**
-     * @param {?} instance
+    DragDropRegistry.prototype.registerDropContainer = /**
+     * Adds a drop container to the registry.
+     * @param {?} drop
      * @return {?}
      */
-    function (instance) {
-        var _this = this;
-        if (instance instanceof CdkDrop) {
-            if (!this._dropInstances.has(instance)) {
-                if (this.getDropContainer(instance.id)) {
-                    throw Error("Drop instance with id \"" + instance.id + "\" has already been registered.");
-                }
-                this._dropInstances.add(instance);
+    function (drop) {
+        if (!this._dropInstances.has(drop)) {
+            if (this.getDropContainer(drop.id)) {
+                throw Error("Drop instance with id \"" + drop.id + "\" has already been registered.");
             }
+            this._dropInstances.add(drop);
         }
-        else {
-            this._dragInstances.add(instance);
-            if (this._dragInstances.size === 1) {
-                this._ngZone.runOutsideAngular(function () {
-                    // The event handler has to be explicitly active, because
-                    // newer browsers make it passive by default.
-                    // The event handler has to be explicitly active, because
-                    // newer browsers make it passive by default.
-                    _this._document.addEventListener('touchmove', _this._preventScrollListener, activeEventOptions);
-                });
-            }
+    };
+    /** Adds a drag item instance to the registry. */
+    /**
+     * Adds a drag item instance to the registry.
+     * @param {?} drag
+     * @return {?}
+     */
+    DragDropRegistry.prototype.registerDragItem = /**
+     * Adds a drag item instance to the registry.
+     * @param {?} drag
+     * @return {?}
+     */
+    function (drag) {
+        var _this = this;
+        this._dragInstances.add(drag);
+        if (this._dragInstances.size === 1) {
+            this._ngZone.runOutsideAngular(function () {
+                // The event handler has to be explicitly active, because
+                // newer browsers make it passive by default.
+                // The event handler has to be explicitly active, because
+                // newer browsers make it passive by default.
+                _this._document.addEventListener('touchmove', _this._preventScrollListener, activeEventOptions);
+            });
         }
     };
+    /** Removes a drop container from the registry. */
     /**
-     * @param {?} instance
+     * Removes a drop container from the registry.
+     * @param {?} drop
      * @return {?}
      */
-    CdkDragDropRegistry.prototype.remove = /**
-     * @param {?} instance
+    DragDropRegistry.prototype.removeDropContainer = /**
+     * Removes a drop container from the registry.
+     * @param {?} drop
      * @return {?}
      */
-    function (instance) {
-        if (instance instanceof CdkDrop) {
-            this._dropInstances.delete(instance);
+    function (drop) {
+        this._dropInstances.delete(drop);
+    };
+    /** Removes a drag item instance from the registry. */
+    /**
+     * Removes a drag item instance from the registry.
+     * @param {?} drag
+     * @return {?}
+     */
+    DragDropRegistry.prototype.removeDragItem = /**
+     * Removes a drag item instance from the registry.
+     * @param {?} drag
+     * @return {?}
+     */
+    function (drag) {
+        this._dragInstances.delete(drag);
+        this.stopDragging(drag);
+        if (this._dragInstances.size === 0) {
+            this._document.removeEventListener('touchmove', this._preventScrollListener, /** @type {?} */ (activeEventOptions));
         }
-        else {
-            this._dragInstances.delete(instance);
-            this.stopDragging(instance);
-            if (this._dragInstances.size === 0) {
-                this._document.removeEventListener('touchmove', this._preventScrollListener, /** @type {?} */ (activeEventOptions));
-            }
-        }
     };
@@ -227,3 +253,3 @@ /**
      */
-    CdkDragDropRegistry.prototype.startDragging = /**
+    DragDropRegistry.prototype.startDragging = /**
      * Starts the dragging sequence for a drag instance.
@@ -254,10 +280,10 @@ * @param {?} drag Drag instance which is being dragged.
     };
-    /** Stops dragging a `CdkDrag` instance. */
+    /** Stops dragging a drag item instance. */
     /**
-     * Stops dragging a `CdkDrag` instance.
+     * Stops dragging a drag item instance.
      * @param {?} drag
      * @return {?}
      */
-    CdkDragDropRegistry.prototype.stopDragging = /**
-     * Stops dragging a `CdkDrag` instance.
+    DragDropRegistry.prototype.stopDragging = /**
+     * Stops dragging a drag item instance.
      * @param {?} drag
@@ -272,10 +298,10 @@ * @return {?}
     };
-    /** Gets whether a `CdkDrag` instance is currently being dragged. */
+    /** Gets whether a drag item instance is currently being dragged. */
     /**
-     * Gets whether a `CdkDrag` instance is currently being dragged.
+     * Gets whether a drag item instance is currently being dragged.
      * @param {?} drag
      * @return {?}
      */
-    CdkDragDropRegistry.prototype.isDragging = /**
-     * Gets whether a `CdkDrag` instance is currently being dragged.
+    DragDropRegistry.prototype.isDragging = /**
+     * Gets whether a drag item instance is currently being dragged.
      * @param {?} drag
@@ -287,12 +313,10 @@ * @return {?}
     };
-    /** Gets a `CdkDrop` instance by its id. */
+    /** Gets a drop container by its id. */
     /**
-     * Gets a `CdkDrop` instance by its id.
-     * @template T
+     * Gets a drop container by its id.
      * @param {?} id
      * @return {?}
      */
-    CdkDragDropRegistry.prototype.getDropContainer = /**
-     * Gets a `CdkDrop` instance by its id.
-     * @template T
+    DragDropRegistry.prototype.getDropContainer = /**
+     * Gets a drop container by its id.
      * @param {?} id
@@ -307,3 +331,3 @@ * @return {?}
      */
-    CdkDragDropRegistry.prototype.ngOnDestroy = /**
+    DragDropRegistry.prototype.ngOnDestroy = /**
      * @return {?}
@@ -313,4 +337,4 @@ */
         var _this = this;
-        this._dragInstances.forEach(function (instance) { return _this.remove(instance); });
-        this._dropInstances.forEach(function (instance) { return _this.remove(instance); });
+        this._dragInstances.forEach(function (instance) { return _this.removeDragItem(instance); });
+        this._dropInstances.forEach(function (instance) { return _this.removeDropContainer(instance); });
         this._clearGlobalListeners();
@@ -324,3 +348,3 @@ this.pointerMove.complete();
      */
-    CdkDragDropRegistry.prototype._clearGlobalListeners = /**
+    DragDropRegistry.prototype._clearGlobalListeners = /**
      * Clears out the global event listeners from the `document`.
@@ -336,12 +360,12 @@ * @return {?}
     };
-    CdkDragDropRegistry.decorators = [
+    DragDropRegistry.decorators = [
         { type: core.Injectable, args: [{ providedIn: 'root' },] },
     ];
     /** @nocollapse */
-    CdkDragDropRegistry.ctorParameters = function () { return [
+    DragDropRegistry.ctorParameters = function () { return [
         { type: core.NgZone, },
         { type: undefined, decorators: [{ type: core.Inject, args: [common.DOCUMENT,] },] },
     ]; };
-    /** @nocollapse */ CdkDragDropRegistry.ngInjectableDef = core.defineInjectable({ factory: function CdkDragDropRegistry_Factory() { return new CdkDragDropRegistry(core.inject(core.NgZone), core.inject(common.DOCUMENT)); }, token: CdkDragDropRegistry, providedIn: "root" });
-    return CdkDragDropRegistry;
+    /** @nocollapse */ DragDropRegistry.ngInjectableDef = core.defineInjectable({ factory: function DragDropRegistry_Factory() { return new DragDropRegistry(core.inject(core.NgZone), core.inject(common.DOCUMENT)); }, token: DragDropRegistry, providedIn: "root" });
+    return DragDropRegistry;
 }());
@@ -449,3 +473,3 @@
         this._pointerMove = function (event) {
-            // TODO: this should start dragging after a certain threshold,
+            // TODO(crisbeto): this should start dragging after a certain threshold,
             // otherwise we risk interfering with clicks on the element.
@@ -491,3 +515,3 @@ if (!_this._dragDropRegistry.isDragging(_this)) {
         this._document = document;
-        _dragDropRegistry.register(this);
+        _dragDropRegistry.registerDragItem(this);
     }
@@ -528,3 +552,3 @@ /**
         this._nextSibling = null;
-        this._dragDropRegistry.remove(this);
+        this._dragDropRegistry.removeDragItem(this);
         this._destroyed.next();
@@ -570,3 +594,2 @@ this._destroyed.complete();
         var _this = this;
-        var /** @type {?} */ currentIndex = this._getElementIndexInDom(this._placeholder);
         // Restore the element's visibility and insert it at its old position in the DOM.
@@ -587,2 +610,3 @@ // It's important that we maintain the position, because moving the element around in the DOM
         this._ngZone.run(function () {
+            var /** @type {?} */ currentIndex = _this.dropContainer.getItemIndex(_this);
             _this.ended.emit({ source: _this });
@@ -626,3 +650,3 @@ _this.dropped.emit({
                 _this.dropContainer = newContainer;
-                _this.dropContainer.enter(_this);
+                _this.dropContainer.enter(_this, x, y);
             });
@@ -684,40 +708,2 @@ }
     /**
-     * Gets the index of an element, based on its index in the DOM.
-     * @param {?} element
-     * @return {?}
-     */
-    CdkDrag.prototype._getElementIndexInDom = /**
-     * Gets the index of an element, based on its index in the DOM.
-     * @param {?} element
-     * @return {?}
-     */
-    function (element) {
-        var _this = this;
-        // Note: we may be able to figure this in memory while sorting, but doing so won't be very
-        // reliable when transferring between containers, because the new container doesn't have
-        // the proper indices yet. Also this will work better for the case where the consumer
-        // isn't using an `ngFor` to render the list.
-        if (!element.parentElement) {
-            return -1;
-        }
-        // Avoid accessing `children` and `children.length` too much since they're a "live collection".
-        var /** @type {?} */ index = 0;
-        var /** @type {?} */ siblings = element.parentElement.children;
-        var /** @type {?} */ siblingsLength = siblings.length;
-        var /** @type {?} */ draggableElements = this.dropContainer._draggables
-            .filter(function (item) { return item !== _this; })
-            .map(function (item) { return item.element.nativeElement; });
-        // Loop through the sibling elements to find out the index of the
-        // current one, while skipping any elements that aren't draggable.
-        for (var /** @type {?} */ i = 0; i < siblingsLength; i++) {
-            if (siblings[i] === element) {
-                return index;
-            }
-            else if (draggableElements.indexOf(/** @type {?} */ (siblings[i])) > -1) {
-                index++;
-            }
-        }
-        return -1;
-    };
-    /**
      * Figures out the coordinates at which an element was picked up.
@@ -908,3 +894,3 @@ * @param {?} referenceElement Element that initiated the dragging.
         { type: overlay.ViewportRuler, },
-        { type: CdkDragDropRegistry, },
+        { type: DragDropRegistry, },
         { type: bidi.Directionality, decorators: [{ type: core.Optional },] },
@@ -1010,3 +996,3 @@ ]; };
     function () {
-        this._dragDropRegistry.register(this);
+        this._dragDropRegistry.registerDropContainer(this);
     };
@@ -1020,3 +1006,3 @@ /**
     function () {
-        this._dragDropRegistry.remove(this);
+        this._dragDropRegistry.removeDropContainer(this);
     };
@@ -1034,3 +1020,4 @@ /** Starts dragging an item. */
         this._dragging = true;
-        this._refreshPositions();
+        this._activeDraggables = this._draggables.toArray();
+        this._cachePositions();
     };
@@ -1058,2 +1045,3 @@ /**
     function (item, currentIndex, previousContainer) {
+        this._reset();
         this.dropped.emit({
@@ -1064,6 +1052,5 @@ item: item,
             container: this,
-            // TODO: reconsider whether to make this null if the containers are the same.
+            // TODO(crisbeto): reconsider whether to make this null if the containers are the same.
             previousContainer: previousContainer
         });
-        this._reset();
     };
@@ -1073,2 +1060,4 @@ /**
      * @param item Item that was moved into the container.
+     * @param xOffset Position of the item along the X axis.
+     * @param yOffset Position of the item along the Y axis.
      */
@@ -1078,2 +1067,4 @@ /**
      * @param {?} item Item that was moved into the container.
+     * @param {?} xOffset Position of the item along the X axis.
+     * @param {?} yOffset Position of the item along the Y axis.
      * @return {?}
@@ -1084,7 +1075,36 @@ */
      * @param {?} item Item that was moved into the container.
+     * @param {?} xOffset Position of the item along the X axis.
+     * @param {?} yOffset Position of the item along the Y axis.
      * @return {?}
      */
-    function (item) {
+    function (item, xOffset, yOffset) {
         this.entered.emit({ item: item, container: this });
         this.start();
+        // We use the coordinates of where the item entered the drop
+        // zone to figure out at which index it should be inserted.
+        var /** @type {?} */ newIndex = this._getItemIndexFromPointerPosition(item, xOffset, yOffset);
+        var /** @type {?} */ currentIndex = this._activeDraggables.indexOf(item);
+        var /** @type {?} */ newPositionReference = this._activeDraggables[newIndex];
+        var /** @type {?} */ placeholder = item.getPlaceholderElement();
+        // Since the item may be in the `activeDraggables` already (e.g. if the user dragged it
+        // into another container and back again), we have to ensure that it isn't duplicated.
+        if (currentIndex > -1) {
+            this._activeDraggables.splice(currentIndex, 1);
+        }
+        // Don't use items that are being dragged as a reference, because
+        // their element has been moved down to the bottom of the body.
+        if (newPositionReference && !this._dragDropRegistry.isDragging(newPositionReference)) {
+            var /** @type {?} */ element = newPositionReference.element.nativeElement; /** @type {?} */
+            ((element.parentElement)).insertBefore(placeholder, element);
+            this._activeDraggables.splice(newIndex, 0, item);
+        }
+        else {
+            this.element.nativeElement.appendChild(placeholder);
+            this._activeDraggables.push(item);
+        }
+        // The transform needs to be cleared so it doesn't throw off the measurements.
+        placeholder.style.transform = '';
+        // Note that the positions were already cached when we called `start` above,
+        // but we need to refresh them since the amount of items has changed.
+        this._cachePositions();
     };
@@ -1124,3 +1144,5 @@ /**
     function (item) {
-        return this._draggables.toArray().indexOf(item);
+        return this._dragging ?
+            this._positionCache.items.findIndex(function (currentItem) { return currentItem.drag === item; }) :
+            this._draggables.toArray().indexOf(item);
     };
@@ -1148,32 +1170,35 @@ /**
     function (item, xOffset, yOffset) {
-        var _this = this;
         var /** @type {?} */ siblings = this._positionCache.items;
-        var /** @type {?} */ newPosition = siblings.find(function (_a) {
-            var drag = _a.drag, clientRect = _a.clientRect;
-            if (drag === item) {
-                // If there's only one left item in the container, it must be
-                // the dragged item itself so we use it as a reference.
-                return siblings.length < 2;
-            }
-            return _this.orientation === 'horizontal' ?
-                xOffset > clientRect.left && xOffset < clientRect.right :
-                yOffset > clientRect.top && yOffset < clientRect.bottom;
-        });
-        if (!newPosition && siblings.length > 0) {
+        var /** @type {?} */ isHorizontal = this.orientation === 'horizontal';
+        var /** @type {?} */ newIndex = this._getItemIndexFromPointerPosition(item, xOffset, yOffset);
+        var /** @type {?} */ placeholder = item.getPlaceholderElement();
+        if (newIndex === -1 && siblings.length > 0) {
             return;
         }
-        // Don't take the element of a dragged item as a reference,
-        // because it has been moved down to the end of the body.
-        var /** @type {?} */ element = (newPosition && !this._dragDropRegistry.isDragging(newPosition.drag)) ?
-            newPosition.drag.element.nativeElement : null;
-        var /** @type {?} */ next = element ? /** @type {?} */ ((element)).nextSibling : null;
-        var /** @type {?} */ parent = element ? /** @type {?} */ ((element.parentElement)) : this.element.nativeElement;
-        var /** @type {?} */ placeholder = item.getPlaceholderElement();
-        if (next) {
-            parent.insertBefore(placeholder, next === placeholder ? element : next);
-        }
-        else {
-            parent.appendChild(placeholder);
-        }
-        this._refreshPositions();
+        var /** @type {?} */ currentIndex = siblings.findIndex(function (currentItem) { return currentItem.drag === item; });
+        var /** @type {?} */ currentPosition = siblings[currentIndex];
+        var /** @type {?} */ newPosition = siblings[newIndex];
+        // Figure out the offset necessary for the items to be swapped.
+        var /** @type {?} */ offset = isHorizontal ?
+            currentPosition.clientRect.left - newPosition.clientRect.left :
+            currentPosition.clientRect.top - newPosition.clientRect.top;
+        var /** @type {?} */ topAdjustment = isHorizontal ? 0 : offset;
+        var /** @type {?} */ leftAdjustment = isHorizontal ? offset : 0;
+        // Since we've moved the items with a `transform`, we need to adjust their cached
+        // client rects to reflect their new position, as well as swap their positions in the cache.
+        // Note that we shouldn't use `getBoundingClientRect` here to update the cache, because the
+        // elements may be mid-animation which will give us a wrong result.
+        this._adjustClientRect(currentPosition.clientRect, -topAdjustment, -leftAdjustment);
+        currentPosition.offset -= offset;
+        siblings[currentIndex] = newPosition;
+        this._adjustClientRect(newPosition.clientRect, topAdjustment, leftAdjustment);
+        newPosition.offset += offset;
+        siblings[newIndex] = currentPosition;
+        // Swap the placeholder's position with the one of the target draggable.
+        placeholder.style.transform = isHorizontal ?
+            "translate3d(" + currentPosition.offset + "px, 0, 0)" :
+            "translate3d(0, " + currentPosition.offset + "px, 0)";
+        newPosition.drag.element.nativeElement.style.transform = isHorizontal ?
+            "translate3d(" + newPosition.offset + "px, 0, 0)" :
+            "translate3d(0, " + newPosition.offset + "px, 0)";
     };
@@ -1212,3 +1237,3 @@ /**
      */
-    CdkDrop.prototype._refreshPositions = /**
+    CdkDrop.prototype._cachePositions = /**
      * Refreshes the position cache of the items and sibling containers.
@@ -1219,9 +1244,31 @@ * @return {?}
         var _this = this;
-        this._positionCache.items = this._draggables
-            .map(function (drag) { return ({ drag: drag, clientRect: drag.element.nativeElement.getBoundingClientRect() }); })
+        this._positionCache.items = this._activeDraggables
+            .map(function (drag) {
+            var /** @type {?} */ elementToMeasure = _this._dragDropRegistry.isDragging(drag) ?
+                // If the element is being dragged, we have to measure the
+                // placeholder, because the element is hidden.
+                drag.getPlaceholderElement() :
+                drag.element.nativeElement;
+            var /** @type {?} */ clientRect = elementToMeasure.getBoundingClientRect();
+            return {
+                drag: drag,
+                offset: 0,
+                // We need to clone the `clientRect` here, because all the values on it are readonly
+                // and we need to be able to update them. Also we can't use a spread here, because
+                // the values on a `ClientRect` aren't own properties. See:
+                // https://developer.mozilla.org/en-US/docs/Web/API/Element/getBoundingClientRect#Notes
+                clientRect: {
+                    top: clientRect.top,
+                    right: clientRect.right,
+                    bottom: clientRect.bottom,
+                    left: clientRect.left,
+                    width: clientRect.width,
+                    height: clientRect.height
+                }
+            };
+        })
             .sort(function (a, b) { return a.clientRect.top - b.clientRect.top; });
-        // TODO: add filter here that ensures that the current container isn't being passed to itself.
         this._positionCache.siblings = this.connectedTo
             .map(function (drop) { return typeof drop === 'string' ? /** @type {?} */ ((_this._dragDropRegistry.getDropContainer(drop))) : drop; })
-            .filter(Boolean)
+            .filter(function (drop) { return drop && drop !== _this; })
             .map(function (drop) { return ({ drop: drop, clientRect: drop.element.nativeElement.getBoundingClientRect() }); });
@@ -1239,5 +1286,58 @@ };
         this._dragging = false;
+        // TODO(crisbeto): may have to wait for the animations to finish.
+        this._activeDraggables.forEach(function (item) { return item.element.nativeElement.style.transform = ''; });
+        this._activeDraggables = [];
         this._positionCache.items = [];
         this._positionCache.siblings = [];
     };
+    /**
+     * Updates the top/left positions of a `ClientRect`, as well as their bottom/right counterparts.
+     * @param {?} clientRect `ClientRect` that should be updated.
+     * @param {?} top New value for the `top` position.
+     * @param {?} left New value for the `left` position.
+     * @return {?}
+     */
+    CdkDrop.prototype._adjustClientRect = /**
+     * Updates the top/left positions of a `ClientRect`, as well as their bottom/right counterparts.
+     * @param {?} clientRect `ClientRect` that should be updated.
+     * @param {?} top New value for the `top` position.
+     * @param {?} left New value for the `left` position.
+     * @return {?}
+     */
+    function (clientRect, top, left) {
+        clientRect.top += top;
+        clientRect.bottom = clientRect.top + clientRect.height;
+        clientRect.left += left;
+        clientRect.right = clientRect.left + clientRect.width;
+    };
+    /**
+     * Gets the index of an item in the drop container, based on the position of the user's pointer.
+     * @param {?} item Item that is being sorted.
+     * @param {?} xOffset Position of the user's pointer along the X axis.
+     * @param {?} yOffset Position of the user's pointer along the Y axis.
+     * @return {?}
+     */
+    CdkDrop.prototype._getItemIndexFromPointerPosition = /**
+     * Gets the index of an item in the drop container, based on the position of the user's pointer.
+     * @param {?} item Item that is being sorted.
+     * @param {?} xOffset Position of the user's pointer along the X axis.
+     * @param {?} yOffset Position of the user's pointer along the Y axis.
+     * @return {?}
+     */
+    function (item, xOffset, yOffset) {
+        var _this = this;
+        return this._positionCache.items.findIndex(function (_a, _, array) {
+            var drag = _a.drag, clientRect = _a.clientRect;
+            if (drag === item) {
+                // If there's only one item left in the container, it must be
+                // the dragged item itself so we use it as a reference.
+                return array.length < 2;
+            }
+            return _this.orientation === 'horizontal' ?
+                // Round these down since most browsers report client rects with
+                // sub-pixel precision, whereas the mouse coordinates are rounded to pixels.
+                xOffset >= Math.floor(clientRect.left) && xOffset <= Math.floor(clientRect.right) :
+                yOffset >= Math.floor(clientRect.top) && yOffset <= Math.floor(clientRect.bottom);
+        });
+    };
     CdkDrop.decorators = [
@@ -1263,3 +1363,3 @@ { type: core.Component, args: [{selector: 'cdk-drop',
         { type: core.ElementRef, },
-        { type: CdkDragDropRegistry, },
+        { type: DragDropRegistry, },
     ]; };
@@ -1368,3 +1468,3 @@ CdkDrop.propDecorators = {
 exports.DragDropModule = DragDropModule;
-exports.CdkDragDropRegistry = CdkDragDropRegistry;
+exports.DragDropRegistry = DragDropRegistry;
 
@@ -1371,0 +1471,0 @@ Object.defineProperty(exports, '__esModule', { value: true });

bundles/cdk-experimental-drag-drop.umd.min.js

@@ -8,3 +8,3 @@ /**
  */
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/core"),require("@angular/common"),require("@angular/cdk/platform"),require("rxjs"),require("@angular/cdk/bidi"),require("@angular/cdk/overlay"),require("rxjs/operators")):"function"==typeof define&&define.amd?define("@angular/cdk-experimental/dragDrop",["exports","@angular/core","@angular/common","@angular/cdk/platform","rxjs","@angular/cdk/bidi","@angular/cdk/overlay","rxjs/operators"],t):t((e.ng=e.ng||{},e.ng["cdk-experimental"]=e.ng["cdk-experimental"]||{},e.ng["cdk-experimental"].dragDrop={}),e.ng.core,e.ng.common,e.ng.cdk.platform,e.rxjs,e.ng.cdk.bidi,e.ng.cdk.overlay,e.rxjs.operators)}(this,function(e,t,n,r,i,o,s,a){"use strict";function p(e){var t=e.toLowerCase().indexOf("ms")>-1?1:1e3;return parseFloat(e)*t}function c(e){var t=getComputedStyle(e),n=t.getPropertyValue("transition-duration"),r=t.getPropertyValue("transition-delay");return p(n)+p(r)}function d(e,t,n){var r=h(t,e.length-1),i=h(n,e.length-1);if(r!==i){for(var o=e[r],s=i<r?-1:1,a=r;a!==i;a+=s)e[a]=e[a+s];e[i]=o}}function l(e,t,n,r){var i=h(n,e.length-1),o=h(r,t.length);e.length&&t.splice(o,0,e.splice(i,1)[0])}function h(e,t){return Math.max(0,Math.min(t,e))}var g=function(){function e(e){this.element=e}return e.decorators=[{type:t.Directive,args:[{selector:"[cdkDragHandle]",host:{class:"cdk-drag-handle"}}]}],e.ctorParameters=function(){return[{type:t.ElementRef}]},e}(),u=new t.InjectionToken("CDK_DROP_CONTAINER"),_=function(){function e(e){this.templateRef=e}return e.decorators=[{type:t.Directive,args:[{selector:"ng-template[cdkDragPreview]"}]}],e.ctorParameters=function(){return[{type:t.TemplateRef}]},e.propDecorators={data:[{type:t.Input}]},e}(),f=function(){function e(e){this.templateRef=e}return e.decorators=[{type:t.Directive,args:[{selector:"ng-template[cdkDragPlaceholder]"}]}],e.ctorParameters=function(){return[{type:t.TemplateRef}]},e.propDecorators={data:[{type:t.Input}]},e}(),m=!!r.supportsPassiveEventListeners()&&{passive:!1},v=function(){function e(e,t){var n=this;this._ngZone=e,this._dropInstances=new Set,this._dragInstances=new Set,this._activeDragInstances=new Set,this._globalListeners=new Map,this.pointerMove=new i.Subject,this.pointerUp=new i.Subject,this._preventScrollListener=function(e){n._activeDragInstances.size&&e.preventDefault()},this._document=t}return e.prototype.register=function(e){var t=this;if(e instanceof E){if(!this._dropInstances.has(e)){if(this.getDropContainer(e.id))throw Error('Drop instance with id "'+e.id+'" has already been registered.');this._dropInstances.add(e)}}else this._dragInstances.add(e),1===this._dragInstances.size&&this._ngZone.runOutsideAngular(function(){t._document.addEventListener("touchmove",t._preventScrollListener,m)})},e.prototype.remove=function(e){e instanceof E?this._dropInstances.delete(e):(this._dragInstances.delete(e),this.stopDragging(e),0===this._dragInstances.size&&this._document.removeEventListener("touchmove",this._preventScrollListener,m))},e.prototype.startDragging=function(e,t){var n=this;if(this._activeDragInstances.add(e),1===this._activeDragInstances.size){var r=t.type.startsWith("touch"),i=r?"touchmove":"mousemove",o=r?"touchend":"mouseup";this._globalListeners.set(i,{handler:function(e){return n.pointerMove.next(e)},options:m}).set(o,{handler:function(e){return n.pointerUp.next(e)}}).forEach(function(e,t){n._ngZone.runOutsideAngular(function(){n._document.addEventListener(t,e.handler,e.options)})})}},e.prototype.stopDragging=function(e){this._activeDragInstances.delete(e),0===this._activeDragInstances.size&&this._clearGlobalListeners()},e.prototype.isDragging=function(e){return this._activeDragInstances.has(e)},e.prototype.getDropContainer=function(e){return Array.from(this._dropInstances).find(function(t){return t.id===e})},e.prototype.ngOnDestroy=function(){var e=this;this._dragInstances.forEach(function(t){return e.remove(t)}),this._dropInstances.forEach(function(t){return e.remove(t)}),this._clearGlobalListeners(),this.pointerMove.complete(),this.pointerUp.complete()},e.prototype._clearGlobalListeners=function(){var e=this;this._globalListeners.forEach(function(t,n){e._document.removeEventListener(n,t.handler,t.options)}),this._globalListeners.clear()},e.decorators=[{type:t.Injectable,args:[{providedIn:"root"}]}],e.ctorParameters=function(){return[{type:t.NgZone},{type:void 0,decorators:[{type:t.Inject,args:[n.DOCUMENT]}]}]},e.ngInjectableDef=t.defineInjectable({factory:function(){return new e(t.inject(t.NgZone),t.inject(n.DOCUMENT))},token:e,providedIn:"root"}),e}(),y=function(){function e(e,n,r,o,s,p,c,d){var l=this;this.element=e,this.dropContainer=n,this._ngZone=o,this._viewContainerRef=s,this._viewportRuler=p,this._dragDropRegistry=c,this._dir=d,this._destroyed=new i.Subject,this._passiveTransform={x:0,y:0},this._activeTransform={x:0,y:0},this._hasMoved=!1,this.started=new t.EventEmitter,this.ended=new t.EventEmitter,this.entered=new t.EventEmitter,this.exited=new t.EventEmitter,this.dropped=new t.EventEmitter,this._pointerDown=function(e,t){if(!l._dragDropRegistry.isDragging(l)){var n=i.merge(l.ended,l._destroyed);if(l._dragDropRegistry.pointerMove.pipe(a.takeUntil(n)).subscribe(l._pointerMove),l._dragDropRegistry.pointerUp.pipe(a.takeUntil(n)).subscribe(l._pointerUp),l._dragDropRegistry.startDragging(l,t),l._initialContainer=l.dropContainer,l._scrollPosition=l._viewportRuler.getViewportScrollPosition(),l._pickupPositionInElement=l._previewTemplate?{x:0,y:0}:l._getPointerPositionInElement(e,t),l._pickupPositionOnPage=l._getPointerPositionOnPage(t),l.started.emit({source:l}),l.dropContainer){var r=l.element.nativeElement,o=l._preview=l._createPreviewElement(),s=l._placeholder=l._createPlaceholderElement();r.style.display="none",l._nextSibling=r.nextSibling,l._document.body.appendChild(r.parentNode.replaceChild(s,r)),l._document.body.appendChild(o),l.dropContainer.start()}}},this._pointerMove=function(e){if(l._dragDropRegistry.isDragging(l))if(l._hasMoved=!0,e.preventDefault(),l.dropContainer)l._updateActiveDropContainer(e);else{var t=l._activeTransform,n=l._getPointerPositionOnPage(e),r=n.x,i=n.y;t.x=r-l._pickupPositionOnPage.x+l._passiveTransform.x,t.y=i-l._pickupPositionOnPage.y+l._passiveTransform.y,l._setTransform(l.element.nativeElement,t.x,t.y)}},this._pointerUp=function(){if(l._dragDropRegistry.isDragging(l)){if(l._dragDropRegistry.stopDragging(l),!l.dropContainer)return l._passiveTransform.x=l._activeTransform.x,l._passiveTransform.y=l._activeTransform.y,void l._ngZone.run(function(){return l.ended.emit({source:l})});l._animatePreviewToPlaceholder().then(function(){return l._cleanupDragArtifacts()})}},this._document=r,c.register(this)}return e.prototype.getPlaceholderElement=function(){return this._placeholder},e.prototype.ngOnDestroy=function(){this._destroyPreview(),this._destroyPlaceholder(),this._dragDropRegistry.isDragging(this)&&this._removeElement(this.element.nativeElement),this._nextSibling=null,this._dragDropRegistry.remove(this),this._destroyed.next(),this._destroyed.complete()},e.prototype._startDragging=function(e){if(this._handles.length){var t=this._handles.find(function(t){var n=t.element.nativeElement,r=e.target;return!!r&&(r===n||n.contains(r))});t&&this._pointerDown(t.element,e)}else this._pointerDown(this.element,e)},e.prototype._cleanupDragArtifacts=function(){var e=this,t=this._getElementIndexInDom(this._placeholder);this.element.nativeElement.style.display="",this._nextSibling?this._nextSibling.parentNode.insertBefore(this.element.nativeElement,this._nextSibling):this._placeholder.parentNode.appendChild(this.element.nativeElement),this._destroyPreview(),this._destroyPlaceholder(),this._ngZone.run(function(){e.ended.emit({source:e}),e.dropped.emit({item:e,currentIndex:t,previousIndex:e._initialContainer.getItemIndex(e),container:e.dropContainer,previousContainer:e._initialContainer}),e.dropContainer.drop(e,t,e._initialContainer)})},e.prototype._updateActiveDropContainer=function(e){var t=this,n=this._getPointerPositionOnPage(e),r=n.x,i=n.y,o=this.dropContainer._getSiblingContainerFromPosition(r,i);o&&this._ngZone.run(function(){t.exited.emit({item:t,container:t.dropContainer}),t.dropContainer.exit(t),t.entered.emit({item:t,container:o}),t.dropContainer=o,t.dropContainer.enter(t)}),this.dropContainer._sortItem(this,r,i),this._setTransform(this._preview,r-this._pickupPositionInElement.x,i-this._pickupPositionInElement.y)},e.prototype._createPreviewElement=function(){var e;if(this._previewTemplate){var t=this._viewContainerRef.createEmbeddedView(this._previewTemplate.templateRef,this._previewTemplate.data);e=t.rootNodes[0],this._previewRef=t,this._setTransform(e,this._pickupPositionOnPage.x,this._pickupPositionOnPage.y)}else{var n=this.element.nativeElement,r=n.getBoundingClientRect();e=n.cloneNode(!0),e.style.width=r.width+"px",e.style.height=r.height+"px",this._setTransform(e,r.left,r.top)}return e.classList.add("cdk-drag-preview"),e.setAttribute("dir",this._dir?this._dir.value:"ltr"),e},e.prototype._createPlaceholderElement=function(){var e;return this._placeholderTemplate?(this._placeholderRef=this._viewContainerRef.createEmbeddedView(this._placeholderTemplate.templateRef,this._placeholderTemplate.data),e=this._placeholderRef.rootNodes[0]):e=this.element.nativeElement.cloneNode(!0),e.classList.add("cdk-drag-placeholder"),e},e.prototype._getElementIndexInDom=function(e){var t=this;if(!e.parentElement)return-1;for(var n=0,r=e.parentElement.children,i=r.length,o=this.dropContainer._draggables.filter(function(e){return e!==t}).map(function(e){return e.element.nativeElement}),s=0;s<i;s++){if(r[s]===e)return n;o.indexOf(r[s])>-1&&n++}return-1},e.prototype._getPointerPositionInElement=function(e,t){var n=this.element.nativeElement.getBoundingClientRect(),r=e===this.element?null:e.nativeElement,i=r?r.getBoundingClientRect():n,o=this._isTouchEvent(t)?t.targetTouches[0].pageX-i.left-this._scrollPosition.left:t.offsetX,s=this._isTouchEvent(t)?t.targetTouches[0].pageY-i.top-this._scrollPosition.top:t.offsetY;return{x:i.left-n.left+o,y:i.top-n.top+s}},e.prototype._animatePreviewToPlaceholder=function(){var e=this;if(!this._hasMoved)return Promise.resolve();var t=this._placeholder.getBoundingClientRect();this._preview.classList.add("cdk-drag-animating"),this._setTransform(this._preview,t.left,t.top);var n=c(this._preview);return 0===n?Promise.resolve():this._ngZone.runOutsideAngular(function(){return new Promise(function(t){var r=function(n){n&&n.target!==e._preview||(e._preview.removeEventListener("transitionend",r),t(),clearTimeout(i))},i=setTimeout(r,1.5*n);e._preview.addEventListener("transitionend",r)})})},e.prototype._setTransform=function(e,t,n){e.style.transform="translate3d("+t+"px, "+n+"px, 0)"},e.prototype._removeElement=function(e){e&&e.parentNode&&e.parentNode.removeChild(e)},e.prototype._getPointerPositionOnPage=function(e){var t=this._isTouchEvent(e)?e.touches[0]:e;return{x:t.pageX-this._scrollPosition.left,y:t.pageY-this._scrollPosition.top}},e.prototype._isTouchEvent=function(e){return e.type.startsWith("touch")},e.prototype._destroyPreview=function(){this._preview&&this._removeElement(this._preview),this._previewRef&&this._previewRef.destroy(),this._preview=this._previewRef=null},e.prototype._destroyPlaceholder=function(){this._placeholder&&this._removeElement(this._placeholder),this._placeholderRef&&this._placeholderRef.destroy(),this._placeholder=this._placeholderRef=null},e.decorators=[{type:t.Directive,args:[{selector:"[cdkDrag]",exportAs:"cdkDrag",host:{class:"cdk-drag","(mousedown)":"_startDragging($event)","(touchstart)":"_startDragging($event)"}}]}],e.ctorParameters=function(){return[{type:t.ElementRef},{type:void 0,decorators:[{type:t.Inject,args:[u]},{type:t.Optional},{type:t.SkipSelf}]},{type:void 0,decorators:[{type:t.Inject,args:[n.DOCUMENT]}]},{type:t.NgZone},{type:t.ViewContainerRef},{type:s.ViewportRuler},{type:v},{type:o.Directionality,decorators:[{type:t.Optional}]}]},e.propDecorators={_handles:[{type:t.ContentChildren,args:[g]}],_previewTemplate:[{type:t.ContentChild,args:[_]}],_placeholderTemplate:[{type:t.ContentChild,args:[f]}],data:[{type:t.Input}],started:[{type:t.Output,args:["cdkDragStarted"]}],ended:[{type:t.Output,args:["cdkDragEnded"]}],entered:[{type:t.Output,args:["cdkDragEntered"]}],exited:[{type:t.Output,args:["cdkDragExited"]}],dropped:[{type:t.Output,args:["cdkDragDropped"]}]},e}(),D=0,E=function(){function e(e,n){this.element=e,this._dragDropRegistry=n,this.connectedTo=[],this.orientation="vertical",this.id="cdk-drop-"+D++,this.dropped=new t.EventEmitter,this.entered=new t.EventEmitter,this.exited=new t.EventEmitter,this._dragging=!1,this._positionCache={items:[],siblings:[]}}return e.prototype.ngOnInit=function(){this._dragDropRegistry.register(this)},e.prototype.ngOnDestroy=function(){this._dragDropRegistry.remove(this)},e.prototype.start=function(){this._dragging=!0,this._refreshPositions()},e.prototype.drop=function(e,t,n){this.dropped.emit({item:e,currentIndex:t,previousIndex:n.getItemIndex(e),container:this,previousContainer:n}),this._reset()},e.prototype.enter=function(e){this.entered.emit({item:e,container:this}),this.start()},e.prototype.exit=function(e){this._reset(),this.exited.emit({item:e,container:this})},e.prototype.getItemIndex=function(e){return this._draggables.toArray().indexOf(e)},e.prototype._sortItem=function(e,t,n){var r=this,i=this._positionCache.items,o=i.find(function(o){var s=o.drag,a=o.clientRect;return s===e?i.length<2:"horizontal"===r.orientation?t>a.left&&t<a.right:n>a.top&&n<a.bottom});if(o||!(i.length>0)){var s=o&&!this._dragDropRegistry.isDragging(o.drag)?o.drag.element.nativeElement:null,a=s?s.nextSibling:null,p=s?s.parentElement:this.element.nativeElement,c=e.getPlaceholderElement();a?p.insertBefore(c,a===c?s:a):p.appendChild(c),this._refreshPositions()}},e.prototype._getSiblingContainerFromPosition=function(e,t){var n=this._positionCache.siblings.find(function(n){var r=n.clientRect,i=r.top,o=r.bottom,s=r.left,a=r.right;return t>=i&&t<=o&&e>=s&&e<=a});return n?n.drop:null},e.prototype._refreshPositions=function(){var e=this;this._positionCache.items=this._draggables.map(function(e){return{drag:e,clientRect:e.element.nativeElement.getBoundingClientRect()}}).sort(function(e,t){return e.clientRect.top-t.clientRect.top}),this._positionCache.siblings=this.connectedTo.map(function(t){return"string"==typeof t?e._dragDropRegistry.getDropContainer(t):t}).filter(Boolean).map(function(e){return{drop:e,clientRect:e.element.nativeElement.getBoundingClientRect()}})},e.prototype._reset=function(){this._dragging=!1,this._positionCache.items=[],this._positionCache.siblings=[]},e.decorators=[{type:t.Component,args:[{selector:"cdk-drop",exportAs:"cdkDrop",template:"<ng-content></ng-content>",encapsulation:t.ViewEncapsulation.None,changeDetection:t.ChangeDetectionStrategy.OnPush,styles:[".cdk-drag-preview{position:fixed;top:0;left:0;z-index:1000}.cdk-drag,.cdk-drag-handle{touch-action:none;-webkit-user-drag:none;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}"],providers:[{provide:u,useExisting:e}],host:{class:"cdk-drop","[id]":"id","[class.cdk-drop-dragging]":"_dragging"}}]}],e.ctorParameters=function(){return[{type:t.ElementRef},{type:v}]},e.propDecorators={_draggables:[{type:t.ContentChildren,args:[t.forwardRef(function(){return y})]}],connectedTo:[{type:t.Input}],data:[{type:t.Input}],orientation:[{type:t.Input}],id:[{type:t.Input}],dropped:[{type:t.Output}],entered:[{type:t.Output}],exited:[{type:t.Output}]},e}(),C=function(){function e(){}return e.decorators=[{type:t.NgModule,args:[{declarations:[E,y,g,_,f],exports:[E,y,g,_,f]}]}],e}();e.CdkDrop=E,e.CDK_DROP_CONTAINER=u,e.CdkDrag=y,e.CdkDragHandle=g,e.moveItemInArray=d,e.transferArrayItem=l,e.CdkDragPreview=_,e.CdkDragPlaceholder=f,e.DragDropModule=C,e.CdkDragDropRegistry=v,Object.defineProperty(e,"__esModule",{value:!0})});
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/core"),require("@angular/common"),require("@angular/cdk/platform"),require("rxjs"),require("@angular/cdk/bidi"),require("@angular/cdk/overlay"),require("rxjs/operators")):"function"==typeof define&&define.amd?define("@angular/cdk-experimental/dragDrop",["exports","@angular/core","@angular/common","@angular/cdk/platform","rxjs","@angular/cdk/bidi","@angular/cdk/overlay","rxjs/operators"],t):t((e.ng=e.ng||{},e.ng["cdk-experimental"]=e.ng["cdk-experimental"]||{},e.ng["cdk-experimental"].dragDrop={}),e.ng.core,e.ng.common,e.ng.cdk.platform,e.rxjs,e.ng.cdk.bidi,e.ng.cdk.overlay,e.rxjs.operators)}(this,function(e,t,n,r,i,o,s,a){"use strict";function p(e){var t=e.toLowerCase().indexOf("ms")>-1?1:1e3;return parseFloat(e)*t}function c(e){var t=getComputedStyle(e),n=t.getPropertyValue("transition-duration"),r=t.getPropertyValue("transition-delay");return p(n)+p(r)}function d(e,t,n){var r=h(t,e.length-1),i=h(n,e.length-1);if(r!==i){for(var o=e[r],s=i<r?-1:1,a=r;a!==i;a+=s)e[a]=e[a+s];e[i]=o}}function l(e,t,n,r){var i=h(n,e.length-1),o=h(r,t.length);e.length&&t.splice(o,0,e.splice(i,1)[0])}function h(e,t){return Math.max(0,Math.min(t,e))}var g=function(){function e(e){this.element=e}return e.decorators=[{type:t.Directive,args:[{selector:"[cdkDragHandle]",host:{class:"cdk-drag-handle"}}]}],e.ctorParameters=function(){return[{type:t.ElementRef}]},e}(),u=new t.InjectionToken("CDK_DROP_CONTAINER"),_=function(){function e(e){this.templateRef=e}return e.decorators=[{type:t.Directive,args:[{selector:"ng-template[cdkDragPreview]"}]}],e.ctorParameters=function(){return[{type:t.TemplateRef}]},e.propDecorators={data:[{type:t.Input}]},e}(),f=function(){function e(e){this.templateRef=e}return e.decorators=[{type:t.Directive,args:[{selector:"ng-template[cdkDragPlaceholder]"}]}],e.ctorParameters=function(){return[{type:t.TemplateRef}]},e.propDecorators={data:[{type:t.Input}]},e}(),m=!!r.supportsPassiveEventListeners()&&{passive:!1},v=function(){function e(e,t){var n=this;this._ngZone=e,this._dropInstances=new Set,this._dragInstances=new Set,this._activeDragInstances=new Set,this._globalListeners=new Map,this.pointerMove=new i.Subject,this.pointerUp=new i.Subject,this._preventScrollListener=function(e){n._activeDragInstances.size&&e.preventDefault()},this._document=t}return e.prototype.registerDropContainer=function(e){if(!this._dropInstances.has(e)){if(this.getDropContainer(e.id))throw Error('Drop instance with id "'+e.id+'" has already been registered.');this._dropInstances.add(e)}},e.prototype.registerDragItem=function(e){var t=this;this._dragInstances.add(e),1===this._dragInstances.size&&this._ngZone.runOutsideAngular(function(){t._document.addEventListener("touchmove",t._preventScrollListener,m)})},e.prototype.removeDropContainer=function(e){this._dropInstances.delete(e)},e.prototype.removeDragItem=function(e){this._dragInstances.delete(e),this.stopDragging(e),0===this._dragInstances.size&&this._document.removeEventListener("touchmove",this._preventScrollListener,m)},e.prototype.startDragging=function(e,t){var n=this;if(this._activeDragInstances.add(e),1===this._activeDragInstances.size){var r=t.type.startsWith("touch"),i=r?"touchmove":"mousemove",o=r?"touchend":"mouseup";this._globalListeners.set(i,{handler:function(e){return n.pointerMove.next(e)},options:m}).set(o,{handler:function(e){return n.pointerUp.next(e)}}).forEach(function(e,t){n._ngZone.runOutsideAngular(function(){n._document.addEventListener(t,e.handler,e.options)})})}},e.prototype.stopDragging=function(e){this._activeDragInstances.delete(e),0===this._activeDragInstances.size&&this._clearGlobalListeners()},e.prototype.isDragging=function(e){return this._activeDragInstances.has(e)},e.prototype.getDropContainer=function(e){return Array.from(this._dropInstances).find(function(t){return t.id===e})},e.prototype.ngOnDestroy=function(){var e=this;this._dragInstances.forEach(function(t){return e.removeDragItem(t)}),this._dropInstances.forEach(function(t){return e.removeDropContainer(t)}),this._clearGlobalListeners(),this.pointerMove.complete(),this.pointerUp.complete()},e.prototype._clearGlobalListeners=function(){var e=this;this._globalListeners.forEach(function(t,n){e._document.removeEventListener(n,t.handler,t.options)}),this._globalListeners.clear()},e.decorators=[{type:t.Injectable,args:[{providedIn:"root"}]}],e.ctorParameters=function(){return[{type:t.NgZone},{type:void 0,decorators:[{type:t.Inject,args:[n.DOCUMENT]}]}]},e.ngInjectableDef=t.defineInjectable({factory:function(){return new e(t.inject(t.NgZone),t.inject(n.DOCUMENT))},token:e,providedIn:"root"}),e}(),y=function(){function e(e,n,r,o,s,p,c,d){var l=this;this.element=e,this.dropContainer=n,this._ngZone=o,this._viewContainerRef=s,this._viewportRuler=p,this._dragDropRegistry=c,this._dir=d,this._destroyed=new i.Subject,this._passiveTransform={x:0,y:0},this._activeTransform={x:0,y:0},this._hasMoved=!1,this.started=new t.EventEmitter,this.ended=new t.EventEmitter,this.entered=new t.EventEmitter,this.exited=new t.EventEmitter,this.dropped=new t.EventEmitter,this._pointerDown=function(e,t){if(!l._dragDropRegistry.isDragging(l)){var n=i.merge(l.ended,l._destroyed);if(l._dragDropRegistry.pointerMove.pipe(a.takeUntil(n)).subscribe(l._pointerMove),l._dragDropRegistry.pointerUp.pipe(a.takeUntil(n)).subscribe(l._pointerUp),l._dragDropRegistry.startDragging(l,t),l._initialContainer=l.dropContainer,l._scrollPosition=l._viewportRuler.getViewportScrollPosition(),l._pickupPositionInElement=l._previewTemplate?{x:0,y:0}:l._getPointerPositionInElement(e,t),l._pickupPositionOnPage=l._getPointerPositionOnPage(t),l.started.emit({source:l}),l.dropContainer){var r=l.element.nativeElement,o=l._preview=l._createPreviewElement(),s=l._placeholder=l._createPlaceholderElement();r.style.display="none",l._nextSibling=r.nextSibling,l._document.body.appendChild(r.parentNode.replaceChild(s,r)),l._document.body.appendChild(o),l.dropContainer.start()}}},this._pointerMove=function(e){if(l._dragDropRegistry.isDragging(l))if(l._hasMoved=!0,e.preventDefault(),l.dropContainer)l._updateActiveDropContainer(e);else{var t=l._activeTransform,n=l._getPointerPositionOnPage(e),r=n.x,i=n.y;t.x=r-l._pickupPositionOnPage.x+l._passiveTransform.x,t.y=i-l._pickupPositionOnPage.y+l._passiveTransform.y,l._setTransform(l.element.nativeElement,t.x,t.y)}},this._pointerUp=function(){if(l._dragDropRegistry.isDragging(l)){if(l._dragDropRegistry.stopDragging(l),!l.dropContainer)return l._passiveTransform.x=l._activeTransform.x,l._passiveTransform.y=l._activeTransform.y,void l._ngZone.run(function(){return l.ended.emit({source:l})});l._animatePreviewToPlaceholder().then(function(){return l._cleanupDragArtifacts()})}},this._document=r,c.registerDragItem(this)}return e.prototype.getPlaceholderElement=function(){return this._placeholder},e.prototype.ngOnDestroy=function(){this._destroyPreview(),this._destroyPlaceholder(),this._dragDropRegistry.isDragging(this)&&this._removeElement(this.element.nativeElement),this._nextSibling=null,this._dragDropRegistry.removeDragItem(this),this._destroyed.next(),this._destroyed.complete()},e.prototype._startDragging=function(e){if(this._handles.length){var t=this._handles.find(function(t){var n=t.element.nativeElement,r=e.target;return!!r&&(r===n||n.contains(r))});t&&this._pointerDown(t.element,e)}else this._pointerDown(this.element,e)},e.prototype._cleanupDragArtifacts=function(){var e=this;this.element.nativeElement.style.display="",this._nextSibling?this._nextSibling.parentNode.insertBefore(this.element.nativeElement,this._nextSibling):this._placeholder.parentNode.appendChild(this.element.nativeElement),this._destroyPreview(),this._destroyPlaceholder(),this._ngZone.run(function(){var t=e.dropContainer.getItemIndex(e);e.ended.emit({source:e}),e.dropped.emit({item:e,currentIndex:t,previousIndex:e._initialContainer.getItemIndex(e),container:e.dropContainer,previousContainer:e._initialContainer}),e.dropContainer.drop(e,t,e._initialContainer)})},e.prototype._updateActiveDropContainer=function(e){var t=this,n=this._getPointerPositionOnPage(e),r=n.x,i=n.y,o=this.dropContainer._getSiblingContainerFromPosition(r,i);o&&this._ngZone.run(function(){t.exited.emit({item:t,container:t.dropContainer}),t.dropContainer.exit(t),t.entered.emit({item:t,container:o}),t.dropContainer=o,t.dropContainer.enter(t,r,i)}),this.dropContainer._sortItem(this,r,i),this._setTransform(this._preview,r-this._pickupPositionInElement.x,i-this._pickupPositionInElement.y)},e.prototype._createPreviewElement=function(){var e;if(this._previewTemplate){var t=this._viewContainerRef.createEmbeddedView(this._previewTemplate.templateRef,this._previewTemplate.data);e=t.rootNodes[0],this._previewRef=t,this._setTransform(e,this._pickupPositionOnPage.x,this._pickupPositionOnPage.y)}else{var n=this.element.nativeElement,r=n.getBoundingClientRect();e=n.cloneNode(!0),e.style.width=r.width+"px",e.style.height=r.height+"px",this._setTransform(e,r.left,r.top)}return e.classList.add("cdk-drag-preview"),e.setAttribute("dir",this._dir?this._dir.value:"ltr"),e},e.prototype._createPlaceholderElement=function(){var e;return this._placeholderTemplate?(this._placeholderRef=this._viewContainerRef.createEmbeddedView(this._placeholderTemplate.templateRef,this._placeholderTemplate.data),e=this._placeholderRef.rootNodes[0]):e=this.element.nativeElement.cloneNode(!0),e.classList.add("cdk-drag-placeholder"),e},e.prototype._getPointerPositionInElement=function(e,t){var n=this.element.nativeElement.getBoundingClientRect(),r=e===this.element?null:e.nativeElement,i=r?r.getBoundingClientRect():n,o=this._isTouchEvent(t)?t.targetTouches[0].pageX-i.left-this._scrollPosition.left:t.offsetX,s=this._isTouchEvent(t)?t.targetTouches[0].pageY-i.top-this._scrollPosition.top:t.offsetY;return{x:i.left-n.left+o,y:i.top-n.top+s}},e.prototype._animatePreviewToPlaceholder=function(){var e=this;if(!this._hasMoved)return Promise.resolve();var t=this._placeholder.getBoundingClientRect();this._preview.classList.add("cdk-drag-animating"),this._setTransform(this._preview,t.left,t.top);var n=c(this._preview);return 0===n?Promise.resolve():this._ngZone.runOutsideAngular(function(){return new Promise(function(t){var r=function(n){n&&n.target!==e._preview||(e._preview.removeEventListener("transitionend",r),t(),clearTimeout(i))},i=setTimeout(r,1.5*n);e._preview.addEventListener("transitionend",r)})})},e.prototype._setTransform=function(e,t,n){e.style.transform="translate3d("+t+"px, "+n+"px, 0)"},e.prototype._removeElement=function(e){e&&e.parentNode&&e.parentNode.removeChild(e)},e.prototype._getPointerPositionOnPage=function(e){var t=this._isTouchEvent(e)?e.touches[0]:e;return{x:t.pageX-this._scrollPosition.left,y:t.pageY-this._scrollPosition.top}},e.prototype._isTouchEvent=function(e){return e.type.startsWith("touch")},e.prototype._destroyPreview=function(){this._preview&&this._removeElement(this._preview),this._previewRef&&this._previewRef.destroy(),this._preview=this._previewRef=null},e.prototype._destroyPlaceholder=function(){this._placeholder&&this._removeElement(this._placeholder),this._placeholderRef&&this._placeholderRef.destroy(),this._placeholder=this._placeholderRef=null},e.decorators=[{type:t.Directive,args:[{selector:"[cdkDrag]",exportAs:"cdkDrag",host:{class:"cdk-drag","(mousedown)":"_startDragging($event)","(touchstart)":"_startDragging($event)"}}]}],e.ctorParameters=function(){return[{type:t.ElementRef},{type:void 0,decorators:[{type:t.Inject,args:[u]},{type:t.Optional},{type:t.SkipSelf}]},{type:void 0,decorators:[{type:t.Inject,args:[n.DOCUMENT]}]},{type:t.NgZone},{type:t.ViewContainerRef},{type:s.ViewportRuler},{type:v},{type:o.Directionality,decorators:[{type:t.Optional}]}]},e.propDecorators={_handles:[{type:t.ContentChildren,args:[g]}],_previewTemplate:[{type:t.ContentChild,args:[_]}],_placeholderTemplate:[{type:t.ContentChild,args:[f]}],data:[{type:t.Input}],started:[{type:t.Output,args:["cdkDragStarted"]}],ended:[{type:t.Output,args:["cdkDragEnded"]}],entered:[{type:t.Output,args:["cdkDragEntered"]}],exited:[{type:t.Output,args:["cdkDragExited"]}],dropped:[{type:t.Output,args:["cdkDragDropped"]}]},e}(),D=0,C=function(){function e(e,n){this.element=e,this._dragDropRegistry=n,this.connectedTo=[],this.orientation="vertical",this.id="cdk-drop-"+D++,this.dropped=new t.EventEmitter,this.entered=new t.EventEmitter,this.exited=new t.EventEmitter,this._dragging=!1,this._positionCache={items:[],siblings:[]}}return e.prototype.ngOnInit=function(){this._dragDropRegistry.registerDropContainer(this)},e.prototype.ngOnDestroy=function(){this._dragDropRegistry.removeDropContainer(this)},e.prototype.start=function(){this._dragging=!0,this._activeDraggables=this._draggables.toArray(),this._cachePositions()},e.prototype.drop=function(e,t,n){this._reset(),this.dropped.emit({item:e,currentIndex:t,previousIndex:n.getItemIndex(e),container:this,previousContainer:n})},e.prototype.enter=function(e,t,n){this.entered.emit({item:e,container:this}),this.start();var r=this._getItemIndexFromPointerPosition(e,t,n),i=this._activeDraggables.indexOf(e),o=this._activeDraggables[r],s=e.getPlaceholderElement();if(i>-1&&this._activeDraggables.splice(i,1),o&&!this._dragDropRegistry.isDragging(o)){var a=o.element.nativeElement;a.parentElement.insertBefore(s,a),this._activeDraggables.splice(r,0,e)}else this.element.nativeElement.appendChild(s),this._activeDraggables.push(e);s.style.transform="",this._cachePositions()},e.prototype.exit=function(e){this._reset(),this.exited.emit({item:e,container:this})},e.prototype.getItemIndex=function(e){return this._dragging?this._positionCache.items.findIndex(function(t){return t.drag===e}):this._draggables.toArray().indexOf(e)},e.prototype._sortItem=function(e,t,n){var r=this._positionCache.items,i="horizontal"===this.orientation,o=this._getItemIndexFromPointerPosition(e,t,n),s=e.getPlaceholderElement();if(!(-1===o&&r.length>0)){var a=r.findIndex(function(t){return t.drag===e}),p=r[a],c=r[o],d=i?p.clientRect.left-c.clientRect.left:p.clientRect.top-c.clientRect.top,l=i?0:d,h=i?d:0;this._adjustClientRect(p.clientRect,-l,-h),p.offset-=d,r[a]=c,this._adjustClientRect(c.clientRect,l,h),c.offset+=d,r[o]=p,s.style.transform=i?"translate3d("+p.offset+"px, 0, 0)":"translate3d(0, "+p.offset+"px, 0)",c.drag.element.nativeElement.style.transform=i?"translate3d("+c.offset+"px, 0, 0)":"translate3d(0, "+c.offset+"px, 0)"}},e.prototype._getSiblingContainerFromPosition=function(e,t){var n=this._positionCache.siblings.find(function(n){var r=n.clientRect,i=r.top,o=r.bottom,s=r.left,a=r.right;return t>=i&&t<=o&&e>=s&&e<=a});return n?n.drop:null},e.prototype._cachePositions=function(){var e=this;this._positionCache.items=this._activeDraggables.map(function(t){var n=e._dragDropRegistry.isDragging(t)?t.getPlaceholderElement():t.element.nativeElement,r=n.getBoundingClientRect();return{drag:t,offset:0,clientRect:{top:r.top,right:r.right,bottom:r.bottom,left:r.left,width:r.width,height:r.height}}}).sort(function(e,t){return e.clientRect.top-t.clientRect.top}),this._positionCache.siblings=this.connectedTo.map(function(t){return"string"==typeof t?e._dragDropRegistry.getDropContainer(t):t}).filter(function(t){return t&&t!==e}).map(function(e){return{drop:e,clientRect:e.element.nativeElement.getBoundingClientRect()}})},e.prototype._reset=function(){this._dragging=!1,this._activeDraggables.forEach(function(e){return e.element.nativeElement.style.transform=""}),this._activeDraggables=[],this._positionCache.items=[],this._positionCache.siblings=[]},e.prototype._adjustClientRect=function(e,t,n){e.top+=t,e.bottom=e.top+e.height,e.left+=n,e.right=e.left+e.width},e.prototype._getItemIndexFromPointerPosition=function(e,t,n){var r=this;return this._positionCache.items.findIndex(function(i,o,s){var a=i.drag,p=i.clientRect;return a===e?s.length<2:"horizontal"===r.orientation?t>=Math.floor(p.left)&&t<=Math.floor(p.right):n>=Math.floor(p.top)&&n<=Math.floor(p.bottom)})},e.decorators=[{type:t.Component,args:[{selector:"cdk-drop",exportAs:"cdkDrop",template:"<ng-content></ng-content>",encapsulation:t.ViewEncapsulation.None,changeDetection:t.ChangeDetectionStrategy.OnPush,styles:[".cdk-drag-preview{position:fixed;top:0;left:0;z-index:1000}.cdk-drag,.cdk-drag-handle{touch-action:none;-webkit-user-drag:none;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}"],providers:[{provide:u,useExisting:e}],host:{class:"cdk-drop","[id]":"id","[class.cdk-drop-dragging]":"_dragging"}}]}],e.ctorParameters=function(){return[{type:t.ElementRef},{type:v}]},e.propDecorators={_draggables:[{type:t.ContentChildren,args:[t.forwardRef(function(){return y})]}],connectedTo:[{type:t.Input}],data:[{type:t.Input}],orientation:[{type:t.Input}],id:[{type:t.Input}],dropped:[{type:t.Output}],entered:[{type:t.Output}],exited:[{type:t.Output}]},e}(),P=function(){function e(){}return e.decorators=[{type:t.NgModule,args:[{declarations:[C,y,g,_,f],exports:[C,y,g,_,f]}]}],e}();e.CdkDrop=C,e.CDK_DROP_CONTAINER=u,e.CdkDrag=y,e.CdkDragHandle=g,e.moveItemInArray=d,e.transferArrayItem=l,e.CdkDragPreview=_,e.CdkDragPlaceholder=f,e.DragDropModule=P,e.DragDropRegistry=v,Object.defineProperty(e,"__esModule",{value:!0})});
 //# sourceMappingURL=cdk-experimental-drag-drop.umd.min.js.map

bundles/cdk-experimental.umd.js

@@ -21,3 +21,3 @@ /**
  */
-var /** @type {?} */ VERSION = new core.Version('6.4.3');
+var /** @type {?} */ VERSION = new core.Version('6.4.5');
 
@@ -24,0 +24,0 @@ exports.VERSION = VERSION;

bundles/cdk-experimental.umd.min.js

@@ -8,3 +8,3 @@ /**
  */
-!function(e,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports,require("@angular/core")):"function"==typeof define&&define.amd?define("@angular/cdk-experimental",["exports","@angular/core"],n):n((e.ng=e.ng||{},e.ng["cdk-experimental"]={}),e.ng.core)}(this,function(e,n){"use strict";var r=new n.Version("6.4.3");e.VERSION=r,Object.defineProperty(e,"__esModule",{value:!0})});
+!function(e,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports,require("@angular/core")):"function"==typeof define&&define.amd?define("@angular/cdk-experimental",["exports","@angular/core"],n):n((e.ng=e.ng||{},e.ng["cdk-experimental"]={}),e.ng.core)}(this,function(e,n){"use strict";var r=new n.Version("6.4.5");e.VERSION=r,Object.defineProperty(e,"__esModule",{value:!0})});
 //# sourceMappingURL=cdk-experimental.umd.min.js.map

drag-drop/typings/drag-drop-registry.d.ts

@@ -10,17 +10,17 @@ /**
 import { Subject } from 'rxjs';
-import { CdkDrop } from './drop';
-import { CdkDrag } from './drag';
 /**
- * Service that keeps track of all the `CdkDrag` and `CdkDrop` instances, and
- * manages global event listeners on the `document`.
+ * Service that keeps track of all the drag item and drop container
+ * instances, and manages global event listeners on the `document`.
  * @docs-private
  */
-export declare class CdkDragDropRegistry implements OnDestroy {
+export declare class DragDropRegistry<I, C extends {
+    id: string;
+}> implements OnDestroy {
     private _ngZone;
     private _document;
-    /** Registered `CdkDrop` instances. */
+    /** Registered drop container instances. */
     private _dropInstances;
-    /** Registered `CdkDrag` instances. */
+    /** Registered drag item instances. */
     private _dragInstances;
-    /** `CdkDrag` instances that are currently being dragged. */
+    /** Drag item instances that are currently being dragged. */
     private _activeDragInstances;
@@ -31,3 +31,3 @@ /** Keeps track of the event listeners that we've bound to the `document`. */
      * Emits the `touchmove` or `mousemove` events that are dispatched
-     * while the user is dragging a `CdkDrag` instance.
+     * while the user is dragging a drag item instance.
      */
@@ -37,14 +37,14 @@ readonly pointerMove: Subject<TouchEvent | MouseEvent>;
      * Emits the `touchend` or `mouseup` events that are dispatched
-     * while the user is dragging a `CdkDrag` instance.
+     * while the user is dragging a drag item instance.
      */
     readonly pointerUp: Subject<TouchEvent | MouseEvent>;
     constructor(_ngZone: NgZone, _document: any);
-    /** Adds a `CdkDrop` instance to the registry. */
-    register(drop: CdkDrop): any;
-    /** Adds a `CdkDrag` instance to the registry. */
-    register(drag: CdkDrag): any;
-    /** Removes a `CdkDrop` instance from the registry. */
-    remove(drop: CdkDrop): any;
-    /** Removes a `CdkDrag` instance from the registry. */
-    remove(drag: CdkDrag): any;
+    /** Adds a drop container to the registry. */
+    registerDropContainer(drop: C): void;
+    /** Adds a drag item instance to the registry. */
+    registerDragItem(drag: I): void;
+    /** Removes a drop container from the registry. */
+    removeDropContainer(drop: C): void;
+    /** Removes a drag item instance from the registry. */
+    removeDragItem(drag: I): void;
     /**
@@ -55,9 +55,9 @@ * Starts the dragging sequence for a drag instance.
      */
-    startDragging(drag: CdkDrag, event: TouchEvent | MouseEvent): void;
-    /** Stops dragging a `CdkDrag` instance. */
-    stopDragging(drag: CdkDrag): void;
-    /** Gets whether a `CdkDrag` instance is currently being dragged. */
-    isDragging(drag: CdkDrag): boolean;
-    /** Gets a `CdkDrop` instance by its id. */
-    getDropContainer<T = any>(id: string): CdkDrop<T> | undefined;
+    startDragging(drag: I, event: TouchEvent | MouseEvent): void;
+    /** Stops dragging a drag item instance. */
+    stopDragging(drag: I): void;
+    /** Gets whether a drag item instance is currently being dragged. */
+    isDragging(drag: I): boolean;
+    /** Gets a drop container by its id. */
+    getDropContainer(id: string): C | undefined;
     ngOnDestroy(): void;
@@ -64,0 +64,0 @@ /**

drag-drop/typings/drag.d.ts

@@ -16,3 +16,3 @@ /**
 import { ViewportRuler } from '@angular/cdk/overlay';
-import { CdkDragDropRegistry } from './drag-drop-registry';
+import { DragDropRegistry } from './drag-drop-registry';
 /** Element that can be moved inside a CdkDrop container. */
@@ -87,3 +87,3 @@ export declare class CdkDrag<T = any> implements OnDestroy {
         /** Droppable container that the draggable is a part of. */
-        dropContainer: CdkDropContainer, document: any, _ngZone: NgZone, _viewContainerRef: ViewContainerRef, _viewportRuler: ViewportRuler, _dragDropRegistry: CdkDragDropRegistry, _dir: Directionality);
+        dropContainer: CdkDropContainer, document: any, _ngZone: NgZone, _viewContainerRef: ViewContainerRef, _viewportRuler: ViewportRuler, _dragDropRegistry: DragDropRegistry<CdkDrag<T>, CdkDropContainer>, _dir: Directionality);
     /**
@@ -117,4 +117,2 @@ * Returns the element that is being used as a placeholder
     private _createPlaceholderElement();
-    /** Gets the index of an element, based on its index in the DOM. */
-    private _getElementIndexInDom(element);
     /**
@@ -121,0 +119,0 @@ * Figures out the coordinates at which an element was picked up.

drag-drop/typings/drop-container.d.ts

@@ -13,2 +13,4 @@ /**
     data: T;
+    /** Unique ID for the drop zone. */
+    id: string;
     /** Direction in which the list is oriented. */
@@ -28,4 +30,6 @@ orientation: 'horizontal' | 'vertical';
      * @param item Item that was moved into the container.
+     * @param xOffset Position of the item along the X axis.
+     * @param yOffset Position of the item along the Y axis.
      */
-    enter(item: CdkDrag): void;
+    enter(item: CdkDrag, xOffset: number, yOffset: number): void;
     /**
@@ -32,0 +36,0 @@ * Removes an item from the container after it was dragged into another container by the user.

drag-drop/typings/drop.d.ts

@@ -11,3 +11,3 @@ /**
 import { CdkDragExit, CdkDragEnter, CdkDragDrop } from './drag-events';
-import { CdkDragDropRegistry } from './drag-drop-registry';
+import { DragDropRegistry } from './drag-drop-registry';
 /** Container that wraps a set of draggable items. */
@@ -45,3 +45,3 @@ export declare class CdkDrop<T = any> implements OnInit, OnDestroy {
     exited: EventEmitter<CdkDragExit<T>>;
-    constructor(element: ElementRef<HTMLElement>, _dragDropRegistry: CdkDragDropRegistry);
+    constructor(element: ElementRef<HTMLElement>, _dragDropRegistry: DragDropRegistry<CdkDrag, CdkDrop<T>>);
     ngOnInit(): void;
@@ -53,2 +53,8 @@ ngOnDestroy(): void;
     private _positionCache;
+    /**
+     * Draggable items that are currently active inside the container. Includes the items
+     * from `_draggables`, as well as any items that have been dragged in, but haven't
+     * been dropped yet.
+     */
+    private _activeDraggables;
     /** Starts dragging an item. */
@@ -66,4 +72,6 @@ start(): void;
      * @param item Item that was moved into the container.
+     * @param xOffset Position of the item along the X axis.
+     * @param yOffset Position of the item along the Y axis.
      */
-    enter(item: CdkDrag): void;
+    enter(item: CdkDrag, xOffset: number, yOffset: number): void;
     /**
@@ -94,5 +102,19 @@ * Removes an item from the container after it was dragged into another container by the user.
     /** Refreshes the position cache of the items and sibling containers. */
-    private _refreshPositions();
+    private _cachePositions();
     /** Resets the container to its initial state. */
     private _reset();
+    /**
+     * Updates the top/left positions of a `ClientRect`, as well as their bottom/right counterparts.
+     * @param clientRect `ClientRect` that should be updated.
+     * @param top New value for the `top` position.
+     * @param left New value for the `left` position.
+     */
+    private _adjustClientRect(clientRect, top, left);
+    /**
+     * Gets the index of an item in the drop container, based on the position of the user's pointer.
+     * @param item Item that is being sorted.
+     * @param xOffset Position of the user's pointer along the X axis.
+     * @param yOffset Position of the user's pointer along the Y axis.
+     */
+    private _getItemIndexFromPointerPosition(item, xOffset, yOffset);
 }

drag-drop/typings/index.metadata.json

@@ -1,1 +0,1 @@
-{"__symbolic":"module","version":4,"metadata":{"CdkDrop":{"__symbolic":"class","arity":1,"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":31,"character":1},"arguments":[{"moduleId":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"module"},"member":"id"},"selector":"cdk-drop","exportAs":"cdkDrop","template":"<ng-content></ng-content>","encapsulation":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewEncapsulation","line":36,"character":17},"member":"None"},"changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":37,"character":19},"member":"OnPush"},"providers":[{"provide":{"__symbolic":"reference","name":"CDK_DROP_CONTAINER"},"useExisting":{"__symbolic":"reference","name":"CdkDrop"}}],"host":{"class":"cdk-drop","[id]":"id","[class.cdk-drop-dragging]":"_dragging","$quoted$":["class","[id]","[class.cdk-drop-dragging]"]},"styles":[".cdk-drag-preview{position:fixed;top:0;left:0;z-index:1000}.cdk-drag,.cdk-drag-handle{touch-action:none;-webkit-user-drag:none;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}"]}]}],"members":{"_draggables":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChildren","line":50,"character":3},"arguments":[{"__symbolic":"reference","name":"CdkDrag"}]}]}],"connectedTo":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":57,"character":3}}]}],"data":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":60,"character":3}}]}],"orientation":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":63,"character":3}}]}],"id":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":69,"character":3}}]}],"dropped":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":72,"character":3}}]}],"entered":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":77,"character":3}}]}],"exited":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":83,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"ElementRef","module":"@angular/core","arguments":[{"__symbolic":"error","message":"Could not resolve type","line":86,"character":31,"context":{"typeName":"HTMLElement"},"module":"./drop"}]},{"__symbolic":"reference","name":"CdkDragDropRegistry"}]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"start":[{"__symbolic":"method"}],"drop":[{"__symbolic":"method"}],"enter":[{"__symbolic":"method"}],"exit":[{"__symbolic":"method"}],"getItemIndex":[{"__symbolic":"method"}],"_sortItem":[{"__symbolic":"method"}],"_getSiblingContainerFromPosition":[{"__symbolic":"method"}],"_refreshPositions":[{"__symbolic":"method"}],"_reset":[{"__symbolic":"method"}]}},"CdkDropContainer":{"__symbolic":"interface"},"CDK_DROP_CONTAINER":{"__symbolic":"new","expression":{"__symbolic":"reference","module":"@angular/core","name":"InjectionToken","line":55,"character":38},"arguments":["CDK_DROP_CONTAINER"]},"CdkDrag":{"__symbolic":"class","arity":1,"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":42,"character":1},"arguments":[{"selector":"[cdkDrag]","exportAs":"cdkDrag","host":{"class":"cdk-drag","(mousedown)":"_startDragging($event)","(touchstart)":"_startDragging($event)","$quoted$":["class","(mousedown)","(touchstart)"]}}]}],"members":{"_handles":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChildren","line":100,"character":3},"arguments":[{"__symbolic":"reference","name":"CdkDragHandle"}]}]}],"_previewTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChild","line":103,"character":3},"arguments":[{"__symbolic":"reference","name":"CdkDragPreview"}]}]}],"_placeholderTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChild","line":108,"character":3},"arguments":[{"__symbolic":"reference","name":"CdkDragPlaceholder"}]}]}],"data":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":111,"character":3}}]}],"started":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":114,"character":3},"arguments":["cdkDragStarted"]}]}],"ended":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":117,"character":3},"arguments":["cdkDragEnded"]}]}],"entered":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":120,"character":3},"arguments":["cdkDragEntered"]}]}],"exited":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":124,"character":3},"arguments":["cdkDragExited"]}]}],"dropped":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":128,"character":3},"arguments":["cdkDragDropped"]}]}],"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[null,[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject","line":135,"character":5},"arguments":[{"__symbolic":"reference","name":"CDK_DROP_CONTAINER"}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional","line":135,"character":33}},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"SkipSelf","line":135,"character":45}}],[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject","line":136,"character":5},"arguments":[{"__symbolic":"reference","module":"@angular/common","name":"DOCUMENT","line":136,"character":12}]}],null,null,null,null,[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional","line":141,"character":5}}]],"parameters":[{"__symbolic":"reference","name":"ElementRef","module":"@angular/core","arguments":[{"__symbolic":"error","message":"Could not resolve type","line":133,"character":31,"context":{"typeName":"HTMLElement"},"module":"./drag"}]},{"__symbolic":"reference","name":"CdkDropContainer"},{"__symbolic":"reference","name":"any"},{"__symbolic":"reference","module":"@angular/core","name":"NgZone","line":137,"character":21},{"__symbolic":"reference","module":"@angular/core","name":"ViewContainerRef","line":138,"character":31},{"__symbolic":"reference","module":"@angular/cdk/overlay","name":"ViewportRuler","line":139,"character":28},{"__symbolic":"reference","name":"CdkDragDropRegistry"},{"__symbolic":"reference","module":"@angular/cdk/bidi","name":"Directionality","line":141,"character":30}]}],"getPlaceholderElement":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"_startDragging":[{"__symbolic":"method"}],"_cleanupDragArtifacts":[{"__symbolic":"method"}],"_updateActiveDropContainer":[{"__symbolic":"method"}],"_createPreviewElement":[{"__symbolic":"method"}],"_createPlaceholderElement":[{"__symbolic":"method"}],"_getElementIndexInDom":[{"__symbolic":"method"}],"_getPointerPositionInElement":[{"__symbolic":"method"}],"_animatePreviewToPlaceholder":[{"__symbolic":"method"}],"_setTransform":[{"__symbolic":"method"}],"_removeElement":[{"__symbolic":"method"}],"_getPointerPositionOnPage":[{"__symbolic":"method"}],"_isTouchEvent":[{"__symbolic":"method"}],"_destroyPreview":[{"__symbolic":"method"}],"_destroyPlaceholder":[{"__symbolic":"method"}]}},"CdkDragHandle":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":11,"character":1},"arguments":[{"selector":"[cdkDragHandle]","host":{"class":"cdk-drag-handle","$quoted$":["class"]}}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"ElementRef","module":"@angular/core","arguments":[{"__symbolic":"error","message":"Could not resolve type","line":18,"character":41,"context":{"typeName":"HTMLElement"},"module":"./drag-handle"}]}]}]}},"CdkDragStart":{"__symbolic":"interface"},"CdkDragEnd":{"__symbolic":"interface"},"CdkDragEnter":{"__symbolic":"interface"},"CdkDragExit":{"__symbolic":"interface"},"CdkDragDrop":{"__symbolic":"interface"},"moveItemInArray":{"__symbolic":"function"},"transferArrayItem":{"__symbolic":"function"},"CdkDragPreview":{"__symbolic":"class","arity":1,"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":14,"character":1},"arguments":[{"selector":"ng-template[cdkDragPreview]"}]}],"members":{"data":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":19,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"TemplateRef","module":"@angular/core","arguments":[{"__symbolic":"error","message":"Could not resolve type","line":20,"character":46,"context":{"typeName":"T"},"module":"./drag-preview"}]}]}]}},"CdkDragPlaceholder":{"__symbolic":"class","arity":1,"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":14,"character":1},"arguments":[{"selector":"ng-template[cdkDragPlaceholder]"}]}],"members":{"data":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":19,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"TemplateRef","module":"@angular/core","arguments":[{"__symbolic":"error","message":"Could not resolve type","line":20,"character":46,"context":{"typeName":"T"},"module":"./drag-placeholder"}]}]}]}},"DragDropModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":15,"character":1},"arguments":[{"declarations":[{"__symbolic":"reference","name":"CdkDrop"},{"__symbolic":"reference","name":"CdkDrag"},{"__symbolic":"reference","name":"CdkDragHandle"},{"__symbolic":"reference","name":"CdkDragPreview"},{"__symbolic":"reference","name":"CdkDragPlaceholder"}],"exports":[{"__symbolic":"reference","name":"CdkDrop"},{"__symbolic":"reference","name":"CdkDrag"},{"__symbolic":"reference","name":"CdkDragHandle"},{"__symbolic":"reference","name":"CdkDragPreview"},{"__symbolic":"reference","name":"CdkDragPlaceholder"}]}]}],"members":{}},"CdkDragDropRegistry":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":26,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[null,[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject","line":56,"character":5},"arguments":[{"__symbolic":"reference","module":"@angular/common","name":"DOCUMENT","line":56,"character":12}]}]],"parameters":[{"__symbolic":"reference","module":"@angular/core","name":"NgZone","line":55,"character":21},{"__symbolic":"reference","name":"any"}]}],"register":[{"__symbolic":"method"},{"__symbolic":"method"},{"__symbolic":"method"}],"remove":[{"__symbolic":"method"},{"__symbolic":"method"},{"__symbolic":"method"}],"startDragging":[{"__symbolic":"method"}],"stopDragging":[{"__symbolic":"method"}],"isDragging":[{"__symbolic":"method"}],"getDropContainer":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"_clearGlobalListeners":[{"__symbolic":"method"}]},"statics":{"ngInjectableDef":{}}}},"origins":{"CdkDrop":"./drop","CdkDropContainer":"./drop-container","CDK_DROP_CONTAINER":"./drop-container","CdkDrag":"./drag","CdkDragHandle":"./drag-handle","CdkDragStart":"./drag-events","CdkDragEnd":"./drag-events","CdkDragEnter":"./drag-events","CdkDragExit":"./drag-events","CdkDragDrop":"./drag-events","moveItemInArray":"./drag-utils","transferArrayItem":"./drag-utils","CdkDragPreview":"./drag-preview","CdkDragPlaceholder":"./drag-placeholder","DragDropModule":"./drag-drop-module","CdkDragDropRegistry":"./drag-drop-registry"},"importAs":"@angular/cdk-experimental/drag-drop"}
+{"__symbolic":"module","version":4,"metadata":{"CdkDrop":{"__symbolic":"class","arity":1,"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":31,"character":1},"arguments":[{"moduleId":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"module"},"member":"id"},"selector":"cdk-drop","exportAs":"cdkDrop","template":"<ng-content></ng-content>","encapsulation":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewEncapsulation","line":36,"character":17},"member":"None"},"changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":37,"character":19},"member":"OnPush"},"providers":[{"provide":{"__symbolic":"reference","name":"CDK_DROP_CONTAINER"},"useExisting":{"__symbolic":"reference","name":"CdkDrop"}}],"host":{"class":"cdk-drop","[id]":"id","[class.cdk-drop-dragging]":"_dragging","$quoted$":["class","[id]","[class.cdk-drop-dragging]"]},"styles":[".cdk-drag-preview{position:fixed;top:0;left:0;z-index:1000}.cdk-drag,.cdk-drag-handle{touch-action:none;-webkit-user-drag:none;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}"]}]}],"members":{"_draggables":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChildren","line":50,"character":3},"arguments":[{"__symbolic":"reference","name":"CdkDrag"}]}]}],"connectedTo":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":57,"character":3}}]}],"data":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":60,"character":3}}]}],"orientation":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":63,"character":3}}]}],"id":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":69,"character":3}}]}],"dropped":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":72,"character":3}}]}],"entered":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":77,"character":3}}]}],"exited":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":83,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"ElementRef","module":"@angular/core","arguments":[{"__symbolic":"error","message":"Could not resolve type","line":86,"character":31,"context":{"typeName":"HTMLElement"},"module":"./drop"}]},{"__symbolic":"reference","name":"DragDropRegistry"}]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"start":[{"__symbolic":"method"}],"drop":[{"__symbolic":"method"}],"enter":[{"__symbolic":"method"}],"exit":[{"__symbolic":"method"}],"getItemIndex":[{"__symbolic":"method"}],"_sortItem":[{"__symbolic":"method"}],"_getSiblingContainerFromPosition":[{"__symbolic":"method"}],"_cachePositions":[{"__symbolic":"method"}],"_reset":[{"__symbolic":"method"}],"_adjustClientRect":[{"__symbolic":"method"}],"_getItemIndexFromPointerPosition":[{"__symbolic":"method"}]}},"CdkDropContainer":{"__symbolic":"interface"},"CDK_DROP_CONTAINER":{"__symbolic":"new","expression":{"__symbolic":"reference","module":"@angular/core","name":"InjectionToken","line":60,"character":38},"arguments":["CDK_DROP_CONTAINER"]},"CdkDrag":{"__symbolic":"class","arity":1,"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":42,"character":1},"arguments":[{"selector":"[cdkDrag]","exportAs":"cdkDrag","host":{"class":"cdk-drag","(mousedown)":"_startDragging($event)","(touchstart)":"_startDragging($event)","$quoted$":["class","(mousedown)","(touchstart)"]}}]}],"members":{"_handles":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChildren","line":100,"character":3},"arguments":[{"__symbolic":"reference","name":"CdkDragHandle"}]}]}],"_previewTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChild","line":103,"character":3},"arguments":[{"__symbolic":"reference","name":"CdkDragPreview"}]}]}],"_placeholderTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChild","line":108,"character":3},"arguments":[{"__symbolic":"reference","name":"CdkDragPlaceholder"}]}]}],"data":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":111,"character":3}}]}],"started":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":114,"character":3},"arguments":["cdkDragStarted"]}]}],"ended":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":117,"character":3},"arguments":["cdkDragEnded"]}]}],"entered":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":120,"character":3},"arguments":["cdkDragEntered"]}]}],"exited":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":124,"character":3},"arguments":["cdkDragExited"]}]}],"dropped":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":128,"character":3},"arguments":["cdkDragDropped"]}]}],"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[null,[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject","line":135,"character":5},"arguments":[{"__symbolic":"reference","name":"CDK_DROP_CONTAINER"}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional","line":135,"character":33}},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"SkipSelf","line":135,"character":45}}],[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject","line":136,"character":5},"arguments":[{"__symbolic":"reference","module":"@angular/common","name":"DOCUMENT","line":136,"character":12}]}],null,null,null,null,[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional","line":141,"character":5}}]],"parameters":[{"__symbolic":"reference","name":"ElementRef","module":"@angular/core","arguments":[{"__symbolic":"error","message":"Could not resolve type","line":133,"character":31,"context":{"typeName":"HTMLElement"},"module":"./drag"}]},{"__symbolic":"reference","name":"CdkDropContainer"},{"__symbolic":"reference","name":"any"},{"__symbolic":"reference","module":"@angular/core","name":"NgZone","line":137,"character":21},{"__symbolic":"reference","module":"@angular/core","name":"ViewContainerRef","line":138,"character":31},{"__symbolic":"reference","module":"@angular/cdk/overlay","name":"ViewportRuler","line":139,"character":28},{"__symbolic":"reference","name":"DragDropRegistry"},{"__symbolic":"reference","module":"@angular/cdk/bidi","name":"Directionality","line":141,"character":30}]}],"getPlaceholderElement":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"_startDragging":[{"__symbolic":"method"}],"_cleanupDragArtifacts":[{"__symbolic":"method"}],"_updateActiveDropContainer":[{"__symbolic":"method"}],"_createPreviewElement":[{"__symbolic":"method"}],"_createPlaceholderElement":[{"__symbolic":"method"}],"_getPointerPositionInElement":[{"__symbolic":"method"}],"_animatePreviewToPlaceholder":[{"__symbolic":"method"}],"_setTransform":[{"__symbolic":"method"}],"_removeElement":[{"__symbolic":"method"}],"_getPointerPositionOnPage":[{"__symbolic":"method"}],"_isTouchEvent":[{"__symbolic":"method"}],"_destroyPreview":[{"__symbolic":"method"}],"_destroyPlaceholder":[{"__symbolic":"method"}]}},"CdkDragHandle":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":11,"character":1},"arguments":[{"selector":"[cdkDragHandle]","host":{"class":"cdk-drag-handle","$quoted$":["class"]}}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"ElementRef","module":"@angular/core","arguments":[{"__symbolic":"error","message":"Could not resolve type","line":18,"character":41,"context":{"typeName":"HTMLElement"},"module":"./drag-handle"}]}]}]}},"CdkDragStart":{"__symbolic":"interface"},"CdkDragEnd":{"__symbolic":"interface"},"CdkDragEnter":{"__symbolic":"interface"},"CdkDragExit":{"__symbolic":"interface"},"CdkDragDrop":{"__symbolic":"interface"},"moveItemInArray":{"__symbolic":"function"},"transferArrayItem":{"__symbolic":"function"},"CdkDragPreview":{"__symbolic":"class","arity":1,"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":14,"character":1},"arguments":[{"selector":"ng-template[cdkDragPreview]"}]}],"members":{"data":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":19,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"TemplateRef","module":"@angular/core","arguments":[{"__symbolic":"error","message":"Could not resolve type","line":20,"character":46,"context":{"typeName":"T"},"module":"./drag-preview"}]}]}]}},"CdkDragPlaceholder":{"__symbolic":"class","arity":1,"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":14,"character":1},"arguments":[{"selector":"ng-template[cdkDragPlaceholder]"}]}],"members":{"data":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":19,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"TemplateRef","module":"@angular/core","arguments":[{"__symbolic":"error","message":"Could not resolve type","line":20,"character":46,"context":{"typeName":"T"},"module":"./drag-placeholder"}]}]}]}},"DragDropModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":15,"character":1},"arguments":[{"declarations":[{"__symbolic":"reference","name":"CdkDrop"},{"__symbolic":"reference","name":"CdkDrag"},{"__symbolic":"reference","name":"CdkDragHandle"},{"__symbolic":"reference","name":"CdkDragPreview"},{"__symbolic":"reference","name":"CdkDragPlaceholder"}],"exports":[{"__symbolic":"reference","name":"CdkDrop"},{"__symbolic":"reference","name":"CdkDrag"},{"__symbolic":"reference","name":"CdkDragHandle"},{"__symbolic":"reference","name":"CdkDragPreview"},{"__symbolic":"reference","name":"CdkDragPlaceholder"}]}]}],"members":{}},"DragDropRegistry":{"__symbolic":"class","arity":2,"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":27,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[null,[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject","line":57,"character":5},"arguments":[{"__symbolic":"reference","module":"@angular/common","name":"DOCUMENT","line":57,"character":12}]}]],"parameters":[{"__symbolic":"reference","module":"@angular/core","name":"NgZone","line":56,"character":21},{"__symbolic":"reference","name":"any"}]}],"registerDropContainer":[{"__symbolic":"method"}],"registerDragItem":[{"__symbolic":"method"}],"removeDropContainer":[{"__symbolic":"method"}],"removeDragItem":[{"__symbolic":"method"}],"startDragging":[{"__symbolic":"method"}],"stopDragging":[{"__symbolic":"method"}],"isDragging":[{"__symbolic":"method"}],"getDropContainer":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"_clearGlobalListeners":[{"__symbolic":"method"}]},"statics":{"ngInjectableDef":{}}}},"origins":{"CdkDrop":"./drop","CdkDropContainer":"./drop-container","CDK_DROP_CONTAINER":"./drop-container","CdkDrag":"./drag","CdkDragHandle":"./drag-handle","CdkDragStart":"./drag-events","CdkDragEnd":"./drag-events","CdkDragEnter":"./drag-events","CdkDragExit":"./drag-events","CdkDragDrop":"./drag-events","moveItemInArray":"./drag-utils","transferArrayItem":"./drag-utils","CdkDragPreview":"./drag-preview","CdkDragPlaceholder":"./drag-placeholder","DragDropModule":"./drag-drop-module","DragDropRegistry":"./drag-drop-registry"},"importAs":"@angular/cdk-experimental/drag-drop"}

esm2015/cdk-experimental.js

@@ -17,3 +17,3 @@ /**
  */
-const /** @type {?} */ VERSION = new Version('6.4.3');
+const /** @type {?} */ VERSION = new Version('6.4.5');
 
@@ -20,0 +20,0 @@ /**

esm2015/drag-drop.js

@@ -122,8 +122,10 @@ /**
 const /** @type {?} */ activeEventOptions = supportsPassiveEventListeners() ? { passive: false } : false;
+// unsupported: template constraints.
 /**
- * Service that keeps track of all the `CdkDrag` and `CdkDrop` instances, and
- * manages global event listeners on the `document`.
+ * Service that keeps track of all the drag item and drop container
+ * instances, and manages global event listeners on the `document`.
  * \@docs-private
+ * @template I, C
  */
-class CdkDragDropRegistry {
+class DragDropRegistry {
     /**
@@ -136,11 +138,11 @@ * @param {?} _ngZone
         /**
-         * Registered `CdkDrop` instances.
+         * Registered drop container instances.
          */
         this._dropInstances = new Set();
         /**
-         * Registered `CdkDrag` instances.
+         * Registered drag item instances.
          */
         this._dragInstances = new Set();
         /**
-         * `CdkDrag` instances that are currently being dragged.
+         * Drag item instances that are currently being dragged.
          */
@@ -154,3 +156,3 @@ this._activeDragInstances = new Set();
          * Emits the `touchmove` or `mousemove` events that are dispatched
-         * while the user is dragging a `CdkDrag` instance.
+         * while the user is dragging a drag item instance.
          */
@@ -160,3 +162,3 @@ this.pointerMove = new Subject();
          * Emits the `touchend` or `mouseup` events that are dispatched
-         * while the user is dragging a `CdkDrag` instance.
+         * while the user is dragging a drag item instance.
          */
@@ -177,40 +179,48 @@ this.pointerUp = new Subject();
     /**
-     * @param {?} instance
+     * Adds a drop container to the registry.
+     * @param {?} drop
      * @return {?}
      */
-    register(instance) {
-        if (instance instanceof CdkDrop) {
-            if (!this._dropInstances.has(instance)) {
-                if (this.getDropContainer(instance.id)) {
-                    throw Error(`Drop instance with id "${instance.id}" has already been registered.`);
-                }
-                this._dropInstances.add(instance);
+    registerDropContainer(drop) {
+        if (!this._dropInstances.has(drop)) {
+            if (this.getDropContainer(drop.id)) {
+                throw Error(`Drop instance with id "${drop.id}" has already been registered.`);
             }
+            this._dropInstances.add(drop);
         }
-        else {
-            this._dragInstances.add(instance);
-            if (this._dragInstances.size === 1) {
-                this._ngZone.runOutsideAngular(() => {
-                    // The event handler has to be explicitly active, because
-                    // newer browsers make it passive by default.
-                    this._document.addEventListener('touchmove', this._preventScrollListener, activeEventOptions);
-                });
-            }
+    }
+    /**
+     * Adds a drag item instance to the registry.
+     * @param {?} drag
+     * @return {?}
+     */
+    registerDragItem(drag) {
+        this._dragInstances.add(drag);
+        if (this._dragInstances.size === 1) {
+            this._ngZone.runOutsideAngular(() => {
+                // The event handler has to be explicitly active, because
+                // newer browsers make it passive by default.
+                this._document.addEventListener('touchmove', this._preventScrollListener, activeEventOptions);
+            });
         }
     }
     /**
-     * @param {?} instance
+     * Removes a drop container from the registry.
+     * @param {?} drop
      * @return {?}
      */
-    remove(instance) {
-        if (instance instanceof CdkDrop) {
-            this._dropInstances.delete(instance);
+    removeDropContainer(drop) {
+        this._dropInstances.delete(drop);
+    }
+    /**
+     * Removes a drag item instance from the registry.
+     * @param {?} drag
+     * @return {?}
+     */
+    removeDragItem(drag) {
+        this._dragInstances.delete(drag);
+        this.stopDragging(drag);
+        if (this._dragInstances.size === 0) {
+            this._document.removeEventListener('touchmove', this._preventScrollListener, /** @type {?} */ (activeEventOptions));
         }
-        else {
-            this._dragInstances.delete(instance);
-            this.stopDragging(instance);
-            if (this._dragInstances.size === 0) {
-                this._document.removeEventListener('touchmove', this._preventScrollListener, /** @type {?} */ (activeEventOptions));
-            }
-        }
     }
@@ -243,3 +253,3 @@ /**
     /**
-     * Stops dragging a `CdkDrag` instance.
+     * Stops dragging a drag item instance.
      * @param {?} drag
@@ -255,3 +265,3 @@ * @return {?}
     /**
-     * Gets whether a `CdkDrag` instance is currently being dragged.
+     * Gets whether a drag item instance is currently being dragged.
      * @param {?} drag
@@ -264,4 +274,3 @@ * @return {?}
     /**
-     * Gets a `CdkDrop` instance by its id.
-     * @template T
+     * Gets a drop container by its id.
      * @param {?} id
@@ -277,4 +286,4 @@ * @return {?}
     ngOnDestroy() {
-        this._dragInstances.forEach(instance => this.remove(instance));
-        this._dropInstances.forEach(instance => this.remove(instance));
+        this._dragInstances.forEach(instance => this.removeDragItem(instance));
+        this._dropInstances.forEach(instance => this.removeDropContainer(instance));
         this._clearGlobalListeners();
@@ -295,11 +304,11 @@ this.pointerMove.complete();
 }
-CdkDragDropRegistry.decorators = [
+DragDropRegistry.decorators = [
     { type: Injectable, args: [{ providedIn: 'root' },] },
 ];
 /** @nocollapse */
-CdkDragDropRegistry.ctorParameters = () => [
+DragDropRegistry.ctorParameters = () => [
     { type: NgZone, },
     { type: undefined, decorators: [{ type: Inject, args: [DOCUMENT,] },] },
 ];
-/** @nocollapse */ CdkDragDropRegistry.ngInjectableDef = defineInjectable({ factory: function CdkDragDropRegistry_Factory() { return new CdkDragDropRegistry(inject(NgZone), inject(DOCUMENT)); }, token: CdkDragDropRegistry, providedIn: "root" });
+/** @nocollapse */ DragDropRegistry.ngInjectableDef = defineInjectable({ factory: function DragDropRegistry_Factory() { return new DragDropRegistry(inject(NgZone), inject(DOCUMENT)); }, token: DragDropRegistry, providedIn: "root" });
 
@@ -412,3 +421,3 @@ /**
         this._pointerMove = (event) => {
-            // TODO: this should start dragging after a certain threshold,
+            // TODO(crisbeto): this should start dragging after a certain threshold,
             // otherwise we risk interfering with clicks on the element.
@@ -451,3 +460,3 @@ if (!this._dragDropRegistry.isDragging(this)) {
         this._document = document;
-        _dragDropRegistry.register(this);
+        _dragDropRegistry.registerDragItem(this);
     }
@@ -476,3 +485,3 @@ /**
         this._nextSibling = null;
-        this._dragDropRegistry.remove(this);
+        this._dragDropRegistry.removeDragItem(this);
         this._destroyed.next();
@@ -507,3 +516,2 @@ this._destroyed.complete();
     _cleanupDragArtifacts() {
-        const /** @type {?} */ currentIndex = this._getElementIndexInDom(this._placeholder);
         // Restore the element's visibility and insert it at its old position in the DOM.
@@ -524,2 +532,3 @@ // It's important that we maintain the position, because moving the element around in the DOM
         this._ngZone.run(() => {
+            const /** @type {?} */ currentIndex = this.dropContainer.getItemIndex(this);
             this.ended.emit({ source: this });
@@ -554,3 +563,3 @@ this.dropped.emit({
                 this.dropContainer = newContainer;
-                this.dropContainer.enter(this);
+                this.dropContainer.enter(this, x, y);
             });
@@ -603,34 +612,2 @@ }
     /**
-     * Gets the index of an element, based on its index in the DOM.
-     * @param {?} element
-     * @return {?}
-     */
-    _getElementIndexInDom(element) {
-        // Note: we may be able to figure this in memory while sorting, but doing so won't be very
-        // reliable when transferring between containers, because the new container doesn't have
-        // the proper indices yet. Also this will work better for the case where the consumer
-        // isn't using an `ngFor` to render the list.
-        if (!element.parentElement) {
-            return -1;
-        }
-        // Avoid accessing `children` and `children.length` too much since they're a "live collection".
-        let /** @type {?} */ index = 0;
-        const /** @type {?} */ siblings = element.parentElement.children;
-        const /** @type {?} */ siblingsLength = siblings.length;
-        const /** @type {?} */ draggableElements = this.dropContainer._draggables
-            .filter(item => item !== this)
-            .map(item => item.element.nativeElement);
-        // Loop through the sibling elements to find out the index of the
-        // current one, while skipping any elements that aren't draggable.
-        for (let /** @type {?} */ i = 0; i < siblingsLength; i++) {
-            if (siblings[i] === element) {
-                return index;
-            }
-            else if (draggableElements.indexOf(/** @type {?} */ (siblings[i])) > -1) {
-                index++;
-            }
-        }
-        return -1;
-    }
-    /**
      * Figures out the coordinates at which an element was picked up.
@@ -781,3 +758,3 @@ * @param {?} referenceElement Element that initiated the dragging.
     { type: ViewportRuler, },
-    { type: CdkDragDropRegistry, },
+    { type: DragDropRegistry, },
     { type: Directionality, decorators: [{ type: Optional },] },
@@ -882,3 +859,3 @@ ];
     ngOnInit() {
-        this._dragDropRegistry.register(this);
+        this._dragDropRegistry.registerDropContainer(this);
     }
@@ -889,3 +866,3 @@ /**
     ngOnDestroy() {
-        this._dragDropRegistry.remove(this);
+        this._dragDropRegistry.removeDropContainer(this);
     }
@@ -898,3 +875,4 @@ /**
         this._dragging = true;
-        this._refreshPositions();
+        this._activeDraggables = this._draggables.toArray();
+        this._cachePositions();
     }
@@ -909,2 +887,3 @@ /**
     drop(item, currentIndex, previousContainer) {
+        this._reset();
         this.dropped.emit({
@@ -915,6 +894,5 @@ item,
             container: this,
-            // TODO: reconsider whether to make this null if the containers are the same.
+            // TODO(crisbeto): reconsider whether to make this null if the containers are the same.
             previousContainer
         });
-        this._reset();
     }
@@ -924,7 +902,36 @@ /**
      * @param {?} item Item that was moved into the container.
+     * @param {?} xOffset Position of the item along the X axis.
+     * @param {?} yOffset Position of the item along the Y axis.
      * @return {?}
      */
-    enter(item) {
+    enter(item, xOffset, yOffset) {
         this.entered.emit({ item, container: this });
         this.start();
+        // We use the coordinates of where the item entered the drop
+        // zone to figure out at which index it should be inserted.
+        const /** @type {?} */ newIndex = this._getItemIndexFromPointerPosition(item, xOffset, yOffset);
+        const /** @type {?} */ currentIndex = this._activeDraggables.indexOf(item);
+        const /** @type {?} */ newPositionReference = this._activeDraggables[newIndex];
+        const /** @type {?} */ placeholder = item.getPlaceholderElement();
+        // Since the item may be in the `activeDraggables` already (e.g. if the user dragged it
+        // into another container and back again), we have to ensure that it isn't duplicated.
+        if (currentIndex > -1) {
+            this._activeDraggables.splice(currentIndex, 1);
+        }
+        // Don't use items that are being dragged as a reference, because
+        // their element has been moved down to the bottom of the body.
+        if (newPositionReference && !this._dragDropRegistry.isDragging(newPositionReference)) {
+            const /** @type {?} */ element = newPositionReference.element.nativeElement; /** @type {?} */
+            ((element.parentElement)).insertBefore(placeholder, element);
+            this._activeDraggables.splice(newIndex, 0, item);
+        }
+        else {
+            this.element.nativeElement.appendChild(placeholder);
+            this._activeDraggables.push(item);
+        }
+        // The transform needs to be cleared so it doesn't throw off the measurements.
+        placeholder.style.transform = '';
+        // Note that the positions were already cached when we called `start` above,
+        // but we need to refresh them since the amount of items has changed.
+        this._cachePositions();
     }
@@ -946,3 +953,5 @@ /**
     getItemIndex(item) {
-        return this._draggables.toArray().indexOf(item);
+        return this._dragging ?
+            this._positionCache.items.findIndex(currentItem => currentItem.drag === item) :
+            this._draggables.toArray().indexOf(item);
     }
@@ -958,29 +967,34 @@ /**
         const /** @type {?} */ siblings = this._positionCache.items;
-        const /** @type {?} */ newPosition = siblings.find(({ drag, clientRect }) => {
-            if (drag === item) {
-                // If there's only one left item in the container, it must be
-                // the dragged item itself so we use it as a reference.
-                return siblings.length < 2;
-            }
-            return this.orientation === 'horizontal' ?
-                xOffset > clientRect.left && xOffset < clientRect.right :
-                yOffset > clientRect.top && yOffset < clientRect.bottom;
-        });
-        if (!newPosition && siblings.length > 0) {
+        const /** @type {?} */ isHorizontal = this.orientation === 'horizontal';
+        const /** @type {?} */ newIndex = this._getItemIndexFromPointerPosition(item, xOffset, yOffset);
+        const /** @type {?} */ placeholder = item.getPlaceholderElement();
+        if (newIndex === -1 && siblings.length > 0) {
             return;
         }
-        // Don't take the element of a dragged item as a reference,
-        // because it has been moved down to the end of the body.
-        const /** @type {?} */ element = (newPosition && !this._dragDropRegistry.isDragging(newPosition.drag)) ?
-            newPosition.drag.element.nativeElement : null;
-        const /** @type {?} */ next = element ? /** @type {?} */ ((element)).nextSibling : null;
-        const /** @type {?} */ parent = element ? /** @type {?} */ ((element.parentElement)) : this.element.nativeElement;
-        const /** @type {?} */ placeholder = item.getPlaceholderElement();
-        if (next) {
-            parent.insertBefore(placeholder, next === placeholder ? element : next);
-        }
-        else {
-            parent.appendChild(placeholder);
-        }
-        this._refreshPositions();
+        const /** @type {?} */ currentIndex = siblings.findIndex(currentItem => currentItem.drag === item);
+        const /** @type {?} */ currentPosition = siblings[currentIndex];
+        const /** @type {?} */ newPosition = siblings[newIndex];
+        // Figure out the offset necessary for the items to be swapped.
+        const /** @type {?} */ offset = isHorizontal ?
+            currentPosition.clientRect.left - newPosition.clientRect.left :
+            currentPosition.clientRect.top - newPosition.clientRect.top;
+        const /** @type {?} */ topAdjustment = isHorizontal ? 0 : offset;
+        const /** @type {?} */ leftAdjustment = isHorizontal ? offset : 0;
+        // Since we've moved the items with a `transform`, we need to adjust their cached
+        // client rects to reflect their new position, as well as swap their positions in the cache.
+        // Note that we shouldn't use `getBoundingClientRect` here to update the cache, because the
+        // elements may be mid-animation which will give us a wrong result.
+        this._adjustClientRect(currentPosition.clientRect, -topAdjustment, -leftAdjustment);
+        currentPosition.offset -= offset;
+        siblings[currentIndex] = newPosition;
+        this._adjustClientRect(newPosition.clientRect, topAdjustment, leftAdjustment);
+        newPosition.offset += offset;
+        siblings[newIndex] = currentPosition;
+        // Swap the placeholder's position with the one of the target draggable.
+        placeholder.style.transform = isHorizontal ?
+            `translate3d(${currentPosition.offset}px, 0, 0)` :
+            `translate3d(0, ${currentPosition.offset}px, 0)`;
+        newPosition.drag.element.nativeElement.style.transform = isHorizontal ?
+            `translate3d(${newPosition.offset}px, 0, 0)` :
+            `translate3d(0, ${newPosition.offset}px, 0)`;
     }
@@ -1005,10 +1019,32 @@ /**
      */
-    _refreshPositions() {
-        this._positionCache.items = this._draggables
-            .map(drag => ({ drag, clientRect: drag.element.nativeElement.getBoundingClientRect() }))
+    _cachePositions() {
+        this._positionCache.items = this._activeDraggables
+            .map(drag => {
+            const /** @type {?} */ elementToMeasure = this._dragDropRegistry.isDragging(drag) ?
+                // If the element is being dragged, we have to measure the
+                // placeholder, because the element is hidden.
+                drag.getPlaceholderElement() :
+                drag.element.nativeElement;
+            const /** @type {?} */ clientRect = elementToMeasure.getBoundingClientRect();
+            return {
+                drag,
+                offset: 0,
+                // We need to clone the `clientRect` here, because all the values on it are readonly
+                // and we need to be able to update them. Also we can't use a spread here, because
+                // the values on a `ClientRect` aren't own properties. See:
+                // https://developer.mozilla.org/en-US/docs/Web/API/Element/getBoundingClientRect#Notes
+                clientRect: {
+                    top: clientRect.top,
+                    right: clientRect.right,
+                    bottom: clientRect.bottom,
+                    left: clientRect.left,
+                    width: clientRect.width,
+                    height: clientRect.height
+                }
+            };
+        })
             .sort((a, b) => a.clientRect.top - b.clientRect.top);
-        // TODO: add filter here that ensures that the current container isn't being passed to itself.
         this._positionCache.siblings = this.connectedTo
             .map(drop => typeof drop === 'string' ? /** @type {?} */ ((this._dragDropRegistry.getDropContainer(drop))) : drop)
-            .filter(Boolean)
+            .filter(drop => drop && drop !== this)
             .map(drop => ({ drop, clientRect: drop.element.nativeElement.getBoundingClientRect() }));
@@ -1022,5 +1058,42 @@ }
         this._dragging = false;
+        // TODO(crisbeto): may have to wait for the animations to finish.
+        this._activeDraggables.forEach(item => item.element.nativeElement.style.transform = '');
+        this._activeDraggables = [];
         this._positionCache.items = [];
         this._positionCache.siblings = [];
     }
+    /**
+     * Updates the top/left positions of a `ClientRect`, as well as their bottom/right counterparts.
+     * @param {?} clientRect `ClientRect` that should be updated.
+     * @param {?} top New value for the `top` position.
+     * @param {?} left New value for the `left` position.
+     * @return {?}
+     */
+    _adjustClientRect(clientRect, top, left) {
+        clientRect.top += top;
+        clientRect.bottom = clientRect.top + clientRect.height;
+        clientRect.left += left;
+        clientRect.right = clientRect.left + clientRect.width;
+    }
+    /**
+     * Gets the index of an item in the drop container, based on the position of the user's pointer.
+     * @param {?} item Item that is being sorted.
+     * @param {?} xOffset Position of the user's pointer along the X axis.
+     * @param {?} yOffset Position of the user's pointer along the Y axis.
+     * @return {?}
+     */
+    _getItemIndexFromPointerPosition(item, xOffset, yOffset) {
+        return this._positionCache.items.findIndex(({ drag, clientRect }, _, array) => {
+            if (drag === item) {
+                // If there's only one item left in the container, it must be
+                // the dragged item itself so we use it as a reference.
+                return array.length < 2;
+            }
+            return this.orientation === 'horizontal' ?
+                // Round these down since most browsers report client rects with
+                // sub-pixel precision, whereas the mouse coordinates are rounded to pixels.
+                xOffset >= Math.floor(clientRect.left) && xOffset <= Math.floor(clientRect.right) :
+                yOffset >= Math.floor(clientRect.top) && yOffset <= Math.floor(clientRect.bottom);
+        });
+    }
 }
@@ -1047,3 +1120,3 @@ CdkDrop.decorators = [
     { type: ElementRef, },
-    { type: CdkDragDropRegistry, },
+    { type: DragDropRegistry, },
 ];
@@ -1148,3 +1221,3 @@ CdkDrop.propDecorators = {
 
-export { CdkDrop, CDK_DROP_CONTAINER, CdkDrag, CdkDragHandle, moveItemInArray, transferArrayItem, CdkDragPreview, CdkDragPlaceholder, DragDropModule, CdkDragDropRegistry };
+export { CdkDrop, CDK_DROP_CONTAINER, CdkDrag, CdkDragHandle, moveItemInArray, transferArrayItem, CdkDragPreview, CdkDragPlaceholder, DragDropModule, DragDropRegistry };
 //# sourceMappingURL=drag-drop.js.map

esm5/cdk-experimental.es5.js

@@ -17,3 +17,3 @@ /**
  */
-var /** @type {?} */ VERSION = new Version('6.4.3');
+var /** @type {?} */ VERSION = new Version('6.4.5');
 
@@ -20,0 +20,0 @@ /**

esm5/drag-drop.es5.js

@@ -116,21 +116,23 @@ /**
 var /** @type {?} */ activeEventOptions = supportsPassiveEventListeners() ? { passive: false } : false;
+// unsupported: template constraints.
 /**
- * Service that keeps track of all the `CdkDrag` and `CdkDrop` instances, and
- * manages global event listeners on the `document`.
+ * Service that keeps track of all the drag item and drop container
+ * instances, and manages global event listeners on the `document`.
  * \@docs-private
+ * @template I, C
  */
-var CdkDragDropRegistry = /** @class */ (function () {
-    function CdkDragDropRegistry(_ngZone, _document) {
+var DragDropRegistry = /** @class */ (function () {
+    function DragDropRegistry(_ngZone, _document) {
         var _this = this;
         this._ngZone = _ngZone;
         /**
-         * Registered `CdkDrop` instances.
+         * Registered drop container instances.
          */
         this._dropInstances = new Set();
         /**
-         * Registered `CdkDrag` instances.
+         * Registered drag item instances.
          */
         this._dragInstances = new Set();
         /**
-         * `CdkDrag` instances that are currently being dragged.
+         * Drag item instances that are currently being dragged.
          */
@@ -144,3 +146,3 @@ this._activeDragInstances = new Set();
          * Emits the `touchmove` or `mousemove` events that are dispatched
-         * while the user is dragging a `CdkDrag` instance.
+         * while the user is dragging a drag item instance.
          */
@@ -150,3 +152,3 @@ this.pointerMove = new Subject();
          * Emits the `touchend` or `mouseup` events that are dispatched
-         * while the user is dragging a `CdkDrag` instance.
+         * while the user is dragging a drag item instance.
          */
@@ -166,52 +168,76 @@ this.pointerUp = new Subject();
     }
+    /** Adds a drop container to the registry. */
     /**
-     * @param {?} instance
+     * Adds a drop container to the registry.
+     * @param {?} drop
      * @return {?}
      */
-    CdkDragDropRegistry.prototype.register = /**
-     * @param {?} instance
+    DragDropRegistry.prototype.registerDropContainer = /**
+     * Adds a drop container to the registry.
+     * @param {?} drop
      * @return {?}
      */
-    function (instance) {
-        var _this = this;
-        if (instance instanceof CdkDrop) {
-            if (!this._dropInstances.has(instance)) {
-                if (this.getDropContainer(instance.id)) {
-                    throw Error("Drop instance with id \"" + instance.id + "\" has already been registered.");
-                }
-                this._dropInstances.add(instance);
+    function (drop) {
+        if (!this._dropInstances.has(drop)) {
+            if (this.getDropContainer(drop.id)) {
+                throw Error("Drop instance with id \"" + drop.id + "\" has already been registered.");
             }
+            this._dropInstances.add(drop);
         }
-        else {
-            this._dragInstances.add(instance);
-            if (this._dragInstances.size === 1) {
-                this._ngZone.runOutsideAngular(function () {
-                    // The event handler has to be explicitly active, because
-                    // newer browsers make it passive by default.
-                    // The event handler has to be explicitly active, because
-                    // newer browsers make it passive by default.
-                    _this._document.addEventListener('touchmove', _this._preventScrollListener, activeEventOptions);
-                });
-            }
+    };
+    /** Adds a drag item instance to the registry. */
+    /**
+     * Adds a drag item instance to the registry.
+     * @param {?} drag
+     * @return {?}
+     */
+    DragDropRegistry.prototype.registerDragItem = /**
+     * Adds a drag item instance to the registry.
+     * @param {?} drag
+     * @return {?}
+     */
+    function (drag) {
+        var _this = this;
+        this._dragInstances.add(drag);
+        if (this._dragInstances.size === 1) {
+            this._ngZone.runOutsideAngular(function () {
+                // The event handler has to be explicitly active, because
+                // newer browsers make it passive by default.
+                // The event handler has to be explicitly active, because
+                // newer browsers make it passive by default.
+                _this._document.addEventListener('touchmove', _this._preventScrollListener, activeEventOptions);
+            });
         }
     };
+    /** Removes a drop container from the registry. */
     /**
-     * @param {?} instance
+     * Removes a drop container from the registry.
+     * @param {?} drop
      * @return {?}
      */
-    CdkDragDropRegistry.prototype.remove = /**
-     * @param {?} instance
+    DragDropRegistry.prototype.removeDropContainer = /**
+     * Removes a drop container from the registry.
+     * @param {?} drop
      * @return {?}
      */
-    function (instance) {
-        if (instance instanceof CdkDrop) {
-            this._dropInstances.delete(instance);
+    function (drop) {
+        this._dropInstances.delete(drop);
+    };
+    /** Removes a drag item instance from the registry. */
+    /**
+     * Removes a drag item instance from the registry.
+     * @param {?} drag
+     * @return {?}
+     */
+    DragDropRegistry.prototype.removeDragItem = /**
+     * Removes a drag item instance from the registry.
+     * @param {?} drag
+     * @return {?}
+     */
+    function (drag) {
+        this._dragInstances.delete(drag);
+        this.stopDragging(drag);
+        if (this._dragInstances.size === 0) {
+            this._document.removeEventListener('touchmove', this._preventScrollListener, /** @type {?} */ (activeEventOptions));
         }
-        else {
-            this._dragInstances.delete(instance);
-            this.stopDragging(instance);
-            if (this._dragInstances.size === 0) {
-                this._document.removeEventListener('touchmove', this._preventScrollListener, /** @type {?} */ (activeEventOptions));
-            }
-        }
     };
@@ -229,3 +255,3 @@ /**
      */
-    CdkDragDropRegistry.prototype.startDragging = /**
+    DragDropRegistry.prototype.startDragging = /**
      * Starts the dragging sequence for a drag instance.
@@ -256,10 +282,10 @@ * @param {?} drag Drag instance which is being dragged.
     };
-    /** Stops dragging a `CdkDrag` instance. */
+    /** Stops dragging a drag item instance. */
     /**
-     * Stops dragging a `CdkDrag` instance.
+     * Stops dragging a drag item instance.
      * @param {?} drag
      * @return {?}
      */
-    CdkDragDropRegistry.prototype.stopDragging = /**
-     * Stops dragging a `CdkDrag` instance.
+    DragDropRegistry.prototype.stopDragging = /**
+     * Stops dragging a drag item instance.
      * @param {?} drag
@@ -274,10 +300,10 @@ * @return {?}
     };
-    /** Gets whether a `CdkDrag` instance is currently being dragged. */
+    /** Gets whether a drag item instance is currently being dragged. */
     /**
-     * Gets whether a `CdkDrag` instance is currently being dragged.
+     * Gets whether a drag item instance is currently being dragged.
      * @param {?} drag
      * @return {?}
      */
-    CdkDragDropRegistry.prototype.isDragging = /**
-     * Gets whether a `CdkDrag` instance is currently being dragged.
+    DragDropRegistry.prototype.isDragging = /**
+     * Gets whether a drag item instance is currently being dragged.
      * @param {?} drag
@@ -289,12 +315,10 @@ * @return {?}
     };
-    /** Gets a `CdkDrop` instance by its id. */
+    /** Gets a drop container by its id. */
     /**
-     * Gets a `CdkDrop` instance by its id.
-     * @template T
+     * Gets a drop container by its id.
      * @param {?} id
      * @return {?}
      */
-    CdkDragDropRegistry.prototype.getDropContainer = /**
-     * Gets a `CdkDrop` instance by its id.
-     * @template T
+    DragDropRegistry.prototype.getDropContainer = /**
+     * Gets a drop container by its id.
      * @param {?} id
@@ -309,3 +333,3 @@ * @return {?}
      */
-    CdkDragDropRegistry.prototype.ngOnDestroy = /**
+    DragDropRegistry.prototype.ngOnDestroy = /**
      * @return {?}
@@ -315,4 +339,4 @@ */
         var _this = this;
-        this._dragInstances.forEach(function (instance) { return _this.remove(instance); });
-        this._dropInstances.forEach(function (instance) { return _this.remove(instance); });
+        this._dragInstances.forEach(function (instance) { return _this.removeDragItem(instance); });
+        this._dropInstances.forEach(function (instance) { return _this.removeDropContainer(instance); });
         this._clearGlobalListeners();
@@ -326,3 +350,3 @@ this.pointerMove.complete();
      */
-    CdkDragDropRegistry.prototype._clearGlobalListeners = /**
+    DragDropRegistry.prototype._clearGlobalListeners = /**
      * Clears out the global event listeners from the `document`.
@@ -338,12 +362,12 @@ * @return {?}
     };
-    CdkDragDropRegistry.decorators = [
+    DragDropRegistry.decorators = [
         { type: Injectable, args: [{ providedIn: 'root' },] },
     ];
     /** @nocollapse */
-    CdkDragDropRegistry.ctorParameters = function () { return [
+    DragDropRegistry.ctorParameters = function () { return [
         { type: NgZone, },
         { type: undefined, decorators: [{ type: Inject, args: [DOCUMENT,] },] },
     ]; };
-    /** @nocollapse */ CdkDragDropRegistry.ngInjectableDef = defineInjectable({ factory: function CdkDragDropRegistry_Factory() { return new CdkDragDropRegistry(inject(NgZone), inject(DOCUMENT)); }, token: CdkDragDropRegistry, providedIn: "root" });
-    return CdkDragDropRegistry;
+    /** @nocollapse */ DragDropRegistry.ngInjectableDef = defineInjectable({ factory: function DragDropRegistry_Factory() { return new DragDropRegistry(inject(NgZone), inject(DOCUMENT)); }, token: DragDropRegistry, providedIn: "root" });
+    return DragDropRegistry;
 }());
@@ -451,3 +475,3 @@
         this._pointerMove = function (event) {
-            // TODO: this should start dragging after a certain threshold,
+            // TODO(crisbeto): this should start dragging after a certain threshold,
             // otherwise we risk interfering with clicks on the element.
@@ -493,3 +517,3 @@ if (!_this._dragDropRegistry.isDragging(_this)) {
         this._document = document;
-        _dragDropRegistry.register(this);
+        _dragDropRegistry.registerDragItem(this);
     }
@@ -530,3 +554,3 @@ /**
         this._nextSibling = null;
-        this._dragDropRegistry.remove(this);
+        this._dragDropRegistry.removeDragItem(this);
         this._destroyed.next();
@@ -572,3 +596,2 @@ this._destroyed.complete();
         var _this = this;
-        var /** @type {?} */ currentIndex = this._getElementIndexInDom(this._placeholder);
         // Restore the element's visibility and insert it at its old position in the DOM.
@@ -589,2 +612,3 @@ // It's important that we maintain the position, because moving the element around in the DOM
         this._ngZone.run(function () {
+            var /** @type {?} */ currentIndex = _this.dropContainer.getItemIndex(_this);
             _this.ended.emit({ source: _this });
@@ -628,3 +652,3 @@ _this.dropped.emit({
                 _this.dropContainer = newContainer;
-                _this.dropContainer.enter(_this);
+                _this.dropContainer.enter(_this, x, y);
             });
@@ -686,40 +710,2 @@ }
     /**
-     * Gets the index of an element, based on its index in the DOM.
-     * @param {?} element
-     * @return {?}
-     */
-    CdkDrag.prototype._getElementIndexInDom = /**
-     * Gets the index of an element, based on its index in the DOM.
-     * @param {?} element
-     * @return {?}
-     */
-    function (element) {
-        var _this = this;
-        // Note: we may be able to figure this in memory while sorting, but doing so won't be very
-        // reliable when transferring between containers, because the new container doesn't have
-        // the proper indices yet. Also this will work better for the case where the consumer
-        // isn't using an `ngFor` to render the list.
-        if (!element.parentElement) {
-            return -1;
-        }
-        // Avoid accessing `children` and `children.length` too much since they're a "live collection".
-        var /** @type {?} */ index = 0;
-        var /** @type {?} */ siblings = element.parentElement.children;
-        var /** @type {?} */ siblingsLength = siblings.length;
-        var /** @type {?} */ draggableElements = this.dropContainer._draggables
-            .filter(function (item) { return item !== _this; })
-            .map(function (item) { return item.element.nativeElement; });
-        // Loop through the sibling elements to find out the index of the
-        // current one, while skipping any elements that aren't draggable.
-        for (var /** @type {?} */ i = 0; i < siblingsLength; i++) {
-            if (siblings[i] === element) {
-                return index;
-            }
-            else if (draggableElements.indexOf(/** @type {?} */ (siblings[i])) > -1) {
-                index++;
-            }
-        }
-        return -1;
-    };
-    /**
      * Figures out the coordinates at which an element was picked up.
@@ -910,3 +896,3 @@ * @param {?} referenceElement Element that initiated the dragging.
         { type: ViewportRuler, },
-        { type: CdkDragDropRegistry, },
+        { type: DragDropRegistry, },
         { type: Directionality, decorators: [{ type: Optional },] },
@@ -1012,3 +998,3 @@ ]; };
     function () {
-        this._dragDropRegistry.register(this);
+        this._dragDropRegistry.registerDropContainer(this);
     };
@@ -1022,3 +1008,3 @@ /**
     function () {
-        this._dragDropRegistry.remove(this);
+        this._dragDropRegistry.removeDropContainer(this);
     };
@@ -1036,3 +1022,4 @@ /** Starts dragging an item. */
         this._dragging = true;
-        this._refreshPositions();
+        this._activeDraggables = this._draggables.toArray();
+        this._cachePositions();
     };
@@ -1060,2 +1047,3 @@ /**
     function (item, currentIndex, previousContainer) {
+        this._reset();
         this.dropped.emit({
@@ -1066,6 +1054,5 @@ item: item,
             container: this,
-            // TODO: reconsider whether to make this null if the containers are the same.
+            // TODO(crisbeto): reconsider whether to make this null if the containers are the same.
             previousContainer: previousContainer
         });
-        this._reset();
     };
@@ -1075,2 +1062,4 @@ /**
      * @param item Item that was moved into the container.
+     * @param xOffset Position of the item along the X axis.
+     * @param yOffset Position of the item along the Y axis.
      */
@@ -1080,2 +1069,4 @@ /**
      * @param {?} item Item that was moved into the container.
+     * @param {?} xOffset Position of the item along the X axis.
+     * @param {?} yOffset Position of the item along the Y axis.
      * @return {?}
@@ -1086,7 +1077,36 @@ */
      * @param {?} item Item that was moved into the container.
+     * @param {?} xOffset Position of the item along the X axis.
+     * @param {?} yOffset Position of the item along the Y axis.
      * @return {?}
      */
-    function (item) {
+    function (item, xOffset, yOffset) {
         this.entered.emit({ item: item, container: this });
         this.start();
+        // We use the coordinates of where the item entered the drop
+        // zone to figure out at which index it should be inserted.
+        var /** @type {?} */ newIndex = this._getItemIndexFromPointerPosition(item, xOffset, yOffset);
+        var /** @type {?} */ currentIndex = this._activeDraggables.indexOf(item);
+        var /** @type {?} */ newPositionReference = this._activeDraggables[newIndex];
+        var /** @type {?} */ placeholder = item.getPlaceholderElement();
+        // Since the item may be in the `activeDraggables` already (e.g. if the user dragged it
+        // into another container and back again), we have to ensure that it isn't duplicated.
+        if (currentIndex > -1) {
+            this._activeDraggables.splice(currentIndex, 1);
+        }
+        // Don't use items that are being dragged as a reference, because
+        // their element has been moved down to the bottom of the body.
+        if (newPositionReference && !this._dragDropRegistry.isDragging(newPositionReference)) {
+            var /** @type {?} */ element = newPositionReference.element.nativeElement; /** @type {?} */
+            ((element.parentElement)).insertBefore(placeholder, element);
+            this._activeDraggables.splice(newIndex, 0, item);
+        }
+        else {
+            this.element.nativeElement.appendChild(placeholder);
+            this._activeDraggables.push(item);
+        }
+        // The transform needs to be cleared so it doesn't throw off the measurements.
+        placeholder.style.transform = '';
+        // Note that the positions were already cached when we called `start` above,
+        // but we need to refresh them since the amount of items has changed.
+        this._cachePositions();
     };
@@ -1126,3 +1146,5 @@ /**
     function (item) {
-        return this._draggables.toArray().indexOf(item);
+        return this._dragging ?
+            this._positionCache.items.findIndex(function (currentItem) { return currentItem.drag === item; }) :
+            this._draggables.toArray().indexOf(item);
     };
@@ -1150,32 +1172,35 @@ /**
     function (item, xOffset, yOffset) {
-        var _this = this;
         var /** @type {?} */ siblings = this._positionCache.items;
-        var /** @type {?} */ newPosition = siblings.find(function (_a) {
-            var drag = _a.drag, clientRect = _a.clientRect;
-            if (drag === item) {
-                // If there's only one left item in the container, it must be
-                // the dragged item itself so we use it as a reference.
-                return siblings.length < 2;
-            }
-            return _this.orientation === 'horizontal' ?
-                xOffset > clientRect.left && xOffset < clientRect.right :
-                yOffset > clientRect.top && yOffset < clientRect.bottom;
-        });
-        if (!newPosition && siblings.length > 0) {
+        var /** @type {?} */ isHorizontal = this.orientation === 'horizontal';
+        var /** @type {?} */ newIndex = this._getItemIndexFromPointerPosition(item, xOffset, yOffset);
+        var /** @type {?} */ placeholder = item.getPlaceholderElement();
+        if (newIndex === -1 && siblings.length > 0) {
             return;
         }
-        // Don't take the element of a dragged item as a reference,
-        // because it has been moved down to the end of the body.
-        var /** @type {?} */ element = (newPosition && !this._dragDropRegistry.isDragging(newPosition.drag)) ?
-            newPosition.drag.element.nativeElement : null;
-        var /** @type {?} */ next = element ? /** @type {?} */ ((element)).nextSibling : null;
-        var /** @type {?} */ parent = element ? /** @type {?} */ ((element.parentElement)) : this.element.nativeElement;
-        var /** @type {?} */ placeholder = item.getPlaceholderElement();
-        if (next) {
-            parent.insertBefore(placeholder, next === placeholder ? element : next);
-        }
-        else {
-            parent.appendChild(placeholder);
-        }
-        this._refreshPositions();
+        var /** @type {?} */ currentIndex = siblings.findIndex(function (currentItem) { return currentItem.drag === item; });
+        var /** @type {?} */ currentPosition = siblings[currentIndex];
+        var /** @type {?} */ newPosition = siblings[newIndex];
+        // Figure out the offset necessary for the items to be swapped.
+        var /** @type {?} */ offset = isHorizontal ?
+            currentPosition.clientRect.left - newPosition.clientRect.left :
+            currentPosition.clientRect.top - newPosition.clientRect.top;
+        var /** @type {?} */ topAdjustment = isHorizontal ? 0 : offset;
+        var /** @type {?} */ leftAdjustment = isHorizontal ? offset : 0;
+        // Since we've moved the items with a `transform`, we need to adjust their cached
+        // client rects to reflect their new position, as well as swap their positions in the cache.
+        // Note that we shouldn't use `getBoundingClientRect` here to update the cache, because the
+        // elements may be mid-animation which will give us a wrong result.
+        this._adjustClientRect(currentPosition.clientRect, -topAdjustment, -leftAdjustment);
+        currentPosition.offset -= offset;
+        siblings[currentIndex] = newPosition;
+        this._adjustClientRect(newPosition.clientRect, topAdjustment, leftAdjustment);
+        newPosition.offset += offset;
+        siblings[newIndex] = currentPosition;
+        // Swap the placeholder's position with the one of the target draggable.
+        placeholder.style.transform = isHorizontal ?
+            "translate3d(" + currentPosition.offset + "px, 0, 0)" :
+            "translate3d(0, " + currentPosition.offset + "px, 0)";
+        newPosition.drag.element.nativeElement.style.transform = isHorizontal ?
+            "translate3d(" + newPosition.offset + "px, 0, 0)" :
+            "translate3d(0, " + newPosition.offset + "px, 0)";
     };
@@ -1214,3 +1239,3 @@ /**
      */
-    CdkDrop.prototype._refreshPositions = /**
+    CdkDrop.prototype._cachePositions = /**
      * Refreshes the position cache of the items and sibling containers.
@@ -1221,9 +1246,31 @@ * @return {?}
         var _this = this;
-        this._positionCache.items = this._draggables
-            .map(function (drag) { return ({ drag: drag, clientRect: drag.element.nativeElement.getBoundingClientRect() }); })
+        this._positionCache.items = this._activeDraggables
+            .map(function (drag) {
+            var /** @type {?} */ elementToMeasure = _this._dragDropRegistry.isDragging(drag) ?
+                // If the element is being dragged, we have to measure the
+                // placeholder, because the element is hidden.
+                drag.getPlaceholderElement() :
+                drag.element.nativeElement;
+            var /** @type {?} */ clientRect = elementToMeasure.getBoundingClientRect();
+            return {
+                drag: drag,
+                offset: 0,
+                // We need to clone the `clientRect` here, because all the values on it are readonly
+                // and we need to be able to update them. Also we can't use a spread here, because
+                // the values on a `ClientRect` aren't own properties. See:
+                // https://developer.mozilla.org/en-US/docs/Web/API/Element/getBoundingClientRect#Notes
+                clientRect: {
+                    top: clientRect.top,
+                    right: clientRect.right,
+                    bottom: clientRect.bottom,
+                    left: clientRect.left,
+                    width: clientRect.width,
+                    height: clientRect.height
+                }
+            };
+        })
             .sort(function (a, b) { return a.clientRect.top - b.clientRect.top; });
-        // TODO: add filter here that ensures that the current container isn't being passed to itself.
         this._positionCache.siblings = this.connectedTo
             .map(function (drop) { return typeof drop === 'string' ? /** @type {?} */ ((_this._dragDropRegistry.getDropContainer(drop))) : drop; })
-            .filter(Boolean)
+            .filter(function (drop) { return drop && drop !== _this; })
             .map(function (drop) { return ({ drop: drop, clientRect: drop.element.nativeElement.getBoundingClientRect() }); });
@@ -1241,5 +1288,58 @@ };
         this._dragging = false;
+        // TODO(crisbeto): may have to wait for the animations to finish.
+        this._activeDraggables.forEach(function (item) { return item.element.nativeElement.style.transform = ''; });
+        this._activeDraggables = [];
         this._positionCache.items = [];
         this._positionCache.siblings = [];
     };
+    /**
+     * Updates the top/left positions of a `ClientRect`, as well as their bottom/right counterparts.
+     * @param {?} clientRect `ClientRect` that should be updated.
+     * @param {?} top New value for the `top` position.
+     * @param {?} left New value for the `left` position.
+     * @return {?}
+     */
+    CdkDrop.prototype._adjustClientRect = /**
+     * Updates the top/left positions of a `ClientRect`, as well as their bottom/right counterparts.
+     * @param {?} clientRect `ClientRect` that should be updated.
+     * @param {?} top New value for the `top` position.
+     * @param {?} left New value for the `left` position.
+     * @return {?}
+     */
+    function (clientRect, top, left) {
+        clientRect.top += top;
+        clientRect.bottom = clientRect.top + clientRect.height;
+        clientRect.left += left;
+        clientRect.right = clientRect.left + clientRect.width;
+    };
+    /**
+     * Gets the index of an item in the drop container, based on the position of the user's pointer.
+     * @param {?} item Item that is being sorted.
+     * @param {?} xOffset Position of the user's pointer along the X axis.
+     * @param {?} yOffset Position of the user's pointer along the Y axis.
+     * @return {?}
+     */
+    CdkDrop.prototype._getItemIndexFromPointerPosition = /**
+     * Gets the index of an item in the drop container, based on the position of the user's pointer.
+     * @param {?} item Item that is being sorted.
+     * @param {?} xOffset Position of the user's pointer along the X axis.
+     * @param {?} yOffset Position of the user's pointer along the Y axis.
+     * @return {?}
+     */
+    function (item, xOffset, yOffset) {
+        var _this = this;
+        return this._positionCache.items.findIndex(function (_a, _, array) {
+            var drag = _a.drag, clientRect = _a.clientRect;
+            if (drag === item) {
+                // If there's only one item left in the container, it must be
+                // the dragged item itself so we use it as a reference.
+                return array.length < 2;
+            }
+            return _this.orientation === 'horizontal' ?
+                // Round these down since most browsers report client rects with
+                // sub-pixel precision, whereas the mouse coordinates are rounded to pixels.
+                xOffset >= Math.floor(clientRect.left) && xOffset <= Math.floor(clientRect.right) :
+                yOffset >= Math.floor(clientRect.top) && yOffset <= Math.floor(clientRect.bottom);
+        });
+    };
     CdkDrop.decorators = [
@@ -1265,3 +1365,3 @@ { type: Component, args: [{selector: 'cdk-drop',
         { type: ElementRef, },
-        { type: CdkDragDropRegistry, },
+        { type: DragDropRegistry, },
     ]; };
@@ -1371,3 +1471,3 @@ CdkDrop.propDecorators = {
 
-export { CdkDrop, CDK_DROP_CONTAINER, CdkDrag, CdkDragHandle, moveItemInArray, transferArrayItem, CdkDragPreview, CdkDragPlaceholder, DragDropModule, CdkDragDropRegistry };
+export { CdkDrop, CDK_DROP_CONTAINER, CdkDrag, CdkDragHandle, moveItemInArray, transferArrayItem, CdkDragPreview, CdkDragPlaceholder, DragDropModule, DragDropRegistry };
 //# sourceMappingURL=drag-drop.es5.js.map

package.json

 {
   "name": "@angular/cdk-experimental",
-  "version": "6.4.3",
+  "version": "6.4.5",
   "description": "Experimental components for Angular CDK",
@@ -19,3 +19,3 @@ "main": "./bundles/cdk-experimental.umd.js",
   "peerDependencies": {
-    "@angular/cdk": "6.4.3",
+    "@angular/cdk": "6.4.5",
     "@angular/core": ">=6.0.0-beta.0 <7.0.0"
@@ -26,5 +26,5 @@ },
   },
-  "releaseGitCommitSha": "6c9190260782afebfa9187c3958a37e64b906057",
+  "releaseGitCommitSha": "f575b1f05bd2a8048f0d92e2cf4ce04b4f6374e4",
   "releaseGitBranch": "6.4.x",
-  "releaseGitUser": "Jeremy Elbourn <[e-mail]>"
+  "releaseGitUser": "Joey Perrott <[e-mail]>"
 }

typings/drag-drop/drag-drop-registry.d.ts

@@ -10,17 +10,17 @@ /**
 import { Subject } from 'rxjs';
-import { CdkDrop } from './drop';
-import { CdkDrag } from './drag';
 /**
- * Service that keeps track of all the `CdkDrag` and `CdkDrop` instances, and
- * manages global event listeners on the `document`.
+ * Service that keeps track of all the drag item and drop container
+ * instances, and manages global event listeners on the `document`.
  * @docs-private
  */
-export declare class CdkDragDropRegistry implements OnDestroy {
+export declare class DragDropRegistry<I, C extends {
+    id: string;
+}> implements OnDestroy {
     private _ngZone;
     private _document;
-    /** Registered `CdkDrop` instances. */
+    /** Registered drop container instances. */
     private _dropInstances;
-    /** Registered `CdkDrag` instances. */
+    /** Registered drag item instances. */
     private _dragInstances;
-    /** `CdkDrag` instances that are currently being dragged. */
+    /** Drag item instances that are currently being dragged. */
     private _activeDragInstances;
@@ -31,3 +31,3 @@ /** Keeps track of the event listeners that we've bound to the `document`. */
      * Emits the `touchmove` or `mousemove` events that are dispatched
-     * while the user is dragging a `CdkDrag` instance.
+     * while the user is dragging a drag item instance.
      */
@@ -37,14 +37,14 @@ readonly pointerMove: Subject<TouchEvent | MouseEvent>;
      * Emits the `touchend` or `mouseup` events that are dispatched
-     * while the user is dragging a `CdkDrag` instance.
+     * while the user is dragging a drag item instance.
      */
     readonly pointerUp: Subject<TouchEvent | MouseEvent>;
     constructor(_ngZone: NgZone, _document: any);
-    /** Adds a `CdkDrop` instance to the registry. */
-    register(drop: CdkDrop): any;
-    /** Adds a `CdkDrag` instance to the registry. */
-    register(drag: CdkDrag): any;
-    /** Removes a `CdkDrop` instance from the registry. */
-    remove(drop: CdkDrop): any;
-    /** Removes a `CdkDrag` instance from the registry. */
-    remove(drag: CdkDrag): any;
+    /** Adds a drop container to the registry. */
+    registerDropContainer(drop: C): void;
+    /** Adds a drag item instance to the registry. */
+    registerDragItem(drag: I): void;
+    /** Removes a drop container from the registry. */
+    removeDropContainer(drop: C): void;
+    /** Removes a drag item instance from the registry. */
+    removeDragItem(drag: I): void;
     /**
@@ -55,9 +55,9 @@ * Starts the dragging sequence for a drag instance.
      */
-    startDragging(drag: CdkDrag, event: TouchEvent | MouseEvent): void;
-    /** Stops dragging a `CdkDrag` instance. */
-    stopDragging(drag: CdkDrag): void;
-    /** Gets whether a `CdkDrag` instance is currently being dragged. */
-    isDragging(drag: CdkDrag): boolean;
-    /** Gets a `CdkDrop` instance by its id. */
-    getDropContainer<T = any>(id: string): CdkDrop<T> | undefined;
+    startDragging(drag: I, event: TouchEvent | MouseEvent): void;
+    /** Stops dragging a drag item instance. */
+    stopDragging(drag: I): void;
+    /** Gets whether a drag item instance is currently being dragged. */
+    isDragging(drag: I): boolean;
+    /** Gets a drop container by its id. */
+    getDropContainer(id: string): C | undefined;
     ngOnDestroy(): void;
@@ -64,0 +64,0 @@ /**

typings/drag-drop/drag.d.ts

@@ -16,3 +16,3 @@ /**
 import { ViewportRuler } from '@angular/cdk/overlay';
-import { CdkDragDropRegistry } from './drag-drop-registry';
+import { DragDropRegistry } from './drag-drop-registry';
 /** Element that can be moved inside a CdkDrop container. */
@@ -87,3 +87,3 @@ export declare class CdkDrag<T = any> implements OnDestroy {
         /** Droppable container that the draggable is a part of. */
-        dropContainer: CdkDropContainer, document: any, _ngZone: NgZone, _viewContainerRef: ViewContainerRef, _viewportRuler: ViewportRuler, _dragDropRegistry: CdkDragDropRegistry, _dir: Directionality);
+        dropContainer: CdkDropContainer, document: any, _ngZone: NgZone, _viewContainerRef: ViewContainerRef, _viewportRuler: ViewportRuler, _dragDropRegistry: DragDropRegistry<CdkDrag<T>, CdkDropContainer>, _dir: Directionality);
     /**
@@ -117,4 +117,2 @@ * Returns the element that is being used as a placeholder
     private _createPlaceholderElement();
-    /** Gets the index of an element, based on its index in the DOM. */
-    private _getElementIndexInDom(element);
     /**
@@ -121,0 +119,0 @@ * Figures out the coordinates at which an element was picked up.

typings/drag-drop/drop-container.d.ts

@@ -13,2 +13,4 @@ /**
     data: T;
+    /** Unique ID for the drop zone. */
+    id: string;
     /** Direction in which the list is oriented. */
@@ -28,4 +30,6 @@ orientation: 'horizontal' | 'vertical';
      * @param item Item that was moved into the container.
+     * @param xOffset Position of the item along the X axis.
+     * @param yOffset Position of the item along the Y axis.
      */
-    enter(item: CdkDrag): void;
+    enter(item: CdkDrag, xOffset: number, yOffset: number): void;
     /**
@@ -32,0 +36,0 @@ * Removes an item from the container after it was dragged into another container by the user.

typings/drag-drop/drop.d.ts

@@ -11,3 +11,3 @@ /**
 import { CdkDragExit, CdkDragEnter, CdkDragDrop } from './drag-events';
-import { CdkDragDropRegistry } from './drag-drop-registry';
+import { DragDropRegistry } from './drag-drop-registry';
 /** Container that wraps a set of draggable items. */
@@ -45,3 +45,3 @@ export declare class CdkDrop<T = any> implements OnInit, OnDestroy {
     exited: EventEmitter<CdkDragExit<T>>;
-    constructor(element: ElementRef<HTMLElement>, _dragDropRegistry: CdkDragDropRegistry);
+    constructor(element: ElementRef<HTMLElement>, _dragDropRegistry: DragDropRegistry<CdkDrag, CdkDrop<T>>);
     ngOnInit(): void;
@@ -53,2 +53,8 @@ ngOnDestroy(): void;
     private _positionCache;
+    /**
+     * Draggable items that are currently active inside the container. Includes the items
+     * from `_draggables`, as well as any items that have been dragged in, but haven't
+     * been dropped yet.
+     */
+    private _activeDraggables;
     /** Starts dragging an item. */
@@ -66,4 +72,6 @@ start(): void;
      * @param item Item that was moved into the container.
+     * @param xOffset Position of the item along the X axis.
+     * @param yOffset Position of the item along the Y axis.
      */
-    enter(item: CdkDrag): void;
+    enter(item: CdkDrag, xOffset: number, yOffset: number): void;
     /**
@@ -94,5 +102,19 @@ * Removes an item from the container after it was dragged into another container by the user.
     /** Refreshes the position cache of the items and sibling containers. */
-    private _refreshPositions();
+    private _cachePositions();
     /** Resets the container to its initial state. */
     private _reset();
+    /**
+     * Updates the top/left positions of a `ClientRect`, as well as their bottom/right counterparts.
+     * @param clientRect `ClientRect` that should be updated.
+     * @param top New value for the `top` position.
+     * @param left New value for the `left` position.
+     */
+    private _adjustClientRect(clientRect, top, left);
+    /**
+     * Gets the index of an item in the drop container, based on the position of the user's pointer.
+     * @param item Item that is being sorted.
+     * @param xOffset Position of the user's pointer along the X axis.
+     * @param yOffset Position of the user's pointer along the Y axis.
+     */
+    private _getItemIndexFromPointerPosition(item, xOffset, yOffset);
 }

typings/drag-drop/index.metadata.json

@@ -1,1 +0,1 @@
-{"__symbolic":"module","version":4,"metadata":{"CdkDrop":{"__symbolic":"class","arity":1,"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":31,"character":1},"arguments":[{"moduleId":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"module"},"member":"id"},"selector":"cdk-drop","exportAs":"cdkDrop","template":"<ng-content></ng-content>","encapsulation":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewEncapsulation","line":36,"character":17},"member":"None"},"changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":37,"character":19},"member":"OnPush"},"providers":[{"provide":{"__symbolic":"reference","name":"CDK_DROP_CONTAINER"},"useExisting":{"__symbolic":"reference","name":"CdkDrop"}}],"host":{"class":"cdk-drop","[id]":"id","[class.cdk-drop-dragging]":"_dragging","$quoted$":["class","[id]","[class.cdk-drop-dragging]"]},"styles":[".cdk-drag-preview{position:fixed;top:0;left:0;z-index:1000}.cdk-drag,.cdk-drag-handle{touch-action:none;-webkit-user-drag:none;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}"]}]}],"members":{"_draggables":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChildren","line":50,"character":3},"arguments":[{"__symbolic":"reference","name":"CdkDrag"}]}]}],"connectedTo":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":57,"character":3}}]}],"data":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":60,"character":3}}]}],"orientation":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":63,"character":3}}]}],"id":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":69,"character":3}}]}],"dropped":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":72,"character":3}}]}],"entered":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":77,"character":3}}]}],"exited":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":83,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"ElementRef","module":"@angular/core","arguments":[{"__symbolic":"error","message":"Could not resolve type","line":86,"character":31,"context":{"typeName":"HTMLElement"},"module":"./drop"}]},{"__symbolic":"reference","name":"CdkDragDropRegistry"}]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"start":[{"__symbolic":"method"}],"drop":[{"__symbolic":"method"}],"enter":[{"__symbolic":"method"}],"exit":[{"__symbolic":"method"}],"getItemIndex":[{"__symbolic":"method"}],"_sortItem":[{"__symbolic":"method"}],"_getSiblingContainerFromPosition":[{"__symbolic":"method"}],"_refreshPositions":[{"__symbolic":"method"}],"_reset":[{"__symbolic":"method"}]}},"CdkDropContainer":{"__symbolic":"interface"},"CDK_DROP_CONTAINER":{"__symbolic":"new","expression":{"__symbolic":"reference","module":"@angular/core","name":"InjectionToken","line":55,"character":38},"arguments":["CDK_DROP_CONTAINER"]},"CdkDrag":{"__symbolic":"class","arity":1,"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":42,"character":1},"arguments":[{"selector":"[cdkDrag]","exportAs":"cdkDrag","host":{"class":"cdk-drag","(mousedown)":"_startDragging($event)","(touchstart)":"_startDragging($event)","$quoted$":["class","(mousedown)","(touchstart)"]}}]}],"members":{"_handles":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChildren","line":100,"character":3},"arguments":[{"__symbolic":"reference","name":"CdkDragHandle"}]}]}],"_previewTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChild","line":103,"character":3},"arguments":[{"__symbolic":"reference","name":"CdkDragPreview"}]}]}],"_placeholderTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChild","line":108,"character":3},"arguments":[{"__symbolic":"reference","name":"CdkDragPlaceholder"}]}]}],"data":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":111,"character":3}}]}],"started":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":114,"character":3},"arguments":["cdkDragStarted"]}]}],"ended":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":117,"character":3},"arguments":["cdkDragEnded"]}]}],"entered":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":120,"character":3},"arguments":["cdkDragEntered"]}]}],"exited":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":124,"character":3},"arguments":["cdkDragExited"]}]}],"dropped":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":128,"character":3},"arguments":["cdkDragDropped"]}]}],"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[null,[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject","line":135,"character":5},"arguments":[{"__symbolic":"reference","name":"CDK_DROP_CONTAINER"}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional","line":135,"character":33}},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"SkipSelf","line":135,"character":45}}],[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject","line":136,"character":5},"arguments":[{"__symbolic":"reference","module":"@angular/common","name":"DOCUMENT","line":136,"character":12}]}],null,null,null,null,[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional","line":141,"character":5}}]],"parameters":[{"__symbolic":"reference","name":"ElementRef","module":"@angular/core","arguments":[{"__symbolic":"error","message":"Could not resolve type","line":133,"character":31,"context":{"typeName":"HTMLElement"},"module":"./drag"}]},{"__symbolic":"reference","name":"CdkDropContainer"},{"__symbolic":"reference","name":"any"},{"__symbolic":"reference","module":"@angular/core","name":"NgZone","line":137,"character":21},{"__symbolic":"reference","module":"@angular/core","name":"ViewContainerRef","line":138,"character":31},{"__symbolic":"reference","module":"@angular/cdk/overlay","name":"ViewportRuler","line":139,"character":28},{"__symbolic":"reference","name":"CdkDragDropRegistry"},{"__symbolic":"reference","module":"@angular/cdk/bidi","name":"Directionality","line":141,"character":30}]}],"getPlaceholderElement":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"_startDragging":[{"__symbolic":"method"}],"_cleanupDragArtifacts":[{"__symbolic":"method"}],"_updateActiveDropContainer":[{"__symbolic":"method"}],"_createPreviewElement":[{"__symbolic":"method"}],"_createPlaceholderElement":[{"__symbolic":"method"}],"_getElementIndexInDom":[{"__symbolic":"method"}],"_getPointerPositionInElement":[{"__symbolic":"method"}],"_animatePreviewToPlaceholder":[{"__symbolic":"method"}],"_setTransform":[{"__symbolic":"method"}],"_removeElement":[{"__symbolic":"method"}],"_getPointerPositionOnPage":[{"__symbolic":"method"}],"_isTouchEvent":[{"__symbolic":"method"}],"_destroyPreview":[{"__symbolic":"method"}],"_destroyPlaceholder":[{"__symbolic":"method"}]}},"CdkDragHandle":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":11,"character":1},"arguments":[{"selector":"[cdkDragHandle]","host":{"class":"cdk-drag-handle","$quoted$":["class"]}}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"ElementRef","module":"@angular/core","arguments":[{"__symbolic":"error","message":"Could not resolve type","line":18,"character":41,"context":{"typeName":"HTMLElement"},"module":"./drag-handle"}]}]}]}},"CdkDragStart":{"__symbolic":"interface"},"CdkDragEnd":{"__symbolic":"interface"},"CdkDragEnter":{"__symbolic":"interface"},"CdkDragExit":{"__symbolic":"interface"},"CdkDragDrop":{"__symbolic":"interface"},"moveItemInArray":{"__symbolic":"function"},"transferArrayItem":{"__symbolic":"function"},"CdkDragPreview":{"__symbolic":"class","arity":1,"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":14,"character":1},"arguments":[{"selector":"ng-template[cdkDragPreview]"}]}],"members":{"data":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":19,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"TemplateRef","module":"@angular/core","arguments":[{"__symbolic":"error","message":"Could not resolve type","line":20,"character":46,"context":{"typeName":"T"},"module":"./drag-preview"}]}]}]}},"CdkDragPlaceholder":{"__symbolic":"class","arity":1,"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":14,"character":1},"arguments":[{"selector":"ng-template[cdkDragPlaceholder]"}]}],"members":{"data":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":19,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"TemplateRef","module":"@angular/core","arguments":[{"__symbolic":"error","message":"Could not resolve type","line":20,"character":46,"context":{"typeName":"T"},"module":"./drag-placeholder"}]}]}]}},"DragDropModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":15,"character":1},"arguments":[{"declarations":[{"__symbolic":"reference","name":"CdkDrop"},{"__symbolic":"reference","name":"CdkDrag"},{"__symbolic":"reference","name":"CdkDragHandle"},{"__symbolic":"reference","name":"CdkDragPreview"},{"__symbolic":"reference","name":"CdkDragPlaceholder"}],"exports":[{"__symbolic":"reference","name":"CdkDrop"},{"__symbolic":"reference","name":"CdkDrag"},{"__symbolic":"reference","name":"CdkDragHandle"},{"__symbolic":"reference","name":"CdkDragPreview"},{"__symbolic":"reference","name":"CdkDragPlaceholder"}]}]}],"members":{}},"CdkDragDropRegistry":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":26,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[null,[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject","line":56,"character":5},"arguments":[{"__symbolic":"reference","module":"@angular/common","name":"DOCUMENT","line":56,"character":12}]}]],"parameters":[{"__symbolic":"reference","module":"@angular/core","name":"NgZone","line":55,"character":21},{"__symbolic":"reference","name":"any"}]}],"register":[{"__symbolic":"method"},{"__symbolic":"method"},{"__symbolic":"method"}],"remove":[{"__symbolic":"method"},{"__symbolic":"method"},{"__symbolic":"method"}],"startDragging":[{"__symbolic":"method"}],"stopDragging":[{"__symbolic":"method"}],"isDragging":[{"__symbolic":"method"}],"getDropContainer":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"_clearGlobalListeners":[{"__symbolic":"method"}]},"statics":{"ngInjectableDef":{}}}},"origins":{"CdkDrop":"./drop","CdkDropContainer":"./drop-container","CDK_DROP_CONTAINER":"./drop-container","CdkDrag":"./drag","CdkDragHandle":"./drag-handle","CdkDragStart":"./drag-events","CdkDragEnd":"./drag-events","CdkDragEnter":"./drag-events","CdkDragExit":"./drag-events","CdkDragDrop":"./drag-events","moveItemInArray":"./drag-utils","transferArrayItem":"./drag-utils","CdkDragPreview":"./drag-preview","CdkDragPlaceholder":"./drag-placeholder","DragDropModule":"./drag-drop-module","CdkDragDropRegistry":"./drag-drop-registry"},"importAs":"@angular/cdk-experimental/drag-drop"}
+{"__symbolic":"module","version":4,"metadata":{"CdkDrop":{"__symbolic":"class","arity":1,"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":31,"character":1},"arguments":[{"moduleId":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"module"},"member":"id"},"selector":"cdk-drop","exportAs":"cdkDrop","template":"<ng-content></ng-content>","encapsulation":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewEncapsulation","line":36,"character":17},"member":"None"},"changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":37,"character":19},"member":"OnPush"},"providers":[{"provide":{"__symbolic":"reference","name":"CDK_DROP_CONTAINER"},"useExisting":{"__symbolic":"reference","name":"CdkDrop"}}],"host":{"class":"cdk-drop","[id]":"id","[class.cdk-drop-dragging]":"_dragging","$quoted$":["class","[id]","[class.cdk-drop-dragging]"]},"styles":[".cdk-drag-preview{position:fixed;top:0;left:0;z-index:1000}.cdk-drag,.cdk-drag-handle{touch-action:none;-webkit-user-drag:none;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}"]}]}],"members":{"_draggables":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChildren","line":50,"character":3},"arguments":[{"__symbolic":"reference","name":"CdkDrag"}]}]}],"connectedTo":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":57,"character":3}}]}],"data":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":60,"character":3}}]}],"orientation":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":63,"character":3}}]}],"id":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":69,"character":3}}]}],"dropped":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":72,"character":3}}]}],"entered":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":77,"character":3}}]}],"exited":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":83,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"ElementRef","module":"@angular/core","arguments":[{"__symbolic":"error","message":"Could not resolve type","line":86,"character":31,"context":{"typeName":"HTMLElement"},"module":"./drop"}]},{"__symbolic":"reference","name":"DragDropRegistry"}]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"start":[{"__symbolic":"method"}],"drop":[{"__symbolic":"method"}],"enter":[{"__symbolic":"method"}],"exit":[{"__symbolic":"method"}],"getItemIndex":[{"__symbolic":"method"}],"_sortItem":[{"__symbolic":"method"}],"_getSiblingContainerFromPosition":[{"__symbolic":"method"}],"_cachePositions":[{"__symbolic":"method"}],"_reset":[{"__symbolic":"method"}],"_adjustClientRect":[{"__symbolic":"method"}],"_getItemIndexFromPointerPosition":[{"__symbolic":"method"}]}},"CdkDropContainer":{"__symbolic":"interface"},"CDK_DROP_CONTAINER":{"__symbolic":"new","expression":{"__symbolic":"reference","module":"@angular/core","name":"InjectionToken","line":60,"character":38},"arguments":["CDK_DROP_CONTAINER"]},"CdkDrag":{"__symbolic":"class","arity":1,"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":42,"character":1},"arguments":[{"selector":"[cdkDrag]","exportAs":"cdkDrag","host":{"class":"cdk-drag","(mousedown)":"_startDragging($event)","(touchstart)":"_startDragging($event)","$quoted$":["class","(mousedown)","(touchstart)"]}}]}],"members":{"_handles":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChildren","line":100,"character":3},"arguments":[{"__symbolic":"reference","name":"CdkDragHandle"}]}]}],"_previewTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChild","line":103,"character":3},"arguments":[{"__symbolic":"reference","name":"CdkDragPreview"}]}]}],"_placeholderTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChild","line":108,"character":3},"arguments":[{"__symbolic":"reference","name":"CdkDragPlaceholder"}]}]}],"data":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":111,"character":3}}]}],"started":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":114,"character":3},"arguments":["cdkDragStarted"]}]}],"ended":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":117,"character":3},"arguments":["cdkDragEnded"]}]}],"entered":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":120,"character":3},"arguments":["cdkDragEntered"]}]}],"exited":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":124,"character":3},"arguments":["cdkDragExited"]}]}],"dropped":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":128,"character":3},"arguments":["cdkDragDropped"]}]}],"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[null,[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject","line":135,"character":5},"arguments":[{"__symbolic":"reference","name":"CDK_DROP_CONTAINER"}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional","line":135,"character":33}},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"SkipSelf","line":135,"character":45}}],[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject","line":136,"character":5},"arguments":[{"__symbolic":"reference","module":"@angular/common","name":"DOCUMENT","line":136,"character":12}]}],null,null,null,null,[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional","line":141,"character":5}}]],"parameters":[{"__symbolic":"reference","name":"ElementRef","module":"@angular/core","arguments":[{"__symbolic":"error","message":"Could not resolve type","line":133,"character":31,"context":{"typeName":"HTMLElement"},"module":"./drag"}]},{"__symbolic":"reference","name":"CdkDropContainer"},{"__symbolic":"reference","name":"any"},{"__symbolic":"reference","module":"@angular/core","name":"NgZone","line":137,"character":21},{"__symbolic":"reference","module":"@angular/core","name":"ViewContainerRef","line":138,"character":31},{"__symbolic":"reference","module":"@angular/cdk/overlay","name":"ViewportRuler","line":139,"character":28},{"__symbolic":"reference","name":"DragDropRegistry"},{"__symbolic":"reference","module":"@angular/cdk/bidi","name":"Directionality","line":141,"character":30}]}],"getPlaceholderElement":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"_startDragging":[{"__symbolic":"method"}],"_cleanupDragArtifacts":[{"__symbolic":"method"}],"_updateActiveDropContainer":[{"__symbolic":"method"}],"_createPreviewElement":[{"__symbolic":"method"}],"_createPlaceholderElement":[{"__symbolic":"method"}],"_getPointerPositionInElement":[{"__symbolic":"method"}],"_animatePreviewToPlaceholder":[{"__symbolic":"method"}],"_setTransform":[{"__symbolic":"method"}],"_removeElement":[{"__symbolic":"method"}],"_getPointerPositionOnPage":[{"__symbolic":"method"}],"_isTouchEvent":[{"__symbolic":"method"}],"_destroyPreview":[{"__symbolic":"method"}],"_destroyPlaceholder":[{"__symbolic":"method"}]}},"CdkDragHandle":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":11,"character":1},"arguments":[{"selector":"[cdkDragHandle]","host":{"class":"cdk-drag-handle","$quoted$":["class"]}}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"ElementRef","module":"@angular/core","arguments":[{"__symbolic":"error","message":"Could not resolve type","line":18,"character":41,"context":{"typeName":"HTMLElement"},"module":"./drag-handle"}]}]}]}},"CdkDragStart":{"__symbolic":"interface"},"CdkDragEnd":{"__symbolic":"interface"},"CdkDragEnter":{"__symbolic":"interface"},"CdkDragExit":{"__symbolic":"interface"},"CdkDragDrop":{"__symbolic":"interface"},"moveItemInArray":{"__symbolic":"function"},"transferArrayItem":{"__symbolic":"function"},"CdkDragPreview":{"__symbolic":"class","arity":1,"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":14,"character":1},"arguments":[{"selector":"ng-template[cdkDragPreview]"}]}],"members":{"data":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":19,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"TemplateRef","module":"@angular/core","arguments":[{"__symbolic":"error","message":"Could not resolve type","line":20,"character":46,"context":{"typeName":"T"},"module":"./drag-preview"}]}]}]}},"CdkDragPlaceholder":{"__symbolic":"class","arity":1,"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":14,"character":1},"arguments":[{"selector":"ng-template[cdkDragPlaceholder]"}]}],"members":{"data":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":19,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"TemplateRef","module":"@angular/core","arguments":[{"__symbolic":"error","message":"Could not resolve type","line":20,"character":46,"context":{"typeName":"T"},"module":"./drag-placeholder"}]}]}]}},"DragDropModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":15,"character":1},"arguments":[{"declarations":[{"__symbolic":"reference","name":"CdkDrop"},{"__symbolic":"reference","name":"CdkDrag"},{"__symbolic":"reference","name":"CdkDragHandle"},{"__symbolic":"reference","name":"CdkDragPreview"},{"__symbolic":"reference","name":"CdkDragPlaceholder"}],"exports":[{"__symbolic":"reference","name":"CdkDrop"},{"__symbolic":"reference","name":"CdkDrag"},{"__symbolic":"reference","name":"CdkDragHandle"},{"__symbolic":"reference","name":"CdkDragPreview"},{"__symbolic":"reference","name":"CdkDragPlaceholder"}]}]}],"members":{}},"DragDropRegistry":{"__symbolic":"class","arity":2,"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":27,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[null,[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject","line":57,"character":5},"arguments":[{"__symbolic":"reference","module":"@angular/common","name":"DOCUMENT","line":57,"character":12}]}]],"parameters":[{"__symbolic":"reference","module":"@angular/core","name":"NgZone","line":56,"character":21},{"__symbolic":"reference","name":"any"}]}],"registerDropContainer":[{"__symbolic":"method"}],"registerDragItem":[{"__symbolic":"method"}],"removeDropContainer":[{"__symbolic":"method"}],"removeDragItem":[{"__symbolic":"method"}],"startDragging":[{"__symbolic":"method"}],"stopDragging":[{"__symbolic":"method"}],"isDragging":[{"__symbolic":"method"}],"getDropContainer":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"_clearGlobalListeners":[{"__symbolic":"method"}]},"statics":{"ngInjectableDef":{}}}},"origins":{"CdkDrop":"./drop","CdkDropContainer":"./drop-container","CDK_DROP_CONTAINER":"./drop-container","CdkDrag":"./drag","CdkDragHandle":"./drag-handle","CdkDragStart":"./drag-events","CdkDragEnd":"./drag-events","CdkDragEnter":"./drag-events","CdkDragExit":"./drag-events","CdkDragDrop":"./drag-events","moveItemInArray":"./drag-utils","transferArrayItem":"./drag-utils","CdkDragPreview":"./drag-preview","CdkDragPlaceholder":"./drag-placeholder","DragDropModule":"./drag-drop-module","DragDropRegistry":"./drag-drop-registry"},"importAs":"@angular/cdk-experimental/drag-drop"}

typings/esm5/drag-drop/drag-drop-registry.d.ts

@@ -10,17 +10,17 @@ /**
 import { Subject } from 'rxjs';
-import { CdkDrop } from './drop';
-import { CdkDrag } from './drag';
 /**
- * Service that keeps track of all the `CdkDrag` and `CdkDrop` instances, and
- * manages global event listeners on the `document`.
+ * Service that keeps track of all the drag item and drop container
+ * instances, and manages global event listeners on the `document`.
  * @docs-private
  */
-export declare class CdkDragDropRegistry implements OnDestroy {
+export declare class DragDropRegistry<I, C extends {
+    id: string;
+}> implements OnDestroy {
     private _ngZone;
     private _document;
-    /** Registered `CdkDrop` instances. */
+    /** Registered drop container instances. */
     private _dropInstances;
-    /** Registered `CdkDrag` instances. */
+    /** Registered drag item instances. */
     private _dragInstances;
-    /** `CdkDrag` instances that are currently being dragged. */
+    /** Drag item instances that are currently being dragged. */
     private _activeDragInstances;
@@ -31,3 +31,3 @@ /** Keeps track of the event listeners that we've bound to the `document`. */
      * Emits the `touchmove` or `mousemove` events that are dispatched
-     * while the user is dragging a `CdkDrag` instance.
+     * while the user is dragging a drag item instance.
      */
@@ -37,14 +37,14 @@ readonly pointerMove: Subject<TouchEvent | MouseEvent>;
      * Emits the `touchend` or `mouseup` events that are dispatched
-     * while the user is dragging a `CdkDrag` instance.
+     * while the user is dragging a drag item instance.
      */
     readonly pointerUp: Subject<TouchEvent | MouseEvent>;
     constructor(_ngZone: NgZone, _document: any);
-    /** Adds a `CdkDrop` instance to the registry. */
-    register(drop: CdkDrop): any;
-    /** Adds a `CdkDrag` instance to the registry. */
-    register(drag: CdkDrag): any;
-    /** Removes a `CdkDrop` instance from the registry. */
-    remove(drop: CdkDrop): any;
-    /** Removes a `CdkDrag` instance from the registry. */
-    remove(drag: CdkDrag): any;
+    /** Adds a drop container to the registry. */
+    registerDropContainer(drop: C): void;
+    /** Adds a drag item instance to the registry. */
+    registerDragItem(drag: I): void;
+    /** Removes a drop container from the registry. */
+    removeDropContainer(drop: C): void;
+    /** Removes a drag item instance from the registry. */
+    removeDragItem(drag: I): void;
     /**
@@ -55,9 +55,9 @@ * Starts the dragging sequence for a drag instance.
      */
-    startDragging(drag: CdkDrag, event: TouchEvent | MouseEvent): void;
-    /** Stops dragging a `CdkDrag` instance. */
-    stopDragging(drag: CdkDrag): void;
-    /** Gets whether a `CdkDrag` instance is currently being dragged. */
-    isDragging(drag: CdkDrag): boolean;
-    /** Gets a `CdkDrop` instance by its id. */
-    getDropContainer<T = any>(id: string): CdkDrop<T> | undefined;
+    startDragging(drag: I, event: TouchEvent | MouseEvent): void;
+    /** Stops dragging a drag item instance. */
+    stopDragging(drag: I): void;
+    /** Gets whether a drag item instance is currently being dragged. */
+    isDragging(drag: I): boolean;
+    /** Gets a drop container by its id. */
+    getDropContainer(id: string): C | undefined;
     ngOnDestroy(): void;
@@ -64,0 +64,0 @@ /**

typings/esm5/drag-drop/drag.d.ts

@@ -16,3 +16,3 @@ /**
 import { ViewportRuler } from '@angular/cdk/overlay';
-import { CdkDragDropRegistry } from './drag-drop-registry';
+import { DragDropRegistry } from './drag-drop-registry';
 /** Element that can be moved inside a CdkDrop container. */
@@ -87,3 +87,3 @@ export declare class CdkDrag<T = any> implements OnDestroy {
         /** Droppable container that the draggable is a part of. */
-        dropContainer: CdkDropContainer, document: any, _ngZone: NgZone, _viewContainerRef: ViewContainerRef, _viewportRuler: ViewportRuler, _dragDropRegistry: CdkDragDropRegistry, _dir: Directionality);
+        dropContainer: CdkDropContainer, document: any, _ngZone: NgZone, _viewContainerRef: ViewContainerRef, _viewportRuler: ViewportRuler, _dragDropRegistry: DragDropRegistry<CdkDrag<T>, CdkDropContainer>, _dir: Directionality);
     /**
@@ -117,4 +117,2 @@ * Returns the element that is being used as a placeholder
     private _createPlaceholderElement();
-    /** Gets the index of an element, based on its index in the DOM. */
-    private _getElementIndexInDom(element);
     /**
@@ -121,0 +119,0 @@ * Figures out the coordinates at which an element was picked up.

typings/esm5/drag-drop/drop-container.d.ts

@@ -13,2 +13,4 @@ /**
     data: T;
+    /** Unique ID for the drop zone. */
+    id: string;
     /** Direction in which the list is oriented. */
@@ -28,4 +30,6 @@ orientation: 'horizontal' | 'vertical';
      * @param item Item that was moved into the container.
+     * @param xOffset Position of the item along the X axis.
+     * @param yOffset Position of the item along the Y axis.
      */
-    enter(item: CdkDrag): void;
+    enter(item: CdkDrag, xOffset: number, yOffset: number): void;
     /**
@@ -32,0 +36,0 @@ * Removes an item from the container after it was dragged into another container by the user.

typings/esm5/drag-drop/drop.d.ts

@@ -11,3 +11,3 @@ /**
 import { CdkDragExit, CdkDragEnter, CdkDragDrop } from './drag-events';
-import { CdkDragDropRegistry } from './drag-drop-registry';
+import { DragDropRegistry } from './drag-drop-registry';
 /** Container that wraps a set of draggable items. */
@@ -45,3 +45,3 @@ export declare class CdkDrop<T = any> implements OnInit, OnDestroy {
     exited: EventEmitter<CdkDragExit<T>>;
-    constructor(element: ElementRef<HTMLElement>, _dragDropRegistry: CdkDragDropRegistry);
+    constructor(element: ElementRef<HTMLElement>, _dragDropRegistry: DragDropRegistry<CdkDrag, CdkDrop<T>>);
     ngOnInit(): void;
@@ -53,2 +53,8 @@ ngOnDestroy(): void;
     private _positionCache;
+    /**
+     * Draggable items that are currently active inside the container. Includes the items
+     * from `_draggables`, as well as any items that have been dragged in, but haven't
+     * been dropped yet.
+     */
+    private _activeDraggables;
     /** Starts dragging an item. */
@@ -66,4 +72,6 @@ start(): void;
      * @param item Item that was moved into the container.
+     * @param xOffset Position of the item along the X axis.
+     * @param yOffset Position of the item along the Y axis.
      */
-    enter(item: CdkDrag): void;
+    enter(item: CdkDrag, xOffset: number, yOffset: number): void;
     /**
@@ -94,5 +102,19 @@ * Removes an item from the container after it was dragged into another container by the user.
     /** Refreshes the position cache of the items and sibling containers. */
-    private _refreshPositions();
+    private _cachePositions();
     /** Resets the container to its initial state. */
     private _reset();
+    /**
+     * Updates the top/left positions of a `ClientRect`, as well as their bottom/right counterparts.
+     * @param clientRect `ClientRect` that should be updated.
+     * @param top New value for the `top` position.
+     * @param left New value for the `left` position.
+     */
+    private _adjustClientRect(clientRect, top, left);
+    /**
+     * Gets the index of an item in the drop container, based on the position of the user's pointer.
+     * @param item Item that is being sorted.
+     * @param xOffset Position of the user's pointer along the X axis.
+     * @param yOffset Position of the user's pointer along the Y axis.
+     */
+    private _getItemIndexFromPointerPosition(item, xOffset, yOffset);
 }

typings/esm5/drag-drop/index.metadata.json

@@ -1,1 +0,1 @@
-{"__symbolic":"module","version":4,"metadata":{"CdkDrop":{"__symbolic":"class","arity":1,"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":31,"character":1},"arguments":[{"moduleId":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"module"},"member":"id"},"selector":"cdk-drop","exportAs":"cdkDrop","template":"<ng-content></ng-content>","encapsulation":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewEncapsulation","line":36,"character":17},"member":"None"},"changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":37,"character":19},"member":"OnPush"},"providers":[{"provide":{"__symbolic":"reference","name":"CDK_DROP_CONTAINER"},"useExisting":{"__symbolic":"reference","name":"CdkDrop"}}],"host":{"class":"cdk-drop","[id]":"id","[class.cdk-drop-dragging]":"_dragging","$quoted$":["class","[id]","[class.cdk-drop-dragging]"]},"styles":[".cdk-drag-preview{position:fixed;top:0;left:0;z-index:1000}.cdk-drag,.cdk-drag-handle{touch-action:none;-webkit-user-drag:none;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}"]}]}],"members":{"_draggables":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChildren","line":50,"character":3},"arguments":[{"__symbolic":"reference","name":"CdkDrag"}]}]}],"connectedTo":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":57,"character":3}}]}],"data":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":60,"character":3}}]}],"orientation":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":63,"character":3}}]}],"id":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":69,"character":3}}]}],"dropped":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":72,"character":3}}]}],"entered":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":77,"character":3}}]}],"exited":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":83,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"ElementRef","module":"@angular/core","arguments":[{"__symbolic":"error","message":"Could not resolve type","line":86,"character":31,"context":{"typeName":"HTMLElement"},"module":"./drop"}]},{"__symbolic":"reference","name":"CdkDragDropRegistry"}]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"start":[{"__symbolic":"method"}],"drop":[{"__symbolic":"method"}],"enter":[{"__symbolic":"method"}],"exit":[{"__symbolic":"method"}],"getItemIndex":[{"__symbolic":"method"}],"_sortItem":[{"__symbolic":"method"}],"_getSiblingContainerFromPosition":[{"__symbolic":"method"}],"_refreshPositions":[{"__symbolic":"method"}],"_reset":[{"__symbolic":"method"}]}},"CdkDropContainer":{"__symbolic":"interface"},"CDK_DROP_CONTAINER":{"__symbolic":"new","expression":{"__symbolic":"reference","module":"@angular/core","name":"InjectionToken","line":55,"character":38},"arguments":["CDK_DROP_CONTAINER"]},"CdkDrag":{"__symbolic":"class","arity":1,"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":42,"character":1},"arguments":[{"selector":"[cdkDrag]","exportAs":"cdkDrag","host":{"class":"cdk-drag","(mousedown)":"_startDragging($event)","(touchstart)":"_startDragging($event)","$quoted$":["class","(mousedown)","(touchstart)"]}}]}],"members":{"_handles":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChildren","line":100,"character":3},"arguments":[{"__symbolic":"reference","name":"CdkDragHandle"}]}]}],"_previewTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChild","line":103,"character":3},"arguments":[{"__symbolic":"reference","name":"CdkDragPreview"}]}]}],"_placeholderTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChild","line":108,"character":3},"arguments":[{"__symbolic":"reference","name":"CdkDragPlaceholder"}]}]}],"data":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":111,"character":3}}]}],"started":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":114,"character":3},"arguments":["cdkDragStarted"]}]}],"ended":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":117,"character":3},"arguments":["cdkDragEnded"]}]}],"entered":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":120,"character":3},"arguments":["cdkDragEntered"]}]}],"exited":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":124,"character":3},"arguments":["cdkDragExited"]}]}],"dropped":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":128,"character":3},"arguments":["cdkDragDropped"]}]}],"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[null,[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject","line":135,"character":5},"arguments":[{"__symbolic":"reference","name":"CDK_DROP_CONTAINER"}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional","line":135,"character":33}},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"SkipSelf","line":135,"character":45}}],[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject","line":136,"character":5},"arguments":[{"__symbolic":"reference","module":"@angular/common","name":"DOCUMENT","line":136,"character":12}]}],null,null,null,null,[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional","line":141,"character":5}}]],"parameters":[{"__symbolic":"reference","name":"ElementRef","module":"@angular/core","arguments":[{"__symbolic":"error","message":"Could not resolve type","line":133,"character":31,"context":{"typeName":"HTMLElement"},"module":"./drag"}]},{"__symbolic":"reference","name":"CdkDropContainer"},{"__symbolic":"reference","name":"any"},{"__symbolic":"reference","module":"@angular/core","name":"NgZone","line":137,"character":21},{"__symbolic":"reference","module":"@angular/core","name":"ViewContainerRef","line":138,"character":31},{"__symbolic":"reference","module":"@angular/cdk/overlay","name":"ViewportRuler","line":139,"character":28},{"__symbolic":"reference","name":"CdkDragDropRegistry"},{"__symbolic":"reference","module":"@angular/cdk/bidi","name":"Directionality","line":141,"character":30}]}],"getPlaceholderElement":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"_startDragging":[{"__symbolic":"method"}],"_cleanupDragArtifacts":[{"__symbolic":"method"}],"_updateActiveDropContainer":[{"__symbolic":"method"}],"_createPreviewElement":[{"__symbolic":"method"}],"_createPlaceholderElement":[{"__symbolic":"method"}],"_getElementIndexInDom":[{"__symbolic":"method"}],"_getPointerPositionInElement":[{"__symbolic":"method"}],"_animatePreviewToPlaceholder":[{"__symbolic":"method"}],"_setTransform":[{"__symbolic":"method"}],"_removeElement":[{"__symbolic":"method"}],"_getPointerPositionOnPage":[{"__symbolic":"method"}],"_isTouchEvent":[{"__symbolic":"method"}],"_destroyPreview":[{"__symbolic":"method"}],"_destroyPlaceholder":[{"__symbolic":"method"}]}},"CdkDragHandle":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":11,"character":1},"arguments":[{"selector":"[cdkDragHandle]","host":{"class":"cdk-drag-handle","$quoted$":["class"]}}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"ElementRef","module":"@angular/core","arguments":[{"__symbolic":"error","message":"Could not resolve type","line":18,"character":41,"context":{"typeName":"HTMLElement"},"module":"./drag-handle"}]}]}]}},"CdkDragStart":{"__symbolic":"interface"},"CdkDragEnd":{"__symbolic":"interface"},"CdkDragEnter":{"__symbolic":"interface"},"CdkDragExit":{"__symbolic":"interface"},"CdkDragDrop":{"__symbolic":"interface"},"moveItemInArray":{"__symbolic":"function"},"transferArrayItem":{"__symbolic":"function"},"CdkDragPreview":{"__symbolic":"class","arity":1,"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":14,"character":1},"arguments":[{"selector":"ng-template[cdkDragPreview]"}]}],"members":{"data":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":19,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"TemplateRef","module":"@angular/core","arguments":[{"__symbolic":"error","message":"Could not resolve type","line":20,"character":46,"context":{"typeName":"T"},"module":"./drag-preview"}]}]}]}},"CdkDragPlaceholder":{"__symbolic":"class","arity":1,"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":14,"character":1},"arguments":[{"selector":"ng-template[cdkDragPlaceholder]"}]}],"members":{"data":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":19,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"TemplateRef","module":"@angular/core","arguments":[{"__symbolic":"error","message":"Could not resolve type","line":20,"character":46,"context":{"typeName":"T"},"module":"./drag-placeholder"}]}]}]}},"DragDropModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":15,"character":1},"arguments":[{"declarations":[{"__symbolic":"reference","name":"CdkDrop"},{"__symbolic":"reference","name":"CdkDrag"},{"__symbolic":"reference","name":"CdkDragHandle"},{"__symbolic":"reference","name":"CdkDragPreview"},{"__symbolic":"reference","name":"CdkDragPlaceholder"}],"exports":[{"__symbolic":"reference","name":"CdkDrop"},{"__symbolic":"reference","name":"CdkDrag"},{"__symbolic":"reference","name":"CdkDragHandle"},{"__symbolic":"reference","name":"CdkDragPreview"},{"__symbolic":"reference","name":"CdkDragPlaceholder"}]}]}],"members":{}},"CdkDragDropRegistry":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":26,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[null,[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject","line":56,"character":5},"arguments":[{"__symbolic":"reference","module":"@angular/common","name":"DOCUMENT","line":56,"character":12}]}]],"parameters":[{"__symbolic":"reference","module":"@angular/core","name":"NgZone","line":55,"character":21},{"__symbolic":"reference","name":"any"}]}],"register":[{"__symbolic":"method"},{"__symbolic":"method"},{"__symbolic":"method"}],"remove":[{"__symbolic":"method"},{"__symbolic":"method"},{"__symbolic":"method"}],"startDragging":[{"__symbolic":"method"}],"stopDragging":[{"__symbolic":"method"}],"isDragging":[{"__symbolic":"method"}],"getDropContainer":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"_clearGlobalListeners":[{"__symbolic":"method"}]},"statics":{"ngInjectableDef":{}}}},"origins":{"CdkDrop":"./drop","CdkDropContainer":"./drop-container","CDK_DROP_CONTAINER":"./drop-container","CdkDrag":"./drag","CdkDragHandle":"./drag-handle","CdkDragStart":"./drag-events","CdkDragEnd":"./drag-events","CdkDragEnter":"./drag-events","CdkDragExit":"./drag-events","CdkDragDrop":"./drag-events","moveItemInArray":"./drag-utils","transferArrayItem":"./drag-utils","CdkDragPreview":"./drag-preview","CdkDragPlaceholder":"./drag-placeholder","DragDropModule":"./drag-drop-module","CdkDragDropRegistry":"./drag-drop-registry"},"importAs":"@angular/cdk-experimental/drag-drop"}
+{"__symbolic":"module","version":4,"metadata":{"CdkDrop":{"__symbolic":"class","arity":1,"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":31,"character":1},"arguments":[{"moduleId":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"module"},"member":"id"},"selector":"cdk-drop","exportAs":"cdkDrop","template":"<ng-content></ng-content>","encapsulation":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewEncapsulation","line":36,"character":17},"member":"None"},"changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":37,"character":19},"member":"OnPush"},"providers":[{"provide":{"__symbolic":"reference","name":"CDK_DROP_CONTAINER"},"useExisting":{"__symbolic":"reference","name":"CdkDrop"}}],"host":{"class":"cdk-drop","[id]":"id","[class.cdk-drop-dragging]":"_dragging","$quoted$":["class","[id]","[class.cdk-drop-dragging]"]},"styles":[".cdk-drag-preview{position:fixed;top:0;left:0;z-index:1000}.cdk-drag,.cdk-drag-handle{touch-action:none;-webkit-user-drag:none;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}"]}]}],"members":{"_draggables":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChildren","line":50,"character":3},"arguments":[{"__symbolic":"reference","name":"CdkDrag"}]}]}],"connectedTo":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":57,"character":3}}]}],"data":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":60,"character":3}}]}],"orientation":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":63,"character":3}}]}],"id":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":69,"character":3}}]}],"dropped":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":72,"character":3}}]}],"entered":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":77,"character":3}}]}],"exited":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":83,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"ElementRef","module":"@angular/core","arguments":[{"__symbolic":"error","message":"Could not resolve type","line":86,"character":31,"context":{"typeName":"HTMLElement"},"module":"./drop"}]},{"__symbolic":"reference","name":"DragDropRegistry"}]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"start":[{"__symbolic":"method"}],"drop":[{"__symbolic":"method"}],"enter":[{"__symbolic":"method"}],"exit":[{"__symbolic":"method"}],"getItemIndex":[{"__symbolic":"method"}],"_sortItem":[{"__symbolic":"method"}],"_getSiblingContainerFromPosition":[{"__symbolic":"method"}],"_cachePositions":[{"__symbolic":"method"}],"_reset":[{"__symbolic":"method"}],"_adjustClientRect":[{"__symbolic":"method"}],"_getItemIndexFromPointerPosition":[{"__symbolic":"method"}]}},"CdkDropContainer":{"__symbolic":"interface"},"CDK_DROP_CONTAINER":{"__symbolic":"new","expression":{"__symbolic":"reference","module":"@angular/core","name":"InjectionToken","line":60,"character":38},"arguments":["CDK_DROP_CONTAINER"]},"CdkDrag":{"__symbolic":"class","arity":1,"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":42,"character":1},"arguments":[{"selector":"[cdkDrag]","exportAs":"cdkDrag","host":{"class":"cdk-drag","(mousedown)":"_startDragging($event)","(touchstart)":"_startDragging($event)","$quoted$":["class","(mousedown)","(touchstart)"]}}]}],"members":{"_handles":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChildren","line":100,"character":3},"arguments":[{"__symbolic":"reference","name":"CdkDragHandle"}]}]}],"_previewTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChild","line":103,"character":3},"arguments":[{"__symbolic":"reference","name":"CdkDragPreview"}]}]}],"_placeholderTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChild","line":108,"character":3},"arguments":[{"__symbolic":"reference","name":"CdkDragPlaceholder"}]}]}],"data":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":111,"character":3}}]}],"started":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":114,"character":3},"arguments":["cdkDragStarted"]}]}],"ended":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":117,"character":3},"arguments":["cdkDragEnded"]}]}],"entered":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":120,"character":3},"arguments":["cdkDragEntered"]}]}],"exited":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":124,"character":3},"arguments":["cdkDragExited"]}]}],"dropped":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":128,"character":3},"arguments":["cdkDragDropped"]}]}],"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[null,[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject","line":135,"character":5},"arguments":[{"__symbolic":"reference","name":"CDK_DROP_CONTAINER"}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional","line":135,"character":33}},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"SkipSelf","line":135,"character":45}}],[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject","line":136,"character":5},"arguments":[{"__symbolic":"reference","module":"@angular/common","name":"DOCUMENT","line":136,"character":12}]}],null,null,null,null,[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional","line":141,"character":5}}]],"parameters":[{"__symbolic":"reference","name":"ElementRef","module":"@angular/core","arguments":[{"__symbolic":"error","message":"Could not resolve type","line":133,"character":31,"context":{"typeName":"HTMLElement"},"module":"./drag"}]},{"__symbolic":"reference","name":"CdkDropContainer"},{"__symbolic":"reference","name":"any"},{"__symbolic":"reference","module":"@angular/core","name":"NgZone","line":137,"character":21},{"__symbolic":"reference","module":"@angular/core","name":"ViewContainerRef","line":138,"character":31},{"__symbolic":"reference","module":"@angular/cdk/overlay","name":"ViewportRuler","line":139,"character":28},{"__symbolic":"reference","name":"DragDropRegistry"},{"__symbolic":"reference","module":"@angular/cdk/bidi","name":"Directionality","line":141,"character":30}]}],"getPlaceholderElement":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"_startDragging":[{"__symbolic":"method"}],"_cleanupDragArtifacts":[{"__symbolic":"method"}],"_updateActiveDropContainer":[{"__symbolic":"method"}],"_createPreviewElement":[{"__symbolic":"method"}],"_createPlaceholderElement":[{"__symbolic":"method"}],"_getPointerPositionInElement":[{"__symbolic":"method"}],"_animatePreviewToPlaceholder":[{"__symbolic":"method"}],"_setTransform":[{"__symbolic":"method"}],"_removeElement":[{"__symbolic":"method"}],"_getPointerPositionOnPage":[{"__symbolic":"method"}],"_isTouchEvent":[{"__symbolic":"method"}],"_destroyPreview":[{"__symbolic":"method"}],"_destroyPlaceholder":[{"__symbolic":"method"}]}},"CdkDragHandle":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":11,"character":1},"arguments":[{"selector":"[cdkDragHandle]","host":{"class":"cdk-drag-handle","$quoted$":["class"]}}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"ElementRef","module":"@angular/core","arguments":[{"__symbolic":"error","message":"Could not resolve type","line":18,"character":41,"context":{"typeName":"HTMLElement"},"module":"./drag-handle"}]}]}]}},"CdkDragStart":{"__symbolic":"interface"},"CdkDragEnd":{"__symbolic":"interface"},"CdkDragEnter":{"__symbolic":"interface"},"CdkDragExit":{"__symbolic":"interface"},"CdkDragDrop":{"__symbolic":"interface"},"moveItemInArray":{"__symbolic":"function"},"transferArrayItem":{"__symbolic":"function"},"CdkDragPreview":{"__symbolic":"class","arity":1,"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":14,"character":1},"arguments":[{"selector":"ng-template[cdkDragPreview]"}]}],"members":{"data":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":19,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"TemplateRef","module":"@angular/core","arguments":[{"__symbolic":"error","message":"Could not resolve type","line":20,"character":46,"context":{"typeName":"T"},"module":"./drag-preview"}]}]}]}},"CdkDragPlaceholder":{"__symbolic":"class","arity":1,"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":14,"character":1},"arguments":[{"selector":"ng-template[cdkDragPlaceholder]"}]}],"members":{"data":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":19,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"TemplateRef","module":"@angular/core","arguments":[{"__symbolic":"error","message":"Could not resolve type","line":20,"character":46,"context":{"typeName":"T"},"module":"./drag-placeholder"}]}]}]}},"DragDropModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":15,"character":1},"arguments":[{"declarations":[{"__symbolic":"reference","name":"CdkDrop"},{"__symbolic":"reference","name":"CdkDrag"},{"__symbolic":"reference","name":"CdkDragHandle"},{"__symbolic":"reference","name":"CdkDragPreview"},{"__symbolic":"reference","name":"CdkDragPlaceholder"}],"exports":[{"__symbolic":"reference","name":"CdkDrop"},{"__symbolic":"reference","name":"CdkDrag"},{"__symbolic":"reference","name":"CdkDragHandle"},{"__symbolic":"reference","name":"CdkDragPreview"},{"__symbolic":"reference","name":"CdkDragPlaceholder"}]}]}],"members":{}},"DragDropRegistry":{"__symbolic":"class","arity":2,"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":27,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[null,[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject","line":57,"character":5},"arguments":[{"__symbolic":"reference","module":"@angular/common","name":"DOCUMENT","line":57,"character":12}]}]],"parameters":[{"__symbolic":"reference","module":"@angular/core","name":"NgZone","line":56,"character":21},{"__symbolic":"reference","name":"any"}]}],"registerDropContainer":[{"__symbolic":"method"}],"registerDragItem":[{"__symbolic":"method"}],"removeDropContainer":[{"__symbolic":"method"}],"removeDragItem":[{"__symbolic":"method"}],"startDragging":[{"__symbolic":"method"}],"stopDragging":[{"__symbolic":"method"}],"isDragging":[{"__symbolic":"method"}],"getDropContainer":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"_clearGlobalListeners":[{"__symbolic":"method"}]},"statics":{"ngInjectableDef":{}}}},"origins":{"CdkDrop":"./drop","CdkDropContainer":"./drop-container","CDK_DROP_CONTAINER":"./drop-container","CdkDrag":"./drag","CdkDragHandle":"./drag-handle","CdkDragStart":"./drag-events","CdkDragEnd":"./drag-events","CdkDragEnter":"./drag-events","CdkDragExit":"./drag-events","CdkDragDrop":"./drag-events","moveItemInArray":"./drag-utils","transferArrayItem":"./drag-utils","CdkDragPreview":"./drag-preview","CdkDragPlaceholder":"./drag-placeholder","DragDropModule":"./drag-drop-module","DragDropRegistry":"./drag-drop-registry"},"importAs":"@angular/cdk-experimental/drag-drop"}

typings/esm5/index.metadata.json

@@ -1,1 +0,1 @@
-{"__symbolic":"module","version":4,"metadata":{"VERSION":{"__symbolic":"new","expression":{"__symbolic":"reference","module":"@angular/core","name":"Version","line":11,"character":27},"arguments":["6.4.3"]}},"origins":{"VERSION":"./version"},"importAs":"@angular/cdk-experimental"}
+{"__symbolic":"module","version":4,"metadata":{"VERSION":{"__symbolic":"new","expression":{"__symbolic":"reference","module":"@angular/core","name":"Version","line":11,"character":27},"arguments":["6.4.5"]}},"origins":{"VERSION":"./version"},"importAs":"@angular/cdk-experimental"}

typings/index.metadata.json

@@ -1,1 +0,1 @@
-{"__symbolic":"module","version":4,"metadata":{"VERSION":{"__symbolic":"new","expression":{"__symbolic":"reference","module":"@angular/core","name":"Version","line":11,"character":27},"arguments":["6.4.3"]}},"origins":{"VERSION":"./version"},"importAs":"@angular/cdk-experimental"}
+{"__symbolic":"module","version":4,"metadata":{"VERSION":{"__symbolic":"new","expression":{"__symbolic":"reference","module":"@angular/core","name":"Version","line":11,"character":27},"arguments":["6.4.5"]}},"origins":{"VERSION":"./version"},"importAs":"@angular/cdk-experimental"}

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

1724595

increased by2.86%

Lines of code

16939

increased by2.12%

No dependency changes