feat(react): remove warning dependency in favor of internal module (#…

…8114)

Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>

docs/developer-handbook.md

@@ -706,7 +706,7 @@ pattern that we tend to use:
 ```jsx
 // SomeComponent.js
 // React imports
-import warning from 'warning';
+import { warning } from '../../internal/warning';
 
 let didWarnAboutDeprecation = false;
 

packages/components/src/components/modal/modal.js

@@ -4,6 +4,7 @@
  * 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 warning from 'warning';
 import settings from '../../globals/js/settings';
 import mixin from '../../globals/js/misc/mixin';

packages/react/package.json

@@ -58,7 +58,6 @@
     "lodash.throttle": "^4.1.1",
     "react-is": "^16.8.6",
     "use-resize-observer": "^6.0.0",
-    "warning": "^3.0.0",
     "window-or-global": "^1.0.1"
   },
   "devDependencies": {

packages/react/src/components/OverflowMenuItem/OverflowMenuItem.js

@@ -5,12 +5,12 @@
  * LICENSE file in the root directory of this source tree.
  */
 
+import { settings } from 'carbon-components';
+import classNames from 'classnames';
 import PropTypes from 'prop-types';
 import React from 'react';
-import classNames from 'classnames';
-import warning from 'warning';
-import { settings } from 'carbon-components';
 import { match, keys } from '../../internal/keyboard';
+import { warning } from '../../internal/warning';
 import deprecate from '../../prop-types/deprecate.js';
 
 const { prefix } = settings;

packages/react/src/components/RadioButton/RadioButton.js

@@ -5,11 +5,11 @@
  * LICENSE file in the root directory of this source tree.
  */
 
+import { settings } from 'carbon-components';
+import classNames from 'classnames';
 import PropTypes from 'prop-types';
 import React from 'react';
-import classNames from 'classnames';
-import warning from 'warning';
-import { settings } from 'carbon-components';
+import { warning } from '../../internal/warning';
 import uid from '../../tools/uniqueId';
 
 const { prefix } = settings;

packages/react/src/components/RadioButtonGroup/RadioButtonGroup.js

@@ -9,7 +9,7 @@ import PropTypes from 'prop-types';
 import React from 'react';
 import classNames from 'classnames';
 import RadioButton from '../RadioButton';
-import warning from 'warning';
+import { warning } from '../../internal/warning';
 import { settings } from 'carbon-components';
 
 const { prefix } = settings;

packages/react/src/components/SearchFilterButton/SearchFilterButton-test.js

@@ -17,9 +17,7 @@ describe('[Deprecated] SearchFilterButton', () => {
   let wrapper;
 
   beforeEach(() => {
-    jest.mock('warning', () => {
-      return jest.fn();
-    });
+    jest.mock('../../internal/warning');
     SearchFilterButton = require('../SearchFilterButton').default;
     wrapper = mount(<SearchFilterButton labelText="testlabel" />);
   });

packages/react/src/components/SearchFilterButton/SearchFilterButton.js

@@ -5,11 +5,11 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-import React from 'react';
-import PropTypes from 'prop-types';
-import warning from 'warning';
-import { settings } from 'carbon-components';
 import { Filter16 } from '@carbon/icons-react';
+import { settings } from 'carbon-components';
+import PropTypes from 'prop-types';
+import React from 'react';
+import { warning } from '../../internal/warning';
 
 const { prefix } = settings;
 

packages/react/src/components/SearchLayoutButton/SearchLayoutButton-test.js

@@ -17,9 +17,7 @@ describe('[Deprecated] SearchLayoutButton', () => {
   let wrapper;
 
   beforeEach(() => {
-    jest.mock('warning', () => {
-      return jest.fn();
-    });
+    jest.mock('../../internal/warning');
     SearchLayoutButton = require('../SearchLayoutButton').default;
     wrapper = mount(<SearchLayoutButton labelText="testlabel" />);
   });

packages/react/src/components/SearchLayoutButton/SearchLayoutButton.js

@@ -5,11 +5,11 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-import React, { Component } from 'react';
-import PropTypes from 'prop-types';
-import warning from 'warning';
-import { settings } from 'carbon-components';
 import { ListBulleted16, Grid16 } from '@carbon/icons-react';
+import { settings } from 'carbon-components';
+import PropTypes from 'prop-types';
+import React, { Component } from 'react';
+import { warning } from '../../internal/warning';
 
 const { prefix } = settings;
 

packages/react/src/components/TileGroup/TileGroup.js

@@ -5,11 +5,11 @@
  * LICENSE file in the root directory of this source tree.
  */
 
+import { settings } from 'carbon-components';
 import PropTypes from 'prop-types';
 import React from 'react';
 import RadioTile from '../RadioTile';
-import warning from 'warning';
-import { settings } from 'carbon-components';
+import { warning } from '../../internal/warning';
 
 const { prefix } = settings;
 

packages/react/src/components/ToggleSmall/ToggleSmall-test.js

@@ -16,9 +16,7 @@ describe('ToggleSmall', () => {
   let ToggleSmall;
 
   beforeEach(() => {
-    jest.mock('warning', () => {
-      return jest.fn();
-    });
+    jest.mock('../../internal/warning');
 
     ToggleSmall = require('../ToggleSmall').default;
   });

packages/react/src/components/ToggleSmall/ToggleSmall.js

@@ -5,12 +5,12 @@
  * LICENSE file in the root directory of this source tree.
  */
 
+import { settings } from 'carbon-components';
+import classNames from 'classnames';
 import PropTypes from 'prop-types';
 import React from 'react';
-import classNames from 'classnames';
-import { settings } from 'carbon-components';
 import { keys, match } from '../../internal/keyboard';
-import warning from 'warning';
+import { warning } from '../../internal/warning';
 
 const { prefix } = settings;
 

packages/react/src/components/Toolbar/Toolbar-test.js

@@ -22,9 +22,7 @@ describe('[Deprecated] Toolbar', () => {
 
   beforeEach(() => {
     // Toolbar is deprecated
-    jest.mock('warning', () => {
-      return jest.fn();
-    });
+    jest.mock('../../internal/warning');
 
     Toolbar = require('../Toolbar').default;
     ToolbarItem = require('../Toolbar').ToolbarItem;

packages/react/src/components/Toolbar/Toolbar.js

@@ -10,7 +10,7 @@ import PropTypes from 'prop-types';
 import ToolbarSearch from '../ToolbarSearch';
 import classNames from 'classnames';
 import { settings } from 'carbon-components';
-import warning from 'warning';
+import { warning } from '../../internal/warning';
 
 const { prefix } = settings;
 

packages/react/src/components/ToolbarSearch/ToolbarSearch.js

@@ -11,7 +11,7 @@ import classNames from 'classnames';
 import { Search16 } from '@carbon/icons-react';
 import { settings } from 'carbon-components';
 import ClickListener from '../../internal/ClickListener';
-import warning from 'warning';
+import { warning } from '../../internal/warning';
 
 const { prefix } = settings;
 

packages/react/src/internal/FloatingMenu.js

@@ -5,14 +5,14 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-import warning from 'warning';
 import PropTypes from 'prop-types';
 import React from 'react';
 import ReactDOM from 'react-dom';
 import window from 'window-or-global';
 import { settings } from 'carbon-components';
 import OptimizedResize from './OptimizedResize';
 import { selectorFocusable, selectorTabbable } from './keyboard/navigation';
+import { warning } from './warning';
 import wrapFocus from './wrapFocus';
 
 const { prefix } = settings;

packages/react/src/internal/__mocks__/warning.js

@@ -0,0 +1,10 @@
+/**
+ * Copyright IBM Corp. 2016, 2018
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+module.exports = {
+  warning: jest.fn(),
+};

packages/react/src/internal/useControllableState.js

@@ -6,7 +6,7 @@
  */
 
 import { useEffect, useRef, useState } from 'react';
-import { warn } from './warn';
+import { warning } from './warning';
 
 export function useControllableState(
   controlledState,
@@ -47,7 +47,7 @@ export function useControllableState(
     // Uncontrolled -> Controlled
     // If the component prop is uncontrolled, the prop value should be undefined
     if (controlled.current === false && controlledState !== undefined) {
-      warn(
+      warning(
         false,
         'A component is changing an uncontrolled component to be controlled. ' +
           'This is likely caused by the value changing to a defined value ' +
@@ -60,7 +60,7 @@ export function useControllableState(
     // Controlled -> Uncontrolled
     // If the component prop is controlled, the prop value should be defined
     if (controlled.current === true && controlledState === undefined) {
-      warn(
+      warning(
         false,
         'A component is changing a controlled component to be uncontrolled. ' +
           'This is likely caused by the value changing to an undefined value ' +

packages/react/src/prop-types/__tests__/deprecate-test.js

@@ -13,8 +13,8 @@ describe('deprecate', () => {
 
   beforeEach(() => {
     jest.resetModules();
-    jest.mock('warning');
-    warning = require('warning');
+    jest.mock('../../internal/warning');
+    warning = require('../../internal/warning').warning;
     deprecate = require('../deprecate').default;
     mockPropType = jest.fn();
     mockArgs = [{ propName: true }, 'propName', 'ComponentName'];

packages/react/src/prop-types/deprecate.js

@@ -5,7 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-import warning from 'warning';
+import { warning } from '../internal/warning';
 
 const didWarnAboutDeprecation = {};
 

yarn.lock

@@ -9259,7 +9259,6 @@ __metadata:
     string-replace-loader: ^2.1.0
     terser-webpack-plugin: ^2.3.2
     use-resize-observer: ^6.0.0
-    warning: ^3.0.0
     webpack: ^4.41.5
     whatwg-fetch: ^2.0.3
     window-or-global: ^1.0.1