chore: lint import order

.storybook/preview.ts

@@ -1,7 +1,7 @@
 import { Parameters } from '@storybook/addons';
-import { withThemer, themeNames } from '../docs/themer/react';
-import { withSpacer } from '../docs/spacer/react';
 import { withIcons } from '../docs/icons/react';
+import { withSpacer } from '../docs/spacer/react';
+import { themeNames, withThemer } from '../docs/themer/react';
 import { storySort } from './storySort';
 import './styles.scss';
 

.storybook/storySort.ts

@@ -1,4 +1,4 @@
-import { StorySortComparator, Parameters } from '@storybook/addons';
+import { Parameters, StorySortComparator } from '@storybook/addons';
 
 // sorts stories naturally by kind, then by ID
 export const storySort: StorySortComparator = ([_, a]: Story, [__, b]: Story) =>

docs/_core/_core.stories.tsx

@@ -1,5 +1,5 @@
-import React from 'react';
 import { Primary, Stories } from '@storybook/addon-docs/blocks';
+import React from 'react';
 
 const docsPage = () => (
   <>

docs/_core/borders/borders.stories.tsx

@@ -1,5 +1,8 @@
+import { Primary, Stories, Title } from '@storybook/addon-docs/blocks';
 import React from 'react';
-import { Title, Primary, Stories } from '@storybook/addon-docs/blocks';
+import { Examples } from './examples.story';
+import { Helpers } from './helpers.story';
+import { Intro } from './intro.story';
 
 const docsPage = () => (
   <>
@@ -16,6 +19,4 @@ export default {
   },
 };
 
-export { Intro } from './intro.story';
-export { Examples } from './examples.story';
-export { Helpers } from './helpers.story';
+export { Intro, Examples, Helpers };

docs/_core/borders/examples.story.tsx

@@ -1,5 +1,5 @@
-import React from 'react';
 import { BorderRadius, borderRadius } from '@onfido/castor';
+import React from 'react';
 import styles from './borders.scss';
 
 export const Examples = () => (

docs/_core/borders/helpers.story.tsx

@@ -1,5 +1,5 @@
-import React from 'react';
 import { Source } from '@storybook/components';
+import React from 'react';
 
 export const Helpers = () => (
   <>

docs/_core/borders/intro.story.tsx

@@ -1,5 +1,5 @@
-import React from 'react';
 import { Source } from '@storybook/components';
+import React from 'react';
 
 export const Intro = () => (
   <>

docs/_core/colors/colors.stories.tsx

@@ -1,5 +1,7 @@
+import { Primary, Stories, Title } from '@storybook/addon-docs/blocks';
 import React from 'react';
-import { Title, Primary, Stories } from '@storybook/addon-docs/blocks';
+import { Helpers } from './helpers.story';
+import { Intro } from './intro.story';
 
 const docsPage = () => (
   <>
@@ -16,5 +18,4 @@ export default {
   },
 };
 
-export { Intro } from './intro.story';
-export { Helpers } from './helpers.story';
+export { Intro, Helpers };

docs/_core/colors/helpers.story.tsx

@@ -1,5 +1,5 @@
-import React from 'react';
 import { Source } from '@storybook/components';
+import React from 'react';
 
 export const Helpers = () => (
   <>

docs/_core/colors/intro.story.tsx

@@ -1,5 +1,5 @@
-import React from 'react';
 import { Source } from '@storybook/components';
+import React from 'react';
 
 export const Intro = () => (
   <>

docs/_core/intro.story.tsx

@@ -1,5 +1,5 @@
-import React from 'react';
 import { Source } from '@storybook/components';
+import React from 'react';
 
 export const Intro = () => (
   <>

docs/_core/spacing/helpers.story.tsx

@@ -1,5 +1,5 @@
-import React from 'react';
 import { Source } from '@storybook/components';
+import React from 'react';
 
 export const Helpers = () => (
   <>

docs/_core/spacing/spacing.stories.tsx

@@ -1,5 +1,8 @@
+import { Primary, Stories, Title } from '@storybook/addon-docs/blocks';
 import React from 'react';
-import { Title, Primary, Stories } from '@storybook/addon-docs/blocks';
+import { Examples } from './examples.story';
+import { Helpers } from './helpers.story';
+import { Intro } from './intro.story';
 
 const docsPage = () => (
   <>
@@ -16,6 +19,4 @@ export default {
   },
 };
 
-export { Intro } from './intro.story';
-export { Examples } from './examples.story';
-export { Helpers } from './helpers.story';
+export { Intro, Examples, Helpers };

docs/_core/typography/examples.story.tsx

@@ -1,5 +1,5 @@
+import { font, FontName } from '@onfido/castor';
 import React from 'react';
-import { FontName, font } from '@onfido/castor';
 import styles from './typography.scss';
 
 export const Examples = () => (

docs/_core/typography/helpers.story.tsx

@@ -1,5 +1,5 @@
-import React from 'react';
 import { Source } from '@storybook/components';
+import React from 'react';
 
 export const Helpers = () => (
   <>

docs/_core/typography/typography.stories.tsx

@@ -1,5 +1,8 @@
+import { Primary, Stories, Title } from '@storybook/addon-docs/blocks';
 import React from 'react';
-import { Title, Primary, Stories } from '@storybook/addon-docs/blocks';
+import { Examples } from './examples.story';
+import { Helpers } from './helpers.story';
+import { Intro } from './intro.story';
 
 const docsPage = () => (
   <>
@@ -16,6 +19,4 @@ export default {
   },
 };
 
-export { Intro } from './intro.story';
-export { Examples } from './examples.story';
-export { Helpers } from './helpers.story';
+export { Intro, Examples, Helpers };

docs/_react/_react.stories.tsx

@@ -1,5 +1,5 @@
-import React from 'react';
 import { Primary, Stories } from '@storybook/addon-docs/blocks';
+import React from 'react';
 
 const docsPage = () => (
   <>

docs/_react/intro.story.tsx

@@ -1,5 +1,5 @@
-import React from 'react';
 import { Source } from '@storybook/components';
+import React from 'react';
 
 export const Intro = () => (
   <>

docs/icons/react.tsx

@@ -1,5 +1,5 @@
-import React from 'react';
 import { Icons } from '@onfido/castor-icons';
+import React from 'react';
 
 export function withIcons(storyFn: () => JSX.Element): JSX.Element {
   const story = storyFn();

docs/index.ts

@@ -1,7 +1,6 @@
 import tokens from './tokens.scss';
 
 export * from './docs';
-export * from './storyOf';
 export * from './Story';
-
+export * from './storyOf';
 export { tokens };

docs/storyOf/storyOf.tsx

@@ -1,4 +1,4 @@
-import React, { FC, ReactNode, Fragment, createElement } from 'react';
+import React, { createElement, FC, Fragment, ReactNode } from 'react';
 import { Story } from '../Story';
 import styles from './storyOf.scss';
 

docs/themer/react.tsx

@@ -1,6 +1,6 @@
-import { useEffect } from 'react';
-import { StoryContext } from '@storybook/addons';
 import { switchTheme } from '@onfido/castor';
+import { StoryContext } from '@storybook/addons';
+import { useEffect } from 'react';
 import './themes.scss';
 
 export function withThemer(

examples/html-css-js-parcel/src/index.js

@@ -1,4 +1,4 @@
-import './index.css';
 import { App } from './app';
+import './index.css';
 
 document.body.innerHTML = App();

examples/html-scss-ts-parcel/src/index.ts

@@ -1,4 +1,4 @@
-import './index.scss';
 import { App } from './app';
+import './index.scss';
 
 document.body.innerHTML = App();

examples/react-emotion-ts-parcel/src/App.tsx

@@ -1,7 +1,7 @@
 import styled from '@emotion/styled';
 import { borderRadius, color, space } from '@onfido/castor';
+import { IconPassport, Icons } from '@onfido/castor-icons';
 import { Button, Icon } from '@onfido/castor-react';
-import { Icons, IconPassport } from '@onfido/castor-icons';
 import React from 'react';
 
 export const App = () => (

examples/react-scss-js-webpack/src/App.jsx

@@ -1,5 +1,5 @@
+import { IconPassport, Icons } from '@onfido/castor-icons';
 import { Button, Icon } from '@onfido/castor-react';
-import { Icons, IconPassport } from '@onfido/castor-icons';
 import React from 'react';
 import styles from './App.scss';
 

examples/react-scss-js-webpack/src/index.jsx

@@ -1,8 +1,8 @@
+import '@onfido/castor/dist/castor.css';
+import '@onfido/castor/dist/themes/day.css';
 import React from 'react';
 import { render } from 'react-dom';
 import { App } from './App';
-import '@onfido/castor/dist/castor.css';
-import '@onfido/castor/dist/themes/day.css';
 import './index.css';
 
 render(<App />, document.getElementById('root'));

examples/react-scss-ts-parcel/src/App.tsx

@@ -1,5 +1,5 @@
+import { IconPassport, Icons } from '@onfido/castor-icons';
 import { Button, Icon } from '@onfido/castor-react';
-import { Icons, IconPassport } from '@onfido/castor-icons';
 import React from 'react';
 import styles from './App.scss';
 

packages/react/src/button/button.react.stories.tsx

@@ -1,9 +1,9 @@
-import React, { SyntheticEvent } from 'react';
 import { space } from '@onfido/castor';
 import { IconName, iconNames } from '@onfido/castor-icons';
-import { Meta, Story, omit, storyOf } from '../../../../docs';
+import React, { SyntheticEvent } from 'react';
 import { Icon } from '../';
-import { ButtonProps, Button } from './button.react';
+import { Meta, omit, Story, storyOf } from '../../../../docs';
+import { Button, ButtonProps } from './button.react';
 
 export default {
   title: 'React/Button',

packages/react/src/button/button.react.tsx

@@ -1,5 +1,5 @@
-import React, { HTMLAttributes } from 'react';
 import { ButtonProps as BaseProps, c, classy, m } from '@onfido/castor';
+import React, { HTMLAttributes } from 'react';
 
 export const Button: ButtonComponent = ({
   kind = 'action',

packages/react/src/icon/icon.react.stories.tsx

@@ -1,8 +1,8 @@
-import React from 'react';
 import { Color } from '@onfido/castor';
 import { iconNames } from '@onfido/castor-icons';
-import { Meta, Story, omit, storyOf, tokens } from '../../../../docs';
-import { IconProps, Icon } from './icon.react';
+import React from 'react';
+import { Meta, omit, Story, storyOf, tokens } from '../../../../docs';
+import { Icon, IconProps } from './icon.react';
 
 const colors = Object.keys(tokens).reduce((accumulator, name) => {
   const [, color] = name.match(/^--color-([a-z0-9-]+)$/) ?? [];

packages/react/src/icon/icon.react.tsx

@@ -1,5 +1,5 @@
-import React from 'react';
 import { c, classy, color, IconProps as BaseProps } from '@onfido/castor';
+import React from 'react';
 
 /**
  * Please note that this component requires an SVG sprite to be inlined in your

packages/react/src/input/input.react.stories.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
-import { Meta, Story, omit, storyOf } from '../../../../docs';
-import { InputProps, Input } from './input.react';
+import { Meta, omit, Story, storyOf } from '../../../../docs';
+import { Input, InputProps } from './input.react';
 
 export default {
   title: 'React/Input',

packages/react/src/input/input.react.tsx

@@ -1,5 +1,5 @@
+import { c, classy, InputProps as BaseProps, m } from '@onfido/castor';
 import React from 'react';
-import { c, classy, m, InputProps as BaseProps } from '@onfido/castor';
 
 export const Input = ({
   type = 'text',

packages/react/src/textarea/textarea.react.stories.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
-import { Meta, Story, omit, storyOf } from '../../../../docs';
-import { TextareaProps, Textarea } from './textarea.react';
+import { Meta, omit, Story, storyOf } from '../../../../docs';
+import { Textarea, TextareaProps } from './textarea.react';
 
 export default {
   title: 'React/Textarea',

packages/react/src/textarea/textarea.react.tsx

@@ -1,5 +1,5 @@
-import React from 'react';
 import { c, classy, m, TextareaProps as BaseProps } from '@onfido/castor';
+import React from 'react';
 
 export const Textarea = ({
   resize = 'vertical',