React UI

The @spaceinvoices/react-ui package provides a CLI-backed React UI kit for building invoicing applications. Unlike traditional packages, these components are designed to be copied into your project for full ownership and customization.

Philosophy

• Full ownership — Modify freely without breaking changes
• Complete customization — Change behavior and structure
• No version conflicts — You control when to update
• Zero lock-in — Components work standalone in your codebase

Choose This Path If

• you are already shipping React
• you want faster delivery than building every invoicing screen yourself
• you still want to own, restyle, and extend the component code
• you need tighter product integration than an iframe can give you

Tradeoff

You still need to wire providers, data fetching, and your design system. If you want less frontend ownership, use the Embed SDK. If you want lower-level control, use the JavaScript SDK.

What’s Included

Category	Components
Invoices	Installable list and create flows
Customers	Management, search, forms
Items	Product/service catalog
Payments	Payment recording flows
Estimates	Quote creation, conversion
Dashboard	Revenue charts, stats
Entities	Business settings

Quick Example

import { CustomerListTable } from "@/components/space-invoices/customers";
import { useEntities } from "@/providers/entities-provider";

function CustomersPage() {
  const { activeEntity } = useEntities();

  return (
    <CustomerListTable
      entityId={activeEntity.id}
      onRowClick={(customer) => console.log("Selected:", customer)}
    />
  );
}

Next Steps

1. Getting Started — understand the ownership model
2. Installation — install dependencies
3. Provider Setup — connect entities and auth
4. Components — choose the screens you actually need
5. Customization — adapt structure, behavior, and styles