in src/cdk/drag-drop/drag-ref.ts [1355:1410]
private _containInsideBoundaryOnResize() {
let {x, y} = this._passiveTransform;
if ((x === 0 && y === 0) || this.isDragging() || !this._boundaryElement) {
return;
}
const boundaryRect = this._boundaryElement.getBoundingClientRect();
const elementRect = this._rootElement.getBoundingClientRect();
// It's possible that the element got hidden away after dragging (e.g. by switching to a
// different tab). Don't do anything in this case so we don't clear the user's position.
if (
(boundaryRect.width === 0 && boundaryRect.height === 0) ||
(elementRect.width === 0 && elementRect.height === 0)
) {
return;
}
const leftOverflow = boundaryRect.left - elementRect.left;
const rightOverflow = elementRect.right - boundaryRect.right;
const topOverflow = boundaryRect.top - elementRect.top;
const bottomOverflow = elementRect.bottom - boundaryRect.bottom;
// If the element has become wider than the boundary, we can't
// do much to make it fit so we just anchor it to the left.
if (boundaryRect.width > elementRect.width) {
if (leftOverflow > 0) {
x += leftOverflow;
}
if (rightOverflow > 0) {
x -= rightOverflow;
}
} else {
x = 0;
}
// If the element has become taller than the boundary, we can't
// do much to make it fit so we just anchor it to the top.
if (boundaryRect.height > elementRect.height) {
if (topOverflow > 0) {
y += topOverflow;
}
if (bottomOverflow > 0) {
y -= bottomOverflow;
}
} else {
y = 0;
}
if (x !== this._passiveTransform.x || y !== this._passiveTransform.y) {
this.setFreeDragPosition({y, x});
}
}