Tile manager

Drag a tile by its header to move it; drag a side / bottom / corner adorner to resize. Neighbouring tiles get pushed and gravity-compacted upward in real time. Layout auto-persists to localStorage — reload to verify.

Basic usage

Keyboard shortcuts

Tab — focus the tile board. Exactly one tile is in the tab order (roving tabindex), so Tab again leaves the board.
→ / ↓ — focus the next tile · ← / ↑ — the previous one. The order is row-major (top-to-bottom, then left-to-right) and it wraps around the ends; the arrows step through that sequence rather than moving geometrically, so ↓ does not necessarily land on the tile below.
Home / End — first / last tile in row-major order
M — enter move mode on the focused tile. Ignored on a tile that has both disableMove and disableResize.
In move mode: ↑ / ↓ / ← / → move the tile by one grid cell, Shift + arrow grows or shrinks its span by one column / row. Each step reflows the other tiles through the packer and emits tilelayoutchange; a step the packer can't place is announced as “Move blocked” and changes nothing.
Enter — commit and leave move mode · Esc — leave move mode and restore the layout as it was when move mode was entered
Esc during a pointer drag or resize — cancel that gesture

Lock tiles:

Weather

Sunny · 22 °C · 5 km/h NW

Inbox

3 unread · 2 starred

Stats

1.2k visits · ↑12% week-over-week

Calendar

Next: Standup at 10:00

Notes

“Refactor packer · push v1 by Friday”

Activity

7 commits · 2 PRs reviewed today

Live snapshot

Tile manager

Basic usage

Persist & restore layout