p-input-group-1

PreviousNext

Basic input group

Docs
cossblock

Preview

Loading preview…
registry/default/particles/p-input-group-1.tsx
import { SearchIcon } from "lucide-react";

import {
  InputGroup,
  InputGroupAddon,
  InputGroupInput,
} from "@/registry/default/ui/input-group";

export default function Particle() {
  return (
    <InputGroup>
      <InputGroupInput aria-label="Search" placeholder="Search" type="search" />
      <InputGroupAddon>
        <SearchIcon />
      </InputGroupAddon>
    </InputGroup>
  );
}

Installation

npx shadcn@latest add @coss/p-input-group-1

Usage

import { PInputGroup1 } from "@/components/p-input-group-1"
<PInputGroup1 />