import PropTypes from "prop-types";
import React, { ReactElement } from "react";
import classNames from "classnames";


export interface FormItemProps {
    children: ReactElement | ReactElement[];
    /** CSS class names. */
    className?: string;
    testSection?: string;
}

const Item = ({ // eslint-disable-line @typescript-eslint/explicit-function-return-type
    children,
    className,
    testSection,
    ...props
}: FormItemProps) => (
    <div data-test-section={testSection} className={classNames("oui-form-field__item", className)} {...props}>
        {children}
    </div>
);

Item.propTypes = {
    children: PropTypes.node.isRequired,
    /** CSS class names. */
    className: PropTypes.string,
    testSection: PropTypes.string,
};

export default Item;