Provider
Generated by website/scripts/generate-api.ts from packages/gridla/src. Do not edit by hand; run bun run generate in website/.
GridProvider owns layout and gesture state for one canvas. The server renders the layout from props; on the client a controller is created in a visible task and mirrored into a signal. Callbacks carry the Qwik $ suffix.
import { GridContextId, GridProvider, TransferScopeContextId, useGridContext } from 'gridla/qwik'
import type { GridContextValue, GridProviderProps, GridRuntime, TransferContextValue } from 'gridla/qwik'
Functions
GridProvider
function · qwik/provider.tsx:160
Owns layout state and gesture state for one canvas. Place a GridCanvas
inside it. The server renders the layout at its authored size from props
alone; on the client a GridController from gridla/interaction is created
once the provider is visible and mirrors its store into a signal.
export const GridProvider: Component<GridProviderProps<unknown>>
Hooks
useGridContext
hook · qwik/context.ts:39
Read the nearest GridProvider context. Throws when called outside a provider.
export function useGridContext<TData = unknown>(): GridContextValue<TData>
Constants
GridContextId
const · qwik/context.ts:36
Context id for the nearest GridProvider.
export const GridContextId: ContextId<GridContextValue<unknown>>
TransferScopeContextId
const · qwik/context.ts:56
Context id for the nearest GridTransferScope.
export const TransferScopeContextId: ContextId<TransferContextValue>
Types
GridContextValue
type · qwik/context.ts:29
Value provided by GridProvider: a serializable mirror of the controller
state (so the server render and the resumed client agree) plus the
client-only runtime handles.
export type GridContextValue<TData = unknown> = {
/** Latest `GridState` snapshot. Serializable; updated after every store change. */
state: Signal<GridState<TData>>
runtime: GridRuntime<TData>
}
GridProviderProps
type · qwik/provider.tsx:39
Props for GridProvider. They mirror the React provider; callbacks carry
the Qwik $ suffix because Qwik serializes them as QRLs. acceptTransfers
is a boolean only: the controller needs a synchronous answer and a QRL
resolves asynchronously.
export type GridProviderProps<TData = unknown> = {
/** Controlled layout. Pair with `onLayoutChange$`. */
layout?: GridLayout<TData>
/** Initial layout for uncontrolled use. */
defaultLayout?: GridLayout<TData>
/**
* Called with the next layout after every accepted change. The layout is
* expressed in the canvas size it was rendered at.
*/
onLayoutChange$?: PropFunction<(layout: GridLayout<TData>, detail: GridChangeDetail) => void>
/** Fires with the solver strategy on every accepted interactive commit. */
onCommit$?: PropFunction<(detail: GridChangeDetail) => void>
/** Called when an item moves to another canvas inside a `GridTransferScope`. */
onTransferOut$?: PropFunction<(itemId: string, targetId: string) => void>
/** Called when an item arrives from another canvas. */
onTransferIn$?: PropFunction<(item: GridItem<TData>, sourceId: string) => void>
/** Whether items from other canvases may be dropped here. Default `true`. */
acceptTransfers?: boolean
/** Minimum distance kept between neighbors. Default `0`. */
gap?: number
/** Distance within which edges attract. Default `24`. */
snapDistance?: number
/** When `false`, alignment snapping is skipped. Default `true`. */
snap?: boolean
/** Project the layout 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`; Shift multiplies by 4. */
keyboardStep?: number
/** Controlled selection. */
selectedId?: string | null
onSelectedIdChange$?: PropFunction<(itemId: string | null) => void>
}
GridRuntime
type · qwik/context.ts:13
Client-only handles kept in a Qwik store. Neither the controller nor the
transfer scope can be serialized, so they are created in a visible task and
stored with noSerialize; they are undefined on the server and until the
provider has mounted.
export type GridRuntime<TData = unknown> = {
/** Unique id of this provider. Used by transfer scopes. */
id: string
/** Whether the layout is projected onto the measured canvas size. */
responsive: boolean
/** The controller the provider is built on. Client only. */
controller: NoSerialize<GridController<TData>> | undefined
/** The transfer scope the provider registered with, if any. Client only. */
scope: NoSerialize<TransferScope> | undefined
}
TransferContextValue
type · qwik/context.ts:51
Value provided by GridTransferScope. The scope itself is created lazily
by the first provider that mounts on the client.
export type TransferContextValue = {
scope: NoSerialize<TransferScope> | undefined
}