carbon-react 88.0.0 → 89.3.0

package/lib/__internal__/input/input.component.js

@@ -38,7 +38,8 @@ const Input = /*#__PURE__*/_react.default.forwardRef(({
   const context = (0, _react.useContext)(_inputBehaviour.InputContext);
   const groupContext = (0, _react.useContext)(_inputBehaviour.InputGroupContext);
   const deferredTimeout = (0, _react.useRef)(null);
-  const input = ref || (0, _react.useRef)(null);
+  let input = (0, _react.useRef)(null);
+  if (ref) input = ref;
   (0, _react.useEffect)(() => {
     if (autoFocus && input.current) input.current.focus();
   }, [autoFocus, input]);

package/lib/__spec_helper__/mock-date-helper.js

@@ -16,7 +16,8 @@ jest.mock("../utils/helpers/date", () => {
     default: (() => {
       const mockTodayDate = "1-1-2019";
       const isoDateFormat = "YYYY-MM-DD";
-      const MockedDateHelper = Object.assign({}, _DateHelper.default);
+      const MockedDateHelper = { ..._DateHelper.default
+      };
 
       MockedDateHelper._parseDate = (value, options) => _DateHelper.default._parseDate(value, options).utc();
 

package/lib/components/action-toolbar/action-toolbar.component.js

@@ -193,13 +193,6 @@ let ActionToolbar = /*#__PURE__*/function (_React$Component) {
   return ActionToolbar;
 }(_react.default.Component);
 
-_defineProperty(ActionToolbar, "contextTypes", {
-  attachActionToolbar: _propTypes.default.func,
-  // tracks the action toolbar component
-  detachActionToolbar: _propTypes.default.func // tracks the action toolbar component
-
-});
-
 ActionToolbar.propTypes = {
   /** The actions to display in the toolbar */
   actions: _propTypes.default.object.isRequired,
@@ -210,5 +203,11 @@ ActionToolbar.propTypes = {
   /** A function to return child components for the action toolbar. */
   children: _propTypes.default.func
 };
+ActionToolbar.contextTypes = {
+  attachActionToolbar: _propTypes.default.func,
+  // tracks the action toolbar component
+  detachActionToolbar: _propTypes.default.func // tracks the action toolbar component
+
+};
 var _default = ActionToolbar;
 exports.default = _default;

package/lib/components/app-wrapper/app-wrapper.component.js

@@ -41,8 +41,6 @@ function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Re
 
 function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
 
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-
 /**
  * Manages the width and containment of your application.
  */
@@ -89,7 +87,7 @@ let AppWrapper = /*#__PURE__*/function (_React$Component) {
   return AppWrapper;
 }(_react.default.Component);
 
-_defineProperty(AppWrapper, "propTypes", {
+AppWrapper.propTypes = {
   /**
    * Children elements
    *
@@ -105,7 +103,6 @@ _defineProperty(AppWrapper, "propTypes", {
    * @type {String}
    */
   className: _propTypes.default.string
-});
-
+};
 var _default = AppWrapper;
 exports.default = _default;

package/lib/components/configurable-items/configurable-item-row/configurable-item-row.component.js

@@ -137,14 +137,6 @@ let ConfigurableItemRow = /*#__PURE__*/function (_React$Component) {
 }(_react.default.Component);
 
 exports.ConfigurableItemRowWithoutHOC = ConfigurableItemRow;
-
-_defineProperty(ConfigurableItemRow, "contextTypes", {
-  dragDropManager: _propTypes.default.object,
-  // the React DND DragDropManager
-  dragAndDropActiveIndex: _propTypes.default.number // tracks the currently active index
-
-});
-
 ConfigurableItemRow.propTypes = {
   /** A custom class name for the component. */
   className: _propTypes.default.string,
@@ -167,6 +159,12 @@ ConfigurableItemRow.propTypes = {
   /** An internal prop. Helpful to detect which component should be rendered */
   theme: _propTypes.default.object
 };
+ConfigurableItemRow.contextTypes = {
+  dragDropManager: _propTypes.default.object,
+  // the React DND DragDropManager
+  dragAndDropActiveIndex: _propTypes.default.number // tracks the currently active index
+
+};
 ConfigurableItemRow.defaultProps = {
   theme: _base.default
 };

package/lib/components/configurable-items/configurable-items.component.js

@@ -126,8 +126,7 @@ let ConfigurableItems = /*#__PURE__*/function (_React$Component) {
   return ConfigurableItems;
 }(_react.default.Component);
 
-_defineProperty(ConfigurableItems, "contextType", _i18nContext.default);
-
+ConfigurableItems.contextType = _i18nContext.default;
 ConfigurableItems.propTypes = {
   /** Children elements. */
   children: _propTypes.default.node,

package/lib/components/content/content.component.js

@@ -59,7 +59,7 @@ Content.propTypes = { ...marginPropTypes,
   children: _propTypes.default.node,
 
   /** The title of the content component */
-  title: _propTypes.default.string,
+  title: _propTypes.default.node,
 
   /** Displays the content inline with the title */
   inline: _propTypes.default.bool,

package/lib/components/content/content.d.ts

@@ -14,7 +14,7 @@ export interface ContentProps extends MarginProps {
   /** Displays the content inline with the title */
   inline?: boolean;
   /** The title of the content component */
-  title?: string;
+  title?: React.ReactNode;
   /** Sets a custom width for the title element */
   titleWidth?: string;
   /** Applies a theme to the Content Value: primary, secondary */

package/lib/components/date/date.component.js

@@ -627,8 +627,6 @@ let BaseDateInput = /*#__PURE__*/function (_React$Component) {
 
 exports.BaseDateInput = BaseDateInput;
 
-_defineProperty(BaseDateInput, "contextType", _i18nContext.default);
-
 function generateAdjustedValue({
   value,
   defaultValue,
@@ -686,6 +684,7 @@ function canReturnValue(value, allowEmptyValue, locale, formats, format) {
 }
 
 const DateInput = (0, _withUniqueIdProps.default)(BaseDateInput);
+BaseDateInput.contextType = _i18nContext.default;
 BaseDateInput.propTypes = { ..._textbox.default.propTypes,
   ...marginPropTypes,
 

package/lib/components/date-range/date-range.component.js

@@ -300,8 +300,7 @@ let DateRange = /*#__PURE__*/function (_React$Component) {
   return DateRange;
 }(_react.default.Component);
 
-_defineProperty(DateRange, "contextType", _i18nContext.default);
-
+DateRange.contextType = _i18nContext.default;
 DateRange.propTypes = {
   /** Filtered styled system margin props */
   ...marginPropTypes,

package/lib/components/decimal/decimal.component.js

@@ -281,10 +281,9 @@ let Decimal = /*#__PURE__*/function (_React$Component) {
   return Decimal;
 }(_react.default.Component);
 
-_defineProperty(Decimal, "contextType", _i18nContext.default);
-
 _defineProperty(Decimal, "maxPrecision", 15);
 
+Decimal.contextType = _i18nContext.default;
 Decimal.propTypes = {
   /** Styled-system margin props */
   ...marginPropTypes,

package/lib/components/detail/detail.component.js

@@ -106,7 +106,7 @@ let Detail = /*#__PURE__*/function (_React$Component) {
   return Detail;
 }(_react.default.Component);
 
-_defineProperty(Detail, "propTypes", { ...marginPropTypes,
+Detail.propTypes = { ...marginPropTypes,
 
   /**
    * Custom className
@@ -129,7 +129,6 @@ _defineProperty(Detail, "propTypes", { ...marginPropTypes,
    * The rendered children of the component.
    */
   children: _propTypes.default.node
-});
-
+};
 var _default = Detail;
 exports.default = _default;

package/lib/components/drag-and-drop/custom-drag-layer/custom-drag-layer.js

@@ -146,7 +146,7 @@ let CustomDragLayer = /*#__PURE__*/function (_React$Component) {
   return CustomDragLayer;
 }(_react.default.Component);
 
-_defineProperty(CustomDragLayer, "propTypes", {
+CustomDragLayer.propTypes = {
   /**
    * The dom node being dragged.
    */
@@ -162,8 +162,7 @@ _defineProperty(CustomDragLayer, "propTypes", {
   isDragging: _propTypes.default.bool.isRequired
   /* eslint-enable react/no-unused-prop-types */
 
-});
-
+};
 const UndecoratedCustomDragLayer = CustomDragLayer;
 exports.UndecoratedCustomDragLayer = UndecoratedCustomDragLayer;
 

package/lib/components/drag-and-drop/draggable-context/draggable-context.js

@@ -56,10 +56,6 @@ let DraggableContext = /*#__PURE__*/function (_React$Component) {
 
   var _super = _createSuper(DraggableContext);
 
-  /**
-   * Defines a context object for child components of the draggable context component.
-   * https://facebook.github.io/react/docs/context.html
-   */
   function DraggableContext(_props) {
     var _this;
 
@@ -216,7 +212,7 @@ let DraggableContext = /*#__PURE__*/function (_React$Component) {
   return DraggableContext;
 }(_react.default.Component);
 
-_defineProperty(DraggableContext, "propTypes", {
+DraggableContext.propTypes = {
   /**
    * The element(s) where you want to apply drag
    * and drop functionality
@@ -238,9 +234,13 @@ _defineProperty(DraggableContext, "propTypes", {
    * Prop to enable/disable auto scroll on drag
    */
   autoScroll: _propTypes.default.bool
-});
+};
+/**
+ * Defines a context object for child components of the draggable context component.
+ * https://facebook.github.io/react/docs/context.html
+ */
 
-_defineProperty(DraggableContext, "childContextTypes", {
+DraggableContext.childContextTypes = {
   dragAndDropActiveIndex: _propTypes.default.number,
   // Tracks the currently dragged index
   dragAndDropBeginDrag: _propTypes.default.func,
@@ -251,12 +251,11 @@ _defineProperty(DraggableContext, "childContextTypes", {
   // Callback for when a hover is triggered
   dragAndDropOnDrag: _propTypes.default.func // Callback for when order is changed
 
-});
-
-_defineProperty(DraggableContext, "defaultProps", {
+};
+DraggableContext.defaultProps = {
   customDragLayer: /*#__PURE__*/_react.default.createElement(_customDragLayer.default, null),
   autoScroll: false
-});
+};
 
 var _default = (0, _reactDndLegacy.DragDropContext)((0, _reactDndTouchBackend.default)({
   enableMouseEvents: true

package/lib/components/drag-and-drop/with-drag/with-drag.js

@@ -94,7 +94,7 @@ let WithDrag = /*#__PURE__*/function (_React$Component) {
   return WithDrag;
 }(_react.default.Component);
 
-_defineProperty(WithDrag, "propTypes", {
+WithDrag.propTypes = {
   /**
    * The component that will have drag enabled
    */
@@ -145,13 +145,11 @@ _defineProperty(WithDrag, "propTypes", {
 
   /* eslint-enable react/no-unused-prop-types */
 
-});
-
-_defineProperty(WithDrag, "contextTypes", {
+};
+WithDrag.contextTypes = {
   dragAndDropBeginDrag: _propTypes.default.func,
   dragAndDropEndDrag: _propTypes.default.func
-});
-
+};
 const ItemSource = {
   canDrag(props, monitor) {
     return props.canDrag ? props.canDrag(props, monitor) : true;

package/lib/components/drag-and-drop/with-drop/with-drop.js

@@ -113,7 +113,7 @@ let WithDrop = /*#__PURE__*/function (_React$Component) {
   return WithDrop;
 }(_react.default.Component);
 
-_defineProperty(WithDrop, "propTypes", {
+WithDrop.propTypes = {
   /**
    * The component that will have drop enabled
    */
@@ -166,13 +166,11 @@ _defineProperty(WithDrop, "propTypes", {
    * @ignore
    */
   didDrop: _propTypes.default.func
-});
-
-_defineProperty(WithDrop, "contextTypes", {
+};
+WithDrop.contextTypes = {
   dragAndDropOnDrag: _propTypes.default.func,
   dragAndDropHover: _propTypes.default.func
-});
-
+};
 const ItemTarget = {
   canDrop(props, monitor) {
     return props.canDrop ? props.canDrop(props, monitor) : true;

package/lib/components/flat-table/flat-table-row/flat-table-row.component.js

@@ -53,7 +53,8 @@ const FlatTableRow = /*#__PURE__*/_react.default.forwardRef(({
   moveItem
 }, ref) => {
   const [isExpanded, setIsExpanded] = (0, _react.useState)(expanded);
-  const rowRef = ref || (0, _react.useRef)();
+  let rowRef = (0, _react.useRef)();
+  if (ref) rowRef = ref;
   const firstColumnExpandable = expandableArea === "firstColumn";
   const [stickyCellWidths, setStickyCellWidths] = (0, _react.useState)([]);
   const [leftPositions, setLeftPositions] = (0, _react.useState)([]);

package/lib/components/heading/heading.component.js

@@ -41,8 +41,6 @@ function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Re
 
 function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
 
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-
 const marginPropTypes = (0, _utils.filterStyledSystemMarginProps)(_propTypes2.default.space);
 
 let Heading = /*#__PURE__*/function (_React$Component) {
@@ -202,7 +200,7 @@ let Heading = /*#__PURE__*/function (_React$Component) {
   return Heading;
 }(_react.default.Component);
 
-_defineProperty(Heading, "propTypes", { ...marginPropTypes,
+Heading.propTypes = { ...marginPropTypes,
 
   /**
    * Children elements
@@ -258,12 +256,10 @@ _defineProperty(Heading, "propTypes", { ...marginPropTypes,
    * Pills that will be added after the title.
    */
   pills: _propTypes.default.node
-});
-
-_defineProperty(Heading, "defaultProps", {
+};
+Heading.defaultProps = {
   divider: true,
   separator: false
-});
-
+};
 var _default = Heading;
 exports.default = _default;

package/lib/components/i18n-provider/i18n-provider.d.ts

@@ -1,101 +1,10 @@
 import * as React from "react";
 
+import Locale from "../../locales";
+
 export interface I18nProviderProps {
+  locale: Locale;
   children: React.ReactNode;
-  locale: {
-    locale: () => string;
-    actions: {
-      edit: () => string;
-      delete: () => string;
-      reset: () => string;
-    };
-    actionPopover: {
-      ariaLabel: () => string;
-    };
-    actionToolbar: {
-      selected: () => string;
-    };
-    batchSelection: {
-      selected: (count: number | string) => string;
-    };
-    confirm: {
-      no: () => string;
-      yes: () => string;
-    };
-    date: {
-      formats: {
-        inputs: () => [string];
-        javascript: () => string;
-      };
-    };
-    errors: {
-      messages: {
-        formSummary: (
-          errors: number,
-          warnings: number,
-          type: string
-        ) => [string, string];
-      };
-    };
-    message: {
-      closeButtonAriaLabel: () => string;
-    };
-    numeralDate: {
-      validation: {
-        day: () => string;
-        month: () => string;
-        year: () => string;
-      };
-    };
-    pager: {
-      show: () => string;
-      records: (count: number | string, showNumber: boolean) => string;
-      first: () => string;
-      last: () => string;
-      next: () => string;
-      previous: () => string;
-      pageX: () => string;
-      ofY: (count: string | number) => string;
-    };
-    select: {
-      actionButtonText: () => string;
-      placeholder: () => string;
-      noResultsForTerm: (term: string) => string;
-    };
-    switch: {
-      on: () => string;
-      off: () => string;
-    };
-    table: {
-      noData: () => string;
-    };
-    textEditor: {
-      tooltipMessages: {
-        bold: () => string;
-        italic: () => string;
-        bulletList: () => string;
-        numberList: () => string;
-      };
-      ariaLabels: {
-        bold: () => string;
-        italic: () => string;
-        bulletList: () => string;
-        numberList: () => string;
-      };
-    };
-    titleSelect: {
-      deselect: () => string;
-    };
-    wizards: {
-      multiStep: {
-        buttons: {
-          submit: () => string;
-          next: () => string;
-          back: () => string;
-        };
-      };
-    };
-  };
 }
 
 declare const I18nProvider: React.FunctionComponent<I18nProviderProps>;

package/lib/components/icon/icon.component.js

@@ -113,11 +113,12 @@ const Icon = /*#__PURE__*/_react.default.forwardRef(({
     "data-element": iconType()
   }, (0, _tags.default)("icon", rest), styleProps));
 
+  const {
+    tooltipPosition: tooltipPositionFromContext
+  } = (0, _react.useContext)(_tooltipProvider.TooltipContext);
+
   if (tooltipMessage) {
     const visible = disabled ? false : tooltipVisible;
-    const {
-      tooltipPosition: tooltipPositionFromContext
-    } = (0, _react.useContext)(_tooltipProvider.TooltipContext);
     return /*#__PURE__*/_react.default.createElement(_tooltip.default, {
       message: tooltipMessage,
       position: tooltipPositionFromContext || tooltipPosition,

package/lib/components/mount-in-app/mount-in-app.js

@@ -35,8 +35,6 @@ function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Re
 
 function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
 
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-
 let deprecatedWarnTriggered = false;
 
 let MountInApp = /*#__PURE__*/function (_React$Component) {
@@ -92,7 +90,7 @@ let MountInApp = /*#__PURE__*/function (_React$Component) {
   return MountInApp;
 }(_react.default.Component);
 
-_defineProperty(MountInApp, "propTypes", {
+MountInApp.propTypes = {
   /**
    * Children elements
    */
@@ -102,7 +100,6 @@ _defineProperty(MountInApp, "propTypes", {
    * ID of the element in which the children components will be rendered.
    */
   targetId: _propTypes.default.string
-});
-
+};
 var _default = MountInApp;
 exports.default = _default;

package/lib/components/multi-step-wizard/multi-step-wizard.js

@@ -169,17 +169,17 @@ let MultiStepWizard = /*#__PURE__*/function (_React$Component) {
 
     return _this;
   }
+  /**
+   * Returns wizard object to child components.
+   *
+   * @method getChildContext
+   * @return {void}
+   */
+
 
   _createClass(MultiStepWizard, [{
     key: "getChildContext",
-    value:
-    /**
-     * Returns wizard object to child components.
-     *
-     * @method getChildContext
-     * @return {void}
-     */
-    function getChildContext() {
+    value: function getChildContext() {
       return {
         wizard: {
           nextHandler: this.props.onNext,
@@ -299,7 +299,7 @@ let MultiStepWizard = /*#__PURE__*/function (_React$Component) {
   return MultiStepWizard;
 }(_react.default.Component);
 
-_defineProperty(MultiStepWizard, "propTypes", {
+MultiStepWizard.propTypes = {
   /**
    * Individual steps
    *
@@ -374,9 +374,8 @@ _defineProperty(MultiStepWizard, "propTypes", {
    */
   completed: _propTypes.default.bool // eslint-disable-line react/no-unused-prop-types
 
-});
-
-_defineProperty(MultiStepWizard, "defaultProps", {
+};
+MultiStepWizard.defaultProps = {
   beforeSubmitValidation: null,
   className: "",
   completed: false,
@@ -384,9 +383,8 @@ _defineProperty(MultiStepWizard, "defaultProps", {
   enableInactiveSteps: false,
   onNext: null,
   onBack: null
-});
-
-_defineProperty(MultiStepWizard, "childContextTypes", {
+};
+MultiStepWizard.childContextTypes = {
   /**
    * Defines a context object for child components of this wizard.
    *
@@ -394,7 +392,6 @@ _defineProperty(MultiStepWizard, "childContextTypes", {
    * @type {Object}
    */
   wizard: _propTypes.default.object
-});
-
+};
 var _default = MultiStepWizard;
 exports.default = _default;

package/lib/components/multi-step-wizard/step/step.js

@@ -337,7 +337,7 @@ let Step = /*#__PURE__*/function (_React$Component) {
   return Step;
 }(_react.default.Component);
 
-_defineProperty(Step, "propTypes", {
+Step.propTypes = {
   /**
    * Step number
    *
@@ -404,9 +404,8 @@ _defineProperty(Step, "propTypes", {
    * @type {Node}
    */
   children: _propTypes.default.node
-});
-
-_defineProperty(Step, "defaultProps", {
+};
+Step.defaultProps = {
   children: null,
   className: "",
   defaultButton: true,
@@ -414,11 +413,9 @@ _defineProperty(Step, "defaultProps", {
   extraButtons: [],
   onBack: null,
   onNext: null
-});
-
-_defineProperty(Step, "contextTypes", {
+};
+Step.contextTypes = {
   wizard: _propTypes.default.object
-});
-
+};
 var _default = Step;
 exports.default = _default;