Client approval workflows get complicated long before the UI does.
Roundmark is a source-code React kit for building client review, contextual feedback, revision rounds, and final approval directly into a product. It is a frontend workflow that you integrate into your application, not a hosted approval portal.
Live Demo · Technical Guides · Get Roundmark
This repository is a public technical showcase and overview only. The commercial Roundmark source code is not included. This is not an open-source edition and does not grant a license to the commercial source. Get the paid product at roundmark.dev.
Draft → Review → Changes Requested → Revision → Review → Approved
The important detail is that the second Review is a new review context for a new version. Approval of version 2 must not silently become approval of version 3.
A boolean status loses the context developers and clients need:
- A decision belongs to a specific version and review round.
- Earlier versions remain inspectable instead of inheriting a later approval.
- Comments explain feedback; they are not reviewer decisions.
- Request changes must lead to a deliberate revision and resubmission path.
- An annotation needs stable context, such as normalized coordinates, when a responsive preview changes size.
The result is a workflow that can explain what was reviewed, who decided, and what should happen next.
Roundmark provides a client-side workflow and the source code needed to integrate and control it inside your product:
- React review workspace and approval/review components
- Workflow/domain model and lifecycle transitions
- Version history and review rounds
- Contextual comments, replies, and annotations
- Multi-reviewer decisions, request changes, and revision/resubmission UI
- Final approval states and an approval receipt
- Responsive UI and accessibility work
- Vite and Next.js integration guidance
- Three worked integration examples, documentation, and 238 buyer-facing tests
- Client-review UI
- Workflow/domain model and lifecycle transitions
- Versions and review rounds
- Annotations and comments/replies
- Reviewer decisions and request changes
- Revision/resubmission UI and final approval states
- Examples, documentation, and tests
- Backend and API routes
- Authentication and identity
- Persistence/database
- File and storage layer
- Notifications
- Application-specific authorization and business rules
Roundmark is backend-agnostic by design. Your application remains the authority for identity, access, persistence, and the assets being reviewed.
Your App
│
├── authentication and identity
├── backend / persistence
├── file storage and signed previews
└── authorization and notifications
│
▼
Roundmark integration boundary
│
├── review workspace
├── versions and review rounds
├── comments / annotations
├── reviewer decisions
└── approval lifecycle
The showcase intentionally stays at this public boundary. It does not reproduce the commercial state machine, selectors, reducers, geometry implementation, or test suite.
The exact integration details ship with Roundmark. This small shape shows the ownership boundary without inventing a public component API:
// Conceptual only — exact integration details are included with Roundmark.
function ClientReviewScreen() {
return (
<YourAppShell>
<RoundmarkReviewExperience />
</YourAppShell>
);
}Your app loads the deliverable, authenticates the actor, persists workflow events, authorizes every mutation, and renders the preview asset. Roundmark presents the review experience and reports the user action at the integration boundary.
- Version: the exact deliverable a reviewer saw. A new revision gets a new version.
- Review round: the reviewer set and decisions for one version.
- Annotation: contextual feedback attached to a location in the reviewed preview.
- Reviewer decision: an explicit approval or request for changes, separate from comments.
- Request changes: a review outcome that opens a deliberate revision path.
- Final approval: a recorded sign-off for a specific approved version.
Verified product facts:
- React 19 and TypeScript
- Tailwind CSS 4
- Responsive UI with accessibility work
- Vite and Next.js integration guidance
- Chromium, Firefox, and WebKit verification
- Three integration examples
- 238 buyer-facing tests
- Source code included with purchase
- Backend-agnostic integration model
Roundmark does not provide:
- Backend or authentication
- Database or persistence service
- File hosting, upload, or storage service
- Email or notification backend
- Realtime backend
- Billing
- SaaS hosting
- Customer accounts
It is licensed source code that you integrate and modify within your application.
You can absolutely build this yourself. The work is coordinating version and round identity, contextual feedback, explicit reviewer decisions, revision semantics, responsive states, authorization, and the edge cases around historical work.
Roundmark is for teams that want a finished client-side workflow as source code while keeping their own backend, data, storage, and authorization decisions. The trade-off is ownership and integration work versus rebuilding the shared workflow foundation.
These pages serve different intents:
- React Approval Workflow for Client Review — product and technical category overview
- Client Approval Workflow for React — client-facing review use cases
- How to Build a Client Approval Workflow in React — implementation tutorial
- Individual — $99 one-time
- Team — $249 one-time
- No subscription
See the current product details at roundmark.dev. Checkout is handled by the website; this repository contains no purchase or payment integration.
Explore the workflow in the Roundmark live demo, then read the technical guides for the product boundary and implementation concepts.
This repository contains public documentation and showcase material only. The commercial Roundmark source code is licensed separately under the Roundmark Commercial License.
For legal reference, see the public Terms of Sale and Privacy Policy.