On this Page
CollisionRect
CollisionRect describes the measured bounds of one sortable item. It is a TypeScript type used with the collection helpers exported from fractalsvelte/motion; it has no runtime constructor or rendered component.
Usage
TypeScript
import { closestCenter, type CollisionRect } from "fractalsvelte/motion";
const rects: CollisionRect[] = [
{ id: "alpha", left: 0, top: 0, width: 120, height: 48 },
{ id: "beta", left: 0, top: 64, width: 120, height: 48 },
];
const closestId = closestCenter({ x: 60, y: 80 }, rects);
// "beta"
API
| Field | Type | Description |
|---|---|---|
id | string | Stable identifier returned by collision resolution. |
left | number | Left edge in the coordinate space used for the pointer. |
top | number | Top edge in the coordinate space used for the pointer. |
width | number | Measured width of the item. |
height | number | Measured height of the item. |
Related helpers
Pass a CollisionRect[] to closestCenter(point, rects) to find the closest item by centre point. The collection module also exports moveBetween for immutable list transfers and moveTreeNode for immutable nested-tree moves.