LukeParke/better-auth
1
0
Fork 0
mirror of https://github.com/LukeHagar/better-auth.git synced 2025-12-09 20:27:44 +00:00
Code Issues Packages Projects Releases Wiki Activity

refactor: migrate UI components to React 19

Browse Source
This commit is contained in:
Bereket Engida
2025-03-04 20:29:25 +03:00
parent 232f565cb7
commit 210c20eb65
42 changed files with 2456 additions and 2031 deletions
Download Patch File Download Diff File Expand all files Collapse all files

117
demo/nextjs/components/ui/drawer.tsx
View File

@@ -22,37 +22,44 @@ const DrawerPortal = DrawerPrimitive.Portal;
const DrawerClose = DrawerPrimitive.Close;
const DrawerOverlay = React.forwardRef<
React.ElementRef<typeof DrawerPrimitive.Overlay>,
React.ComponentPropsWithoutRef<typeof DrawerPrimitive.Overlay>
>(({ className, ...props }, ref) => (
<DrawerPrimitive.Overlay
ref={ref}
className={cn("fixed inset-0 z-50 bg-black/80", className)}
{...props}
/>
));
const DrawerOverlay = (
{
ref,
className,
...props
}: React.ComponentPropsWithoutRef<typeof DrawerPrimitive.Overlay> & {
ref: React.RefObject<React.ElementRef<typeof DrawerPrimitive.Overlay>>;
}
) => (<DrawerPrimitive.Overlay
ref={ref}
className={cn("fixed inset-0 z-50 bg-black/80", className)}
{...props}
/>);
DrawerOverlay.displayName = DrawerPrimitive.Overlay.displayName;
const DrawerContent = React.forwardRef<
React.ElementRef<typeof DrawerPrimitive.Content>,
React.ComponentPropsWithoutRef<typeof DrawerPrimitive.Content>
>(({ className, children, ...props }, ref) => (
<DrawerPortal>
<DrawerOverlay />
<DrawerPrimitive.Content
ref={ref}
className={cn(
"fixed inset-x-0 bottom-0 z-50 mt-24 flex h-auto flex-col rounded-t-[10px] border bg-background",
className,
)}
{...props}
>
<div className="mx-auto mt-4 h-2 w-[100px] rounded-full bg-muted" />
{children}
</DrawerPrimitive.Content>
</DrawerPortal>
));
const DrawerContent = (
{
ref,
className,
children,
...props
}: React.ComponentPropsWithoutRef<typeof DrawerPrimitive.Content> & {
ref: React.RefObject<React.ElementRef<typeof DrawerPrimitive.Content>>;
}
) => (<DrawerPortal>
<DrawerOverlay />
<DrawerPrimitive.Content
ref={ref}
className={cn(
"fixed inset-x-0 bottom-0 z-50 mt-24 flex h-auto flex-col rounded-t-[10px] border bg-background",
className,
)}
{...props}
>
<div className="mx-auto mt-4 h-2 w-[100px] rounded-full bg-muted" />
{children}
</DrawerPrimitive.Content>
</DrawerPortal>);
DrawerContent.displayName = "DrawerContent";
const DrawerHeader = ({
@@ -77,31 +84,37 @@ const DrawerFooter = ({
);
DrawerFooter.displayName = "DrawerFooter";
const DrawerTitle = React.forwardRef<
React.ElementRef<typeof DrawerPrimitive.Title>,
React.ComponentPropsWithoutRef<typeof DrawerPrimitive.Title>
>(({ className, ...props }, ref) => (
<DrawerPrimitive.Title
ref={ref}
className={cn(
"text-lg font-semibold leading-none tracking-tight",
className,
)}
{...props}
/>
));
const DrawerTitle = (
{
ref,
className,
...props
}: React.ComponentPropsWithoutRef<typeof DrawerPrimitive.Title> & {
ref: React.RefObject<React.ElementRef<typeof DrawerPrimitive.Title>>;
}
) => (<DrawerPrimitive.Title
ref={ref}
className={cn(
"text-lg font-semibold leading-none tracking-tight",
className,
)}
{...props}
/>);
DrawerTitle.displayName = DrawerPrimitive.Title.displayName;
const DrawerDescription = React.forwardRef<
React.ElementRef<typeof DrawerPrimitive.Description>,
React.ComponentPropsWithoutRef<typeof DrawerPrimitive.Description>
>(({ className, ...props }, ref) => (
<DrawerPrimitive.Description
ref={ref}
className={cn("text-sm text-muted-foreground", className)}
{...props}
/>
));
const DrawerDescription = (
{
ref,
className,
...props
}: React.ComponentPropsWithoutRef<typeof DrawerPrimitive.Description> & {
ref: React.RefObject<React.ElementRef<typeof DrawerPrimitive.Description>>;
}
) => (<DrawerPrimitive.Description
ref={ref}
className={cn("text-sm text-muted-foreground", className)}
{...props}
/>);
DrawerDescription.displayName = DrawerPrimitive.Description.displayName;
export {