Types
Generated by website/scripts/generate-api.ts from packages/gridla/src. Do not edit by hand; run bun run generate in website/.
Output payloads, application options, and the state, action, and change types shared with the other adapters.
import { } from 'gridla/angular'
import type { GridActions, GridChangeDetail, GridChangeReason, GridControllerConfig, GridInteraction, GridInteractionMode, GridlaOptions, GridLayoutChangeEvent, GridPreview, GridState, GridTransferInEvent, GridTransferOutEvent } from 'gridla/angular'
Types
GridActions
type · interaction/types.ts:99
Imperative layout and selection API exposed by the controller. The object is
stable for the controller's lifetime.
export type GridActions<TData = unknown> = {
/** Replace the whole layout. */
setLayout: (layout: GridLayout<TData>) => void
/** Move an item programmatically. Returns whether the solver accepted it. */
move: (itemId: string, position: GridPoint, options?: SolveOptions) => boolean
/** Resize an item programmatically. */
resize: (
itemId: string,
change: { edge: GridResizeEdge; delta: GridPoint } | { rect: Partial<GridRect> },
options?: SolveOptions,
) => boolean
/** Insert an item at a position or centered on a pointer. */
place: (
item: NewGridItem<TData>,
at: { position: GridPoint } | { pointer: GridPoint },
options?: SolveOptions,
) => boolean
remove: (itemId: string) => void
/** Patch an item's fields (constraints, policy, data). Geometry is re-clamped. */
update: (itemId: string, patch: Partial<GridItem<TData>>) => void
select: (itemId: string | null) => void
/** Cancel the gesture in progress without committing. */
cancel: () => void
/**
* Preview a new item (for example one dragged from a palette) centered on a
* pointer position in canvas pixels. Returns the preview, or `null` when it
* cannot be placed. Follow up with `commitIncoming` or `clearIncoming`.
*/
previewIncoming: (item: GridItem<TData>, pointer: GridPoint) => GridPreview<TData> | null
/** Commit the incoming preview into the layout. Returns whether one was committed. */
commitIncoming: () => boolean
/** Drop the incoming preview without committing. */
clearIncoming: () => void
}
GridChangeDetail
type · interaction/types.ts:73
Describes an accepted change: the reason, the affected item when there is one,
and the solver strategy for solved operations.
export type GridChangeDetail = {
reason: GridChangeReason
itemId?: string
strategy?: SolveStrategy
}
GridChangeReason
type · interaction/types.ts:60
Why the layout changed, as reported in GridChangeDetail.
export type GridChangeReason =
| 'move'
| 'resize'
| 'place'
| 'remove'
| 'update'
| 'transfer'
| 'set'
GridControllerConfig
type · interaction/types.ts:83
Resolved controller configuration: every SolveOptions field plus the
responsive, drag-threshold, and keyboard-step settings with defaults applied.
export type GridControllerConfig = SolveOptions & {
/**
* Project the layout onto the measured canvas size. When `false`, the
* canvas element is sized to the layout instead. Default `true`.
*/
responsive: boolean
/** Minimum pointer travel before a press becomes a drag. Default `4`. */
dragThreshold: number
/** Pixels moved per arrow key press. Default `8`; Shift multiplies by 4. */
keyboardStep: number
}
GridInteraction
type · interaction/types.ts:17
The gesture currently in progress.
export type GridInteraction = {
itemId: string
mode: GridInteractionMode
edge?: GridResizeEdge
pointerId: number | null
/** Where the pointer grabbed the item, relative to its top-left. */
grabOffset: GridPoint
/** Item rect at gesture start, in rendered canvas pixels. */
origin: GridRect
/** Pointer position at gesture start, in rendered canvas pixels. */
start: GridPoint
}
GridInteractionMode
type · interaction/types.ts:14
Kind of gesture: dragging an item or resizing it.
export type GridInteractionMode = 'move' | 'resize'
GridlaOptions
type · angular/types.ts:47
Application-wide defaults registered with provideGridla. Every field is
optional; a provider's own inputs take precedence.
export type GridlaOptions = SolveOptions & {
/** Project layouts onto the measured canvas size. Default `true`. */
responsive?: boolean
/** Minimum pointer travel before a press becomes a drag. Default `4`. */
dragThreshold?: number
/** Pixels moved per arrow key press. Default `8`. */
keyboardStep?: number
}
GridLayoutChangeEvent
type · angular/types.ts:20
Payload of the provider's layoutChangeDetail output: the next layout plus
the GridChangeDetail that produced it (reason, item id, solver strategy).
The layoutChange output carries the layout alone so [(layout)] works.
export type GridLayoutChangeEvent<TData = unknown> = {
/** The next layout, expressed in the canvas size it was rendered at. */
layout: GridLayout<TData>
/** Why the layout changed. */
change: GridChangeDetail
}
GridPreview
type · interaction/types.ts:31
The solver's latest answer for the gesture in progress.
export type GridPreview<TData = unknown> = {
layout: GridLayout<TData>
item: GridItem<TData>
strategy: SolveStrategy
shiftedSiblings: boolean
accepted: boolean
}
GridState
type · interaction/types.ts:43
Controller state held in the store. layout is what interactions operate on;
source is what the caller owns.
export type GridState<TData = unknown> = {
/** The layout the controller was given (or owns). */
source: GridLayout<TData>
/** Measured canvas element size, or `null` until measured. */
size: GridSize | null
/** `source` projected onto `size`. Interactions operate on this layout. */
layout: GridLayout<TData>
interaction: GridInteraction | null
/** Rect that tracks the pointer during a gesture, in rendered pixels. */
activeRect: GridRect | null
preview: GridPreview<TData> | null
selectedId: string | null
/** True while the active item is being previewed in another canvas. */
transferring: boolean
}
GridTransferInEvent
type · angular/types.ts:28
Payload of the provider's transferIn output: an item arrived from another canvas.
export type GridTransferInEvent<TData = unknown> = {
/** The item as placed in this canvas. */
item: GridItem<TData>
/** Id of the canvas the item came from. */
sourceId: string
}
GridTransferOutEvent
type · angular/types.ts:36
Payload of the provider's transferOut output: an item left for another canvas.
export type GridTransferOutEvent = {
/** Id of the item that left. */
itemId: string
/** Id of the canvas that received it. */
targetId: string
}