Yaltopia-Tickets-App/components/ui/card.tsx
2026-03-01 14:43:12 +03:00

81 lines
1.7 KiB
TypeScript

import { Text, TextClassContext } from "@/components/ui/text";
import { cn } from "@/lib/utils";
import { View, type ViewProps } from "react-native";
import { ShadowWrapper } from "../ShadowWrapper";
function Card({ className, ...props }: ViewProps & React.RefAttributes<View>) {
return (
<TextClassContext.Provider value="text-card-foreground">
<ShadowWrapper>
<View
className={cn("bg-card flex flex-col gap-4 rounded-xl ", className)}
{...props}
/>
</ShadowWrapper>
</TextClassContext.Provider>
);
}
function CardHeader({
className,
...props
}: ViewProps & React.RefAttributes<View>) {
return (
<View className={cn("flex flex-col gap-1.5 px-6", className)} {...props} />
);
}
function CardTitle({
className,
...props
}: React.ComponentProps<typeof Text> & React.RefAttributes<Text>) {
return (
<Text
role="heading"
aria-level={3}
className={cn("font-semibold leading-none", className)}
{...props}
/>
);
}
function CardDescription({
className,
...props
}: React.ComponentProps<typeof Text> & React.RefAttributes<Text>) {
return (
<Text
className={cn("text-muted-foreground text-sm", className)}
{...props}
/>
);
}
function CardContent({
className,
...props
}: ViewProps & React.RefAttributes<View>) {
return <View className={cn("px-4", className)} {...props} />;
}
function CardFooter({
className,
...props
}: ViewProps & React.RefAttributes<View>) {
return (
<View
className={cn("flex flex-row items-center px-6", className)}
{...props}
/>
);
}
export {
Card,
CardContent,
CardDescription,
CardFooter,
CardHeader,
CardTitle,
};