Merge fc9ce99 into 6268407

.eslintrc

@@ -135,7 +135,7 @@ rules:
     react/sort-prop-types: [2, { 'callbacksLast' : true, 'ignoreCase' : true, 'requiredFirst' : true, } ]
     semi-spacing: 2
     semi: 2
-    #sort-imports: [2, { 'ignoreCase': true, 'ignoreMemberSort': false, 'memberSyntaxSortOrder': ['none', 'single', 'multiple', 'all'] }]
+    sort-imports: [2, { 'ignoreCase': true, 'ignoreMemberSort': false, 'memberSyntaxSortOrder': ['none', 'single', 'multiple', 'all'] }]
     space-before-blocks: 2
     space-before-function-paren: [2, 'never']
     space-infix-ops: 2

src/ActionBar/ActionBar.Component.js

@@ -1,6 +1,6 @@
 import React from 'react';
-import { ActionBar, ActionBarBack, ActionBarHeader, ActionBarActions, Button, Popover, Menu, MenuList, MenuItem } from '../';
-import { DocsTile, DocsText, Separator, Header, Description, Import, Properties } from '../_playground';
+import { ActionBar, ActionBarActions, ActionBarBack, ActionBarHeader, Button, Menu, MenuItem, MenuList, Popover } from '../';
+import { Description, DocsText, DocsTile, Header, Import, Properties, Separator } from '../_playground';
 
 export const ActionBarComponent = () => {
     const actionBarBackBtnCode = `<ActionBar>

src/ActionBar/ActionBar.js

@@ -1,5 +1,5 @@
-import React from 'react';
 import PropTypes from 'prop-types';
+import React from 'react';
 
 export const ActionBar = ({ mobile, width, children, className, ...props }) => {
 

src/ActionBar/ActionBar.test.js

@@ -3,9 +3,9 @@ import React from 'react';
 import renderer from 'react-test-renderer';
 import {
     ActionBar,
+    ActionBarActions,
     ActionBarBack,
-    ActionBarHeader,
-    ActionBarActions
+    ActionBarHeader
 } from './ActionBar';
 
 describe('<ActionBar />', () => {

src/Alert/Alert.Component.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { Alert, Icon } from '../';
-import { DocsTile, DocsText, Separator, Header, Description, Import, Properties, Playground } from '../_playground';
+import { Description, DocsText, DocsTile, Header, Import, Playground, Properties, Separator } from '../_playground';
 
 export const AlertComponent = () => {
     const defaultAlertCode = '<Alert dismissable link="#" linkText="link">Default alert with a </Alert>';

src/Alert/Alert.js

@@ -1,5 +1,5 @@
-import React, { Component } from 'react';
 import PropTypes from 'prop-types';
+import React, { Component } from 'react';
 
 export class Alert extends Component {
     constructor(props) {

src/Alert/Alert.test.js

@@ -1,7 +1,7 @@
+import { Alert } from './Alert';
 import React from 'react';
 import renderer from 'react-test-renderer';
 import { mount, shallow } from 'enzyme';
-import { Alert } from './Alert';
 
 describe('<Alert />', () => {
     const basicAlert = (

src/Badge/Badge.Component.js

@@ -1,6 +1,6 @@
 import React from 'react';
-import { Badge, Label, Status, Counter, Button } from '../';
-import { DocsTile, DocsText, Separator, Header, Description, Import, Properties, Playground } from '../_playground';
+import { Badge, Button, Counter, Label, Status } from '../';
+import { Description, DocsText, DocsTile, Header, Import, Playground, Properties, Separator } from '../_playground';
 
 export const BadgeComponent = () => {
     const defaultBadgeCode = `<Badge>Default</Badge>

src/Badge/Badge.js

@@ -1,5 +1,5 @@
-import React from 'react';
 import PropTypes from 'prop-types';
+import React from 'react';
 
 export const Badge = ({ type, modifier, children, className, ...props }) => {
     return (

src/Badge/Badge.test.js

@@ -1,7 +1,7 @@
 import { mount } from 'enzyme';
 import React from 'react';
 import renderer from 'react-test-renderer';
-import { Badge, Label, Status, Counter } from './Badge';
+import { Badge, Counter, Label, Status } from './Badge';
 
 describe('<Badge />', () => {
     const defaultBadge = <Badge>Default</Badge>;

src/Breadcrumb/Breadcrumb.Component.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { Breadcrumb, BreadcrumbItem } from '../';
-import { DocsTile, DocsText, Separator, Header, Description, Import } from '../_playground';
+import { Description, DocsText, DocsTile, Header, Import, Separator } from '../_playground';
 
 export const BreadcrumbComponent = () => {
     const breadcrumbHrefCode = `<Breadcrumb>

src/Breadcrumb/Breadcrumb.js

@@ -1,5 +1,5 @@
-import React from 'react';
 import PropTypes from 'prop-types';
+import React from 'react';
 import { BrowserRouter, Link } from 'react-router-dom';
 
 export const Breadcrumb = props => {

src/Breadcrumb/Breadcrumb.test.js

@@ -1,7 +1,7 @@
+import { MemoryRouter } from 'react-router-dom';
 import { mount } from 'enzyme';
 import React from 'react';
 import renderer from 'react-test-renderer';
-import { MemoryRouter } from 'react-router-dom';
 import { Breadcrumb, BreadcrumbItem } from './Breadcrumb';
 
 describe('<Breadcrumb />', () => {

src/Button/Button.Component.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { Button, ButtonGroup } from '../';
-import { DocsTile, DocsText, Separator, Header, Description, Import, Properties, Playground } from '../_playground';
+import { Description, DocsText, DocsTile, Header, Import, Playground, Properties, Separator } from '../_playground';
 
 export const ButtonComponent = () => {
     const buttonOptionsCode = `<Button option="emphasized" onClick={() => clickBtnHandler('Emphasized')}>

src/Button/Button.js

@@ -1,5 +1,5 @@
-import React from 'react';
 import PropTypes from 'prop-types';
+import React from 'react';
 
 export const Button = ({
     option,

src/Calendar/Calendar.Component.js

@@ -1,6 +1,6 @@
+import { Calendar } from '../';
 import React from 'react';
-import { DocsTile, DocsText, Separator, Header, Description, Import, Properties } from '../_playground';
-import {Calendar} from '../';
+import { Description, DocsText, DocsTile, Header, Import, Properties, Separator } from '../_playground';
 
 export const CalendarComponent = () => {
 

src/Calendar/Calendar.js

@@ -1,5 +1,5 @@
-import React, { Component } from 'react';
 import PropTypes from 'prop-types';
+import React, { Component } from 'react';
 
 export class Calendar extends Component {
 

src/Calendar/Calendar.test.js

@@ -1,6 +1,6 @@
+import { Calendar } from '../Calendar/Calendar';
 import { mount } from 'enzyme';
 import React from 'react';
-import { Calendar } from '../Calendar/Calendar';
 
 describe('<Calendar />', () => {
     const mockOnChange = jest.fn();

src/ComboboxInput/ComboboxInput.Component.js

@@ -1,6 +1,6 @@
 import React from 'react';
-import { DocsTile, DocsText, Separator, Header, Import, Properties } from '../_playground';
-import { Menu, MenuItem, MenuList, ComboboxInput } from '../';
+import { ComboboxInput, Menu, MenuItem, MenuList } from '../';
+import { DocsText, DocsTile, Header, Import, Properties, Separator } from '../_playground';
 
 export const ComboboxInputComponent = () => {
     const comboboxInputCode = `<ComboboxInput

src/ComboboxInput/ComboboxInput.js

@@ -1,6 +1,6 @@
-import React from 'react';
-import PropTypes from 'prop-types';
 import { Popover } from '../Popover/Popover';
+import PropTypes from 'prop-types';
+import React from 'react';
 
 // ------------------------------------------- Combobox Input ------------------------------------------
 export const ComboboxInput = ({ placeholder, menu, compact, className, ...props }) => {

src/ComboboxInput/ComboboxInput.test.js

@@ -1,7 +1,7 @@
+import { ComboboxInput } from './ComboboxInput';
 import { mount } from 'enzyme';
 import React from 'react';
 import renderer from 'react-test-renderer';
-import { ComboboxInput } from './ComboboxInput';
 import { Menu, MenuItem, MenuList } from '../Menu/Menu';
 
 describe('<ComboboxInput />', () => {

src/ContextualMenu/ContextualMenu.Component.js

@@ -1,6 +1,6 @@
 import React from 'react';
-import { DocsTile, DocsText, Separator, Header, Description } from '../_playground';
-import { Popover, Button, Menu, MenuList, MenuItem } from '../';
+import { Button, Menu, MenuItem, MenuList, Popover } from '../';
+import { Description, DocsText, DocsTile, Header, Separator } from '../_playground';
 
 export const ContextualMenuComponent = () => {
     const contextualMenuIconCode = `<Popover

src/DatePicker/DatePicker.Component.js

@@ -1,6 +1,6 @@
-import React from 'react';
-import { DocsTile, DocsText, Separator, Header, Description, Import, Properties } from '../_playground';
 import { DatePicker } from '../';
+import React from 'react';
+import { Description, DocsText, DocsTile, Header, Import, Properties, Separator } from '../_playground';
 
 export const DatePickerComponent = () => {
     const defaultDatePickerCode = `<DatePicker disableBeforeDate={new Date(2018, 11, 24, 0, 0, 0, 0)} disableWeekends={true} />

src/DatePicker/DatePicker.js

@@ -1,6 +1,6 @@
-import React, { Component } from 'react';
-import PropTypes from 'prop-types';
 import { Calendar } from '../Calendar/Calendar';
+import PropTypes from 'prop-types';
+import React, { Component } from 'react';
 
 export class DatePicker extends Component {
     constructor(props) {

src/DatePicker/DatePicker.test.js

@@ -1,6 +1,6 @@
+import { DatePicker } from '../DatePicker/DatePicker';
 import { mount } from 'enzyme';
 import React from 'react';
-import { DatePicker } from '../DatePicker/DatePicker';
 
 describe('<DatePicker />', () => {
     const defaultDatePicker = <DatePicker />;

src/Dropdown/Dropdown.Component.js

@@ -1,6 +1,6 @@
 import React from 'react';
-import { DocsTile, DocsText, Separator, Header, Description, Import, Properties } from '../_playground';
-import { Dropdown, Popover, Button, Menu, MenuList, MenuItem } from '../';
+import { Button, Dropdown, Menu, MenuItem, MenuList, Popover } from '../';
+import { Description, DocsText, DocsTile, Header, Import, Properties, Separator } from '../_playground';
 
 export const DropdownComponent = () => {
     const defaultDropdownCode = `<Dropdown>

src/Dropdown/Dropdown.js

@@ -1,5 +1,5 @@
-import React from 'react';
 import PropTypes from 'prop-types';
+import React from 'react';
 
 export const Dropdown = props => {
     const { standard, children, className } = props;

src/Dropdown/Dropdown.test.js

@@ -1,9 +1,9 @@
-import React from 'react';
-import renderer from 'react-test-renderer';
+import { Button } from '../Button/Button';
 import { Dropdown } from './Dropdown';
 import { Popover } from '../Popover/Popover';
+import React from 'react';
+import renderer from 'react-test-renderer';
 import { Menu, MenuItem, MenuList } from '../Menu/Menu';
-import { Button } from '../Button/Button';
 
 describe('<Dropdown />', () => {
     const defaultMenu = (

src/Forms/Forms.Component.js

@@ -1,17 +1,6 @@
 import React from 'react';
-import {
-    FormSet,
-    FormItem,
-    FormLabel,
-    FormInput,
-    FormRadio,
-    FormTextarea,
-    FormMessage,
-    FormSelect,
-    FormFieldset,
-    FormLegend
-} from '../';
-import { DocsTile, DocsText, Separator, Header, Description, Import, Properties } from '../_playground';
+import { Description, DocsText, DocsTile, Header, Import, Properties, Separator } from '../_playground';
+import { FormFieldset, FormInput, FormItem, FormLabel, FormLegend, FormMessage, FormRadio, FormSelect, FormSet, FormTextarea} from '../';
 
 export const FormsComponent = () => {
     const inputsCode = `<FormSet>

src/Forms/Forms.js

@@ -1,5 +1,5 @@
-import React, { Component } from 'react';
 import PropTypes from 'prop-types';
+import React, { Component } from 'react';
 
 // ------------------------------------------------- Form Set -----------------------------------------------
 export const FormSet = ({ children, className }) => {

src/Forms/Forms.test.js

@@ -1,18 +1,7 @@
 import { mount } from 'enzyme';
 import React from 'react';
 import renderer from 'react-test-renderer';
-import {
-    FormFieldset,
-    FormInput,
-    FormItem,
-    FormLabel,
-    FormLegend,
-    FormMessage,
-    FormRadio,
-    FormSelect,
-    FormSet,
-    FormTextarea
-} from './Forms';
+import { FormFieldset, FormInput, FormItem, FormLabel, FormLegend, FormMessage, FormRadio, FormSelect, FormSet, FormTextarea} from './Forms';
 
 describe('<Forms />', () => {
     const formInput = (

src/Icon/Icon.Component.js

@@ -1,15 +1,6 @@
-import React from 'react';
 import { Icon } from '../';
-import {
-    DocsTile,
-    DocsText,
-    Separator,
-    Header,
-    Description,
-    Import,
-    Properties,
-    Playground
-} from '../_playground';
+import React from 'react';
+import { Description, DocsText, DocsTile, Header, Import, Playground, Properties, Separator } from '../_playground';
 
 export const IconComponent = () => {
     const iconsCode = `<Icon glyph="cart" size="s" />

src/Icon/Icon.js

@@ -1,5 +1,5 @@
-import React from 'react';
 import PropTypes from 'prop-types';
+import React from 'react';
 
 export const Icon = ({ glyph, size, clickHandler, className, ...props }) => {
     return (

src/Icon/Icon.test.js

@@ -1,7 +1,7 @@
+import { Icon } from './Icon';
 import React from 'react';
 import renderer from 'react-test-renderer';
 import { mount, shallow } from 'enzyme';
-import { Icon } from './Icon';
 
 describe('<Icon />', () => {
     const mockOnClick = jest.fn();

src/Identifier/Identifier.Component.js

@@ -1,6 +1,6 @@
-import React from 'react';
 import { Identifier } from '../';
-import { DocsTile, DocsText, Separator, Header, Description, Import, Properties, Playground } from '../_playground';
+import React from 'react';
+import { Description, DocsText, DocsTile, Header, Import, Playground, Properties, Separator } from '../_playground';
 
 
 export const IdentifierComponent = () => {

src/Identifier/Identifier.js

@@ -1,5 +1,5 @@
-import React from 'react';
 import PropTypes from 'prop-types';
+import React from 'react';
 
 export const Identifier = ({ glyph, size, modifier, color, label, backgroundImageUrl, children, className, ...props }) => {
     const styles = {

src/Identifier/Identifier.test.js

@@ -1,7 +1,7 @@
+import { Identifier } from './Identifier';
 import { mount } from 'enzyme';
 import React from 'react';
 import renderer from 'react-test-renderer';
-import { Identifier } from './Identifier';
 
 describe('<Identifier />', () => {
     const defaultIcon = <Identifier glyph='washing-machine' size='s' />;

src/Image/Image.Component.js

@@ -1,6 +1,6 @@
-import React from 'react';
 import { Image } from '../';
-import { DocsTile, DocsText, Separator, Header, Description, Import, Properties, Playground } from '../_playground';
+import React from 'react';
+import { Description, DocsText, DocsTile, Header, Import, Playground, Properties, Separator } from '../_playground';
 
 export const ImageComponent = () => {
     const sizesImageCode = `<Image size="s" photo="https://placeimg.com/400/400/nature"></Image>

src/Image/Image.js

@@ -1,5 +1,5 @@
-import React from 'react';
 import PropTypes from 'prop-types';
+import React from 'react';
 
 export const Image = ({ size, type, photo, className, ...props }) => {
     return (

src/Image/Image.test.js

@@ -1,7 +1,7 @@
+import { Image } from './Image';
 import { mount } from 'enzyme';
 import React from 'react';
 import renderer from 'react-test-renderer';
-import { Image } from './Image';
 
 describe('<Image />', () => {
     const image = (

src/InlineHelp/InlineHelp.Component.js

@@ -1,6 +1,6 @@
-import React from 'react';
 import { InlineHelp } from '../';
-import { DocsTile, DocsText, Separator, Header, Description, Import, Properties } from '../_playground';
+import React from 'react';
+import { Description, DocsText, DocsTile, Header, Import, Properties, Separator } from '../_playground';
 
 
 export const InlineHelpComponent = () => {

src/InlineHelp/InlineHelp.js

@@ -1,5 +1,5 @@
-import React from 'react';
 import PropTypes from 'prop-types';
+import React from 'react';
 
 export const InlineHelp = ({ text, placement, className, ...props }) => {
     return (

src/InlineHelp/InlineHelp.test.js

@@ -1,7 +1,7 @@
+import { InlineHelp } from './InlineHelp';
 import { mount } from 'enzyme';
 import React from 'react';
 import renderer from 'react-test-renderer';
-import { InlineHelp } from './InlineHelp';
 
 describe('<InlineHelp />', () => {
     const defaultInlineHelp = (