import React, {CSSProperties} from "react";

import './card.scss'
import {clsx} from "clsx";

type CardProps = {
    title?: React.ReactNode;
    headerRight?: React.ReactNode;
    children?: React.ReactNode;
    bordered?: boolean;
    style?: CSSProperties;
    className?: string;
}
export const Card: React.FC<CardProps> = (props) => {

    return (<div style={props.style} className={clsx(props.className,'card-container',{'card-padding':!(props.title || props.headerRight)})}>
        {(props.title || props.headerRight) && <div className={'card-header'}>
            <div className="card-title">{props.title}</div>
            <div className="card-right">{props.headerRight}</div>
        </div>}
        <div className="card-body">{props.children}</div>
    </div>)
}