buzz-sheet/.agents/skills/ordering-with-dnd-kit/SKILL.md

name, description

name	description
ordering-with-dnd-kit	Use the project's installed dnd-kit packages for UI requests involving ordering, reordering, sorting, dragging, or moving items. Applies when a user asks for an orderable or sortable interface, including similar wording.

Ordering with dnd-kit

Implement interactive ordering and reordering with the project's installed dnd-kit libraries:

• Use @dnd-kit/core for drag-and-drop context, sensors, and events.
• Use @dnd-kit/sortable for sortable collections and item movement.
• Use @dnd-kit/utilities for dnd-kit transform helpers when needed.
• Prefer these library APIs over custom pointer handling or native HTML drag-and-drop.
• Preserve the project's existing UI patterns and persist the resulting order through the data flow already used by the feature.

Interpret requests mentioning ordering, reordering, sorting, rearranging, dragging, moving, ranking, or similar item-placement behavior as triggers for this guidance when the request concerns an interactive UI.