APP-3274 - Update React imports to use standard style.

.storybook/preview.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import addons from '@storybook/addons';
 import { addParameters } from '@storybook/react';
 import { themes } from '@storybook/theming';

spec/components/button/Button.spec.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import { shallow } from 'enzyme';
 
 import Button from '../../../src/components/button/Button';

spec/components/crop-content/CropContent.spec.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import { shallow } from 'enzyme';
 
 import CropContent from '../../../src/components/crop-content/CropContent';

spec/components/date-picker/DatePicker.spec.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import { mount, shallow } from 'enzyme';
 import { act } from 'react-dom/test-utils';
 

spec/components/date-picker/Header.spec.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import { shallow } from 'enzyme';
 
 import Header from '../../../src/components/date-picker/Header';

spec/components/date-picker/keyUtils.spec.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import { shallow } from 'enzyme';
 
 import {

spec/components/expandable-card/ExpandableCard.spec.tsx

@@ -1,5 +1,5 @@
 import { shallow } from 'enzyme';
-import React from 'react';
+import * as React from 'react';
 import { ExpandableCard } from '../../../src/components';
 
 /**

spec/components/icon/icon.spec.tsx

@@ -1,5 +1,5 @@
 import { shallow } from 'enzyme';
-import React from 'react';
+import * as React from 'react';
 import Icon from '../../../src/components/icon';
 
 describe('Icon Component', () => {

spec/components/input/TextArea.spec.tsx

@@ -1,5 +1,5 @@
 import { shallow } from 'enzyme';
-import React from 'react';
+import * as React from 'react';
 import { TextArea } from '../../../src/components';
 import { TextComponent, Types } from '../../../src/components/input/TextComponent';
 

spec/components/input/TextComponent.spec.tsx

@@ -1,5 +1,5 @@
 import { shallow } from 'enzyme';
-import React from 'react';
+import * as React from 'react';
 import { TextComponent, Types } from '../../../src/components/input/TextComponent';
 
 import Icon from '../../../src/components/icon/Icon';

spec/components/input/TextField.spec.tsx

@@ -1,5 +1,5 @@
 import { shallow } from 'enzyme';
-import React from 'react';
+import * as React from 'react';
 import { TextField } from '../../../src/components';
 import { TextComponent, Types } from '../../../src/components/input/TextComponent';
 

spec/components/selection/Checkbox.spec.tsx

@@ -1,5 +1,5 @@
 import { mount, shallow } from 'enzyme';
-import React from 'react';
+import * as React from 'react';
 import { Checkbox } from '../../../src/components';
 import SelectionTypes from '../../../src/components/selection/SelectionTypes';
 import { SelectionInput } from '../../../src/components/selection/SelectionInput';

spec/components/selection/Radio.spec.tsx

@@ -1,5 +1,5 @@
 import { mount, shallow } from 'enzyme';
-import React from 'react';
+import * as React from 'react';
 import { Radio } from '../../../src/components';
 import SelectionTypes from '../../../src/components/selection/SelectionTypes';
 import { SelectionInput } from '../../../src/components/selection/SelectionInput';

spec/components/selection/SelectionInput.spec.tsx

@@ -1,5 +1,5 @@
 import { shallow } from 'enzyme';
-import React from 'react';
+import * as React from 'react';
 import SelectionTypes from '../../../src/components/selection/SelectionTypes';
 
 import { SelectionInput } from '../../../src/components/selection/SelectionInput';

spec/components/tooltip/Tooltip.spec.tsx

@@ -1,5 +1,5 @@
 import { shallow } from 'enzyme';
-import React from 'react';
+import * as React from 'react';
 import Tooltip from '../../../src/components/tooltip';
 
 describe('Tooltip Component', () => {

spec/components/typography/Typography.spec.tsx

@@ -1,5 +1,5 @@
 import { shallow } from 'enzyme';
-import React from 'react';
+import * as React from 'react';
 import Typography from '../../../src/components/typography';
 
 describe('Typography Component', () => {

spec/components/validation/Validation.spec.tsx

@@ -1,5 +1,5 @@
 import { shallow } from 'enzyme';
-import React from 'react';
+import * as React from 'react';
 import { TextField, Validation } from '../../../src/components';
 import { Validators } from '../../../src/core/validators/validators';
 

spec/core/hoc/ResizeDetectDiv.spec.tsx

@@ -1,7 +1,7 @@
 /* eslint-disable @typescript-eslint/no-empty-function */
 
 import { shallow } from 'enzyme';
-import React from 'react';
+import * as React from 'react';
 import { ResizeDetectDivInternal } from '../../../src/core/hoc/ResizeDetectDiv';
 
 describe('ResizeDetectDiv Component', () => {

spec/core/hoc/Scale.spec.tsx

@@ -1,5 +1,5 @@
 import { shallow } from 'enzyme';
-import React from 'react';
+import * as React from 'react';
 import Scale from '../../../src/core/hoc/Scale';
 
 describe('Scale Component', () => {

src/components/button/Button.tsx

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import PropTypes from 'prop-types';
+import * as PropTypes from 'prop-types';
 import classNames from 'classnames';
 
 const prefix = 'tk-button';

src/components/crop-content/CropContent.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import ResizeDetectDiv from '../../core/hoc/ResizeDetectDiv';
-import PropTypes from 'prop-types';
+import * as PropTypes from 'prop-types';
 
 type CropContentProps = {
   children?: React.ReactNode;

src/components/date-picker/DatePicker.tsx

@@ -1,5 +1,6 @@
-import PropTypes from 'prop-types';
-import React, { FunctionComponent, useEffect, useRef, useState } from 'react';
+import * as PropTypes from 'prop-types';
+import * as React from 'react';
+import { FunctionComponent, useEffect, useRef, useState } from 'react';
 import classNames from 'classnames';
 
 import { usePopper } from 'react-popper';

src/components/date-picker/Header.tsx

@@ -1,5 +1,5 @@
-import PropTypes from 'prop-types';
-import React from 'react';
+import * as PropTypes from 'prop-types';
+import * as React from 'react';
 
 import Icon from '../icon/Icon';
 import { addMonths, addYears } from 'date-fns';

src/components/date-picker/utils/propTypesUtils.tsx

@@ -1,4 +1,4 @@
-import PropTypes from 'prop-types';
+import * as PropTypes from 'prop-types';
 
 export const modifierPropTypes = [
   PropTypes.instanceOf(Date),

src/components/expandable-card/ExpandableCard.tsx

@@ -1,4 +1,4 @@
-import PropTypes from 'prop-types';
+import * as PropTypes from 'prop-types';
 import * as React from 'react';
 import styled from 'styled-components';
 

src/components/icon/Icon.tsx

@@ -1,6 +1,7 @@
-import PropTypes from 'prop-types';
+import * as PropTypes from 'prop-types';
+import * as React from 'react';
+import { FunctionComponent } from 'react';
 import classnames from 'classnames';
-import React, { FunctionComponent } from 'react';
 
 export type IconProps = {
   className?: string;

src/components/input/TextArea.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import { TextComponentPropTypes, TextComponent, TextComponentProps, Types } from './TextComponent';
 
 const TextArea:React.FC<TextComponentProps> = (props) => {

src/components/input/TextComponent.tsx

@@ -1,8 +1,9 @@
-import React, { useCallback, useMemo, useState } from 'react';
+import * as React from 'react';
+import { useCallback, useMemo, useState } from 'react';
 import classNames from 'classnames';
 import shortid from 'shortid';
 import styled from 'styled-components';
-import PropTypes from 'prop-types';
+import * as PropTypes from 'prop-types';
 import Icon from '../icon';
 import Tooltip from '../tooltip';
 

src/components/input/TextField.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import { TextComponentPropTypes, TextComponentProps, TextComponent, Types } from './TextComponent';
 
 const TextField:React.FC<TextComponentProps> = (props) => {

src/components/selection/Checkbox.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import SelectionTypes from './SelectionTypes';
 import { SelectionInput, SelectionInputPropTypes } from './SelectionInput';
 

src/components/selection/Radio.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import SelectionTypes from './SelectionTypes';
 import { SelectionInput, SelectionInputPropTypes } from './SelectionInput';
 

src/components/selection/SelectionInput.tsx

@@ -1,5 +1,6 @@
-import React, { useEffect, useMemo, useState } from 'react';
-import PropTypes from 'prop-types';
+import * as React from 'react';
+import { useEffect, useMemo, useState } from 'react';
+import * as PropTypes from 'prop-types';
 import classNames from 'classnames';
 import shortid from 'shortid';
 import SelectionTypes from './SelectionTypes';

src/components/tooltip/Tooltip.tsx

@@ -1,5 +1,6 @@
-import React, { useState } from 'react';
-import PropTypes from 'prop-types';
+import * as React from 'react';
+import { useState } from 'react';
+import * as PropTypes from 'prop-types';
 import { usePopper } from 'react-popper';
 import { CSSTransition } from 'react-transition-group';
 import styled from 'styled-components';

src/components/validation/Validation.tsx

@@ -1,5 +1,5 @@
-import React from 'react';
-import PropTypes from 'prop-types';
+import * as React from 'react';
+import * as PropTypes from 'prop-types';
 import { isEmpty } from 'lodash';
 import classNames from 'classnames';
 import { ValidatorFn } from '../../core/validators/validators';

stories/Button.stories.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import { Button } from '../src/components';
 import Icon from '../src/components/icon/Icon';
 import './stories.scss';

stories/Checkbox.stories.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import { Checkbox } from '../src/components';
 import LabelPlacements from '../src/components/selection/LabelPlacements';
 import SelectionStatus from '../src/components/selection/SelectionStatus';

stories/CropContent.stories.tsx

@@ -1,5 +1,5 @@
 import { withKnobs, number } from '@storybook/addon-knobs';
-import React from 'react';
+import * as React from 'react';
 import { CropContent } from '../src/components';
 
 export const CropContentContainer: React.SFC = () => {

stories/DatePicker.stories.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import { DatePicker, TextField } from '../src/components';
 
 const Template = (args) => {

stories/Docs.stories.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import GettingStartedDoc from '../docs/getting-started.md';
 
 import ReactHtmlParser from 'html-react-parser';

stories/ExpandableCard.stories.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import { ExpandableCard, Button, CropContent } from '../src/components';
 
 export const ExpandableCardContainer: React.SFC = () => {

stories/Icons.stories.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import Icon from '../src/components/icon/Icon';
 
 export const Icons: React.SFC = () => (

stories/Modal.stories.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import { Button, Icon, Modal, Typography } from '../src/components';
 import { ModalBody, ModalFooter, ModalHeader, ModalTitle } from '../src/components';
 

stories/Radio.stories.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import { Radio } from '../src/components';
 import LabelPlacements from '../src/components/selection/LabelPlacements';
 import { action } from '@storybook/addon-actions';

stories/Scale.stories.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import { Button, Checkbox, Radio } from '../src/components';
 import Icon from '../src/components/icon/Icon';
 import './stories.scss';

stories/TextArea.stories.tsx

@@ -1,5 +1,5 @@
 import { withKnobs, boolean, button, text } from '@storybook/addon-knobs';
-import React from 'react';
+import * as React from 'react';
 import { TextArea } from '../src/components';
 import { Validators } from '../src/core/validators/validators';
 

stories/TextField.stories.tsx

@@ -1,5 +1,6 @@
 import { boolean, button, text, withKnobs } from '@storybook/addon-knobs';
-import React, { useState } from 'react';
+import * as React from 'react';
+import { useState } from 'react';
 import { TextField, Icon } from '../src/components';
 
 import { Validators } from '../src/core/validators/validators';

stories/Tooltip.stories.tsx

@@ -1,4 +1,5 @@
-import React, { useState } from 'react';
+import * as React from 'react';
+import { useState } from 'react';
 import { Tooltip } from '../src/components';
 import Icon from '../src/components/icon';
 

stories/Typography.stories.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import Typography from '../src/components/typography';
 
 

stories/Validation.stories.tsx

@@ -1,5 +1,5 @@
 import { withKnobs } from '@storybook/addon-knobs';
-import React from 'react';
+import * as React from 'react';
 import { DatePicker, TextArea, TextField, Validation } from '../src/components';
 import { Validators } from '../src/core/validators/validators';