import type { ReactNode } from "react";

import clsx from "clsx";

import styles from "./FilterSection.module.scss";

export default function FilterSection({
  label,
  className,
  children,
}: {
  label: string;
  className?: string | undefined;
  children: ReactNode;
}) {
  return (
    <section className={clsx(styles["filter-section"], className)}>
      <span className={styles["filter-section__heading"]}>{label}</span>

      <div className={styles["filter-section__body"]}>{children}</div>
    </section>
  );
}