Buttongroups3

1import { Button } from "@/ui/button";
2import {
3  ChevronLeft,
4  ChevronRight,
5  TextAlignCenter,
6  TextAlignLeft,
7  TextAlignRight,
8} from "@mynaui/icons-react";
9 
10export default function SharedBorder() {
11  return (
12    <>
13      <div className="relative z-0 flex space-x-0.5 rounded border border-border p-1">
14        <Button>
15          <ChevronLeft className="size-5" />
16        </Button>
17        <Button variant="ghost">
18          <ChevronRight className="size-5" />
19        </Button>
20      </div>
21      <div className="relative z-0 flex space-x-0.5 rounded border border-border p-1">
22        <Button>
23          <TextAlignLeft className="size-5" />
24        </Button>
25        <Button variant="ghost">
26          <TextAlignCenter className="size-5" />
27        </Button>
28        <Button variant="ghost">
29          <TextAlignRight className="size-5" />
30        </Button>
31      </div>
32    </>
33  );
34}