Docs

Docs for motion and placement

One page per package, rendered from the package's own README when this site is built, so it says what npm says for the version shown. Both are young and still changing: pin an exact version.

Move · How things move

`@n-uf/motion`

For desktop-style web apps with windows, panels, docks and toolbars: every change of layout moves the way a good tiling window manager does, and a drag reads what you mean. You give it rects and pointer samples; it moves the real elements.

Version 26.11.9 Install npm i @n-uf/motion

Entries

@n-uf/motion
@n-uf/motion/clock
@n-uf/motion/signals
@n-uf/motion/values
@n-uf/motion/gestures
@n-uf/motion/testing
@n-uf/motion/drag
@n-uf/motion/layout
@n-uf/motion/browser

Read the @n-uf/motion docs README on GitHub (opens in a new tab)npm (opens in a new tab)

See it live Window motion · Drag intent

Place · Where things go

`@n-uf/placement`

For the same apps: it works out where windows, panels and toolbar groups go, as the space changes and while something is dragged. You give it state and a size; it gives back rects, notes on what gave way, and drop targets.

Version 26.11.9 Install npm i @n-uf/placement

Entries

@n-uf/placement
@n-uf/placement/dock
@n-uf/placement/toolbar
@n-uf/placement/targets
@n-uf/placement/panels
@n-uf/placement/desk

Read the @n-uf/placement docs README on GitHub (opens in a new tab)npm (opens in a new tab)

See it live Desk layouts · Toolbar groups