import React from 'react';
import { Stack } from './Stack';
import { Text } from './Text';

interface FeatureListProps {
  items: string[];
  intent?: 'primary' | 'aqua' | 'amber' | 'low';
}

/**
 * FeatureList - A semantic list of features.
 */
export function FeatureList({ items, intent = 'primary' }: FeatureListProps) {
  return (
    <Stack as="ul" gap={2}>
      {items.map((item, index) => (
        <Stack as="li" key={index} direction="row" align="start" gap={2}>
          <Text variant={intent === 'low' ? 'low' : 'primary'}>•</Text>
          <Text size="sm" variant="med">{item}</Text>
        </Stack>
      ))}
    </Stack>
  );
}