iZakcode

Getting Started

Install and use iZakcode components in your project.

A curated shadcn/ui registry of form components built on react-hook-form. Each component is designed to drop into any project that already uses shadcn's tooling — same conventions, same patterns, zero lock-in.

Installation

You need shadcn CLI v4+ and a project already initialised with shadcn init.

Add the registry to your project

Open your components.json and add the iZakcode registry under registries:

components.json
{
  "registries": {
    "@izakcode": "https://shadcn.izakcode.com/r/{name}.json"
  }
}

Install a component

Once the registry is configured you can install any component with the shorthand prefix:

npx shadcn@latest add @izakcode/generic-input

Or use the full registry URL directly:

npx shadcn@latest add https://shadcn.izakcode.com/r/generic-input.json

Dependencies like react-hook-form, lucide-react, and any required shadcn primitives (input, field, etc.) are resolved automatically.


Available Components


Quick Example

Here's what using a registry component looks like in practice:

login-form.tsx
import { FormProvider, useForm } from "react-hook-form"
import { GenericInput } from "@/components/ui/generic-input"
import { Button } from "@/components/ui/button"

export function LoginForm() {
  const form = useForm({
    defaultValues: { email: "", password: "" },
  })

  return (
    <FormProvider {...form}>
      <form onSubmit={form.handleSubmit(console.log)} className="space-y-4">
        <GenericInput name="email" type="email" required />
        <GenericInput name="password" type="password" required />
        <Button type="submit">Sign in</Button>
      </form>
    </FormProvider>
  )
}

Learn More

On this page