Liquid Sortable List

Smooth drag-and-drop sortable team list with generative avatars and spring reordering.

8.5 KB

•

Updated on September 17, 2026

Guillermo RauchFrontend Architect

Marc LouProduct Builder

Pieter LevelsAutonomous Founder

Jony IveDesign Lead

Installation

Bash

pnpm dlx shadcn@latest add @spaceui/components-spaceui-liquid-sortable-list

Code

import { LiquidSortableList } from '@/components/spaceui/liquid-sortable-list'

export default function Example() {
  return <LiquidSortableList />
}

Prop	Type	Default	Description
`items`	SortableMember[]	DEFAULT_MEMBERS	Items with avatars and roles
`onOrderChange`	(items: SortableMember[]) => void	—	Callback when order changes
`title`	string	Reorder Priority	Header title
`corner`	number	20	Card corner radius

MIT License: Free and open-source for personal and commercial use. Feel free to copy, tweak, and adapt the components to match your exact needs.
Credits & Inspiration: Some components on this site are inspired by or recreated from great ideas across the web. I'm not here to take credit; just to learn, experiment, and push interface craft further.
Reach out & Claims: If an attribution was missed, or if you have any inquiry or claim, feel free to reach out directly on X to @adrielzimbril. I'll be glad to update or resolve it right away.

On This Page