import { ButtonGroupItem } from '@/components/buttons/components';
import { classNames } from '@/utils/classNames';

export type TButtonGroupProps = {
  children: React.ReactNode;
  className?: string;
};

function ButtonGroup({ children, className }: TButtonGroupProps): React.ReactElement {
  return (
    <div
      className={classNames(
        'flex border border-gray-ui/ba h-9 p-[3px] rounded-lg items-center justify-center',
        className ?? '',
      )}
    >
      {children}
    </div>
  );
}

ButtonGroup.Item = ButtonGroupItem;

export { ButtonGroup };