@syncropel/cockpit

The Syncropel traversal cockpit — the shared grammar for navigating a graph of records. One cockpit, mounted by any host:

• Helm — the locator (where you are) + the lens (axis × shape). The host injects its own identity/world chrome into the locator slots.
• Stage — the projection host. Clamps the frame to the surface, frames the device, and delegates rendering to a host-supplied ProjectionResolver.
• Deck — the one driving input: travel, command, and compose in a single surface.
• Frame stack — the path through the graph; URL-serializable, drill/pop.
• Axis × shape lens — the seven traversal axes and the surface-capable shapes.

The cockpit is source-blind and projection-blind by design: it reads nothing from any host store, owns no connection, and ships no projections. The host supplies data through the seam contexts (FrameSource, MaterialSource, MaterialSink, RecordSink), its own projections through the ProjectionResolver, and its locator chrome through Helm's injection slots. That is what lets the same grammar drive Syncropel Studio (inhabit) and the Syncropic Console (operate) without forking.

Install

npm install @syncropel/cockpit react react-dom @syncropel/editor lucide-react

react/react-dom (>= 18), @syncropel/editor, and lucide-react are peer dependencies. Design tokens are CSS custom properties — provide them via @syncropel/react (or @syncropel/tokens) in the host.

The seam contracts

A host mounts the cockpit by supplying:

• Data sources (FrameSource, MaterialSource, MaterialSink, RecordSink) via the exported context providers — the cockpit reads only these, never a host store.
• A ProjectionResolver (frame, surface) => ReactNode — the host decides which view renders for a given frame. The package ships mock defaults for development.
• Locator chrome — Helm takes the identity menu and world switcher as injected slots, so identity/fleet concerns stay in the host.

License

Apache-2.0 © Syncropic, Inc.