import React, {FC, PropsWithChildren} from "react";
import classNames from "classnames";

export type WithLabelsProps = {
    bottom?: string,
    centered?: boolean,
    fullWidth?: boolean
}

export const WithLabels: FC<WithLabelsProps & PropsWithChildren> = ({children, bottom, centered, fullWidth = true }) => {
    return <div className={classNames("grid", {
        'w-full': fullWidth,
        'justify-center': centered,
        'gird-rows-2': bottom,
        'gap': 'gap-1',
    })}>
        {children}
        {bottom && <div className="">{bottom}</div>}
    </div>
}