fix(mobile): check for responsiveness, add scrollarea support

This commit is contained in:
Amruth Pillai
2023-11-14 11:43:28 +01:00
parent 6303071410
commit 888b4db0bb
40 changed files with 491 additions and 397 deletions

View File

@ -5,22 +5,35 @@ import { forwardRef } from "react";
export const ScrollArea = forwardRef<
React.ElementRef<typeof ScrollAreaPrimitive.Root>,
React.ComponentPropsWithoutRef<typeof ScrollAreaPrimitive.Root> & {
hideScrollbar?: boolean;
orientation?: "vertical" | "horizontal";
}
>(({ type = "scroll", orientation = "vertical", className, children, ...props }, ref) => (
<ScrollAreaPrimitive.Root
ref={ref}
type={type}
className={cn("relative overflow-hidden", className)}
{...props}
>
<ScrollAreaPrimitive.Viewport className="h-full w-full rounded-[inherit]">
{children}
</ScrollAreaPrimitive.Viewport>
<ScrollBar orientation={orientation} />
<ScrollAreaPrimitive.Corner />
</ScrollAreaPrimitive.Root>
));
>(
(
{
type = "scroll",
orientation = "vertical",
hideScrollbar = false,
className,
children,
...props
},
ref,
) => (
<ScrollAreaPrimitive.Root
ref={ref}
type={type}
className={cn("relative overflow-hidden", className)}
{...props}
>
<ScrollAreaPrimitive.Viewport className="h-full w-full rounded-[inherit]">
{children}
</ScrollAreaPrimitive.Viewport>
<ScrollBar orientation={orientation} className={cn(hideScrollbar && "opacity-0")} />
<ScrollAreaPrimitive.Corner />
</ScrollAreaPrimitive.Root>
),
);
ScrollArea.displayName = ScrollAreaPrimitive.Root.displayName;