DataCanvas Demo

Every screen in this demo is a single <EntityScreen /> component. The grid, form, validation, lookups, search, sorting, pagination and the API behind them are all generated from entity metadata.

Customers

CRUD screen with an email field, a boolean flag and a Country lookup.

Countries

The simplest possible entity — two text fields and a generated API.

Orders

Master/detail: select an order to manage its order items.

export const Customer = entity("customers", {
  id: field.uuid().primary(),
  name: field.text().required(),
  email: field.email().required(),
  countryId: field.lookup(Country, { label: "name" }),
});

export default function CustomersPage() {
  return <EntityScreen entity={Customer} />;
}