UI Publish Flows Catalog

Five complete CMS publish journeys — Draft → Review → Schedule/Publish → Live — with working step transitions. Built for content clients (blogs, docs, marketing sites). See CATALOG.md for recipes.

.pubflow-classic

Classic Stepper

Full-width card with horizontal Draft · Review · Publish · Live progress and Back / Continue.

  1. Draft
  2. Review
  3. Publish
  4. Live
Draft Blog
.pubflow-split

Split Sticky Preview

Left stepped form; right sticky article card + stage checklist. Stacks on narrow.

  1. Draft
  2. Review
  3. Publish
  4. Live

Edit draft

.pubflow-accordion

Accordion Journey

Single page with four <details> sections; future steps stay locked until Continue.

Draft Current
Review
  • Content approved Maya Chen · today
  • Legal / brand No flags
Publish
.pubflow-sheet

Mobile Sheet Stack

Phone-framed CMS flow: draft starts as a bottom sheet, then review → publish → live.

Harbor CMS

Content

Draft

Unsaved
.pubflow-schedule

Schedule Fast Track

Same four stages, but Publish leads with datetime scheduling and channel picks — then lands on “Scheduled” live state.

  1. Draft
  2. Review
  3. Schedule
  4. Live

Quick draft

Short path for timed posts — review light, schedule heavy.