"use client";

interface HeadingToolbarProps {
  title?: string;
  subTitle?: string;
  titleClassName?: string;
  subTitleClassName?: string;
}

export function HeadingToolbar({
  title,
  subTitle,
  titleClassName = "",
  subTitleClassName = "",
}: HeadingToolbarProps) {
  return (
    <div>
      {title && (
        <div
          className={`
            font-body text-lg xl:text-28 font-semibold xl:leading-9.5 text-heading
            ${titleClassName}
          `}
        >
          {title}
        </div>
      )}

      {subTitle && (
        <p
          className={`
            mt-2.5 font-body text-base font-normal text-text
            ${subTitleClassName}
          `}
        >
          {subTitle}
        </p>
      )}
    </div>
  );
}