∞ forever components

Product Flows

Crate Stock Table

Sortable vinyl inventory table with FLIP row reordering, status filter tabs, and multi-row select pills.

cssmedium complexitymoderate motionpointer+keyboardmobile-readyaccessible

Open on the canvas to copy the code → Free account · 3 copies a day · membership goes unlimited

Live demo — the real component, running in a sandbox. One self-contained HTML file, zero dependencies. Open it on the canvas →
1

When to use it

Compact inventory overviews, crate queues, and order status tables.

When not to

Multi-thousand-row virtualized spreadsheets.

Working with an AI agent

Every component ships agent-ready metadata. An example instruction for this one:

Edit --b/--i/--c/--l tokens in :root and [data-theme="light"].

Safe to edit

  • theme CSS tokens (--b/--i/--c/--l), data arrays & timings

Keep intact

  • IIFE + crNN- prefix, reduced-motion, visibilitychange, theme/demo-v1

Known limitations

  • Demo state resets on remount

data-tableflipsortingfilterinventorycrate

More Product Flows components

  • File Upload DropzoneSimulated file upload with progress rings and completed rows.
  • Profile MenuSimulated account menu with staggered rows and presence changes.
  • Crate Shop OnboardingThree-step record shop setup flow with genre selection chips, curved vinyl-label SVG type, and animated confirmation.
  • Crate Card CheckoutPayment form with live 3D card flip on CVC focus, number formatting, shake validation, and progress-to-paid pill.