info-card

1"use client";
2 
3import {
4  useState,
5  useRef,
6  useEffect,
7  createContext,
8  useContext,
9  useMemo,
10  useCallback,
11} from "react";
12import { motion, AnimatePresence } from "motion/react";
13import { cn } from "@/lib/utils";
14import React from "react";
15 
16interface InfoCardTitleProps extends React.HTMLAttributes<HTMLDivElement> {
17  children: React.ReactNode;
18}
19 
20interface InfoCardDescriptionProps
21  extends React.HTMLAttributes<HTMLDivElement> {
22  children: React.ReactNode;
23}
24 
25const InfoCardTitle = React.memo(
26  ({ children, className, ...props }: InfoCardTitleProps) => {
27    return (
28      <div className={cn("font-medium mb-1", className)} {...props}>
29        {children}
30      </div>
31    );
32  }
33);
34InfoCardTitle.displayName = "InfoCardTitle";
35 
36const InfoCardDescription = React.memo(
37  ({ children, className, ...props }: InfoCardDescriptionProps) => {
38    return (
39      <div
40        className={cn("text-muted-foreground leading-4", className)}
41        {...props}
42      >
43        {children}
44      </div>
45    );
46  }
47);
48InfoCardDescription.displayName = "InfoCardDescription";
49 
50interface CommonCardProps extends React.HTMLAttributes<HTMLDivElement> {
51  children: React.ReactNode;
52}
53 
54interface InfoCardProps extends React.HTMLAttributes<HTMLDivElement> {
55  children: React.ReactNode;
56  storageKey?: string;
57  dismissType?: "once" | "forever";
58}
59 
60type InfoCardContentProps = CommonCardProps;
61type InfoCardFooterProps = CommonCardProps;
62type InfoCardDismissProps = React.HTMLAttributes<HTMLDivElement> & {
63  children: React.ReactNode;
64  onDismiss?: () => void;
65};
66type InfoCardActionProps = CommonCardProps;
67 
68const InfoCardContent = React.memo(
69  ({ children, className, ...props }: InfoCardContentProps) => {
70    return (
71      <div className={cn("flex flex-col gap-1 text-xs", className)} {...props}>
72        {children}
73      </div>
74    );
75  }
76);
77InfoCardContent.displayName = "InfoCardContent";
78 
79interface MediaItem {
80  type?: "image" | "video";
81  src: string;
82  alt?: string;
83  className?: string;
84  [key: string]: any;
85}
86 
87interface InfoCardMediaProps extends React.HTMLAttributes<HTMLDivElement> {
88  media: MediaItem[];
89  loading?: "eager" | "lazy";
90  shrinkHeight?: number;
91  expandHeight?: number;
92}
93 
94const InfoCardImageContext = createContext<{
95  handleMediaLoad: (mediaSrc: string) => void;
96  setAllImagesLoaded: (loaded: boolean) => void;
97}>({
98  handleMediaLoad: () => {},
99  setAllImagesLoaded: () => {},
100});
101 
102const InfoCardContext = createContext<{
103  isHovered: boolean;
104// … truncated