import type { BusinessTypes } from "@/lib/schemas";

import styles from "./BusinessTypeList.module.css";

/**
 * Sulsys sells by business type, not by accounting concept
 * (PUBLIC-SOURCE-RESEARCH 02-A). The list is reproduced from Sulsys's own
 * campaign copy and attributed to it, so a visitor reads it as "the kinds of
 * business Sulsys addresses" rather than as a list of verified installations.
 */
export function BusinessTypeList({ data }: { data: BusinessTypes }) {
  return (
    <div className={styles.block}>
      <p className={styles.lead}>{data.lead}</p>
      <ul className={styles.list}>
        {data.items.map((item, index) => (
          <li key={item} className={styles.item}>
            <span className={styles.index}>{String(index + 1).padStart(2, "0")}</span>
            <span>{item}</span>
          </li>
        ))}
      </ul>
      <p className={styles.source}>{data.source}</p>
    </div>
  );
}