p-group-9

PreviousNext

Vertical group

Docs
cossblock

Preview

Loading preview…
registry/default/particles/p-group-9.tsx
import { ZoomInIcon, ZoomOutIcon } from "lucide-react";

import { Button } from "@/registry/default/ui/button";
import { Group, GroupSeparator } from "@/registry/default/ui/group";

export default function Particle() {
  return (
    <Group aria-label="Zoom controls" orientation="vertical">
      <Button aria-label="Zoom in" size="icon" variant="outline">
        <ZoomInIcon />
      </Button>
      <GroupSeparator orientation="horizontal" />
      <Button aria-label="Zoom Out" size="icon" variant="outline">
        <ZoomOutIcon />
      </Button>
    </Group>
  );
}

Installation

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

Usage

import { PGroup9 } from "@/components/p-group-9"
<PGroup9 />