Create form

A new-project form with a URL derived from the name, visibility as radio cards, and validation that replaces a hint with its error.

Installation

1. Install a design system if the project does not have one yet: Cueit, Skita or Folio.
2. Add the block. It installs to components/satori-ui/blocks/ with the shadcn/ui primitives it uses.
npx shadcn@latest add @satoriui/form-01
3. Render it inside the system's scope. With the scope class on <html> there is nothing more to do. To try another system, change the class.
app/page.tsx
```
1
2
3
4
5
import { Form01 } from "@/components/satori-ui/blocks/form-01";
export default function Page() {
  return <Form01 />;
}
```

It is built from shadcn/ui primitives, Button, Card, Checkbox, Input, Label, Radio group and Textarea, which every design system re-skins.

For what shadcn has no name for, it uses 5 of the shared contract utilities. Every system defines them identically and sets the variables they read.