CRM template — dir/ui

Companies, people, deals, and reports in a complete CRUD application.

# CRM template

Companies, people, deals, and reports in a complete CRUD application.

## Install

```sh
npx shadcn@4.21.0 add lr-run/dir-ui/crm-example#v0.1.2
```

[Registry item with all source and dependencies](https://github.com/lr-run/dir-ui/blob/v0.1.2/registry.json)

Requires React 19, Tailwind CSS 4 and shadcn initialized with Base UI. Registry target placeholders resolve through components.json: @ui, @components, @hooks and @lib. Imports below use the conventional @/ prefix for illustration; the CLI rewrites them to your configured aliases. Shared components are installed once through registryDependencies. Theme CSS is imported by the UI modules. Existing files are never forcibly overwritten; review CLI conflicts before accepting changes. No Dir runtime is required.

```css
// Theme and grid styles are imported by the installed components.
```

## Entry

```tsx
import { CrmTemplate } from '@/components/crm/template.tsx'

export default function Page() {
  return <div className="h-dvh"><CrmTemplate count={100} basePath="/crm" /></div>
}
```

CrmTemplate includes I18n, Tooltip.Provider, and Toast.Provider. Render on the client in a bounded-height container. basePath defaults to an empty string; count defaults to 100. Configure the host to serve this entry at every route under basePath, including reloads. Records, notes, and saved views reset on reload. No localStorage or backend is installed. Replace example/ with application APIs for persistence; the caller owns permissions.

## Files and routes

Source directory: `components/crm/`.

routes/: route-specific list/detail pages and creation forms. screens/: shared list/detail screens driven by route definitions. layout.tsx: navigation and global search. example/: sample records, query helpers, and in-memory storage.

Routes under basePath: `/companies`, `/companies/:id`, `/people`, `/people/:id`, `/deals`, `/deals/:id`, `/report`