gridla

    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. It accepts every SolveOptions field as a prop, works controlled or uncontrolled, and exposes actions through context.

    import { applyMeasuredSize, createStore, GridProvider } from 'gridla/react'
import type { GridProviderProps, Store } from 'gridla/react'
    ExportKindSummary
    applyMeasuredSizefunctionUpdate the measured size.
    createStorefunctionCreate a Store holding initial.
    GridProvidercomponentOwns layout state and gesture state for one canvas.
    GridProviderPropstypeProps for GridProvider: every SolveOptions field, a controlled or uncontrolled layout, change and transfer callbacks, and GridProviderConfig overrides.
    StoretypeMinimal external store: a snapshot getter, a subscribe function, and a setter.

    Functions

    applyMeasuredSize

    function · react/provider.tsx:111

    Update the measured size. Used by GridCanvas; exposed for custom canvases.

    export function applyMeasuredSize<TData>(
  store: Store<GridState<TData>>,
  size: GridSize | null,
  config: GridProviderConfig,
)

    createStore

    function · react/store.ts:14

    Create a Store holding initial. Listeners fire only when set changes the state reference (compared with Object.is).

    export function createStore<S>(initial: S): Store<S>

    Components

    GridProvider

    component · react/provider.tsx:53

    Owns layout state and gesture state for one canvas. Place a GridCanvas (or your own element wired with useGridInteraction) inside it. A binding over createGridController from gridla/interaction.

    export function GridProvider<TData = unknown>(props: GridProviderProps<TData>)

    Types

    GridProviderProps

    type · react/provider.tsx:21

    Props for GridProvider: every SolveOptions field, a controlled or uncontrolled layout, change and transfer callbacks, and GridProviderConfig overrides.

    export type GridProviderProps<TData = unknown> = SolveOptions & {
  /** 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?: (layout: GridLayout<TData>, detail: GridChangeDetail) => void
  /** Fires with the solver strategy on every accepted interactive commit. */
  onCommit?: (detail: GridChangeDetail) => void
  /** Called when an item moves to another canvas inside a `GridTransferScope`. */
  onTransferOut?: (itemId: string, targetId: string) => void
  /** Called when an item arrives from another canvas. */
  onTransferIn?: (item: GridItem<TData>, sourceId: string) => void
  /** Whether items from other canvases may be dropped here. Default `true`. */
  acceptTransfers?: boolean | ((item: GridItem<TData>, sourceId: string) => boolean)
  responsive?: boolean
  dragThreshold?: number
  keyboardStep?: number
  /** Controlled selection. */
  selectedId?: string | null
  onSelectedIdChange?: (itemId: string | null) => void
  children?: ReactNode
}
    MemberTypeDescription
    layout?GridLayout\<TData\>Controlled layout. Pair with onLayoutChange.
    defaultLayout?GridLayout\<TData\>Initial layout for uncontrolled use.
    onLayoutChange?((layout: GridLayout\<TData\>, detail: GridChangeDetail) =\> void)Called with the next layout after every accepted change. The layout is expressed in the canvas size it was rendered at.
    onCommit?((detail: GridChangeDetail) =\> void)Fires with the solver strategy on every accepted interactive commit.
    onTransferOut?((itemId: string, targetId: string) =\> void)Called when an item moves to another canvas inside a GridTransferScope.
    onTransferIn?((item: GridItem\<TData\>, sourceId: string) =\> void)Called when an item arrives from another canvas.
    acceptTransfers?`boolean \((item: GridItem<TData>, sourceId: string) => boolean)`
    responsive?boolean
    dragThreshold?number
    keyboardStep?number
    selectedId?`string \null`
    onSelectedIdChange?`((itemId: string \null) => void)`
    children?ReactNode

    Store

    type · react/store.ts:8

    Minimal external store: a snapshot getter, a subscribe function, and a setter. Shaped for useSyncExternalStore. Same shape as GridStore from gridla/interaction.

    export type Store<S> = GridStore<S>
    MemberTypeDescription
    getSnapshot() =\> S
    subscribe(listener: GridStoreListener) =\> () =\> void
    set`(next: S \((prev: S) => S)) => void`