z0x/blog.z0x.ca
Code Activity Actions

refactor(shadcn): use radix-ui mono-package

Browse source
This commit is contained in:
z0x 2025-05-07 08:57:45 -04:00
parent bdece0e21b
commit c0aec29131
5 changed files with 10 additions and 13 deletions
Download patch file Download diff file Expand all files Collapse all files

10
src/components/ui/breadcrumb.tsx
View file

@ -1,6 +1,6 @@
import { cn } from "@/lib/utils";
import { ChevronRightIcon, DotsHorizontalIcon } from "@radix-ui/react-icons";
import { Slot } from "@radix-ui/react-slot";
import { ChevronRight, MoreHorizontal } from "lucide-react";
import { Slot as SlotPrimitive } from "radix-ui";
import type * as React from "react";
function Breadcrumb({ ...props }: React.ComponentProps<"nav">) {
@ -37,7 +37,7 @@ function BreadcrumbLink({
}: React.ComponentProps<"a"> & {
asChild?: boolean;
}) {
const Comp = asChild ? Slot : "a";
const Comp = asChild ? SlotPrimitive.Root : "a";
return (
<Comp
@ -74,7 +74,7 @@ function BreadcrumbSeparator({
className={cn("[&>svg]:size-3.5", className)}
{...props}
>
{children ?? <ChevronRightIcon />}
{children ?? <ChevronRight />}
</li>
);
}
@ -91,7 +91,7 @@ function BreadcrumbEllipsis({
className={cn("flex size-9 items-center justify-center", className)}
{...props}
>
<DotsHorizontalIcon className="size-4" />
<MoreHorizontal className="size-4" />
<span className="sr-only">More</span>
</span>
);

4
src/components/ui/button.tsx
View file

@ -1,5 +1,5 @@
import { Slot } from "@radix-ui/react-slot";
import { type VariantProps, cva } from "class-variance-authority";
import { Slot as SlotPrimitive } from "radix-ui";
import type * as React from "react";
import { cn } from "@/lib/utils";
@ -44,7 +44,7 @@ function Button({
VariantProps<typeof buttonVariants> & {
asChild?: boolean;
}) {
const Comp = asChild ? Slot : "button";
const Comp = asChild ? SlotPrimitive.Root : "button";
return (
<Comp

2
src/components/ui/scroll-area.tsx
View file

@ -1,4 +1,4 @@
import * as ScrollAreaPrimitive from "@radix-ui/react-scroll-area";
import { ScrollArea as ScrollAreaPrimitive } from "radix-ui";
import type * as React from "react";
import { cn } from "@/lib/utils";

2
src/components/ui/separator.tsx
View file

@ -1,4 +1,4 @@
import * as SeparatorPrimitive from "@radix-ui/react-separator";
import { Separator as SeparatorPrimitive } from "radix-ui";
import type * as React from "react";
import { cn } from "@/lib/utils";