diff --git a/.eslintrc.json b/.eslintrc.json index 9e33f3a9b5..7b03eac083 100644 --- a/.eslintrc.json +++ b/.eslintrc.json @@ -12,10 +12,7 @@ "modules": true } }, - "plugins": [ - "filenames", - "json" - ], + "plugins": ["filenames", "json"], "env": { "browser": true }, @@ -142,8 +139,6 @@ "func-names": "off", // May consider removing "function-paren-newline": "off", - // TODO: Should be removed - "import/first": "off", // currently used in older files, this should be removed "no-param-reassign": [ 2, diff --git a/components/alert/__tests__/alert.browser-test.jsx b/components/alert/__tests__/alert.browser-test.jsx index 626fab5629..2ad5b3d0a1 100644 --- a/components/alert/__tests__/alert.browser-test.jsx +++ b/components/alert/__tests__/alert.browser-test.jsx @@ -9,13 +9,13 @@ import { unmountComponent, } from '../../../tests/enzyme-helpers'; -chai.use(chaiEnzyme()); - import Alert from '../'; import AlertContainer from '../container'; import Icon from '../../icon'; import IconSettings from '../../icon-settings'; +chai.use(chaiEnzyme()); + class DemoComponent extends Component { constructor (props) { super(props); diff --git a/components/alert/index.jsx b/components/alert/index.jsx index 5b89576dea..b5df41937f 100644 --- a/components/alert/index.jsx +++ b/components/alert/index.jsx @@ -7,14 +7,14 @@ import React from 'react'; import PropTypes from 'prop-types'; +import assign from 'lodash.assign'; +import { shape } from 'airbnb-prop-types'; import classNames from '../../utilities/class-names'; import Button from '../button'; import Icon from '../icon'; import checkProps from './check-props'; import { ALERT } from '../../utilities/constants'; -import assign from 'lodash.assign'; import DOMElementFocus from '../../utilities/dom-element-focus'; -import { shape } from 'airbnb-prop-types'; const propTypes = { /** diff --git a/components/app-launcher/__tests__/section.browser-test.jsx b/components/app-launcher/__tests__/section.browser-test.jsx index bd2da98a3f..c0edc1bd46 100644 --- a/components/app-launcher/__tests__/section.browser-test.jsx +++ b/components/app-launcher/__tests__/section.browser-test.jsx @@ -4,13 +4,13 @@ import chai from 'chai'; import assign from 'lodash.assign'; import TestUtils from 'react-addons-test-utils'; -const expect = chai.expect; -const should = chai.should(); - import IconSettings from '../../icon-settings'; import AppLauncherTile from '../../app-launcher/tile'; import AppLauncherSection from '../../app-launcher/section'; +const expect = chai.expect; +const should = chai.should(); + const { Simulate } = TestUtils; describe('SLDS APP LAUNCHER SECTION *******************************************', () => { diff --git a/components/app-launcher/__tests__/tile.browser-test.jsx b/components/app-launcher/__tests__/tile.browser-test.jsx index 6214a3533a..86d14e9684 100644 --- a/components/app-launcher/__tests__/tile.browser-test.jsx +++ b/components/app-launcher/__tests__/tile.browser-test.jsx @@ -5,12 +5,12 @@ import assign from 'lodash.assign'; import TestUtils from 'react-addons-test-utils'; import IconSettings from '../../icon-settings'; -const expect = chai.expect; -const should = chai.should(); - import AppLauncherTile from '../../app-launcher/tile'; import Icon from '../../icon'; +const expect = chai.expect; +const should = chai.should(); + const { Simulate } = TestUtils; describe('SLDS APP LAUNCHER TILE *******************************************', () => { diff --git a/components/app-launcher/tile.jsx b/components/app-launcher/tile.jsx index 5ee745bcc8..03b57891d0 100644 --- a/components/app-launcher/tile.jsx +++ b/components/app-launcher/tile.jsx @@ -3,28 +3,17 @@ /* eslint-disable jsx-a11y/no-noninteractive-tabindex */ -// # App Launcher Component - -// ## Dependencies - -// ### React import React from 'react'; import PropTypes from 'prop-types'; - -// ### classNames +import isFunction from 'lodash.isfunction'; import classNames from 'classnames'; -// ### Truncate import Truncate from '../utilities/truncate'; -// ### isFunction -import isFunction from 'lodash.isfunction'; - // ## Children import Highlighter from '../utilities/highlighter'; import PopoverTooltip from '../popover-tooltip'; -// ## Constants import { APP_LAUNCHER_TILE } from '../../utilities/constants'; const handleClick = (event, href, onClick) => { diff --git a/components/avatar/__tests__/avatar.browser-test.jsx b/components/avatar/__tests__/avatar.browser-test.jsx index 460cf9cba1..ae0f9c1310 100644 --- a/components/avatar/__tests__/avatar.browser-test.jsx +++ b/components/avatar/__tests__/avatar.browser-test.jsx @@ -10,11 +10,11 @@ import { destroyMountNode, } from '../../../tests/enzyme-helpers'; -chai.use(chaiEnzyme()); - import SLDSAvatar from '../../avatar'; import IconSettings from '../../icon-settings'; +chai.use(chaiEnzyme()); + describe('SLDSAvatar: ', function () { let mountNode; let wrapper; diff --git a/components/button/__tests__/button.browser-test.jsx b/components/button/__tests__/button.browser-test.jsx index 9e9018ab5e..d0496f1d70 100644 --- a/components/button/__tests__/button.browser-test.jsx +++ b/components/button/__tests__/button.browser-test.jsx @@ -5,15 +5,15 @@ import TestUtils from 'react-addons-test-utils'; import { expect } from 'chai'; import assign from 'lodash.assign'; +import SLDSButton from '../../button'; +import IconSettings from '../../icon-settings'; + const { Simulate, findRenderedDOMComponentWithTag, findRenderedDOMComponentWithClass, } = TestUtils; -import SLDSButton from '../../button'; -import IconSettings from '../../icon-settings'; - const mockCallback = sinon.spy(); describe('SLDSButton: ', () => { diff --git a/components/card/private/body.jsx b/components/card/private/body.jsx index 968ea8f4f4..bbf231eeb2 100644 --- a/components/card/private/body.jsx +++ b/components/card/private/body.jsx @@ -5,13 +5,13 @@ import React from 'react'; import PropTypes from 'prop-types'; -import { CARD_BODY } from '../../../utilities/constants'; - // ### classNames // [github.com/JedWatson/classnames](https://github.com/JedWatson/classnames) // This project uses `classnames`, "a simple javascript utility for conditionally joining classNames together." import classNames from 'classnames'; +import { CARD_BODY } from '../../../utilities/constants'; + const CardBody = (props) => (
{props.children} diff --git a/components/combobox/__tests__/combobox.browser-test.jsx b/components/combobox/__tests__/combobox.browser-test.jsx index 246124ac1f..8548cc779f 100644 --- a/components/combobox/__tests__/combobox.browser-test.jsx +++ b/components/combobox/__tests__/combobox.browser-test.jsx @@ -19,12 +19,12 @@ import { // Import your internal dependencies (for example): import Combobox from '../../../components/combobox'; import Icon from '../../../components/icon'; -import filter from '~/components/combobox/filter'; +import filter from '../../../components/combobox/filter'; import KEYS, { keyObjects } from '../../../utilities/key-code'; import LETTERKEYS, { keyObjects as letterKeyObjects, } from '../../../utilities/letter-key-code'; -import IconSettings from '~/components/icon-settings'; +import IconSettings from '../../../components/icon-settings'; /* Set Chai to use chaiEnzyme for enzyme compatible assertions: * https://github.com/producthunt/chai-enzyme diff --git a/components/combobox/combobox.jsx b/components/combobox/combobox.jsx index 74bcb52433..05a870003d 100644 --- a/components/combobox/combobox.jsx +++ b/components/combobox/combobox.jsx @@ -6,13 +6,6 @@ import React from 'react'; import PropTypes from 'prop-types'; -import Dialog from '../utilities/dialog'; -import InnerInput from '../../components/forms/input/private/inner-input'; -import InputIcon from '../icon/input-icon'; -import Menu from './private/menu'; -import Label from '../forms/private/label'; -import SelectedListBox from './private/selected-listbox'; - import assign from 'lodash.assign'; import find from 'lodash.find'; import reject from 'lodash.reject'; @@ -28,6 +21,13 @@ import classNames from 'classnames'; import shortid from 'shortid'; +import Dialog from '../utilities/dialog'; +import InnerInput from '../../components/forms/input/private/inner-input'; +import InputIcon from '../icon/input-icon'; +import Menu from './private/menu'; +import Label from '../forms/private/label'; +import SelectedListBox from './private/selected-listbox'; + import KEYS from '../../utilities/key-code'; import mapKeyEventCallbacks from '../../utilities/key-callbacks'; diff --git a/components/combobox/private/selected-listbox.jsx b/components/combobox/private/selected-listbox.jsx index e9025ac615..eaeec986f6 100644 --- a/components/combobox/private/selected-listbox.jsx +++ b/components/combobox/private/selected-listbox.jsx @@ -4,13 +4,12 @@ import React from 'react'; import PropTypes from 'prop-types'; -import Pill from '../../utilities/pill'; - import classNames from 'classnames'; import isEqual from 'lodash.isequal'; - import { shape } from 'airbnb-prop-types'; +import Pill from '../../utilities/pill'; + const propTypes = { /* * The option object within the selection prop that should have focus. diff --git a/components/date-picker/date-picker.jsx b/components/date-picker/date-picker.jsx index 98e1d2215a..89c5207a12 100644 --- a/components/date-picker/date-picker.jsx +++ b/components/date-picker/date-picker.jsx @@ -4,11 +4,6 @@ import React from 'react'; import PropTypes from 'prop-types'; -import Dialog from '../utilities/dialog'; -import CalendarWrapper from './private/calendar-wrapper'; -import InputIcon from '../icon/input-icon'; -import Input from '../forms/input'; - import assign from 'lodash.assign'; import { shape } from 'airbnb-prop-types'; @@ -27,6 +22,11 @@ import classNames from 'classnames'; // shortid is a short, non-sequential, url-friendly, unique id generator import shortid from 'shortid'; +import Dialog from '../utilities/dialog'; +import CalendarWrapper from './private/calendar-wrapper'; +import InputIcon from '../icon/input-icon'; +import Input from '../forms/input'; + // This component's `checkProps` which issues warnings to developers about properties // when in development mode (similar to React's built in development tools) import checkProps from './check-props'; diff --git a/components/date-picker/private/calendar-wrapper.jsx b/components/date-picker/private/calendar-wrapper.jsx index 2bb6896a8f..502f229b4d 100644 --- a/components/date-picker/private/calendar-wrapper.jsx +++ b/components/date-picker/private/calendar-wrapper.jsx @@ -4,18 +4,18 @@ import React from 'react'; import PropTypes from 'prop-types'; -import Calendar from './calendar'; -import CalendarNavigation from './navigation'; - -import EventUtil from '../../../utilities/event'; -import KEYS from '../../../utilities/key-code'; - // ### classNames // [github.com/JedWatson/classnames](https://github.com/JedWatson/classnames) // This project uses `classnames`, "a simple javascript utility for conditionally // joining classNames together." import classNames from 'classnames'; +import Calendar from './calendar'; +import CalendarNavigation from './navigation'; + +import EventUtil from '../../../utilities/event'; +import KEYS from '../../../utilities/key-code'; + class DatepickerCalendarWrapper extends React.Component { static defaultProps = { selectedDate: new Date(), diff --git a/components/date-picker/private/day.jsx b/components/date-picker/private/day.jsx index 91f678d78d..348b1bffa5 100644 --- a/components/date-picker/private/day.jsx +++ b/components/date-picker/private/day.jsx @@ -4,16 +4,16 @@ import React from 'react'; import PropTypes from 'prop-types'; -import EventUtil from '../../../utilities/event'; -import DateUtil from '../../../utilities/date'; -import KEYS from '../../../utilities/key-code'; - // ### classNames // [github.com/JedWatson/classnames](https://github.com/JedWatson/classnames) // This project uses `classnames`, "a simple javascript utility for conditionally // joining classNames together." import classNames from 'classnames'; +import EventUtil from '../../../utilities/event'; +import DateUtil from '../../../utilities/date'; +import KEYS from '../../../utilities/key-code'; + const handleClick = (event, { date, onSelectDate }) => { onSelectDate(event, { date }); }; diff --git a/components/filter/index.jsx b/components/filter/index.jsx index 5491ab1831..e0a890afdf 100644 --- a/components/filter/index.jsx +++ b/components/filter/index.jsx @@ -21,17 +21,17 @@ import assign from 'lodash.assign'; // ### classNames import classNames from 'classnames'; +// ### shortid +// [npmjs.com/package/shortid](https://www.npmjs.com/package/shortid) +// shortid is a short, non-sequential, url-friendly, unique id generator +import shortid from 'shortid'; + // This component's `checkProps` which issues warnings to developers about properties when in development mode (similar to React's built in development tools) import checkProps from './check-props'; import Button from '../button'; import Popover from '../popover'; -// ### shortid -// [npmjs.com/package/shortid](https://www.npmjs.com/package/shortid) -// shortid is a short, non-sequential, url-friendly, unique id generator -import shortid from 'shortid'; - // ## Constants import { FILTER } from '../../utilities/constants'; diff --git a/components/forms/checkbox/index.jsx b/components/forms/checkbox/index.jsx index f4048c92f8..c11a30febc 100644 --- a/components/forms/checkbox/index.jsx +++ b/components/forms/checkbox/index.jsx @@ -13,6 +13,9 @@ import PropTypes from 'prop-types'; // ### isFunction import isFunction from 'lodash.isfunction'; +// ### classNames +import classNames from 'classnames'; + // ### shortid // [npmjs.com/package/shortid](https://www.npmjs.com/package/shortid) // shortid is a short, non-sequential, url-friendly, unique id generator @@ -22,9 +25,6 @@ import shortid from 'shortid'; import KEYS from '../../../utilities/key-code'; import EventUtil from '../../../utilities/event'; -// ### classNames -import classNames from 'classnames'; - // This component's `checkProps` which issues warnings to developers about properties when in development mode (similar to React's built in development tools) import checkProps from './check-props'; diff --git a/components/icon-settings/index.jsx b/components/icon-settings/index.jsx index 943b402338..3c6ebde220 100644 --- a/components/icon-settings/index.jsx +++ b/components/icon-settings/index.jsx @@ -7,8 +7,7 @@ import PropTypes from 'prop-types'; import { ICON_SETTINGS } from '../../utilities/constants'; /** - * The Icon Settings component allows for the path to the icons to be specified. - * This should be used at the root of the application. + * The Icon Settings component allows for the path to the icons to be specified in all child components and is recommended to be used at the root of the application. It's render function is `return this.props.children`, so it can only have one child node. * * **Individual sprites** * If you are using webpack it is advised to use the sprite properties diff --git a/components/lookup/lookup.jsx b/components/lookup/lookup.jsx index e8cf7f19de..60e06542b4 100644 --- a/components/lookup/lookup.jsx +++ b/components/lookup/lookup.jsx @@ -17,6 +17,7 @@ import PropTypes from 'prop-types'; import escapeRegExp from 'lodash.escaperegexp'; import isBoolean from 'lodash.isboolean'; import isEqual from 'lodash.isequal'; +import classNames from 'classnames'; // This component's `checkProps` which issues warnings to developers about properties // when in development mode (similar to React's built in development tools) @@ -34,7 +35,6 @@ import EventUtil from '../../utilities/event'; import KEYS from '../../utilities/key-code'; import Menu from './menu'; -import classNames from 'classnames'; import { LOOKUP } from '../../utilities/constants'; diff --git a/components/lookup/private/item.jsx b/components/lookup/private/item.jsx index 51207add0e..c1b761b9f0 100644 --- a/components/lookup/private/item.jsx +++ b/components/lookup/private/item.jsx @@ -5,9 +5,9 @@ import React from 'react'; import PropTypes from 'prop-types'; +import cx from 'classnames'; import Icon from '../../icon'; import EventUtil from '../../../utilities/event'; -import cx from 'classnames'; const displayName = 'Lookup-Menu-Item'; const propTypes = { diff --git a/components/menu-dropdown/button-trigger.jsx b/components/menu-dropdown/button-trigger.jsx index 10fa63cfb1..2509e443aa 100644 --- a/components/menu-dropdown/button-trigger.jsx +++ b/components/menu-dropdown/button-trigger.jsx @@ -8,7 +8,6 @@ import React from 'react'; import createReactClass from 'create-react-class'; import PropTypes from 'prop-types'; -import Button from '../button'; // ### classNames // [github.com/JedWatson/classnames](https://github.com/JedWatson/classnames) @@ -16,6 +15,8 @@ import Button from '../button'; // joining classNames together." import classnames from 'classnames'; +import Button from '../button'; + // ### Children import { MENU_DROPDOWN_TRIGGER } from '../../utilities/constants'; diff --git a/components/menu-picklist/index.jsx b/components/menu-picklist/index.jsx index 4f62d28a6f..e0c5c7d087 100644 --- a/components/menu-picklist/index.jsx +++ b/components/menu-picklist/index.jsx @@ -11,10 +11,6 @@ import React from 'react'; import createReactClass from 'create-react-class'; import PropTypes from 'prop-types'; -// This component's `checkProps` which issues warnings to developers about properties -// when in development mode (similar to React's built in development tools) -import checkProps from './check-props'; - // ### classNames // [github.com/JedWatson/classnames](https://github.com/JedWatson/classnames) // This project uses `classnames`, "a simple javascript utility for conditionally @@ -26,6 +22,12 @@ import classNames from 'classnames'; // shortid is a short, non-sequential, url-friendly, unique id generator import shortid from 'shortid'; +import { shape } from 'airbnb-prop-types'; + +// This component's `checkProps` which issues warnings to developers about properties +// when in development mode (similar to React's built in development tools) +import checkProps from './check-props'; + // ### Children import Dialog from '../utilities/dialog'; import Icon from '../icon'; @@ -33,8 +35,6 @@ import List from '../utilities/menu-list'; import ListItemLabel from '../utilities/menu-list/item-label'; import Pill from '../utilities/pill'; -import { shape } from 'airbnb-prop-types'; - // ### Traits // #### KeyboardNavigable diff --git a/components/modal/index.jsx b/components/modal/index.jsx index aa6522b100..81f26b88a5 100644 --- a/components/modal/index.jsx +++ b/components/modal/index.jsx @@ -10,7 +10,6 @@ import React from 'react'; import PropTypes from 'prop-types'; import ReactDOM from 'react-dom'; -import Button from '../button'; import classNames from 'classnames'; import ReactModal from 'react-modal'; @@ -22,6 +21,8 @@ import isBoolean from 'lodash.isboolean'; // shortid is a short, non-sequential, url-friendly, unique id generator import shortid from 'shortid'; +import Button from '../button'; + const displayName = 'Modal'; const propTypes = { /** diff --git a/components/modal/private/manager.jsx b/components/modal/private/manager.jsx index 5d83a4fbab..91e32eb17a 100644 --- a/components/modal/private/manager.jsx +++ b/components/modal/private/manager.jsx @@ -5,12 +5,12 @@ import React from 'react'; import createReactClass from 'create-react-class'; import ReactDOM from 'react-dom'; +import Modal from 'react-modal'; + import Button from '../../button'; import Icon from '../../icon'; import EventUtil from '../../../utilities/event'; -import Modal from 'react-modal'; - const customStyles = { content: { position: 'default', diff --git a/components/navigation/__tests__/navigation.browser-test.jsx b/components/navigation/__tests__/navigation.browser-test.jsx index 74b1520b62..22e89255b2 100644 --- a/components/navigation/__tests__/navigation.browser-test.jsx +++ b/components/navigation/__tests__/navigation.browser-test.jsx @@ -4,13 +4,6 @@ /* eslint-env mocha */ /* global sinon */ -// Additional modifiers to [eslint-config-slds](https://github.com/salesforce-ux/eslint-config-slds) for convenience -/* eslint-disable no-console */ -/* eslint-disable no-unused-expressions */ -/* eslint-disable max-len */ -/* eslint-disable prefer-arrow-callback */ -/* eslint-disable react/display-name */ - // Import your external dependencies import React from 'react'; import createReactClass from 'create-react-class'; @@ -20,11 +13,6 @@ import chaiEnzyme from 'chai-enzyme'; import entries from 'object.entries'; -// shim for PhantomJS -if (!Object.entries) { - entries.shim(); -} - /* Enzyme Helpers that can mount and unmount React component instances to * the DOM and set `this.wrapper` and `this.dom` within Mocha's `this` * context [full source here](tests/enzyme-helpers.js). `this` can @@ -38,6 +26,11 @@ import { import { sampleReportCategories } from '../../../utilities/sample-data/navigation'; import Navigation from '../../navigation'; +// shim for PhantomJS +if (!Object.entries) { + entries.shim(); +} + /* Set Chai to use chaiEnzyme for enzyme compatible assertions: * https://github.com/producthunt/chai-enzyme */ diff --git a/components/panel/index.jsx b/components/panel/index.jsx index 6ece6d7d5f..2fa7a16f9f 100644 --- a/components/panel/index.jsx +++ b/components/panel/index.jsx @@ -12,12 +12,12 @@ import React from 'react'; import PropTypes from 'prop-types'; -// This component's `checkProps` which issues warnings to developers about properties when in development mode (similar to React's built in development tools) -import checkProps from './check-props'; - // ### classNames import classNames from 'classnames'; +// This component's `checkProps` which issues warnings to developers about properties when in development mode (similar to React's built in development tools) +import checkProps from './check-props'; + // ## Constants import { PANEL } from '../../utilities/constants'; diff --git a/components/popover/popover.jsx b/components/popover/popover.jsx index 69b20c01b9..96f986f530 100644 --- a/components/popover/popover.jsx +++ b/components/popover/popover.jsx @@ -25,14 +25,14 @@ import isBoolean from 'lodash.isboolean'; // ### isFunction import isFunction from 'lodash.isfunction'; -// This component's `checkProps` which issues warnings to developers about properties when in development mode (similar to React's built in development tools) -import checkProps from './check-props'; - // ### shortid // [npmjs.com/package/shortid](https://www.npmjs.com/package/shortid) // shortid is a short, non-sequential, url-friendly, unique id generator import shortid from 'shortid'; +// This component's `checkProps` which issues warnings to developers about properties when in development mode (similar to React's built in development tools) +import checkProps from './check-props'; + import Button from '../button'; // ### Children diff --git a/components/progress-indicator/__docs__/storybook-stories.jsx b/components/progress-indicator/__docs__/storybook-stories.jsx index 8af147993c..10eb45a2ab 100644 --- a/components/progress-indicator/__docs__/storybook-stories.jsx +++ b/components/progress-indicator/__docs__/storybook-stories.jsx @@ -3,7 +3,7 @@ import createReactClass from 'create-react-class'; import { storiesOf } from '@storybook/react'; import IconSettings from '../../icon-settings'; -import ProgressIndicator from '~/components/progress-indicator'; +import ProgressIndicator from '../../../components/progress-indicator'; import { PROGRESS_INDICATOR } from '../../../utilities/constants'; import Default from '../__examples__/default'; import Modal from '../__examples__/modal'; diff --git a/components/progress-indicator/__tests__/progress-indicator.browser-test.jsx b/components/progress-indicator/__tests__/progress-indicator.browser-test.jsx index 4f712cd263..994c7d3ca9 100644 --- a/components/progress-indicator/__tests__/progress-indicator.browser-test.jsx +++ b/components/progress-indicator/__tests__/progress-indicator.browser-test.jsx @@ -20,6 +20,9 @@ import { expect } from 'chai'; import chaiEnzyme from 'chai-enzyme'; import assign from 'lodash.assign'; +import SLDSProgressIndicator from '../../progress-indicator'; +import IconSettings from '../../icon-settings'; + /* Enzyme Helpers that can mount and unmount React component instances to * the DOM and set `this.wrapper` and `this.dom` within Mocha's `this` * context [full source here](tests/enzyme-helpers.js). `this` can @@ -36,9 +39,6 @@ const { findRenderedDOMComponentWithClass, } = TestUtils; -import SLDSProgressIndicator from '../../progress-indicator'; -import IconSettings from '../../icon-settings'; - const defaultProps = { id: 'sample-progress-indicator', }; diff --git a/components/progress-indicator/index.jsx b/components/progress-indicator/index.jsx index 3c7c6e781b..bacd79ef2e 100644 --- a/components/progress-indicator/index.jsx +++ b/components/progress-indicator/index.jsx @@ -9,15 +9,14 @@ import { shape } from 'airbnb-prop-types'; import assign from 'lodash.assign'; +import find from 'lodash.find'; + // ### shortid // [npmjs.com/package/shortid](https://www.npmjs.com/package/shortid) // shortid is a short, non-sequential, url-friendly, unique id generator import shortid from 'shortid'; import { PROGRESS_INDICATOR } from '../../utilities/constants'; -// ### find -import find from 'lodash.find'; - // Child components import Step from './private/step'; import Progress from './private/progress'; diff --git a/components/progress-indicator/private/progress.jsx b/components/progress-indicator/private/progress.jsx index d7cfb7e7df..8514f340ff 100644 --- a/components/progress-indicator/private/progress.jsx +++ b/components/progress-indicator/private/progress.jsx @@ -5,14 +5,14 @@ import React from 'react'; import PropTypes from 'prop-types'; import { shape } from 'airbnb-prop-types'; -import ProgressBar from './progress-bar'; - // ### classNames // [github.com/JedWatson/classnames](https://github.com/JedWatson/classnames) // This project uses `classnames`, 'a simple javascript utility for conditionally // joining classNames together.' import classNames from 'classnames'; +import ProgressBar from './progress-bar'; + import { PROGRESS_INDICATOR_PROGRESS } from '../../../utilities/constants'; // ### Prop Types diff --git a/components/tabs/__docs__/storybook-stories.jsx b/components/tabs/__docs__/storybook-stories.jsx index 7275412da9..d43f11cf3c 100644 --- a/components/tabs/__docs__/storybook-stories.jsx +++ b/components/tabs/__docs__/storybook-stories.jsx @@ -2,6 +2,9 @@ import React from 'react'; import createReactClass from 'create-react-class'; import PropTypes from 'prop-types'; import { storiesOf, action } from '@storybook/react'; + +import classNames from 'classnames'; + import IconSettings from '../../icon-settings'; import { TABS } from '../../../utilities/constants'; @@ -22,8 +25,6 @@ import Button from '../../button'; // Used in the custom content story import Icon from '../../icon'; -import classNames from 'classnames'; - /* eslint-disable react/display-name */ const getTabs = () => (
diff --git a/components/time-picker/__tests__/time-picker.browser-test.jsx b/components/time-picker/__tests__/time-picker.browser-test.jsx index 06bca668b0..db328f64a4 100644 --- a/components/time-picker/__tests__/time-picker.browser-test.jsx +++ b/components/time-picker/__tests__/time-picker.browser-test.jsx @@ -7,15 +7,15 @@ import TestUtils from 'react-addons-test-utils'; import { expect } from 'chai'; import assign from 'lodash.assign'; +import SLDSTimepicker from '../../time-picker'; +import IconSettings from '../../icon-settings'; + const { Simulate, findRenderedDOMComponentWithTag, findRenderedDOMComponentWithClass, } = TestUtils; -import SLDSTimepicker from '../../time-picker'; -import IconSettings from '../../icon-settings'; - const mockCallback = sinon.spy(); const formatter = (date) => diff --git a/components/toast/__tests__/toast.browser-test.jsx b/components/toast/__tests__/toast.browser-test.jsx index 0bb73ab875..07cc1722bf 100644 --- a/components/toast/__tests__/toast.browser-test.jsx +++ b/components/toast/__tests__/toast.browser-test.jsx @@ -10,14 +10,14 @@ import { unmountComponent, } from '../../../tests/enzyme-helpers'; -chai.use(chaiEnzyme()); - import Toast from '../../toast'; // `~` is replaced with design-system-react at runtime import ToastContainer from '../../toast/container'; // `~` is replaced with design-system-react at runtime import Icon from '../../icon'; // `~` is replaced with design-system-react at runtime import Button from '../../button'; // `~` is replaced with design-system-react at runtime import IconSettings from '../../icon-settings'; +chai.use(chaiEnzyme()); + class DemoComponent extends React.Component { constructor (props) { super(props); diff --git a/components/toast/index.jsx b/components/toast/index.jsx index 46571713c0..fdc181aa73 100644 --- a/components/toast/index.jsx +++ b/components/toast/index.jsx @@ -7,14 +7,16 @@ import React from 'react'; import PropTypes from 'prop-types'; + +import assign from 'lodash.assign'; +import { shape } from 'airbnb-prop-types'; + import classNames from '../../utilities/class-names'; import Button from '../button'; import Icon from '../icon'; import checkProps from './check-props'; import { TOAST } from '../../utilities/constants'; -import assign from 'lodash.assign'; import DOMElementFocus from '../../utilities/dom-element-focus'; -import { shape } from 'airbnb-prop-types'; const propTypes = { /** diff --git a/components/tooltip/index.jsx b/components/tooltip/index.jsx index cb8d12e5ec..bc60a4b2fc 100644 --- a/components/tooltip/index.jsx +++ b/components/tooltip/index.jsx @@ -11,14 +11,6 @@ import PropTypes from 'prop-types'; import classNames from 'classnames'; -import { POPOVER_TOOLTIP } from '../../utilities/constants'; - -import Dialog from '../utilities/dialog'; -import { getMargin, getNubbinClassName } from '../../utilities/dialog-helpers'; - -// This component's `checkProps` which issues warnings to developers about properties when in development mode (similar to React's built in development tools) -import checkProps from './check-props'; - // ### Util helpers import flatten from 'lodash.flatten'; import compact from 'lodash.compact'; @@ -28,6 +20,14 @@ import compact from 'lodash.compact'; // shortid is a short, non-sequential, url-friendly, unique id generator import shortid from 'shortid'; +import { POPOVER_TOOLTIP } from '../../utilities/constants'; + +import Dialog from '../utilities/dialog'; +import { getMargin, getNubbinClassName } from '../../utilities/dialog-helpers'; + +// This component's `checkProps` which issues warnings to developers about properties when in development mode (similar to React's built in development tools) +import checkProps from './check-props'; + // ### Display Name // Always use the canonical component name as the React display name. const displayName = POPOVER_TOOLTIP; diff --git a/components/tree/__tests__/tree.browser-test.jsx b/components/tree/__tests__/tree.browser-test.jsx index ae524806be..c5285c1175 100644 --- a/components/tree/__tests__/tree.browser-test.jsx +++ b/components/tree/__tests__/tree.browser-test.jsx @@ -7,6 +7,8 @@ import React from 'react'; import createReactClass from 'create-react-class'; import PropTypes from 'prop-types'; +import isFunction from 'lodash.isfunction'; + import chai, { expect } from 'chai'; import chaiEnzyme from 'chai-enzyme'; // `this.wrapper` and `this.dom` is set in the helpers file @@ -15,9 +17,6 @@ import { unmountComponent, } from '../../../tests/enzyme-helpers'; -// ### isFunction -import isFunction from 'lodash.isfunction'; - import sampleNodes from '../../../utilities/sample-data/tree'; import IconSettings from '../../icon-settings'; diff --git a/components/tree/index.jsx b/components/tree/index.jsx index fb8682bebd..64d3c4c509 100644 --- a/components/tree/index.jsx +++ b/components/tree/index.jsx @@ -11,12 +11,12 @@ import React from 'react'; import PropTypes from 'prop-types'; -// Child components -import Branch from './private/branch'; - // ### classNames import classNames from 'classnames'; +// Child components +import Branch from './private/branch'; + // Similar to React's PropTypes check. When in development mode, it issues errors in the console about properties. import checkProps from './check-props'; diff --git a/components/utilities/pill/index.jsx b/components/utilities/pill/index.jsx index b6d69d6f74..7f7916f004 100644 --- a/components/utilities/pill/index.jsx +++ b/components/utilities/pill/index.jsx @@ -6,11 +6,12 @@ import PropTypes from 'prop-types'; import assign from 'lodash.assign'; +import { shape } from 'airbnb-prop-types'; + import KEYS from '../../../utilities/key-code'; import mapKeyEventCallbacks from '../../../utilities/key-callbacks'; import EventUtil from '../../../utilities/event'; -import { shape } from 'airbnb-prop-types'; import SLDSPill from '../../../components/pill'; const propTypes = { diff --git a/tests/snapshot-helpers.jsx b/tests/snapshot-helpers.jsx index 2b428b51bb..02160aaac4 100644 --- a/tests/snapshot-helpers.jsx +++ b/tests/snapshot-helpers.jsx @@ -1,8 +1,8 @@ import React from 'react'; import ReactDOMServer from 'react-dom/server'; import jsBeautify from 'js-beautify'; -import Settings from './settings'; import renderer from 'react-test-renderer'; +import Settings from './settings'; /* * Render React components to DOM state as a String *