carbon-react 105.2.0 → 106.0.2

package/lib/__internal__/utils/helpers/events/events.d.ts

@@ -1,32 +1,133 @@
+/**
+ * JavaScript Events
+ *
+ * A collection of functions to be used with events.
+ *
+ * E.g. The KeyPress event has different implementations accross browsers, so
+ * this class contains methods to polyfill this functionality to ensure a standardised
+ * implementation between browsers
+ *
+ */
+declare const Events: {
+    /**
+     * A method to determine if an event is of a particular type
+     * */
+    isEventType: (ev: React.SyntheticEvent | Event, type: string) => boolean;
+    /**
+     * A method to determine whether a key down event was an arrow key
+     * */
+    isNavigationKeyup: (ev: React.KeyboardEvent | KeyboardEvent) => boolean;
+    /**
+     * A method to determine whether a key down event was an enter key
+     * */
+    isEnterKeyup: (ev: React.KeyboardEvent | KeyboardEvent) => boolean;
+    /**
+     * A method to determine whether a key up event is allowed or not.
+     * */
+    isValidKeypress: (ev: React.KeyboardEvent | KeyboardEvent) => boolean;
+    /**
+     * Determines if a number key along the top of the keyboard or a number key on the
+     * keypad is pressed
+     * */
+    isNumberKey: (ev: React.KeyboardEvent | KeyboardEvent) => boolean;
+    /**
+     * Determines if the key pressed is part of the numpad
+     * includes symbols
+     * */
+    isNumpadKey: (ev: React.KeyboardEvent | KeyboardEvent) => boolean;
+    /**
+     * Determines if the key pressed is a alphabet key
+     * Case insensitive
+     * */
+    isAlphabetKey: (ev: React.KeyboardEvent | KeyboardEvent) => boolean;
+    /**
+     * Determines if the key pressed is a valid symbol
+     * */
+    isSymbolKey: (ev: React.KeyboardEvent | KeyboardEvent) => boolean;
+    /**
+     * Determines if the key pressed is a navigation key
+     * */
+    isNavigationKey: (ev: React.KeyboardEvent | KeyboardEvent) => boolean;
+    /**
+     * Determines if the key pressed is a navigation left key
+     * */
+    isLeftKey: (ev: React.KeyboardEvent | KeyboardEvent) => boolean;
+    /**
+     * Determines if the key pressed is a navigation up key
+     * */
+    isUpKey: (ev: React.KeyboardEvent | KeyboardEvent) => boolean;
+    /**
+     * Determines if the key pressed is a navigation right key
+     * */
+    isRightKey: (ev: React.KeyboardEvent | KeyboardEvent) => boolean;
+    /**
+     * Determines if the key pressed is a navigation down key
+     * */
+    isDownKey: (ev: React.KeyboardEvent | KeyboardEvent) => boolean;
+    /**
+     * Determines if the key pressed is a meta key
+     * */
+    isMetaKey: (ev: React.KeyboardEvent | KeyboardEvent) => boolean;
+    /**
+     * Determines if the key pressed is the escape key
+     * */
+    isEscKey: (ev: React.KeyboardEvent | KeyboardEvent) => boolean;
+    /**
+     * Determines if the key pressed is the enter key
+     * */
+    isEnterKey: (ev: React.KeyboardEvent | KeyboardEvent) => boolean;
+    /**
+     * Determines if the key pressed is the tab key
+     * */
+    isTabKey: (ev: React.KeyboardEvent | KeyboardEvent) => boolean;
+    /**
+     * Determines if the key pressed is the backspace key
+     * */
+    isBackspaceKey: (ev: React.KeyboardEvent | KeyboardEvent) => boolean;
+    /**
+     * Determines if the key pressed is the delete key
+     * */
+    isDeleteKey: (ev: React.KeyboardEvent | KeyboardEvent) => boolean;
+    /**
+     * Determines if the key pressed is the backspace or delete key
+     * */
+    isDeletingKey: (ev: React.KeyboardEvent | KeyboardEvent) => boolean;
+    /**
+     * Determines if the key pressed is the shift key
+     * */
+    isShiftKey: (ev: React.KeyboardEvent | KeyboardEvent) => boolean;
+    /**
+     * Determines if the key pressed is the space key
+     * */
+    isSpaceKey: (ev: React.KeyboardEvent | KeyboardEvent) => boolean;
+    /**
+     * Determines if the key pressed is the space key or enter key
+     * */
+    isEnterOrSpaceKey: (ev: React.KeyboardEvent | KeyboardEvent) => boolean;
+    /**
+     * Determines if the key pressed is the period key
+     * */
+    isPeriodKey: (ev: React.KeyboardEvent | KeyboardEvent) => boolean;
+    /**
+     * Determines if the key pressed is the comma key
+     * */
+    isCommaKey: (ev: React.KeyboardEvent | KeyboardEvent) => boolean;
+    /**
+     * Determines if the key pressed is the minus key
+     * */
+    isMinusKey: (ev: React.KeyboardEvent | KeyboardEvent) => boolean;
+    /**
+     * Determines if the key pressed is the home key
+     * */
+    isHomeKey: (ev: React.KeyboardEvent | KeyboardEvent) => boolean;
+    /**
+     * Determines if the key pressed is the end key
+     * */
+    isEndKey: (ev: React.KeyboardEvent | KeyboardEvent) => boolean;
+    /**
+     * Gets the event's path which is an array of the objects on which listeners will be invoked.
+     * @see https://developer.mozilla.org/en-US/docs/Web/API/Event/composedPath
+     */
+    composedPath: (ev: CustomEvent) => EventTarget[];
+};
 export default Events;
