# Shadcn Settings Priority

> Sortable settings priority with frame

- Type: example, free and open source (MIT)
- Component: [Sortable](https://reui.io/components/sortable.md)
- Page: https://reui.io/components/sortable/c-sortable-5
- Docs (Base UI): https://reui.io/docs/components/base/sortable.md
- Docs (Radix UI): https://reui.io/docs/components/radix/sortable.md
- MCP: `get_example("c-sortable-5")`
- Registry item: https://reui.io/r/styles/base-nova/c-sortable-5.json
- Uses: Frame, Sortable, Switch

## Best for

Notification channels ranked by delivery order in a Frame, each row with a Switch that turns the channel on or off

## Agent notes

- Neither `setChannels` nor `toggleChannel` saves anything; send the order and the enabled flags to your API
- The `Switch` on each row has no accessible name; label it with `channel.name`

## When not to use

- A media queue where one entry is marked as now playing: use [Playlist](https://reui.io/components/sortable/c-sortable-4.md) (`get_example("c-sortable-4")`)

## Install

```bash
npx shadcn@latest add @reui/c-sortable-5
```

## About Shadcn Sortable

### When to use

- Ranked lists such as a play queue, notification channels or release tasks, put in order by a grip
- Tile grids such as a media library, where cards change places across rows and columns
- Grouped options and menus reordered in place, such as product variants or sidebar menu entries

### When not to use

- Cards that move between several status columns on one board: use [Kanban](https://reui.io/components/kanban.md) (`get_component("kanban")`)
- Ranked table rows that keep several columns of values lined up: use the [Drag & Drop blocks](https://reui.io/blocks/data-grid/drag-drop.md)
- A whole page layout of sidebar, top bar and content area around the list: use the [App Shell blocks](https://reui.io/blocks/application/app-shell.md)

### Agent notes

- Drag listeners sit on `SortableItemHandle` only, so a `SortableItem` rendered without one cannot be dragged
- Passing `onMove` skips the built-in reorder, so neither `onValueChange` nor `onValueCommit` fires on drop
- The drag preview clones the child of `Sortable` whose `value` matches the dragged item, so a wrapper around `SortableItem` needs that `value` too

Every ReUI item has a twin like this one; the index is https://reui.io/llms.txt. Agents with the ReUI MCP (https://reui.io/docs/mcp) get the same guidance from the getters named above.