For AI agents: the documentation index is at llms.txt. Markdown versions are available by appending .md to any page URL, including this page's markdown.
Aspect ratio constraints
Lock item resizing to a ratio.
How it works
Constraints run on every resize and can rewrite the proposed geometry before it is committed. This example derives the pixel width of one column from useContainerWidth, then forces each item's height to track its width so cards keep a fixed aspect ratio no matter which handle is dragged.
Because the ratio is computed from the live container width, gap, and containerPadding, it stays correct when the grid is resized rather than only at first paint. Reach for this when the content inside a cell has an intrinsic shape — video embeds, image tiles, or map panes.
Installation
npx shadcn@latest add https://blode.co/dnd-grid/r/aspect-ratio-constraints-example.jsonPublished with Edda