Feature Slide Showcase

import FeatureSlideShowcase from "@/components/ruixen/feature-slide-showcase";
 
export default function App() {
  const features = [
    {
      id: "analytics",
      title: "Advanced Analytics",
      description:
        "Get deep insights into your data with powerful analytics tools and real-time reporting.",
      image: "/features/analytics.jpg",
      icon: "📊",
    },
    {
      id: "collaboration",
      title: "Team Collaboration",
      description:
        "Work together seamlessly with built-in collaboration tools and real-time updates.",
      image: "/features/collaboration.jpg",
      icon: "👥",
    },
    {
      id: "security",
      title: "Enterprise Security",
      description:
        "Bank-level security with end-to-end encryption and compliance certifications.",
      image: "/features/security.jpg",
      icon: "🔒",
    },
  ];
 
  return (
    <FeatureSlideShowcase
      title="Powerful Features"
      subtitle="Everything you need"
      features={features}
    />
  );
}

<FeatureSlideShowcase
  title="Why Choose Us"
  subtitle="Discover our unique advantages"
  features={features}
/>

const features = [
  {
    id: "speed",
    title: "Lightning Fast",
    description: "Optimized for maximum performance",
    image: "/speed.jpg",
    icon: "⚡",
  },
  {
    id: "reliable",
    title: "99.9% Uptime",
    description: "Always available when you need it",
    image: "/reliable.jpg",
    icon: "✓",
  },
];

const features = [
  {
    id: "feature1",
    title: "Feature Name",
    description: "Feature description",
    image: "/feature.jpg",
    // No icon
  },
];

description: "Comprehensive analytics dashboard with real-time data visualization, custom reports, and advanced filtering options. Track key metrics, monitor performance, and make data-driven decisions with confidence.";

const saasFeatures = [
  {
    id: "dashboard",
    title: "Intuitive Dashboard",
    description:
      "Beautiful, easy-to-use dashboard with customizable widgets and real-time updates.",
    image: "/dashboard.jpg",
    icon: "📈",
  },
  {
    id: "api",
    title: "Powerful API",
    description:
      "RESTful API with comprehensive documentation and SDKs for popular languages.",
    image: "/api.jpg",
    icon: "🔌",
  },
  {
    id: "integrations",
    title: "Seamless Integrations",
    description:
      "Connect with your favorite tools and services with one-click integrations.",
    image: "/integrations.jpg",
    icon: "🔗",
  },
];

const benefits = [
  {
    id: "scalable",
    title: "Infinitely Scalable",
    description: "Grow from startup to enterprise without changing platforms.",
    image: "/scalable.jpg",
    icon: "📊",
  },
  {
    id: "secure",
    title: "Bank-Level Security",
    description: "SOC 2 Type II certified with end-to-end encryption.",
    image: "/secure.jpg",
    icon: "🔐",
  },
];

const steps = [
  {
    id: "step1",
    title: "Connect Your Data",
    description: "Import data from any source with our flexible connectors.",
    image: "/connect.jpg",
    icon: "1️⃣",
  },
  {
    id: "step2",
    title: "Transform & Analyze",
    description:
      "Use powerful tools to clean, transform, and analyze your data.",
    image: "/transform.jpg",
    icon: "2️⃣",
  },
  {
    id: "step3",
    title: "Share Insights",
    description:
      "Create beautiful reports and dashboards to share with your team.",
    image: "/share.jpg",
    icon: "3️⃣",
  },
];