1
Fork 0
mirror of https://github.com/pds-nest/nest.git synced 2024-11-22 13:04:19 +00:00

Add more props to BoxFull

This commit is contained in:
Stefano Pigozzi 2021-04-23 19:07:50 +02:00
parent 1ffd4637f9
commit 6d6825874f
Signed by untrusted user who does not match committer: steffo
GPG key ID: 6965406171929D01

View file

@ -7,19 +7,34 @@ import classNames from "classnames"
* A box with both a header and a body. * A box with both a header and a body.
* *
* @param header - The contents of the box header. * @param header - The contents of the box header.
* @param headerClassName - Additional class(es) added to the inner `<div>` acting as the header.
* @param headerProps - Additional props passed to the inner `<div>` acting as the header.
* @param children - The contents of the box body. * @param children - The contents of the box body.
* @param childrenClassName - Additional class(es) added to the inner `<div>` acting as the body.
* @param childrenProps - Additional props passed to the inner `<div>` acting as the body.
* @param className - Additional class(es) that should be added to the outer `<div>` of the box. * @param className - Additional class(es) that should be added to the outer `<div>` of the box.
* @param props - Additional props to pass to the box. * @param props - Additional props to pass to the box.
* @returns {JSX.Element} * @returns {JSX.Element}
* @constructor * @constructor
*/ */
export default function BoxFull({ header, children, className, ...props }) { export default function BoxFull(
{
header,
headerClassName,
headerProps,
children,
childrenClassName,
childrenProps,
className,
...props
}) {
return ( return (
<div className={classNames(Style.BoxWithHeader, className)} {...props}> <div className={classNames(Style.BoxWithHeader, className)} {...props}>
<div className={Style.BoxHeader}> <div className={classNames(Style.BoxHeader, headerClassName)} {...headerProps}>
{header} {header}
</div> </div>
<div className={Style.BoxBody}> <div className={classNames(Style.BoxBody, childrenClassName)} {...childrenProps}>
{children} {children}
</div> </div>
</div> </div>