# SnapLine Documentation

> Documentation for building node graphs, connections, selection, groups, and placement workflows with SnapLine.

Framework-specific pages and code examples are listed separately. Each link returns clean Markdown suitable for coding-agent context.

## Introduction

- [SnapLine](https://snapengine.dev/docs/snapline/introduction.md): Node graph interaction primitives for Vanilla JavaScript, Svelte, and React.
- [Installation and setup (Svelte)](https://snapengine.dev/docs/snapline/introduction/01_setup.md?framework=svelte): Install SnapLine and render a first node graph in Vanilla, Svelte, or React.
- [Installation and setup (React)](https://snapengine.dev/docs/snapline/introduction/01_setup.md?framework=react): Install SnapLine and render a first node graph in Vanilla, Svelte, or React.
- [Installation and setup (Vanilla JS)](https://snapengine.dev/docs/snapline/introduction/01_setup.md?framework=vanilla): Install SnapLine and render a first node graph in Vanilla, Svelte, or React.

## Guides

- [Core concepts and connections](https://snapengine.dev/docs/snapline/guides/01_core_concepts.md): Understand engines, nodes, connectors, lines, coordinates, and ownership.
- [Selection and resizing (Svelte)](https://snapengine.dev/docs/snapline/guides/02_selection_resize.md?framework=svelte): Configure rectangle selection, drag surfaces, resize handles, and controlled geometry.
- [Selection and resizing (React)](https://snapengine.dev/docs/snapline/guides/02_selection_resize.md?framework=react): Configure rectangle selection, drag surfaces, resize handles, and controlled geometry.
- [Groups and nesting](https://snapengine.dev/docs/snapline/guides/03_groups.md): Use exclusive automatic membership, nested group trees, and custom parent resolution.
- [Placement and camera interaction](https://snapengine.dev/docs/snapline/guides/04_placement_camera.md): Build palette placement previews with correct screen-to-world conversion and cancellation.
- [State, styling, and accessibility](https://snapengine.dev/docs/snapline/guides/05_state_styling_accessibility.md): Persist graph state, style structural hooks, and understand current accessibility boundaries.
- [Shape surfaces and application-owned graphs](https://snapengine.dev/docs/snapline/guides/06_surface_connectors.md): Connect whole node borders, customize snapping geometry, and keep domain data in your framework.

## Reference

- [React API](https://snapengine.dev/docs/snapline/reference/react.md?framework=react): React SnapLine components, props, callbacks, contexts, and refs.
- [Svelte API](https://snapengine.dev/docs/snapline/reference/svelte.md?framework=svelte): Svelte 5 SnapLine components, props, callbacks, and object access.
- [Vanilla and core API (Vanilla JS)](https://snapengine.dev/docs/snapline/reference/vanilla.md?framework=vanilla): Framework-neutral SnapLine classes, configuration, callbacks, and lifecycle.
- [Node API (React)](https://snapengine.dev/docs/snapline/reference/react/node.md?framework=react): React Node props, callbacks, resize configuration, ref, and hooks.
- [Node API (Svelte)](https://snapengine.dev/docs/snapline/reference/svelte/node.md?framework=svelte): Svelte Node props, callbacks, resize configuration, and object access.
- [Node API (Vanilla JS)](https://snapengine.dev/docs/snapline/reference/vanilla/node.md?framework=vanilla): Core NodeMirror configuration, callbacks, resize constants, and data attributes.
- [Connector API (React)](https://snapengine.dev/docs/snapline/reference/react/connector.md?framework=react): React Connector props, rules and defaults, surfaces, and ref.
- [Connector API (Svelte)](https://snapengine.dev/docs/snapline/reference/svelte/connector.md?framework=svelte): Svelte Connector props, rules and defaults, surfaces, and object access.
- [Connector API (Vanilla JS)](https://snapengine.dev/docs/snapline/reference/vanilla/connector.md?framework=vanilla): Core ConnectorMirror configuration, rules and defaults, surfaces, and admission.
- [Line API (React)](https://snapengine.dev/docs/snapline/reference/react/line.md?framework=react): React Line renderer props, geometry writer contract, and phases.
- [Line API (Svelte)](https://snapengine.dev/docs/snapline/reference/svelte/line.md?framework=svelte): Svelte Line renderer props, geometry writer contract, and phases.
- [Line API (Vanilla JS)](https://snapengine.dev/docs/snapline/reference/vanilla/line.md?framework=vanilla): Core LineMirror identity, phases, geometry snapshots, and render binding.
- [Select API (React)](https://snapengine.dev/docs/snapline/reference/react/select.md?framework=react): React Select rectangle-selection props and callbacks.
- [Select API (Svelte)](https://snapengine.dev/docs/snapline/reference/svelte/select.md?framework=svelte): Svelte Select rectangle-selection props, callbacks, and controller access.
- [Select API (Vanilla JS)](https://snapengine.dev/docs/snapline/reference/vanilla/select.md?framework=vanilla): Core RectSelectController configuration, callbacks, and geometry binding.
- [Group API (React)](https://snapengine.dev/docs/snapline/reference/react/group.md?framework=react): React Group props, callbacks, geometry, and forwarded ref.
- [Group API (Svelte)](https://snapengine.dev/docs/snapline/reference/svelte/group.md?framework=svelte): Svelte Group props, snippets, callbacks, geometry, and ownership.
- [Group API (Vanilla JS)](https://snapengine.dev/docs/snapline/reference/vanilla/group.md?framework=vanilla): Core group configuration, exclusive hierarchy, callbacks, and resolver API.
- [Placement API (React)](https://snapengine.dev/docs/snapline/reference/react/placement.md?framework=react): React Placement controller binding, preview renderer, and cancellation props.
- [Placement API (Svelte)](https://snapengine.dev/docs/snapline/reference/svelte/placement.md?framework=svelte): Svelte Placement controller binding, preview snippet, and cancellation props.
- [Placement API (Vanilla JS)](https://snapengine.dev/docs/snapline/reference/vanilla/placement.md?framework=vanilla): Core PlacementController state, callbacks, anchors, and lifecycle.
- [ControlledGraph API (React)](https://snapengine.dev/docs/snapline/reference/react/controlled-graph.md?framework=react): React controlled-graph bridge — canonical line records, change requests, diagnostics.
- [ControlledGraph API (Svelte)](https://snapengine.dev/docs/snapline/reference/svelte/controlled-graph.md?framework=svelte): Svelte controlled-graph bridge — canonical line records, change requests, diagnostics.
- [ControlledGraph API (Vanilla JS)](https://snapengine.dev/docs/snapline/reference/vanilla/controlled-graph.md?framework=vanilla): Core controlled-graph attachment, canonical snapshots, change requests, and diagnostics.