-declare namespace Events {
-    function isEventType(ev: Event, type: Type): boolean;
-    function isNavigationKeyup(ev: Event): boolean;
-    function isEnterKeyup(ev: Event): boolean;
-    function isValidKeypress(ev: Event): boolean;
-    function isNumberKey(ev: Event): boolean;
-    function isNumpadKey(ev: Event): boolean;
-    function isAlphabetKey(ev: Event): boolean;
-    function isSymbolKey(ev: Event): boolean;
-    function isNavigationKey(ev: Event): boolean;
-    function isLeftKey(ev: Event): boolean;
-    function isUpKey(ev: Event): boolean;
-    function isRightKey(ev: Event): boolean;
-    function isDownKey(ev: Event): boolean;
-    function isMetaKey(ev: Event): boolean;
-    function isEscKey(ev: Event): boolean;
-    function isEnterKey(ev: Event): boolean;
-    function isTabKey(ev: Event): boolean;
-    function isBackspaceKey(ev: Event): boolean;
-    function isDeleteKey(ev: Event): boolean;
-    function isDeletingKey(ev: Event): boolean;
-    function isShiftKey(ev: Event): boolean;
-    function isSpaceKey(ev: Event): boolean;
-    function isEnterOrSpaceKey(ev: Event): boolean;
-    function isPeriodKey(ev: Event): boolean;
-    function isCommaKey(ev: Event): boolean;
-    function isMinusKey(ev: Event): boolean;
-    function isHomeKey(ev: Event): boolean;
-    function isEndKey(ev: Event): boolean;
-    function composedPath(ev: Event): EventTarget[];
-}

package/lib/__internal__/utils/helpers/events/events.js

@@ -18,16 +18,10 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
  * this class contains methods to polyfill this functionality to ensure a standardised
  * implementation between browsers
  *
