Drag-drop columns to reorder

Live in demo 54-columns-hierarchy.

When

Re-order columns by dragging them in a side panel; live grid reflects the new order.

How

Key API surface:

• api.setColumnPinning({...})
• your reordering callback updates the columns prop

See the demo source for the full implementation; this recipe pins the pattern + the surface so you can copy-paste it confidently. The doc page that explains the underlying feature in depth is linked from the recipes index.

See also

• Demo 54-columns-hierarchy source
• Demo 54-columns-hierarchy prompt sidecar - drop into an LLM context window
• Recipes index