# Interfaces

Import these from `@grafloria/angular`.

## Interfaces

### `ClosestHit`

```ts
interface ClosestHit
```

**Properties**

| Name | Type | Default | Description |
| --- | --- | --- | --- |
| `t` | `number` |  | Fraction along the path, 0-1. |
| `point` | `Point` |  |  |
| `distance` | `number` |  |  |

### `GrafloriaCollabOptions`

The uniform collab contract every Grafloria wrapper shares.

```ts
interface GrafloriaCollabOptions
```

**Properties**

| Name | Type | Default | Description |
| --- | --- | --- | --- |
| `transport` | `SyncTransport` |  |  |
| `actor` | `string` |  |  |
| `presence?` | `boolean \| BindPresenceOptions` |  | Live cursors + remote selection outlines. `true` for defaults. |

### `GrafloriaLayoutRequest`

Request shape for the declarative `[layout]` input / `applyLayout()`.

```ts
interface GrafloriaLayoutRequest
```

**Properties**

| Name | Type | Default | Description |
| --- | --- | --- | --- |
| `name` | `string` |  | Registry layout name: 'elk' \| 'dagre' \| 'force' \| 'tree' \| 'grid' \| 'auto' \| … |
| `options?` | `Record<string, unknown>` |  |  |

### `GrafloriaWidgetTemplateContext`

Template context for `<ng-template grafloriaWidget>` widget templates.

```ts
interface GrafloriaWidgetTemplateContext
```

**Properties**

| Name | Type | Default | Description |
| --- | --- | --- | --- |
| `$implicit` | `DashboardWidgetSpec` |  |  |
| `data` | `Record<string, unknown>` |  |  |

### `InsertNodeOnEdgeOptions`

```ts
interface InsertNodeOnEdgeOptions
```

**Properties**

| Name | Type | Default | Description |
| --- | --- | --- | --- |
| `nodeType?` | `string` |  | Type of the node dropped onto the edge (default `'basic'`). |
| `size?` | `{ width: number; height: number }` |  | Size of the inserted node (default 100×50). |
| `data?` | `Record<string, any>` |  | Seed data/label for the new node. |
| `label?` | `string` |  | Label written to the node's `label` metadata (what most shapes render). |
| `configure?` | `(node: NodeModel) => void` |  | Hook to customise the node before it is committed (set style, ports, …). |

### `LinkActionContext`

Card B — what a link-toolbar button is handed.

Unlike a node action (which only needs the node), an edge action needs to
know WHERE on the edge it was invoked: "insert node here" is meaningless
without the split point.

```ts
interface LinkActionContext
```

**Properties**

| Name | Type | Default | Description |
| --- | --- | --- | --- |
| `link` | `LinkModel` |  |  |
| `engine` | `DiagramEngine` |  |  |
| `t` | `number` |  | Fraction along the RENDERED path where the toolbar sits (0-1). |
| `point` | `Point` |  | World-space point at `t` — i.e. exactly under the button the user pressed. |
| `tangent?` | `Point` |  | Unit direction of travel at `t`; decides which sides an inserted node connects on. |

### `LinkToolbarAction`

Mirrors node-toolbar's ToolbarAction, retyped around LinkActionContext. (Same shape, same rendering contract, same keyboard handling.)

```ts
interface LinkToolbarAction
```

**Properties**

| Name | Type | Default | Description |
| --- | --- | --- | --- |
| `id` | `string` |  |  |
| `label` | `string` |  |  |
| `icon?` | `string` |  |  |
| `tooltip?` | `string` |  |  |
| `disabled?` | `boolean` |  |  |
| `hidden?` | `boolean` |  |  |
| `visible?` | `(ctx: LinkActionContext) => boolean` |  |  |
| `onClick` | `(ctx: LinkActionContext) => void` |  |  |
| `group?` | `string` |  |  |
| `shortcut?` | `string` |  |  |

### `NodeToolbarConfig`

Comprehensive configuration object for NodeToolbar

```ts
interface NodeToolbarConfig
```

**Properties**

| Name | Type | Default | Description |
| --- | --- | --- | --- |
| `position?` | `ToolbarPosition` |  |  |
| `alignment?` | `ToolbarAlignment` |  |  |
| `offset?` | `number` |  |  |
| `actions?` | `ToolbarAction[]` |  |  |
| `actionGroups?` | `ToolbarActionGroup[]` |  |  |
| `template?` | `TemplateRef<any>` |  |  |
| `style?` | `ToolbarStyleConfig` |  |  |
| `animation?` | `ToolbarAnimationConfig` |  |  |
| `behavior?` | `ToolbarBehaviorConfig` |  |  |
| `ariaLabel?` | `string` |  |  |
| `positioningStrategy?` | `PositioningStrategy` |  |  |

