# `LivePanels.Graph`
[🔗](https://github.com/livepanels/livepanels/blob/v0.1.0/lib/livepanels/graph.ex#L1)

Canvas-domain graph API for connector items and ports.

Graph commands submit through the canonical canvas command path and create or
update connector items in `LivePanels.Canvas.State`. Graph-owned modules hold
connection resolution, graph command DOM attrs, runtime graph events, and
layout helpers. Connector item modeling, path projection, and SVG item
rendering live under `LivePanels.Item.Connector`.

Headless connector and navigation queries live in `LivePanels.Graph.Query`.
Viewport-fit bounds live in `LivePanels.Graph.Bounds`. Layout helpers live in
`LivePanels.Graph.Layout`.

LivePanels permits cyclic graphs. Applications that need DAG semantics should
reject connector commands in policy with `LivePanels.Graph.Query.creates_cycle?/3`.

`LivePanels.Toolkit.Graph` is the public DOM-protocol helper module for graph
ports, connector commands, graph controls, and graph marker imports.

# `command_result`

```elixir
@type command_result() :: LivePanels.Canvas.Command.result()
```

# `connect_opts`

```elixir
@type connect_opts() :: keyword()
```

# `connector_edit_opts`

```elixir
@type connector_edit_opts() :: connector_presentation_opts() | [{:bends, [map()]}]
```

# `connector_presentation_opts`

```elixir
@type connector_presentation_opts() :: [
  label: String.t() | nil,
  labels: %{optional(String.t()) => String.t() | nil},
  role: atom() | String.t() | nil,
  marker_start: atom() | String.t() | nil,
  marker_end: atom() | String.t() | nil,
  emphasis: :muted | :normal | :active | String.t() | nil,
  directed?: boolean() | String.t() | nil,
  route: :bezier | :orthogonal | :straight | String.t() | nil,
  direction: :horizontal | :vertical | String.t() | nil,
  precision: non_neg_integer() | String.t() | nil,
  curvature: number() | String.t() | nil,
  min_curvature: number() | String.t() | nil
]
```

# `connector_ref`

```elixir
@type connector_ref() :: LivePanels.Item.t() | String.t() | atom()
```

# `connector_target`

```elixir
@type connector_target() :: :all | connector_ref() | [connector_ref()]
```

# `endpoint_ref`

```elixir
@type endpoint_ref() :: {String.t() | atom(), String.t() | atom()}
```

# `fit_target`

```elixir
@type fit_target() :: :graph | :selection
```

# `reconnect_opts`

```elixir
@type reconnect_opts() :: [endpoint: :from | :to, target: endpoint_ref()]
```

# `socket`

```elixir
@type socket() :: Phoenix.LiveView.Socket.t()
```

# `target`

```elixir
@type target() :: LivePanels.Canvas.command_target()
```

First argument accepted by graph command helpers.

Pass a LiveView socket for a standalone command, or a
`LivePanels.Canvas.Transaction` context inside `LivePanels.Canvas.transaction/2`.

# `connect`

```elixir
@spec connect(target(), connect_opts()) :: command_result()
```

Connects two declared ports and returns the command result.

# `connect!`

```elixir
@spec connect!(target(), connect_opts()) :: target()
```

Connects two declared ports through the canvas command path.

Route, label, marker, role, direction, and emphasis options are stored on the
connector item and rendered by the graph SVG item projection.

# `connectors`

```elixir
@spec connectors(term()) :: [LivePanels.Item.t()]
```

Returns connector items from canvas state or an item collection.

# `disconnect`

```elixir
@spec disconnect(target(), connector_ref()) :: command_result()
```

Removes a connector and returns the command result.

# `disconnect!`

```elixir
@spec disconnect!(target(), connector_ref()) :: target()
```

Removes a connector through the canvas command path.

# `edit`

```elixir
@spec edit(target(), connector_target(), connector_edit_opts()) :: command_result()
```

Edits connectors and returns the command result.

# `edit!`

```elixir
@spec edit!(target(), connector_target(), connector_edit_opts()) :: target()
```

Edits connector presentation, labels, route, markers, emphasis, curvature, or bends.

# `edit_connector`

```elixir
@spec edit_connector(target(), connector_target(), connector_edit_opts()) ::
  command_result()
```

Explicit connector edit variant of `edit/3` that returns the command result.

# `edit_connector!`

```elixir
@spec edit_connector!(target(), connector_target(), connector_edit_opts()) :: target()
```

Explicit connector edit variant of `edit/3`.

# `fit`

```elixir
@spec fit(socket(), fit_target()) :: socket()
```

Fits the full graph or current graph selection in the viewport.

# `include`

```elixir
@spec include(target(), term()) :: command_result()
```

Includes graph items or connector items and returns the command result.

# `include!`

```elixir
@spec include!(target(), term()) :: target()
```

Includes graph items or connector items in the current actor graph selection.

# `layout`

```elixir
@spec layout(target(), LivePanels.Graph.Layout.layout_strategy(), keyword()) ::
  command_result()
```

Applies a graph layout strategy and returns the command result.

# `layout!`

```elixir
@spec layout!(target(), LivePanels.Graph.Layout.layout_strategy(), keyword()) ::
  target()
```

Applies a graph layout strategy through ordinary canvas placement commands.

# `reconnect`

```elixir
@spec reconnect(target(), connector_ref(), reconnect_opts()) :: command_result()
```

Reconnects an existing connector endpoint and returns the command result.

# `reconnect!`

```elixir
@spec reconnect!(target(), connector_ref(), reconnect_opts()) :: target()
```

Reconnects an existing connector endpoint through the validated reconnect path.

# `select`

```elixir
@spec select(target(), term()) :: command_result()
```

Replaces the current actor graph selection and returns the command result.

# `select!`

```elixir
@spec select!(target(), term()) :: target()
```

Replaces the current actor graph selection.

# `select_all`

```elixir
@spec select_all(target()) :: command_result()
```

Selects every visible graph item and connector item and returns the command result.

# `select_all!`

```elixir
@spec select_all!(target()) :: target()
```

Selects every visible graph item and connector item for the current actor.

# `toggle`

```elixir
@spec toggle(target(), term()) :: command_result()
```

Toggles graph items or connector items and returns the command result.

# `toggle!`

```elixir
@spec toggle!(target(), term()) :: target()
```

Toggles graph items or connector items in the current actor graph selection.

---

*Consult [api-reference.md](api-reference.md) for complete listing*