Fix default props

src/Avatar/Avatar.tsx

@@ -16,18 +16,27 @@ type AvatarProps = {
   url?: string;
 };
 
-function Avatar(props: AvatarProps) {
+function Avatar({
+  ariaHidden,
+  colorId,
+  image,
+  initials,
+  large,
+  name = '',
+  showAlert,
+  url,
+}: AvatarProps) {
   const [imageLoadFailed, setImageLoadFailed] = useState(false);
 
   function onImageLoadError() {
     setImageLoadFailed(true);
   }
 
   function wrapIfUrlPresent(content) {
-    if (props.url) {
+    if (url) {
       return (
         <a
-          href={props.url}
+          href={url}
           rel="noopener noreferrer"
           target="_blank"
         >
@@ -38,36 +47,36 @@ function Avatar(props: AvatarProps) {
     return content;
   }
 
-  const displayImage = props.image && !imageLoadFailed;
+  const displayImage = image && !imageLoadFailed;
   const content = displayImage ? (
     <img
-      alt={props.name}
-      src={props.image}
+      alt={name}
+      src={image}
       onError={onImageLoadError}
     />
   ) : (
     <span className="Avatar__circle__initials">
-      {props.initials}
+      {initials}
     </span>
   );
 
   return (
     <div
-      aria-hidden={props.ariaHidden}
+      aria-hidden={ariaHidden}
       className={classNames(
         'Avatar',
-        { 'Avatar--large': props.large },
+        { 'Avatar--large': large },
       )}
     >
       <div
         className={classNames([
           'Avatar__circle',
-          { [uiModClassName(props.colorId)]: !!props.colorId },
+          { [uiModClassName(colorId)]: !!colorId },
         ])}
       >
         {wrapIfUrlPresent(content)}
       </div>
-      {props.showAlert && (
+      {showAlert && (
         <div className="Avatar__alert" />
       )}
     </div>

src/Container/Col.tsx

@@ -63,7 +63,7 @@ export const Col = ({
   xl,
   xs,
   xxl,
-  bsPrefix,
+  bsPrefix = 'col',
   ...props
 }: ColProps) => (
   <ReactBootstrapCol

src/Container/Container.tsx

@@ -27,7 +27,7 @@ export const Container = ({
   children,
   className,
   fluid,
-  bsPrefix,
+  bsPrefix = 'container',
   ...props
 }: ContainerProps) => (
   <ReactBootstrapContainer

src/Container/Row.tsx

@@ -63,7 +63,7 @@ export const Row = ({
   xl,
   xs,
   xxl,
-  bsPrefix,
+  bsPrefix = 'row',
   ...props
 }: RowProps) => (
   <ReactBootstrapRow

src/CopyToClipboardButton/CopyToClipboardButton.tsx

@@ -24,7 +24,7 @@ type CopyToClipboardButtonProps = {
 
 function CopyToClipboardButton({
   copyText = '',
-  displayText = undefined,
+  displayText,
   trackingEvent,
   variant = ButtonVariants.NEUTRAL,
 }: CopyToClipboardButtonProps) {

src/Drawer/Drawer.tsx

@@ -39,7 +39,7 @@ type DrawerProps = {
 
 const Drawer = ({
   behindNav = true,
-  children = undefined,
+  children,
   className = '',
   defaultExpanded = false,
   expandable = false,

src/Drawer/DrawerHeader.tsx

@@ -18,7 +18,7 @@ type DrawerHeaderProps = {
 };
 
 const DrawerHeader = ({
-  bordered,
+  bordered = true,
   title,
   onRequestClose,
 }: DrawerHeaderProps) => {

src/Dropdown/Dropdown.tsx

@@ -65,19 +65,19 @@ type DropdownProps = {
 } & RBDropdownProps;
 
 const Dropdown = ({
-  align,
+  align = 'start',
   as,
-  autoClose,
+  autoClose = true,
+  bsPrefix = 'dropdown',
   children,
   className,
   drop,
   flip,
   focusFirstItemOnShow,
-  navbar,
+  navbar = false,
   onSelect,
   onToggle,
   show,
-  bsPrefix,
   ...props
 }: DropdownProps) => (
   <RBDropdown

src/Dropdown/DropdownDivider.tsx

@@ -21,8 +21,8 @@ type DropdownDividerProps = {
 };
 
 const DropdownDivider = ({
-  as,
-  bsPrefix,
+  as = 'hr',
+  bsPrefix = 'dropdown',
   className,
 }: DropdownDividerProps) => (
   <RBDropdown.Divider

src/Dropdown/DropdownMenu.tsx

@@ -57,7 +57,7 @@ const DropdownMenu = ({
   as,
   children,
   className,
-  flip,
+  flip = true,
   onSelect,
   popperConfig,
   renderOnMount,

src/Dropdown/DropdownToggle.tsx

@@ -50,8 +50,8 @@ type DropdownToggleProps = {
 
 const DropdownToggle = ({
   as,
-  ariaLabel,
-  bsPrefix,
+  ariaLabel = 'dropdown-toggle',
+  bsPrefix = 'dropdown-toggle',
   childBsPrefix,
   children,
   className,

src/FormGroup/FormGroup.tsx

@@ -63,18 +63,18 @@ export type FormGroupProps = {
 export default function FormGroup({
   bordered,
   children,
-  className,
-  displayErrorText,
+  className = '',
+  displayErrorText = true,
   elementType = 'div',
   errors = {},
   helperText,
   id,
   inline,
   inputKey,
-  label,
-  labelClassName,
+  label = '',
+  labelClassName = '',
   labelHelperText,
-  labelHtmlFor,
+  labelHtmlFor = '',
   labelTooltip,
   required,
 }: FormGroupProps) {
@@ -90,7 +90,6 @@ export default function FormGroup({
         <InputLegend
           className={labelClassName}
           labelHelperText={labelHelperText}
-          labelHtmlFor={labelHtmlFor}
           required={required}
           text={label}
           tooltipText={labelTooltip}

src/Input/Input.tsx

@@ -34,13 +34,13 @@ const Input = React.forwardRef<HTMLInputElement, InputProps>((props, ref) => {
     id,
     leadingIcon,
     name,
-    placeholder,
+    placeholder = '',
     trailingIcon,
-    trailingIconLabel,
+    trailingIconLabel = '',
     trailingIconOnClick,
     trailingIconOnClickSubmit,
     trailingText,
-    type,
+    type = 'text',
     value,
     onChange,
     ...rest

src/InputLabel/InputLabel.tsx

@@ -17,11 +17,11 @@ export type InputLabelProps = {
 } & LabelProps;
 
 const InputLabel = ({
-  className,
-  labelHtmlFor,
+  className = '',
+  labelHtmlFor = '',
   text,
   required,
-  labelHelperText,
+  labelHelperText = '',
   tooltipText,
   ...props
 }: InputLabelProps) => {

src/InputLegend/InputLegend.tsx

@@ -13,17 +13,16 @@ type LegendProps = React.DetailedHTMLProps<
 export type InputLegendProps = {
   className?: string;
   labelHelperText?: React.ReactNode;
-  labelHtmlFor?: string;
   required?: boolean;
   text: string;
   tooltipText?: React.ReactNode;
 } & LegendProps;
 
 const InputLegend = ({
-  className,
+  className = '',
   text,
   required,
-  labelHelperText,
+  labelHelperText = '',
   tooltipText,
   ...props
 }: InputLegendProps) => {

src/LoadingOverlay/LoadingOverlay.tsx

@@ -17,13 +17,13 @@ type LoadingOverlayProps = {
 };
 
 const LoadingOverlay = ({
-  contentCenterOverflow,
-  contentTop,
+  contentCenterOverflow = false,
+  contentTop = false,
   dataTestid = 'LoadingOverlay',
   header,
   text,
   textClassName,
-  visible,
+  visible = true,
 }: LoadingOverlayProps) => {
   // Only set style if this is not visible to let CSS handle how to display this
   const classes = classNames(

src/Main/Main.tsx

@@ -24,7 +24,7 @@ const Main = ({
   as = 'main',
   className,
   children,
-  fluid,
+  fluid = true,
   id,
   ...props
 }: MainProps) => (

src/Modal/Modal.tsx

@@ -16,7 +16,7 @@ const Modal = ({
   className,
   ...props
 }: ModalProps) => {
-  let componentClassName = '';
+  let componentClassName = className;
 
   if (size === MODAL_SIZES.MEDIUM) {
     componentClassName = classNames(className, 'ReactModal--medium');

src/Modal/ModalFooter.tsx

@@ -15,6 +15,14 @@ export default class ModalFooter extends Component<ModalFooterProps> {
 
   handleCloseClick = () => this.props.onRequestClose && this.props.onRequestClose();
 
+  // eslint-disable-next-line react/static-property-placement
+  static defaultProps: {
+    children: undefined;
+    closingIsDisabled: boolean;
+    dismissButtonText: string;
+    onRequestClose: undefined;
+  };
+
   render() {
     return (
       <div className="ModalFooter">

src/MoneyInput/MoneyInput.tsx

@@ -46,10 +46,23 @@ export type MoneyInputProps = CurrencyInputProps & {
 };
 
 const MoneyInput = ({
+  allowDecimals = true,
+  allowNegativeValue = true,
+  disabled = false,
   className,
+  intlConfig = { locale: 'en-US', currency: 'USD' },
+  prefix = '$ ',
   ...props
 }: MoneyInputProps) => (
-  <CurrencyInput className={classNames(className, 'MoneyInput', 'form-control')} {...props} />
+  <CurrencyInput
+    allowDecimals={allowDecimals}
+    allowNegativeValue={allowNegativeValue}
+    className={classNames(className, 'MoneyInput', 'form-control')}
+    disabled={disabled}
+    intlConfig={intlConfig}
+    prefix={prefix}
+    {...props}
+  />
 );
 
 export default MoneyInput;

src/RadioButton/RadioButton.tsx

@@ -17,9 +17,9 @@ type RadioButtonProps = {
 const RadioButton = React.forwardRef<HTMLInputElement, RadioButtonProps>(({
   checked,
   className,
-  disabled,
+  disabled = false,
   id,
-  name,
+  name = '',
   value,
   onChange,
   ...rest