"use client";
import { clsx } from 'clsx';
import { twMerge } from 'tailwind-merge';
import * as React from 'react';
import { jsx, jsxs } from 'react/jsx-runtime';
import * as AvatarPrimitive from '@radix-ui/react-avatar';
import * as SeparatorPrimitive from '@radix-ui/react-separator';

// lib/utils.ts
function cn(...inputs) {
  return twMerge(clsx(inputs));
}
var svgCache = /* @__PURE__ */ new Map();
function DynamicIcon({
  name,
  size = 28,
  color,
  className,
  alt
}) {
  const [svgContent, setSvgContent] = React.useState(null);
  const [isLoading, setIsLoading] = React.useState(true);
  const [error, setError] = React.useState(null);
  const { url, iconName } = React.useMemo(() => {
    const separator = name.includes("/") ? "/" : ":";
    const [prefix, iconName2] = name.split(separator);
    const baseUrl = `https://icons.opensite.ai/api/icon/${prefix}/${iconName2}?format=svg&width=${size}&height=${size}`;
    return {
      url: baseUrl,
      iconName: iconName2
    };
  }, [name, size]);
  React.useEffect(() => {
    let isMounted = true;
    const fetchSvg = async () => {
      const cached = svgCache.get(url);
      if (cached) {
        if (isMounted) {
          setSvgContent(cached);
          setIsLoading(false);
        }
        return;
      }
      try {
        setIsLoading(true);
        setError(null);
        const response = await fetch(url);
        if (!response.ok) {
          throw new Error(`Failed to fetch icon: ${response.status}`);
        }
        let svg = await response.text();
        svg = processSvgForCurrentColor(svg);
        svgCache.set(url, svg);
        if (isMounted) {
          setSvgContent(svg);
          setIsLoading(false);
        }
      } catch (err) {
        if (isMounted) {
          setError(err instanceof Error ? err.message : "Failed to load icon");
          setIsLoading(false);
        }
      }
    };
    fetchSvg();
    return () => {
      isMounted = false;
    };
  }, [url]);
  if (isLoading) {
    return /* @__PURE__ */ jsx(
      "span",
      {
        className: cn("inline-block", className),
        style: { width: size, height: size },
        "aria-hidden": "true"
      }
    );
  }
  if (error || !svgContent) {
    return /* @__PURE__ */ jsx(
      "span",
      {
        className: cn("inline-block", className),
        style: { width: size, height: size },
        role: "img",
        "aria-label": alt || iconName
      }
    );
  }
  return /* @__PURE__ */ jsx(
    "span",
    {
      className: cn("inline-flex items-center justify-center", className),
      style: {
        width: size,
        height: size,
        color: color || "inherit"
      },
      role: "img",
      "aria-label": alt || iconName,
      dangerouslySetInnerHTML: { __html: svgContent }
    }
  );
}
function processSvgForCurrentColor(svg) {
  let processed = svg;
  processed = processed.replace(
    /stroke=["'](#000000|#000|black)["']/gi,
    'stroke="currentColor"'
  );
  processed = processed.replace(
    /fill=["'](#000000|#000|black)["']/gi,
    'fill="currentColor"'
  );
  return processed;
}
function Avatar({
  className,
  ...props
}) {
  return /* @__PURE__ */ jsx(
    AvatarPrimitive.Root,
    {
      "data-slot": "avatar",
      className: cn(
        "relative flex size-8 shrink-0 overflow-hidden rounded-full",
        className
      ),
      ...props
    }
  );
}
function AvatarImage({
  className,
  ...props
}) {
  return /* @__PURE__ */ jsx(
    AvatarPrimitive.Image,
    {
      "data-slot": "avatar-image",
      className: cn("aspect-square size-full", className),
      ...props
    }
  );
}
function AvatarFallback({
  className,
  ...props
}) {
  return /* @__PURE__ */ jsx(
    AvatarPrimitive.Fallback,
    {
      "data-slot": "avatar-fallback",
      className: cn(
        "bg-muted flex size-full items-center justify-center rounded-full",
        className
      ),
      ...props
    }
  );
}
function Separator({
  className,
  orientation = "horizontal",
  decorative = true,
  ...props
}) {
  return /* @__PURE__ */ jsx(
    SeparatorPrimitive.Root,
    {
      "data-slot": "separator",
      decorative,
      orientation,
      className: cn(
        "bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px",
        className
      ),
      ...props
    }
  );
}

// lib/blockBrandedIconsAndPlaceholders.ts
var blockBrandedIconsAndPlaceholders = {
  avatar1: "https://cdn.ing/assets/i/r/286239/ebm7o3j2kx48vw98emnwjaf5qvl6/avatar-1.webp",
  avatar2: "https://cdn.ing/assets/i/r/286240/vgf3rrkwn0769pfdtpal60uo5vpw/avatar-2.webp",
  avatar3: "https://cdn.ing/assets/i/r/286241/05vbqt3lls0q974r8fv4zn0njllq/avatar-3.webp",
  avatar5: "https://cdn.ing/assets/i/r/286243/alziyfoo570m3vade3usufzlzj6x/avatar-5.webp"};
var DEFAULT_REVIEWS = [
  {
    id: "1",
    rating: 5,
    title: "Exceeded my expectations",
    content: "I was a bit skeptical at first, but this product really delivered. The quality is outstanding and it arrived faster than expected. Would definitely recommend to anyone on the fence.",
    author: {
      name: "Sarah M.",
      avatar: blockBrandedIconsAndPlaceholders.avatar1
    },
    date: "Dec 10, 2024",
    verified: true
  },
  {
    id: "2",
    rating: 4,
    title: "Great value for money",
    content: "Solid product overall. Does exactly what it's supposed to do. Took off one star because the packaging could be better, but the product itself is great.",
    author: {
      name: "James R.",
      avatar: blockBrandedIconsAndPlaceholders.avatar2
    },
    date: "Dec 8, 2024",
    verified: true
  },
  {
    id: "3",
    rating: 5,
    title: "Perfect for everyday use",
    content: "I've been using this daily for a month now and it still looks and works like new. The build quality is impressive at this price point. Already bought one for my sister.",
    author: {
      name: "Emily K.",
      avatar: blockBrandedIconsAndPlaceholders.avatar3
    },
    date: "Dec 5, 2024",
    verified: true
  },
  {
    id: "4",
    rating: 4,
    title: "Good but not perfect",
    content: "The product is nice and works well. My only minor complaint is that the color is slightly different from the photos, but it's still a great purchase overall.",
    author: {
      name: "Michael T."
    },
    date: "Dec 2, 2024",
    verified: false
  },
  {
    id: "5",
    rating: 5,
    title: "Best purchase I've made this year",
    content: "Absolutely love it! The attention to detail is remarkable. Customer service was also very helpful when I had questions. Five stars all around.",
    author: {
      name: "Lisa P.",
      avatar: blockBrandedIconsAndPlaceholders.avatar5
    },
    date: "Nov 28, 2024",
    verified: true
  }
];
function StarRating({ rating, size = 16 }) {
  return /* @__PURE__ */ jsx("div", { className: "flex items-center gap-0.5", children: [1, 2, 3, 4, 5].map((star) => /* @__PURE__ */ jsx(
    DynamicIcon,
    {
      name: "lucide/star",
      size,
      className: cn(
        star <= rating ? "fill-yellow-400 text-yellow-400" : "fill-muted text-muted"
      )
    },
    star
  )) });
}
function ReviewsListVerified({
  reviews = DEFAULT_REVIEWS,
  title = "Customer Reviews",
  className
}) {
  const averageRating = reviews.reduce((sum, review) => sum + review.rating, 0) / reviews.length;
  return /* @__PURE__ */ jsx("section", { className: cn("py-16 md:py-24", className), children: /* @__PURE__ */ jsxs("div", { className: "container max-w-3xl", children: [
    /* @__PURE__ */ jsxs("div", { className: "mb-8", children: [
      /* @__PURE__ */ jsx("h2", { className: "text-2xl font-semibold tracking-tight md:text-3xl", children: title }),
      /* @__PURE__ */ jsxs("div", { className: "mt-2 flex items-center gap-3", children: [
        /* @__PURE__ */ jsx(StarRating, { rating: Math.round(averageRating), size: 20 }),
        /* @__PURE__ */ jsxs("span", { className: "text-sm text-muted-foreground", children: [
          averageRating.toFixed(1),
          " out of 5 \xB7 ",
          reviews.length,
          " reviews"
        ] })
      ] })
    ] }),
    /* @__PURE__ */ jsx("div", { className: "space-y-0", children: reviews.map((review, index) => /* @__PURE__ */ jsxs("div", { children: [
      index > 0 && /* @__PURE__ */ jsx(Separator, { className: "my-6" }),
      /* @__PURE__ */ jsxs("div", { className: "space-y-3", children: [
        /* @__PURE__ */ jsxs("div", { children: [
          /* @__PURE__ */ jsx(StarRating, { rating: review.rating, size: 16 }),
          /* @__PURE__ */ jsx("h3", { className: "mt-2 font-medium", children: review.title })
        ] }),
        /* @__PURE__ */ jsx("p", { className: "text-sm leading-relaxed text-muted-foreground", children: review.content }),
        /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
          /* @__PURE__ */ jsxs(Avatar, { className: "size-8", children: [
            /* @__PURE__ */ jsx(
              AvatarImage,
              {
                src: review.author.avatar,
                alt: review.author.name
              }
            ),
            /* @__PURE__ */ jsx(AvatarFallback, { className: "text-xs", children: review.author.name.split(" ").map((n) => n[0]).join("") })
          ] }),
          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 text-sm", children: [
            /* @__PURE__ */ jsx("span", { className: "font-medium", children: review.author.name }),
            review.verified && /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-1 text-emerald-600", children: [
              /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/badge-check", size: 16 }),
              /* @__PURE__ */ jsx("span", { className: "text-xs", children: "Verified Purchase" })
            ] }),
            /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: "\xB7" }),
            /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: review.date })
          ] })
        ] })
      ] })
    ] }, review.id)) })
  ] }) });
}

export { ReviewsListVerified };
//# sourceMappingURL=reviews-list-verified.js.map
//# sourceMappingURL=reviews-list-verified.js.map