### `Point`

```ts
interface Point
```

**Properties**

| Name | Type | Default | Description |
| --- | --- | --- | --- |
| `x` | `number` |  |  |
| `y` | `number` |  |  |

### `PropertyPanelChangeEvent`

Property panel change event (UI-level event).

```ts
interface PropertyPanelChangeEvent
```

**Properties**

| Name | Type | Default | Description |
| --- | --- | --- | --- |
| `nodes` | `PropertyDiagramNode[]` |  |  |
| `property` | `string` |  |  |
| `value` | `any` |  |  |

### `SaveEvent`

Save event.

```ts
interface SaveEvent
```

**Properties**

| Name | Type | Default | Description |
| --- | --- | --- | --- |
| `nodes` | `PropertyDiagramNode[]` |  |  |
| `changes` | `Record<string, any>` |  |  |

### `ToolbarAction`

```ts
interface ToolbarAction
```

**Properties**

| Name | Type | Default | Description |
| --- | --- | --- | --- |
| `id` | `string` |  |  |
| `label` | `string` |  |  |
| `icon?` | `string` |  |  |
| `tooltip?` | `string` |  |  |
| `disabled?` | `boolean` |  |  |
| `hidden?` | `boolean` |  |  |
| `visible?` | `(node: NodeModel) => boolean` |  |  |
| `onClick` | `(node: NodeModel) => void` |  |  |
| `group?` | `string` |  |  |
| `shortcut?` | `string` |  |  |

### `ToolbarActionGroup`

Toolbar Action Group
Organizes actions into logical groups with visual separators

```ts
interface ToolbarActionGroup
```

**Properties**

| Name | Type | Default | Description |
| --- | --- | --- | --- |
| `id` | `string` |  |  |
| `label?` | `string` |  |  |
| `actions` | `ToolbarAction[]` |  |  |
| `separator?` | `'before' \| 'after' \| 'both' \| 'none'` |  |  |

### `ToolbarAnimationConfig`

```ts
interface ToolbarAnimationConfig
```

**Properties**

| Name | Type | Default | Description |
| --- | --- | --- | --- |
| `enabled?` | `boolean` |  |  |
| `duration?` | `string` |  |  |
| `easing?` | `string` |  |  |
| `preset?` | `AnimationPreset` |  |  |

### `ToolbarBehaviorConfig`

```ts
interface ToolbarBehaviorConfig
```

**Properties**

| Name | Type | Default | Description |
| --- | --- | --- | --- |
| `autoHide?` | `boolean` |  |  |
| `closeOnClickOutside?` | `boolean` |  |  |
| `followNode?` | `boolean` |  |  |
| `enableKeyboardNav?` | `boolean` |  |  |
| `hideOnMultiSelect?` | `boolean` |  |  |
| `showAs?` | `'toolbar' \| 'contextMenu' \| 'both'` |  |  |
| `contextMenuTrigger?` | `'rightClick' \| 'longPress' \| 'both'` |  |  |

### `ToolbarConfig`

```ts
interface ToolbarConfig
```

**Properties**

| Name | Type | Default | Description |
| --- | --- | --- | --- |
| `position?` | `ToolbarPosition` |  |  |
| `alignment?` | `ToolbarAlignment` |  |  |
| `actions?` | `ToolbarAction[]` |  |  |
| `template?` | `TemplateRef<any>` |  |  |
| `offset?` | `number` |  |  |
| `canvasElement?` | `HTMLElement` |  |  |
| `viewport?` | `{ x: number; y: number; width: number; height: number }` |  |  |
| `zoom?` | `number` |  |  |
| `behavior?` | `ToolbarBehaviorConfig` |  |  |
| `style?` | `ToolbarStyleConfig` |  |  |

### `ToolbarStyleConfig`

```ts
interface ToolbarStyleConfig
```

**Properties**

| Name | Type | Default | Description |
| --- | --- | --- | --- |
| `backgroundColor?` | `string` |  |  |
| `borderColor?` | `string` |  |  |
| `borderRadius?` | `string` |  |  |
| `boxShadow?` | `string` |  |  |
| `padding?` | `string` |  |  |
| `zIndex?` | `number` |  |  |
| `transitionDuration?` | `string` |  |  |

### `ValidationErrorEvent`

Validation error event.

```ts
interface ValidationErrorEvent
```

**Properties**

| Name | Type | Default | Description |
| --- | --- | --- | --- |
| `property` | `string` |  |  |
| `errors` | `string[]` |  |  |