import React from 'react';
import CardStack from '@/components/cardStack/CardStack';
import type { CardStackProps } from '@/components/cardStack/CardStack';

interface Feature {
  id: string;
  title: string;
  description: string;
}

interface FeatureCardOneProps extends Omit<CardStackProps, 'children'> {
  features: Feature[];
}

export const FeatureCardOne: React.FC<FeatureCardOneProps> = ({
  features,
  ...cardStackProps
}) => {
  const featureElements = features.map(feature => (
    <div key={feature.id} className="feature-card">
      <h3>{feature.title}</h3>
      <p>{feature.description}</p>
    </div>
  ));

  return (
    <CardStack {...cardStackProps}>
      {featureElements}
    </CardStack>
  );
};

export default FeatureCardOne;