import * as React from 'react';
import * as styles from './field.m.css';

interface IProps {
    label?: React.ReactNode;
    sublabel?: string;
    isRequired?: boolean;
}

export class FieldLabel extends React.PureComponent<IProps> {

    override render () {
        const {label, sublabel, isRequired} = this.props;

        if (!label) {
            return null;
        }

        return (
            <>
                <div className={styles.fieldLabel}>
                    {label}

                    {isRequired === true && (<span className={styles.required}>*</span>)}
                </div>
                {sublabel && (
                    <div className={styles.fieldSubLabel }>{sublabel}</div>
                )}
            </>
        );
    }
}