import React, { forwardRef } from 'react';
import { SegmentedButtonProps } from './segmented-buttons.types';

export const SegmentedButtons = forwardRef<
    HTMLDivElement,
    SegmentedButtonProps
>(({ children, ...props }, ref) => {
    if (children.length <= 1) {
        console.error('You must build segmented button with 2 or more buttton');
        return <></>;
    }

    return (
        <div
            className={`m3 m3-segmented-buttons ${props.className ?? ''}`.trimEnd()}
            ref={ref}
        >
            {children}
        </div>
    );
});