@carbon/react 1.40.0 → 1.41.0

package/lib/components/DataTable/TableToolbarSearch.js

@@ -17,6 +17,7 @@ var Search = require('../Search/Search.js');
 require('../Search/Search.Skeleton.js');
 var instanceId = require('./tools/instanceId.js');
 var usePrefix = require('../../internal/usePrefix.js');
+var noopFn = require('../../internal/noopFn.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -37,8 +38,8 @@ const TableToolbarSearch = _ref => {
     className,
     searchContainerClass,
     onChange: onChangeProp,
-    onClear,
-    translateWithId: t,
+    onClear = noopFn.noopFn,
+    translateWithId: t = translateWithId,
     placeholder,
     labelText,
     expanded: expandedProp,
@@ -46,12 +47,12 @@ const TableToolbarSearch = _ref => {
     defaultValue,
     disabled,
     onExpand,
-    persistent,
+    persistent = false,
     id,
     onBlur,
     onFocus,
     size = 'lg',
-    tabIndex,
+    tabIndex = '0',
     ...rest
   } = _ref;
   const {
@@ -198,13 +199,7 @@ TableToolbarSearch.propTypes = {
   /**
    * Provide custom text for the component for each translation id
    */
-  translateWithId: PropTypes__default["default"].func.isRequired
-};
-TableToolbarSearch.defaultProps = {
-  tabIndex: '0',
-  translateWithId,
-  persistent: false,
-  onClear: () => {}
+  translateWithId: PropTypes__default["default"].func
 };
 
 exports["default"] = TableToolbarSearch;

package/lib/components/DataTable/tools/sorting.js

@@ -90,8 +90,8 @@ const sortRows = _ref => {
     cellsById,
     sortDirection,
     key,
-    locale,
-    sortRow
+    locale = 'en',
+    sortRow = defaultSortRow
   } = _ref;
   return rowIds.slice().sort((a, b) => {
     const cellA = cellsById[cells.getCellId(a, key)];

package/lib/components/DatePicker/DatePicker.d.ts

@@ -24,8 +24,8 @@ export type CalRef = {
 };
 interface DatePickerProps extends Omit<ReactAttr<HTMLDivElement>, ExcludedAttributes> {
     /**
-     * flatpickr prop passthrough. Allows the user to enter a date directly
-     * into the input field
+     * Flatpickr prop passthrough enables direct date input, and when set to false,
+     * we must clear dates manually by resetting the value prop to empty string making it a controlled input.
      */
     allowInput?: boolean;
     /**
@@ -87,11 +87,11 @@ interface DatePickerProps extends Omit<ReactAttr<HTMLDivElement>, ExcludedAttrib
     /**
      * The maximum date that a user can pick to.
      */
-    maxDate?: string;
+    maxDate?: string | number;
     /**
      * The minimum date that a user can start picking from.
      */
-    minDate?: string;
+    minDate?: string | number;
     /**
      * The `change` event handler.
      */

package/lib/components/DatePicker/DatePicker.js

@@ -435,6 +435,11 @@ const DatePicker = /*#__PURE__*/React__default["default"].forwardRef(function Da
       calendarRef.current.set('minDate', minDate);
     }
   }, [minDate]);
+  React.useEffect(() => {
+    if (calendarRef?.current?.set) {
+      calendarRef.current.set('allowInput', allowInput);
+    }
+  }, [allowInput]);
   React.useEffect(() => {
     if (calendarRef?.current?.set) {
       calendarRef.current.set('maxDate', maxDate);
@@ -497,8 +502,8 @@ const DatePicker = /*#__PURE__*/React__default["default"].forwardRef(function Da
 });
 DatePicker.propTypes = {
   /**
-   * flatpickr prop passthrough. Allows the user to enter a date directly
-   * into the input field
+   * Flatpickr prop passthrough enables direct date input, and when set to false,
+   * we must clear dates manually by resetting the value prop to empty string making it a controlled input.
    */
   allowInput: PropTypes__default["default"].bool,
   /**
@@ -682,11 +687,11 @@ DatePicker.propTypes = {
   /**
    * The maximum date that a user can pick to.
    */
-  maxDate: PropTypes__default["default"].string,
+  maxDate: PropTypes__default["default"].oneOfType([PropTypes__default["default"].string, PropTypes__default["default"].number]),
   /**
    * The minimum date that a user can start picking from.
    */
-  minDate: PropTypes__default["default"].string,
+  minDate: PropTypes__default["default"].oneOfType([PropTypes__default["default"].string, PropTypes__default["default"].number]),
   /**
    * The `change` event handler.
    * `(dates: Date[], dStr: string, fp: Instance, data?: any):void;`

package/lib/components/DatePicker/plugins/fixEventsPlugin.js

@@ -43,6 +43,12 @@ var carbonFlatpickrFixEventsPlugin = (config => fp => {
       } else if (match.match(event, keys.ArrowDown)) {
         event.preventDefault();
         fp.open();
+      } else if (!fp.config.allowInput) {
+        // We override the default behaviour of Flatpickr, ideally when allowInput is set to false,
+        // the Delete/Backspace button clears all of the date, which we don't want, hence
+        // we stop event bubbling and the default Flatpickr's onChange behaviour here itself
+        event.stopPropagation();
+        event.preventDefault();
       }
     }
   };

package/lib/components/DatePickerInput/DatePickerInput.d.ts

@@ -10,7 +10,7 @@ import { ReactAttr } from '../../types/common';
 type ExcludedAttributes = 'value' | 'onChange' | 'locale' | 'children';
 export type ReactNodeLike = ReactElementLike | ReactNodeArray | string | number | boolean | null | undefined;
 export type func = (...args: any[]) => any;
-interface DatePickerInputProps extends Omit<ReactAttr<HTMLDivElement>, ExcludedAttributes> {
+interface DatePickerInputProps extends Omit<ReactAttr<HTMLInputElement>, ExcludedAttributes> {
     /**
      * The type of the date picker:
      *

package/lib/components/DatePickerInput/DatePickerInput.js

@@ -17,6 +17,8 @@ var usePrefix = require('../../internal/usePrefix.js');
 require('../FluidForm/FluidForm.js');
 var FormContext = require('../FluidForm/FormContext.js');
 var setupGetInstanceId = require('../../tools/setupGetInstanceId.js');
+require('../Text/index.js');
+var Text = require('../Text/Text.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -103,26 +105,30 @@ const DatePickerInput = /*#__PURE__*/React__default["default"].forwardRef(functi
   const input = /*#__PURE__*/React__default["default"].createElement("input", inputProps);
   return /*#__PURE__*/React__default["default"].createElement("div", {
     className: containerClasses
-  }, labelText && /*#__PURE__*/React__default["default"].createElement("label", {
+  }, labelText && /*#__PURE__*/React__default["default"].createElement(Text.Text, {
+    as: "label",
     htmlFor: id,
     className: labelClasses
   }, labelText), /*#__PURE__*/React__default["default"].createElement("div", {
     className: wrapperClasses
-  }, input, isFluid && /*#__PURE__*/React__default["default"].createElement(DatePickerIcon, {
+  }, /*#__PURE__*/React__default["default"].createElement("span", null, input, isFluid && /*#__PURE__*/React__default["default"].createElement(DatePickerIcon, {
     datePickerType: datePickerType
   }), /*#__PURE__*/React__default["default"].createElement(DatePickerIcon, {
     datePickerType: datePickerType,
     invalid: invalid,
     warn: warn
-  })), invalid && /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, isFluid && /*#__PURE__*/React__default["default"].createElement("hr", {
+  }))), invalid && /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, isFluid && /*#__PURE__*/React__default["default"].createElement("hr", {
     className: `${prefix}--date-picker__divider`
-  }), /*#__PURE__*/React__default["default"].createElement("div", {
+  }), /*#__PURE__*/React__default["default"].createElement(Text.Text, {
+    as: "div",
     className: `${prefix}--form-requirement`
   }, invalidText)), warn && /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, isFluid && /*#__PURE__*/React__default["default"].createElement("hr", {
     className: `${prefix}--date-picker__divider`
-  }), /*#__PURE__*/React__default["default"].createElement("div", {
+  }), /*#__PURE__*/React__default["default"].createElement(Text.Text, {
+    as: "div",
     className: `${prefix}--form-requirement`
-  }, warnText)), helperText && /*#__PURE__*/React__default["default"].createElement("div", {
+  }, warnText)), helperText && !invalid && /*#__PURE__*/React__default["default"].createElement(Text.Text, {
+    as: "div",
     id: datePickerInputHelperId,
     className: helperTextClasses
   }, helperText));

package/lib/components/Dropdown/Dropdown.js

@@ -53,22 +53,22 @@ const defaultItemToString = item => {
 const Dropdown = /*#__PURE__*/React__default["default"].forwardRef((_ref, ref) => {
   let {
     className: containerClassName,
-    disabled,
-    direction,
+    disabled = false,
+    direction = 'bottom',
     items,
     label,
     ['aria-label']: ariaLabel,
     ariaLabel: deprecatedAriaLabel,
     itemToString = defaultItemToString,
-    itemToElement,
+    itemToElement = null,
     renderSelectedItem,
-    type,
+    type = 'default',
     size,
     onChange,
     id,
-    titleText,
+    titleText = '',
     hideLabel,
-    helperText,
+    helperText = '',
     translateWithId,
     light,
     invalid,
@@ -414,14 +414,5 @@ Dropdown.propTypes = {
    */
   warnText: PropTypes__default["default"].node
 };
-Dropdown.defaultProps = {
-  disabled: false,
-  type: 'default',
-  itemToString: defaultItemToString,
-  itemToElement: null,
-  titleText: '',
-  helperText: '',
-  direction: 'bottom'
-};
 
 exports["default"] = Dropdown;

package/lib/components/FileUploader/FileUploader.d.ts

@@ -36,7 +36,7 @@ export interface FileUploaderProps extends ReactAttr<HTMLSpanElement> {
     /**
      * Provide a description for the complete/close icon that can be read by screen readers
      */
-    iconDescription: string;
+    iconDescription?: string;
     /**
      * Specify the description text of this `<FileUploader>`
      */
@@ -106,7 +106,7 @@ export default class FileUploader extends React.Component<FileUploaderProps, {
         /**
          * Provide a description for the complete/close icon that can be read by screen readers
          */
-        iconDescription: PropTypes.Validator<string>;
+        iconDescription: PropTypes.Requireable<string>;
         /**
          * Specify the description text of this `<FileUploader>`
          */
@@ -145,15 +145,6 @@ export default class FileUploader extends React.Component<FileUploaderProps, {
         size: PropTypes.Requireable<string>;
     };
     static contextType: React.Context<string>;
-    static defaultProps: {
-        disabled: boolean;
-        filenameStatus: string;
-        buttonLabel: string;
-        buttonKind: string;
-        multiple: boolean;
-        onClick: () => void;
-        accept: never[];
-    };
     state: {
         filenames: string[];
     };

package/lib/components/FileUploader/FileUploader.js

@@ -17,6 +17,8 @@ var Filename = require('./Filename.js');
 var FileUploaderButton = require('./FileUploaderButton.js');
 var types = require('../../prop-types/types.js');
 var usePrefix = require('../../internal/usePrefix.js');
+require('../Text/index.js');
+var Text = require('../Text/Text.js');
 var match = require('../../internal/keyboard/match.js');
 var keys = require('../../internal/keyboard/keys.js');
 
@@ -84,15 +86,15 @@ class FileUploader extends React__default["default"].Component {
   render() {
     const {
       iconDescription,
-      buttonLabel,
-      buttonKind,
-      disabled,
-      filenameStatus,
+      buttonLabel = '',
+      buttonKind = 'primary',
+      disabled = false,
+      filenameStatus = 'uploading',
       labelDescription,
       labelTitle,
       className,
-      multiple,
-      accept,
+      multiple = false,
+      accept = [],
       name,
       size = 'md',
       onDelete,
@@ -113,9 +115,11 @@ class FileUploader extends React__default["default"].Component {
     });
     return /*#__PURE__*/React__default["default"].createElement("div", _rollupPluginBabelHelpers["extends"]({
       className: classes
-    }, other), !labelTitle ? null : /*#__PURE__*/React__default["default"].createElement("p", {
+    }, other), !labelTitle ? null : /*#__PURE__*/React__default["default"].createElement(Text.Text, {
+      as: "p",
       className: getHelperLabelClasses(`${prefix}--file--label`)
-    }, labelTitle), /*#__PURE__*/React__default["default"].createElement("p", {
+    }, labelTitle), /*#__PURE__*/React__default["default"].createElement(Text.Text, {
+      as: "p",
       className: getHelperLabelClasses(`${prefix}--label-description`)
     }, labelDescription), /*#__PURE__*/React__default["default"].createElement(FileUploaderButton["default"], {
       innerRef: this.uploaderButton,
@@ -134,7 +138,8 @@ class FileUploader extends React__default["default"].Component {
       key: index,
       className: selectedFileClasses,
       ref: node => this.nodes[index] = node // eslint-disable-line
-    }, other), /*#__PURE__*/React__default["default"].createElement("p", {
+    }, other), /*#__PURE__*/React__default["default"].createElement(Text.Text, {
+      as: "p",
       className: `${prefix}--file-filename`,
       id: name
     }, name), /*#__PURE__*/React__default["default"].createElement("span", {
@@ -187,7 +192,7 @@ _rollupPluginBabelHelpers.defineProperty(FileUploader, "propTypes", {
   /**
    * Provide a description for the complete/close icon that can be read by screen readers
    */
-  iconDescription: PropTypes__default["default"].string.isRequired,
+  iconDescription: PropTypes__default["default"].string,
   /**
    * Specify the description text of this `<FileUploader>`
    */
@@ -226,14 +231,5 @@ _rollupPluginBabelHelpers.defineProperty(FileUploader, "propTypes", {
   size: PropTypes__default["default"].oneOf(['sm', 'md', 'lg'])
 });
 _rollupPluginBabelHelpers.defineProperty(FileUploader, "contextType", usePrefix.PrefixContext);
-_rollupPluginBabelHelpers.defineProperty(FileUploader, "defaultProps", {
-  disabled: false,
-  filenameStatus: 'uploading',
-  buttonLabel: '',
-  buttonKind: 'primary',
-  multiple: false,
-  onClick: () => {},
-  accept: []
-});
 
 exports["default"] = FileUploader;

package/lib/components/FileUploader/FileUploaderButton.js

@@ -17,6 +17,7 @@ var types = require('../../prop-types/types.js');
 var uniqueId = require('../../tools/uniqueId.js');
 var usePrefix = require('../../internal/usePrefix.js');
 var deprecate = require('../../prop-types/deprecate.js');
+var noopFn = require('../../internal/noopFn.js');
 var match = require('../../internal/keyboard/match.js');
 var keys = require('../../internal/keyboard/keys.js');
 
@@ -26,7 +27,6 @@ var cx__default = /*#__PURE__*/_interopDefaultLegacy(cx);
 var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
-function noop() {}
 function FileUploaderButton(_ref) {
   let {
     accept,
@@ -37,7 +37,7 @@ function FileUploaderButton(_ref) {
     id,
     labelText: ownerLabelText = 'Add file',
     multiple = false,
-    onChange = noop,
+    onChange = noopFn.noopFn,
     name,
     size = 'md',
     // eslint-disable-next-line react/prop-types

package/lib/components/FileUploader/FileUploaderDropContainer.d.ts

@@ -120,12 +120,5 @@ declare namespace FileUploaderDropContainer {
          */
         tabIndex: (props: any, propName: any, componentName: any, ...rest: any[]) => any;
     };
-    var defaultProps: {
-        labelText: string;
-        multiple: boolean;
-        onAddFiles: () => void;
-        accept: never[];
-        pattern: string;
-    };
 }
 export default FileUploaderDropContainer;

package/lib/components/FileUploader/FileUploaderDropContainer.js

@@ -17,6 +17,7 @@ var uniqueId = require('../../tools/uniqueId.js');
 var usePrefix = require('../../internal/usePrefix.js');
 var events = require('../../tools/events.js');
 var deprecate = require('../../prop-types/deprecate.js');
+var noopFn = require('../../internal/noopFn.js');
 var match = require('../../internal/keyboard/match.js');
 var keys = require('../../internal/keyboard/keys.js');
 
@@ -35,7 +36,7 @@ function FileUploaderDropContainer(_ref) {
     labelText = 'Add file',
     multiple = false,
     name,
-    onAddFiles = () => {},
+    onAddFiles = noopFn.noopFn,
     onClick,
     pattern = '.[0-9a-z]+$',
     // eslint-disable-next-line react/prop-types
@@ -209,12 +210,5 @@ FileUploaderDropContainer.propTypes = {
    */
   tabIndex: deprecate["default"](PropTypes__default["default"].number, 'The `tabIndex` prop for `FileUploaderButton` has ' + 'been deprecated since it now renders a button element by default.')
 };
-FileUploaderDropContainer.defaultProps = {
-  labelText: 'Add file',
-  multiple: false,
-  onAddFiles: () => {},
-  accept: [],
-  pattern: '.[0-9a-z]+$'
-};
 
 exports["default"] = FileUploaderDropContainer;

package/lib/components/FileUploader/FileUploaderItem.d.ts

@@ -95,9 +95,5 @@ declare namespace FileUploaderItem {
          */
         uuid: PropTypes.Requireable<string>;
     };
-    var defaultProps: {
-        status: string;
-        onDelete: () => void;
-    };
 }
 export default FileUploaderItem;

package/lib/components/FileUploader/FileUploaderItem.js

@@ -16,8 +16,11 @@ var React = require('react');
 var Filename = require('./Filename.js');
 var uniqueId = require('../../tools/uniqueId.js');
 var usePrefix = require('../../internal/usePrefix.js');
+var noopFn = require('../../internal/noopFn.js');
+require('../Text/index.js');
 require('../Tooltip/DefinitionTooltip.js');
 var Tooltip = require('../Tooltip/Tooltip.js');
+var Text = require('../Text/Text.js');
 var match = require('../../internal/keyboard/match.js');
 var keys = require('../../internal/keyboard/keys.js');
 
@@ -33,7 +36,7 @@ function FileUploaderItem(_ref) {
     name,
     status = 'uploading',
     iconDescription,
-    onDelete = () => {},
+    onDelete = noopFn.noopFn,
     invalid,
     errorSubject,
     errorBody,
@@ -70,11 +73,13 @@ function FileUploaderItem(_ref) {
   }, /*#__PURE__*/React__default["default"].createElement("button", {
     className: `${prefix}--file-filename-button`,
     type: "button"
-  }, /*#__PURE__*/React__default["default"].createElement("p", {
+  }, /*#__PURE__*/React__default["default"].createElement(Text.Text, {
+    as: "p",
     title: name,
     className: `${prefix}--file-filename-button`,
     id: name
-  }, name)))) : /*#__PURE__*/React__default["default"].createElement("p", {
+  }, name)))) : /*#__PURE__*/React__default["default"].createElement(Text.Text, {
+    as: "p",
     title: name,
     className: `${prefix}--file-filename`,
     id: name
@@ -109,9 +114,11 @@ function FileUploaderItem(_ref) {
     className: `${prefix}--form-requirement`,
     role: "alert",
     id: `${name}-id-error`
-  }, /*#__PURE__*/React__default["default"].createElement("div", {
+  }, /*#__PURE__*/React__default["default"].createElement(Text.Text, {
+    as: "div",
     className: `${prefix}--form-requirement__title`
-  }, errorSubject), errorBody && /*#__PURE__*/React__default["default"].createElement("p", {
+  }, errorSubject), errorBody && /*#__PURE__*/React__default["default"].createElement(Text.Text, {
+    as: "p",
     className: `${prefix}--form-requirement__supplement`
   }, errorBody)));
 }
@@ -155,9 +162,5 @@ FileUploaderItem.propTypes = {
    */
   uuid: PropTypes__default["default"].string
 };
-FileUploaderItem.defaultProps = {
-  status: 'uploading',
-  onDelete: () => {}
-};
 
 exports["default"] = FileUploaderItem;

package/lib/components/FileUploader/Filename.d.ts

@@ -4,11 +4,12 @@
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
  */
-/// <reference types="react" />
 import PropTypes from 'prop-types';
+import React from 'react';
 import { ReactAttr } from '../../types/common';
 export type FilenameStatus = 'edit' | 'complete' | 'uploading';
-export interface FilenameProps extends Omit<ReactAttr<HTMLElement>, 'tabIndex'> {
+type SVGAttr = React.SVGAttributes<React.ReactSVGElement>;
+export interface FilenameProps extends Omit<ReactAttr & SVGAttr, 'tabIndex' | 'type'> {
     /**
      * Specify an id that describes the error to be read by screen readers when the filename is invalid
      */
@@ -32,9 +33,9 @@ export interface FilenameProps extends Omit<ReactAttr<HTMLElement>, 'tabIndex'>
     /**
      * Provide a custom tabIndex value for the `<Filename>`
      */
-    tabIndex?: number | string;
+    tabIndex?: number;
 }
-declare function Filename({ iconDescription, status, invalid, name, ['aria-describedby']: ariaDescribedBy, ...rest }: FilenameProps): JSX.Element | null;
+declare function Filename({ iconDescription, status, invalid, name, tabIndex, ['aria-describedby']: ariaDescribedBy, ...rest }: FilenameProps): JSX.Element | null;
 declare namespace Filename {
     var propTypes: {
         /**
@@ -60,12 +61,7 @@ declare namespace Filename {
         /**
          * Provide a custom tabIndex value for the `<Filename>`
          */
-        tabIndex: PropTypes.Requireable<NonNullable<string | number | null | undefined>>;
-    };
-    var defaultProps: {
-        iconDescription: string;
-        status: string;
-        tabIndex: string;
+        tabIndex: PropTypes.Requireable<number>;
     };
 }
 export default Filename;

package/lib/components/FileUploader/Filename.js

@@ -24,10 +24,11 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var _Close;
 function Filename(_ref) {
   let {
-    iconDescription,
-    status,
+    iconDescription = 'Uploading file',
+    status = 'uploading',
     invalid,
     name,
+    tabIndex = 0,
     ['aria-describedby']: ariaDescribedBy,
     ...rest
   } = _ref;
@@ -46,9 +47,9 @@ function Filename(_ref) {
       }), /*#__PURE__*/React__default["default"].createElement("button", _rollupPluginBabelHelpers["extends"]({
         "aria-label": `${iconDescription} - ${name}`,
         className: `${prefix}--file-close`,
-        type: "button"
+        type: "button",
+        tabIndex: tabIndex
       }, rest, {
-        tabIndex: rest.tabIndex !== undefined ? parseInt(rest.tabIndex, 10) : undefined,
         "aria-describedby": invalid ? ariaDescribedBy : undefined
       }), _Close || (_Close = /*#__PURE__*/React__default["default"].createElement(iconsReact.Close, null))));
     case 'complete':
@@ -56,7 +57,7 @@ function Filename(_ref) {
         "aria-label": iconDescription,
         className: `${prefix}--file-complete`
       }, rest, {
-        tabIndex: null
+        tabIndex: -1
       }), iconDescription && /*#__PURE__*/React__default["default"].createElement("title", null, iconDescription));
     default:
       return null;
@@ -86,12 +87,7 @@ Filename.propTypes = {
   /**
    * Provide a custom tabIndex value for the `<Filename>`
    */
-  tabIndex: PropTypes__default["default"].oneOfType([PropTypes__default["default"].number, PropTypes__default["default"].string])
-};
-Filename.defaultProps = {
-  iconDescription: 'Uploading file',
-  status: 'uploading',
-  tabIndex: '0'
+  tabIndex: PropTypes__default["default"].number
 };
 
 exports["default"] = Filename;

package/lib/components/FormGroup/FormGroup.d.ts

@@ -71,10 +71,5 @@ declare const FormGroup: {
          */
         messageText: PropTypes.Requireable<string>;
     };
-    defaultProps: {
-        invalid: boolean;
-        message: boolean;
-        messageText: string;
-    };
 };
 export default FormGroup;

package/lib/components/FormGroup/FormGroup.js

@@ -25,11 +25,11 @@ const FormGroup = _ref => {
   let {
     legendId,
     legendText,
-    invalid,
+    invalid = false,
     children,
     className,
-    message,
-    messageText,
+    message = false,
+    messageText = '',
     ...rest
   } = _ref;
   const prefix = usePrefix.usePrefix();
@@ -78,10 +78,5 @@ FormGroup.propTypes = {
    */
   messageText: PropTypes__default["default"].string
 };
-FormGroup.defaultProps = {
-  invalid: false,
-  message: false,
-  messageText: ''
-};
 
 exports["default"] = FormGroup;

package/lib/components/FormItem/FormItem.d.ts

@@ -0,0 +1,32 @@
+/**
+ * Copyright IBM Corp. 2016, 2023
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import PropTypes from 'prop-types';
+import React from 'react';
+type FormItemProps = {
+    /**
+     * Provide content to be rendered in the form item
+     */
+    children?: React.ReactNode;
+    /**
+     * Provide a custom className to be applied to the containing node
+     */
+    className?: string;
+};
+declare function FormItem({ className, children, ...rest }: FormItemProps): JSX.Element;
+declare namespace FormItem {
+    var propTypes: {
+        /**
+         * Provide content to be rendered in the form item
+         */
+        children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        /**
+         * Provide a custom className to be applied to the containing node
+         */
+        className: PropTypes.Requireable<string>;
+    };
+}
+export default FormItem;

package/lib/components/FormItem/index.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Copyright IBM Corp. 2016, 2023
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+import FormItem from './FormItem';
+export default FormItem;
+export { FormItem };