p-group-8

PreviousNext

Group with end text

Docs
cossblock

Preview

Loading preview…
registry/default/particles/p-group-8.tsx
import { Group, GroupSeparator, GroupText } from "@/registry/default/ui/group";
import { Input } from "@/registry/default/ui/input";

export default function Particle() {
  return (
    <Group aria-label="Domain input">
      <Input aria-label="Domain" defaultValue="coss" id="domain" type="text" />
      <GroupSeparator />
      <GroupText>.com</GroupText>
    </Group>
  );
}

Installation

npx shadcn@latest add @coss/p-group-8

Usage

import { PGroup8 } from "@/components/p-group-8"
<PGroup8 />