Packable layout library
type Node = {
id: number | string,
// cells
x: number,
y: number,
width: number,
height: number,
static: boolean
}
packNodes({
hoist: false,
containerWidth: Infinity, // cells
updatingId: null,
nodes: Nodes[]
}): Nodes[]
trackDrag({
container: HTMLElement,
mouseMoveOffset = 2, // pixels
isDraggable: Element => boolean
dispatch: (action, startTarget: HTMLElement) => void
})
type Params = {
cellWidth: Number, // pixels
cellHeight: Number, // pixels
minWidth?: 1, // cell
maxWidth?: Infinity, // cell
minHeight?: 1, // cell
maxHeight?: Infinity, // cell
padding?: 0, // pixels
resize?: {
width: 6, // pixels
top: false,
right: false,
bottom: false,
left: false
}
}
type DragResult = null | {
type: 'resize' | 'move',
// pixels
element: { x: number, y: number, width: number, height: number },
node: Node
}
dragNode({
params: Params,
node: Node,
// pixels
action: { startX: number, startY: number, endX: number, endY: number }
}): DragResult
getRight(nodes: Node[]): number // cells
getBottom(nodes: Node[]): number // cells
// takes cells
findNode(nodes: Node[], x: number, y: number): Node
MIT Bogdan Chadkin