'use client';

import React from 'react';
import { FeatureSection } from '@/ui/FeatureSection';

interface HomeFeatureSectionProps {
  heading: string;
  description: React.ReactNode;
  mockup: React.ReactNode;
  layout: 'text-left' | 'text-right';
  accentColor?: 'primary' | 'aqua' | 'amber';
}

/**
 * HomeFeatureSection - A semantic section highlighting a feature.
 */
export function HomeFeatureSection({
  heading,
  description,
  mockup,
  layout,
  accentColor = 'primary',
}: HomeFeatureSectionProps) {
  return (
    <FeatureSection
      heading={heading}
      description={description}
      mockup={mockup}
      layout={layout}
      intent={accentColor}
    />
  );
}