diff --git a/src/components/HasManyFieldsRow.d.ts b/src/components/HasManyFieldsRow.d.ts index 2d8ae01c2..7703cde8e 100644 --- a/src/components/HasManyFieldsRow.d.ts +++ b/src/components/HasManyFieldsRow.d.ts @@ -2,10 +2,11 @@ import * as React from 'react'; interface HasManyFieldsRowProps { children: (JSX.Element | string) | (JSX.Element | string)[]; + className?: string; onDelete?: React.MouseEventHandler; disabled?: boolean; - disabledReason: (JSX.Element | string) | (JSX.Element | string)[]; - disabledReasonPlacement: string; + disabledReason?: (JSX.Element | string) | (JSX.Element | string)[]; + disabledReasonPlacement?: string; } declare class HasManyFieldsRow extends React.Component { } export default HasManyFieldsRow; diff --git a/src/components/HasManyFieldsRow.js b/src/components/HasManyFieldsRow.js index 0443bf891..1d7b92f58 100644 --- a/src/components/HasManyFieldsRow.js +++ b/src/components/HasManyFieldsRow.js @@ -1,5 +1,6 @@ import noop from 'lodash.noop'; import PropTypes from 'prop-types'; +import classnames from 'classnames'; import React from 'react'; import Button from './Button'; import ConfirmationButton from './ConfirmationButton'; @@ -17,6 +18,7 @@ function getID() { export default class HasManyFieldsRow extends React.Component { static propTypes = { children: PropTypes.node.isRequired, + className: PropTypes.string, disabled: PropTypes.bool, disabledReason: PropTypes.node, disabledReasonPlacement: PropTypes.string, @@ -36,15 +38,17 @@ export default class HasManyFieldsRow extends React.Component { render() { const { children, + className, disabledReason, onDelete, disabled, disabledReasonPlacement } = this.props; + const classNames = classnames('mb-3', className); // The `disabled ?