API Index

Use this page to locate a public v2 symbol. Import components, composables, and component contracts from grid-layout-plus. Import DOM-free algorithms from grid-layout-plus/core when you do not need the components or their injected CSS.

Choose an API by task

Task	Start with	Read next
Render an interactive Vue grid	GridLayout and GridItem	Usage
Add a visual grid behind items	GridBackground	Grid Background example
Change a rendered grid from code	GridLayoutExpose	Operation contracts
Build a custom renderer	useGridLayout	Composable example
Manage responsive state without components	useResponsiveLayout	Responsive types
Observe the container width	useContainerWidth	Width property
Validate or normalize Layout data	validateLayout or normalizeLayout	Core API
Handle a rejected operation	OperationRejectedPayload	Rejection reasons
Migrate v1 code	Migration from v1	Properties

Components and component contracts

Public export	Reference
GridLayout	GridLayout properties, events, and methods
GridItem	GridItem properties and events
GridBackground	GridBackground properties
GridLayoutProps, GridItemProps	Properties
GridLayoutEmits, GridItemEmits	Events
GridLayoutExpose, LayoutTransactionReceipt	Methods and transaction receipts
GridLayoutSlots, GridLayoutSlotScope	Slots
GridConfig, DragConfig, ResizeConfig	Grouped configuration
DropConfig, DropCandidate, DropDragOverInput, DropDragOverContext, DropEvaluationResult	Drop types and drop events
LayoutUpdateMeta, ResponsiveWidthState, WidthChangedPayload	Events
InteractionStartPayload, InteractionChangePayload	Interaction events

Layout and extension types

Public export	Reference
LayoutItemRequired, LayoutItem, ReadonlyLayoutItem, Layout, ReadonlyLayout	Layout types
DefaultBreakpoint, Breakpoints	Breakpoint types
ResponsiveValue, ResponsiveLayoutsInput, CompleteResponsiveLayouts	Responsive layout types
Breakpoint, ResponsiveLayout	Deprecated compatibility aliases
CollisionMode	Collision mode
Compactor, CompactType, CompactMinPositions	Compactor contract
PositionStrategy, PositionStyle	Position strategy contract
GridCellDimensions, CalcGridCellDimensionsInput, GridGeometry, PixelRect, ReadonlyClientRect	Geometry types
LayoutOperationResult, LayoutOperationResultBase, AcceptedLayoutOperationResult, RejectedLayoutOperationResult, LayoutOperationReason	Operation results
NormalizeLayoutOptions, DeepReadonly	Core API and Layout types
GridLayoutValidationCode, GridLayoutExtensionCode, GridLayoutExtensionSource	Errors

Composables and headless contracts

Public export	Reference
useGridLayout, UseGridLayoutOptions, UseGridLayoutReturn	useGridLayout
useResponsiveLayout, UseResponsiveLayoutOptions, UseResponsiveLayoutReturn	useResponsiveLayout
useContainerWidth, UseContainerWidthOptions, UseContainerWidthReturn	useContainerWidth
GridDragState, GridResizeState, GridInteractionCandidate	useGridLayout returned state
GridInteractionStart, GridInteractionStartResult, GridInteractionToken	useGridLayout interactions
InteractionCommandResult, InteractionCancelReason	Interaction terminal contract
InteractionTerminalBase, InteractionTerminalPayload	Interaction terminal contract
LayoutChangeReason, OperationRejectedReason, OperationRejectedPayload	Operation contracts
GridLayoutRuntimeError	Runtime errors

Core values

All values in this section are available from both grid-layout-plus and grid-layout-plus/core. Prefer the /core entry for algorithm-only code.

Public export	Reference
validateLayout, normalizeLayout, cloneLayout	Validate and normalize
bottom, collides, getFirstCollision, getAllCollisions, sortLayoutItemsByRowCol	Query a Layout
correctBounds, compact	Bounds and legacy primitives
verticalCompactor, horizontalCompactor, noCompactor	Compactors
fastVerticalCompactor, fastHorizontalCompactor	Compactors
transformStrategy, absoluteStrategy, scaledStrategy	Position strategies
calcGridCellDimensions, gridToPixelRect, pointerToGridPosition, pixelSizeToGridSize	Geometry conversion
GridLayoutValidationError, GridLayoutExtensionError	Errors
moveElement, withOverlap	Deprecated APIs

Import boundaries

import { GridLayout, useGridLayout } from 'grid-layout-plus'
import { normalizeLayout, validateLayout } from 'grid-layout-plus/core'

The root entry injects component CSS. The /core entry has no Vue, DOM, or component CSS dependency. Public APIs not listed here should not be imported from src, es, lib, or another internal path.