The parts other libraries
tell you to build yourself.
Most kits stop at buttons. HyperKit ships the hard layers — the ones every serious app ends up hand-rolling.
Panel system
Resizable, dockable, drag-to-rearrange IDE layouts with layout persistence — PanelContainer, PanelGroup, PanelResizeHandle.
Navigation registry
One action registry drives the command palette, shortcuts, and agents — with 5 middleware, transports, and recording/replay.
FileSystemService · typed
ClipboardService · typed
catch (e: any) soup → Effect errors
Effect-TS services
WebSocket, Session, FileSystem, Clipboard, and Logging services with typed errors — failures live in the type system.
Your AI assistant reads the docs
like a teammate would.
HyperKit ships an MCP server, llms.txt / llms-full.txt, and a registry that exposes your app's actions as tools agents can call.
✓ connected · 2 tools registered
> search_components("kanban")
KanbanBoard — drag-drop columns, swimlanes,
WIP limits, onMove dispatch …
> get_component("CommandPalette")
CommandPalette — props, slots, shortcuts,
a11y notes, 4 usage examples
MCP doc server
search_components and get_component give agents the exact API — no hallucinated props.
llms.txt shipped in the repo
The whole catalog in machine-readable form — index and full API, versioned with the code.
Agents can drive your UI
generateMCPTools turns the navigation registry into callable tools — permissions and undo included.
40 presets. One variable away
from yours.
Every visual value flows through --sk-* custom properties — enforced by HyperKit's own ESLint plugin in CI. Swap a theme, the whole app follows.
A framework-agnostic graph core.
Rendered by anything.
diagram-core owns layout and state; diagram-svg and diagram-solid render it. Dagre layouts, minimap, controls — DAGs, flows, and pipelines out of the box.
diagram-svg static rendering
diagram-solid interactive, pan/zoom
+ gantt, sequence-diagram, timeline
From Button to KanbanBoard.
Feature-scaled, not fragmented.
Fewer, larger components that grow with props — every one themed, tested, and documented in the live Explorer.
$ npm install @ybouhjira/hyperkit
✓ added 1 package — 131 components, 6 systems, 40 themes
$