Module grid 

2D grids - dashboards, tile galleries, icon views. A grid is a flat Vec displayed in cols columns; dragging a tile onto another either inserts (everything reflows, like a photo gallery) or swaps (tiles trade places, like a dashboard) depending on ReorderMode.

Reuses the sortable vocabulary: drops emit SortEvents you apply with crate::sortable::apply_sort or crate::sortable::apply_swap.

let mut tiles = use_signal(|| (0..12).collect::<Vec<u32>>());
rsx! {
    SortableGrid {
        len: tiles.read().len(),
        cols: 4,
        mode: ReorderMode::Swap,
        render: move |ix: usize| rsx! { Tile { n: tiles.read()[ix] } },
        on_sort: move |ev: SortEvent| apply_swap(&mut tiles.write(), ev),
    }
}

Grid coordinate helpers (cell_of, index_of) are provided for custom layouts and keyboard grid navigation.

Mouse, touch and pen use pointer events via the same gesture machine as crate::core::Draggable, so the browser does not create a native drag image. Tiles carry touch-action: none (grids rarely need to scroll by dragging across their own tiles). The hovered tile is simply the one under the pointer - no hysteresis needed, since tiles don’t shift while you hover in swap/insert grids.

Re-exports

pub use SortableGrid_completions::Component::SortableGrid;

Structs

SortableGridProps

Properties for the SortableGrid component.

Functions

SortableGrid

A grid of tiles reordered (or swapped) by dragging.

cell_of

(row, col) of a flat index in a grid with cols columns.

index_of

Flat index of (row, col) in a grid with cols columns, or None if outside len.