- * @object Events
  */
 const Events = {
   /**
    * A method to determine if an event is of a particular type
-   *
-   * @method isEventType
-   * @param {Event} ev A JavaScript event
-   * @param {Type} type A JavaScript event type
-   * @returns {Boolean} true if event type matches passed type
    * */
   isEventType: (ev, type) => {
     return ev.type === type;
@@ -35,10 +29,6 @@ const Events = {
 
   /**
    * A method to determine whether a key down event was an arrow key
-   *
-   * @method isNavigationKeyup
-   * @param {Event} ev A JavaScript event
-   * @returns {Boolean} true if key up event and a navigation key
    * */
   isNavigationKeyup: ev => {
     if (!Events.isEventType(ev, "keyup")) {
@@ -50,10 +40,6 @@ const Events = {
 
   /**
    * A method to determine whether a key down event was an enter key
-   *
-   * @method isEnterKeyup
-   * @param {Event} ev A JavaScript event
-   * @returns {Boolean} true if keyup event and enter key
    * */
   isEnterKeyup: ev => {
     if (!Events.isEventType(ev, "keyup")) {
@@ -65,10 +51,6 @@ const Events = {
 
   /**
    * A method to determine whether a key up event is allowed or not.
-   *
-   * @method isValidKeypress
-   * @param {Event} ev A JavaScript event
-   * @returns {Boolean} true if keyup and valid
    * */
   isValidKeypress: ev => {
     if (!Events.isEventType(ev, "keyup")) {
@@ -85,68 +67,46 @@ const Events = {
   /**
    * Determines if a number key along the top of the keyboard or a number key on the
    * keypad is pressed
-   *
-   * @method isNumberKey
-   * @param {Event} ev A JavaScript event
-   * @returns {Boolean} true if valid number key
    * */
   isNumberKey: ev => {
-    const charCode = ev.key.charCodeAt(0);
-    return charCode >= 48 && charCode <= 57;
+    var _ev$key;
+
+    const charCode = (_ev$key = ev.key) === null || _ev$key === void 0 ? void 0 : _ev$key.charCodeAt(0);
+    return charCode !== undefined && charCode >= 48 && charCode <= 57;
   },
 
   /**
    * Determines if the key pressed is part of the numpad
    * includes symbols
-   *
-   * @method isNumberKey
-   * @param {Event} ev A JavaScript event
-   * @returns {Boolean} true if key is part of numpad
    * */
   isNumpadKey: ev => {
-    return ev.which >= 96 && ev.which <= 111;
+    return ev.which !== undefined && ev.which >= 96 && ev.which <= 111;
   },
 
   /**
    * Determines if the key pressed is a alphabet key
    * Case insensitive
-   *
-   * @method isAlphabetKey
-   * @param {Event} ev A JavaScript event
-   * @returns {Boolean} true if alphabet key is pressed
    * */
   isAlphabetKey: ev => {
-    return ev.which >= 65 && ev.which <= 90;
+    return ev.which !== undefined && ev.which >= 65 && ev.which <= 90;
   },
 
   /**
    * Determines if the key pressed is a valid symbol
-   *
-   * @method isSymbolKey
-   * @param {Event} ev A JavaScript event
-   * @returns {Boolean} true if any symbol key is pressed
    * */
   isSymbolKey: ev => {
-    return ev.which >= 58 && ev.which <= 64 || ev.which >= 106 && ev.which <= 107 || ev.which >= 186 && ev.which <= 192 || ev.which >= 219 && ev.which <= 222; // \ ]
+    return ev.which !== undefined && (ev.which >= 58 && ev.which <= 64 || ev.which >= 106 && ev.which <= 107 || ev.which >= 186 && ev.which <= 192 || ev.which >= 219 && ev.which <= 222);
   },
 
   /**
    * Determines if the key pressed is a navigation key
-   *
-   * @method isNavigationKey
-   * @param {Event} ev A JavaScript event
-   * @returns {Boolean} true if one of four arrow keys
    * */
   isNavigationKey: ev => {
-    return ev.which >= 37 && ev.which <= 40;
+    return ev.which !== undefined && ev.which >= 37 && ev.which <= 40;
   },
 
   /**
    * Determines if the key pressed is a navigation left key
-   *
-   * @method isLeftKey
-   * @param {Event} ev A JavaScript event
-   * @returns {Boolean} true if left arrow key
    * */
   isLeftKey: ev => {
     return ev.which === 37;
@@ -154,10 +114,6 @@ const Events = {
 
   /**
    * Determines if the key pressed is a navigation up key
-   *
-   * @method isUpKey
-   * @param {Event} ev A JavaScript event
-   * @returns {Boolean} true if up arrow key
    * */
   isUpKey: ev => {
     return ev.which === 38;
@@ -165,10 +121,6 @@ const Events = {
 
   /**
    * Determines if the key pressed is a navigation right key
-   *
-   * @method isRightKey
-   * @param {Event} ev A JavaScript event
-   * @returns {Boolean} true if right arrow key
    * */
   isRightKey: ev => {
     return ev.which === 39;
@@ -176,10 +128,6 @@ const Events = {
 
   /**
    * Determines if the key pressed is a navigation down key
-   *
-   * @method isDownKey
-   * @param {Event} ev A JavaScript event
-   * @returns {Boolean} true if down arrow key
    * */
   isDownKey: ev => {
     return ev.which === 40;
@@ -187,21 +135,13 @@ const Events = {
 
   /**
    * Determines if the key pressed is a meta key
-   *
-   * @method isMetaKey
-   * @param {Event} ev A JavaScript event
-   * @returns {Boolean} true if any meta key is pressed
    * */
   isMetaKey: ev => {
-    return ev.metaKey;
+    return !!ev.metaKey;
   },
 
   /**
    * Determines if the key pressed is the escape key
-   *
-   * @method isEscKey
-   * @param {Event} ev A JavaScript event
-   * @returns {Boolean} true if esc key
    * */
   isEscKey: ev => {
     return ev.which === 27;
@@ -209,10 +149,6 @@ const Events = {
 
   /**
    * Determines if the key pressed is the enter key
-   *
-   * @method isEnterKey
-   * @param {Event} ev A JavaScript event
-   * @returns {Boolean} true if enter key
    * */
   isEnterKey: ev => {
     return ev.which === 13;
@@ -220,10 +156,6 @@ const Events = {
 
   /**
    * Determines if the key pressed is the tab key
-   *
-   * @method isTabKey
-   * @param {Event} ev A JavaScript event
-   * @returns {Boolean} true if tab key
    * */
   isTabKey: ev => {
     return ev.which === 9;
@@ -231,10 +163,6 @@ const Events = {
 
   /**
    * Determines if the key pressed is the backspace key
-   *
-   * @method isBackspaceKey
-   * @param {Event} ev A JavaScript event
-   * @returns {Boolean} true if backspace key
    * */
   isBackspaceKey: ev => {
     return ev.key === "Backspace";
@@ -242,10 +170,6 @@ const Events = {
 
   /**
    * Determines if the key pressed is the delete key
-   *
-   * @method isDeleteKey
-   * @param {Event} ev A JavaScript event
-   * @returns {Boolean} true if delete key
    * */
   isDeleteKey: ev => {
     return ev.key === "Delete";
@@ -253,10 +177,6 @@ const Events = {
 
   /**
    * Determines if the key pressed is the backspace or delete key
-   *
-   * @method isDeletingKey
-   * @param {Event} ev A JavaScript event
-   * @returns {Boolean} true if is delete key or backspace key
    * */
   isDeletingKey: ev => {
     return Events.isDeleteKey(ev) || Events.isBackspaceKey(ev);
@@ -264,10 +184,6 @@ const Events = {
 
   /**
    * Determines if the key pressed is the shift key
-   *
-   * @method isShiftKey
-   * @param {Event} ev A JavaScript event
-   * @returns {Boolean} true if shift key
    * */
   isShiftKey: ev => {
     return ev.shiftKey || ev.which === 16;
@@ -275,10 +191,6 @@ const Events = {
 
   /**
    * Determines if the key pressed is the space key
-   *
-   * @method isSpaceKey
-   * @param {Event} ev A JavaScript event
-   * @returns {Boolean} true if space key
    * */
   isSpaceKey: ev => {
     return ev.which === 32;
@@ -286,10 +198,6 @@ const Events = {
 
   /**
    * Determines if the key pressed is the space key or enter key
-   *
-   * @method isEnterOrSpaceKey
-   * @param {Event} ev A JavaScript event
-   * @returns {Boolean} true if space key
    * */
   isEnterOrSpaceKey: ev => {
     return ev.which === 13 || ev.which === 32;
@@ -297,10 +205,6 @@ const Events = {
 
   /**
    * Determines if the key pressed is the period key
-   *
-   * @method isPeriodKey
-   * @param {Event} ev A JavaScript event
-   * @returns {Boolean} true if period key
    * */
   isPeriodKey: ev => {
     return ev.which === 190;
@@ -308,10 +212,6 @@ const Events = {
 
   /**
    * Determines if the key pressed is the comma key
-   *
-   * @method isCommaKey
-   * @param {Event} ev A JavaScript event
-   * @returns {Boolean} true if comma key
    * */
   isCommaKey: ev => {
     return ev.which === 188;
@@ -319,10 +219,6 @@ const Events = {
 
   /**
    * Determines if the key pressed is the minus key
-   *
-   * @method isMinusKey
-   * @param {Event} ev A JavaScript event
-   * @returns {Boolean} true if minus key
    * */
   isMinusKey: ev => {
     return ev.key === "-" || ev.key === "Subtract";
@@ -330,10 +226,6 @@ const Events = {
 
   /**
    * Determines if the key pressed is the home key
-   *
-   * @method isHomeKey
-   * @param {Event} ev A JavaScript event
-   * @returns {Boolean} true if home key
    * */
   isHomeKey: ev => {
     return ev.which === 36;
@@ -341,10 +233,6 @@ const Events = {
 
   /**
    * Determines if the key pressed is the end key
-   *
-   * @method isEndKey
-   * @param {Event} ev A JavaScript event
-   * @returns {Boolean} true if end key
    * */
   isEndKey: ev => {
     return ev.which === 35;
@@ -353,12 +241,9 @@ const Events = {
   /**
    * Gets the event's path which is an array of the objects on which listeners will be invoked.
    * @see https://developer.mozilla.org/en-US/docs/Web/API/Event/composedPath
-   * @method composedPath
-   * @param {Event} ev A Javascript event
-   * @returns {EventTarget[]} objects representing the objects on which an event listener will be invoked
    */
   composedPath: ev => {
-    return ev.path || ev.detail && ev.detail.enzymeTestingTarget && (0, _composedPath.default)(ev) || ev.composedPath && ev.composedPath() || (0, _composedPath.default)(ev);
+    return ev.detail && ev.detail.enzymeTestingTarget && (0, _composedPath.default)(ev) || ev.composedPath && ev.composedPath() || (0, _composedPath.default)(ev);
   }
 };
 var _default = Events;

package/lib/__internal__/utils/helpers/guid/index.d.ts

@@ -0,0 +1,5 @@
+declare const _default: () => string;
+/**
+ * Generates a random guid, useful for creating unique IDs.
+ */
+export default _default;

package/lib/__internal__/utils/helpers/guid/{guid.js → index.js}

@@ -7,8 +7,6 @@ exports.default = void 0;
 
 /**
  * Generates a random guid, useful for creating unique IDs.
- *
- * @method guid
  */
 var _default = () => {
   function s4() {

package/lib/__internal__/utils/helpers/guid/package.json

@@ -1,3 +1,6 @@
 {
-  "main": "./guid.js"
-}
+  "sideEffects": false,
+  "module": "../../../../../esm/__internal__/utils/helpers/guid/index.js",
+  "main": "./index.js",
+  "types": "./index.d.ts"
+}

package/lib/__internal__/utils/helpers/tags/tags-specs/tags-specs.d.ts

@@ -1,2 +1,4 @@
-export function elementsTagTest(wrapper: any, elements: any): void;
-export function rootTagTest(rootNode: any, comp: any, elem: any, role: any): void;
+import { ReactWrapper, ShallowWrapper } from "enzyme";
+declare const elementsTagTest: (wrapper: ReactWrapper, elements: string[]) => void;
+declare const rootTagTest: (rootNode: ReactWrapper | ShallowWrapper, comp: string, elem?: string | undefined, role?: string | undefined) => void;
+export { elementsTagTest, rootTagTest };

package/lib/__internal__/utils/helpers/tags/tags-specs/tags-specs.js

@@ -21,6 +21,7 @@ const rootTagTest = (rootNode, comp, elem, role) => {
   expect(rootNode.prop("data-component")).toEqual(comp);
   expect(rootNode.prop("data-element")).toEqual(elem);
   expect(rootNode.prop("data-role")).toEqual(role);
-};
+}; // eslint-disable-next-line jest/no-export
+
 
 exports.rootTagTest = rootTagTest;

package/lib/__internal__/utils/helpers/tags/tags.d.ts

@@ -1,9 +1,13 @@
-export default tagComponent;
+interface DataProps {
+    "data-element"?: string;
+    "data-role"?: string;
+    [restKeys: string]: any;
+}
+export interface TagProps extends DataProps {
+    "data-component": string;
+}
 /**
  * Builds props object containing top level data tags
- *
- * @param {String} name of component
- * @param {Object} component props
- * @return {Object} dataTagProps
  */
-declare function tagComponent(component: Object, props: any): Object;
+declare function tagComponent(componentName: string, props: DataProps): TagProps;
+export default tagComponent;

package/lib/__internal__/utils/helpers/tags/tags.js

@@ -7,14 +7,10 @@ exports.default = void 0;
 
 /**
  * Builds props object containing top level data tags
- *
- * @param {String} name of component
- * @param {Object} component props
- * @return {Object} dataTagProps
  */
-function tagComponent(component, props) {
+function tagComponent(componentName, props) {
   const tagProps = {
-    "data-component": component
+    "data-component": componentName
   };
 
   if (props["data-element"]) {

package/lib/__internal__/utils/helpers/useUniqueId/index.d.ts

@@ -0,0 +1,2 @@
+declare const _default: (id?: string | undefined, name?: string | undefined) => string[];
+export default _default;

package/lib/__internal__/utils/helpers/useUniqueId/index.js

@@ -0,0 +1,20 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = require("react");
+
+var _guid = _interopRequireDefault(require("../guid"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+var _default = (id, name) => {
+  const createdId = (0, _react.useRef)((0, _guid.default)());
+  const createdName = (0, _react.useRef)((0, _guid.default)());
+  return [id || createdId.current, name || createdName.current];
+};
+
+exports.default = _default;

package/lib/__internal__/utils/helpers/useUniqueId/package.json

@@ -0,0 +1,6 @@
+{
+  "sideEffects": false,
+  "module": "../../../../../esm/__internal__/utils/helpers/useUniqueId/index.js",
+  "main": "./index.js",
+  "types": "./index.d.ts"
+}

package/lib/__internal__/utils/logger/index.d.ts

@@ -1 +1,5 @@
-export { default } from "./logger";
+declare const Logger: {
+    setEnabledState: (newState: boolean) => void;
+    deprecate: (message: string) => void;
+};
+export default Logger;

package/lib/__internal__/utils/logger/index.js

@@ -3,13 +3,31 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-Object.defineProperty(exports, "default", {
-  enumerable: true,
-  get: function () {
-    return _logger.default;
-  }
-});
+exports.default = void 0;
 
-var _logger = _interopRequireDefault(require("./logger"));
+/* eslint-disable no-console */
+// Globally enable the logger
+let enabled = process.env.NODE_ENV !== "production";
+/*
+ * Logger
+ *
+ * Logger function will only output when enabled. By default this
+ * enabled state is set when your NODE_ENV !== 'production'
+ *
+ * Methods
+ * deprecate - console.warn which prepends the message with [Deprecation]
+ *
+ */
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+const Logger = {
+  setEnabledState: newState => {
+    enabled = newState;
+  },
+  deprecate: message => {
+    if (enabled) {
+      console.warn(`[Deprecation] ${message}`);
+    }
+  }
+};
+var _default = Logger;
+exports.default = _default;

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

@@ -13,8 +13,6 @@ var _classnames = _interopRequireDefault(require("classnames"));
 
 var _tags = _interopRequireDefault(require("../../__internal__/utils/helpers/tags/tags"));
 
-var _ether = require("../../__internal__/utils/ether");
-
 var _appWrapper = _interopRequireDefault(require("./app-wrapper.style"));
 
 var _logger = _interopRequireDefault(require("../../__internal__/utils/logger"));
@@ -89,9 +87,12 @@ let AppWrapper = /*#__PURE__*/function (_React$Component) {
   }, {
     key: "render",
     value: function render() {
-      return /*#__PURE__*/_react.default.createElement(_appWrapper.default, _extends({}, (0, _ether.validProps)(this), {
+      const {
+        children
+      } = this.props;
+      return /*#__PURE__*/_react.default.createElement(_appWrapper.default, _extends({}, this.props, {
         className: this.classes()
-      }, (0, _tags.default)("app-wrapper", this.props)), this.props.children);
+      }, (0, _tags.default)("app-wrapper", this.props)), children);
     }
   }]);