# Interfaces S–V

Import these from `@grafloria/engine`.

## Interfaces

### `SelectionEvent`

```ts
interface SelectionEvent
```

**Properties**

| Name | Type | Default | Description |
| --- | --- | --- | --- |
| `nodes?` | `string[]` |  |  |
| `links?` | `string[]` |  |  |
| `groups?` | `string[]` |  |  |
| `source?` | `'user' \| 'api' \| 'pattern'` |  |  |
| `pattern?` | `string` |  |  |

### `SelfLoopConfig`

SELF-LOOP geometry (source node === target node). The loop
leaves the source port, bulges away from the node body and re-enters at the
target port. Several self-loops on the same node nest concentrically
(`size + i * spacing`), so each keeps its own label slot.

```ts
interface SelfLoopConfig
```

**Properties**

| Name | Type | Default | Description |
| --- | --- | --- | --- |
| `size?` | `number` |  | How far the loop bulges away from the node body (px). Default 40. |
| `width?` | `number` |  | Lateral span of the loop along the node's side (px). Only used when the source and target attachment points coincide (or nearly do) — the two ends are spread by this much so the loop has a body. Default = `size`. |
| `spacing?` | `number` |  | Extra size added per additional self-loop on the same node (px). Default 18. |
| `side?` | `'auto' \| 'top' \| 'right' \| 'bottom' \| 'left'` |  | Force the side the loop bulges out of. `'auto'` (default) uses the source port's own side. |

### `SerializedEntity`

```ts
interface SerializedEntity
```

**Properties**

| Name | Type | Default | Description |
| --- | --- | --- | --- |
| `id` | `string` |  |  |
| `uuid` | `string` |  |  |
| `type` | `string` |  |  |
| `version` | `number` |  |  |
| `metadata` | `Record<string, any>` |  |  |

### `SerializedFlexItemConfig`

Serialized flex item configuration

```ts
interface SerializedFlexItemConfig
```

**Properties**

| Name | Type | Default | Description |
| --- | --- | --- | --- |
| `order?` | `number` |  |  |
| `flexGrow?` | `number` |  |  |
| `flexShrink?` | `number` |  |  |
| `flexBasis?` | `number \| 'auto'` |  |  |
| `alignSelf?` | `string` |  |  |

### `SerializedGridItemConfig`

Serialized grid item configuration

```ts
interface SerializedGridItemConfig
```

**Properties**

| Name | Type | Default | Description |
| --- | --- | --- | --- |
| `columnStart?` | `number \| 'auto'` |  |  |
| `columnEnd?` | `number \| 'auto'` |  |  |
| `rowStart?` | `number \| 'auto'` |  |  |
| `rowEnd?` | `number \| 'auto'` |  |  |
| `gridArea?` | `string` |  |  |
| `justifySelf?` | `string` |  |  |
| `alignSelf?` | `string` |  |  |

### `SerializedLayoutConfig`

Serialized layout configuration

```ts
interface SerializedLayoutConfig
```

**Properties**

| Name | Type | Default | Description |
| --- | --- | --- | --- |
| `type` | `LayoutType` |  |  |
| `config?` | `LayoutConfig` |  |  |

### `Shadow`

```ts
interface Shadow
```

**Properties**

| Name | Type | Default | Description |
| --- | --- | --- | --- |
| `offsetX` | `number` |  |  |
| `offsetY` | `number` |  |  |
| `blur` | `number` |  |  |
| `color` | `string` |  |  |

### `Size`

```ts
interface Size
```

**Properties**

| Name | Type | Default | Description |
| --- | --- | --- | --- |
| `width` | `number` |  |  |
| `height` | `number` |  |  |
| `depth?` | `number` |  |  |

### `Transform`

```ts
interface Transform
```

**Properties**

| Name | Type | Default | Description |
| --- | --- | --- | --- |
| `position` | `Point` |  |  |
| `rotation` | `number` |  |  |
| `scale` | `Point` |  |  |
| `origin` | `Point` |  |  |

### `TransformMatrix`

2D Affine Transform Matrix
Represents: translate, rotate, scale, skew
CSS-compatible format: matrix(a, b, c, d, e, f)

Matrix structure:
| a  c  e |
| b  d  f |
| 0  0  1 |

Where:
- a, d: Scale X and Y (also affected by rotation/skew)
- b, c: Rotation and skew components
- e, f: Translation X and Y

```ts
interface TransformMatrix
```

**Properties**

| Name | Type | Default | Description |
| --- | --- | --- | --- |
| `a` | `number` |  |  |
| `b` | `number` |  |  |
| `c` | `number` |  |  |
| `d` | `number` |  |  |
| `e` | `number` |  |  |
| `f` | `number` |  |  |

### `ValidationError`

```ts
interface ValidationError
```

**Properties**

| Name | Type | Default | Description |
| --- | --- | --- | --- |
| `path` | `string` |  |  |
| `message` | `string` |  |  |
| `code` | `string` |  |  |
| `severity` | `'error'` |  |  |

### `ValidationEvent`

```ts
interface ValidationEvent
```

**Properties**

| Name | Type | Default | Description |
| --- | --- | --- | --- |
| `type` | `'diagram' \| 'node' \| 'link' \| 'port' \| 'group'` |  |  |
| `entityId?` | `string` |  |  |
| `result?` | `any` |  |  |
| `timestamp?` | `number` |  |  |

### `ValidationResult`

```ts
interface ValidationResult
```

**Properties**

| Name | Type | Default | Description |
| --- | --- | --- | --- |
| `valid` | `boolean` |  |  |
| `errors` | `ValidationError[]` |  |  |
| `warnings` | `ValidationWarning[]` |  |  |

### `ValidationWarning`

```ts
interface ValidationWarning
```

**Properties**

| Name | Type | Default | Description |
| --- | --- | --- | --- |
| `path` | `string` |  |  |
| `message` | `string` |  |  |
| `code` | `string` |  |  |
| `severity` | `'warning'` |  |  |

### `Viewport`

```ts
interface Viewport
```

**Properties**

| Name | Type | Default | Description |
| --- | --- | --- | --- |
| `x` | `number` |  |  |
| `y` | `number` |  |  |
| `zoom` | `number` |  |  |
| `rotation` | `number` |  |  |
| `width?` | `number` |  |  |
| `height?` | `number` |  |  |

### `ViewportEvent`

```ts
interface ViewportEvent
```

**Properties**

| Name | Type | Default | Description |
| --- | --- | --- | --- |
| `zoom?` | `number` |  |  |
| `position?` | `{ x: number; y: number }` |  |  |
| `settings?` | `any` |  |  |
