"use client";
'use strict';

var clsx = require('clsx');
var tailwindMerge = require('tailwind-merge');
var React = require('react');
var jsxRuntime = require('react/jsx-runtime');

function _interopNamespace(e) {
  if (e && e.__esModule) return e;
  var n = Object.create(null);
  if (e) {
    Object.keys(e).forEach(function (k) {
      if (k !== 'default') {
        var d = Object.getOwnPropertyDescriptor(e, k);
        Object.defineProperty(n, k, d.get ? d : {
          enumerable: true,
          get: function () { return e[k]; }
        });
      }
    });
  }
  n.default = e;
  return Object.freeze(n);
}

var React__namespace = /*#__PURE__*/_interopNamespace(React);

// lib/utils.ts
function cn(...inputs) {
  return tailwindMerge.twMerge(clsx.clsx(inputs));
}
var svgCache = /* @__PURE__ */ new Map();
function DynamicIcon({
  name,
  size = 28,
  color,
  className,
  alt
}) {
  const [svgContent, setSvgContent] = React__namespace.useState(null);
  const [isLoading, setIsLoading] = React__namespace.useState(true);
  const [error, setError] = React__namespace.useState(null);
  const { url, iconName } = React__namespace.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__namespace.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__ */ jsxRuntime.jsx(
      "span",
      {
        className: cn("inline-block", className),
        style: { width: size, height: size },
        "aria-hidden": "true"
      }
    );
  }
  if (error || !svgContent) {
    return /* @__PURE__ */ jsxRuntime.jsx(
      "span",
      {
        className: cn("inline-block", className),
        style: { width: size, height: size },
        role: "img",
        "aria-label": alt || iconName
      }
    );
  }
  return /* @__PURE__ */ jsxRuntime.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;
}
var defaultStats = [
  {
    icon: /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/users", size: 24, className: "text-primary" }),
    value: "10M+",
    label: "Active Users",
    description: "Developers and teams using our platform daily"
  },
  {
    icon: /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/globe", size: 24, className: "text-primary" }),
    value: "150+",
    label: "Countries",
    description: "Global reach across every continent"
  },
  {
    icon: /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/code", size: 24, className: "text-primary" }),
    value: "1B+",
    label: "Lines of Code",
    description: "Generated through our platform"
  },
  {
    icon: /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/star", size: 24, className: "text-primary" }),
    value: "4.9/5",
    label: "Rating",
    description: "Average customer satisfaction score"
  }
];
var defaultFeatures = [
  {
    icon: /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/rocket", size: 24, className: "text-primary" }),
    title: "Fast Deployment",
    description: "Deploy your applications in seconds, not hours."
  },
  {
    icon: /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/shield-check", size: 24, className: "text-primary" }),
    title: "Enterprise Security",
    description: "SOC 2 compliant with end-to-end encryption."
  },
  {
    icon: /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/headphones", size: 24, className: "text-primary" }),
    title: "24/7 Support",
    description: "Our team is always here to help you succeed."
  }
];
function AboutStatsSidebar({
  title = "Why Choose Us",
  description = "We've built a platform that scales with your needs, from startup to enterprise. Here's what sets us apart.",
  stats = defaultStats,
  statsSlot,
  features = defaultFeatures,
  featuresSlot,
  className,
  containerClassName,
  sidebarClassName,
  titleClassName,
  descriptionClassName,
  statsClassName,
  featuresClassName
}) {
  const renderStats = () => {
    if (statsSlot) return statsSlot;
    if (!stats || stats.length === 0) return null;
    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("grid gap-6 sm:grid-cols-2", statsClassName), children: stats.map((stat, idx) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "rounded-xl border bg-card p-6", children: [
      stat.icon,
      typeof stat.value === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-4 text-4xl font-bold", children: stat.value }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-4", children: stat.value }),
      typeof stat.label === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-1 font-semibold", children: stat.label }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-1", children: stat.label }),
      stat.description && (typeof stat.description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-2 text-sm text-muted-foreground", children: stat.description }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-2", children: stat.description }))
    ] }, idx)) });
  };
  const renderFeatures = () => {
    if (featuresSlot) return featuresSlot;
    if (!features || features.length === 0) return null;
    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mt-12 space-y-6", featuresClassName), children: features.map((feature, idx) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-4", children: [
      /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("flex h-12 w-12 shrink-0 items-center justify-center rounded-lg bg-primary/10", feature.iconBgClass), children: feature.icon }),
      /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
        feature.title && (typeof feature.title === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "font-semibold", children: feature.title }) : feature.title),
        feature.description && (typeof feature.description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-muted-foreground", children: feature.description }) : feature.description)
      ] })
    ] }, idx)) });
  };
  return /* @__PURE__ */ jsxRuntime.jsx("section", { className: cn("py-32", className), children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("container", containerClassName), children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid gap-12 lg:grid-cols-3", children: [
    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("lg:sticky lg:top-24 lg:self-start", sidebarClassName), children: [
      title && (typeof title === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h2", { className: cn("text-3xl font-bold tracking-tight md:text-4xl", titleClassName), children: title }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: titleClassName, children: title })),
      description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("mt-4 text-lg text-muted-foreground", descriptionClassName), children: description }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mt-4", descriptionClassName), children: description }))
    ] }),
    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "lg:col-span-2", children: [
      (statsSlot || stats && stats.length > 0) && renderStats(),
      (featuresSlot || features && features.length > 0) && renderFeatures()
    ] })
  ] }) }) });
}

exports.AboutStatsSidebar = AboutStatsSidebar;
//# sourceMappingURL=about-stats-sidebar.cjs.map
//# sourceMappingURL=about-stats-sidebar.cjs.map