Reformat subcomponents to export named values

Tidy up a few bits of spacing along the way so consistently have a
single line between export declarations

src/components/ActionList/components/Item/Item.tsx

@@ -10,9 +10,9 @@ import TextStyle from '../../../TextStyle';
 
 import styles from '../../ActionList.scss';
 
-export type Props = ActionListItemDescriptor;
+export type ItemProps = ActionListItemDescriptor;
 
-export default function Item({
+export function Item({
   id,
   badge,
   content,
@@ -28,7 +28,7 @@ export default function Item({
   ellipsis,
   active,
   role,
-}: Props) {
+}: ItemProps) {
   const className = classNames(
     styles.Item,
     disabled && styles.disabled,

src/components/ActionList/components/Item/index.ts

@@ -1,4 +1 @@
-import Item from './Item';
-
-export {Props} from './Item';
-export default Item;
+export {Item, ItemProps} from './Item';

src/components/ActionList/components/Item/tests/Item.test.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import {mountWithAppProvider} from 'test-utilities/legacy';
 import {UnstyledLink} from 'components';
-import Item from '../Item';
+import {Item} from '../Item';
 import TextStyle from '../../../../TextStyle';
 
 describe('<Item />', () => {

src/components/ActionList/components/Section/Section.tsx

@@ -1,10 +1,10 @@
 import React from 'react';
-import Item from '../Item';
+import {Item} from '../Item';
 import {ActionListItemDescriptor, ActionListSection} from '../../../../types';
 
 import styles from '../../ActionList.scss';
 
-export interface Props {
+export interface SectionProps {
   /** Section of action items */
   section: ActionListSection;
   /** Should there be multiple sections */
@@ -15,12 +15,12 @@ export interface Props {
   onActionAnyItem?: ActionListItemDescriptor['onAction'];
 }
 
-export default function Section({
+export function Section({
   section,
   hasMultipleSections,
   actionRole,
   onActionAnyItem,
-}: Props) {
+}: SectionProps) {
   const handleAction = (itemOnAction: ActionListItemDescriptor['onAction']) => {
     return () => {
       if (itemOnAction) {

src/components/ActionList/components/Section/index.ts

@@ -1,4 +1 @@
-import Section from './Section';
-
-export {Props} from './Section';
-export default Section;
+export {Section, SectionProps} from './Section';

src/components/ActionList/components/Section/tests/Section.test.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import {mountWithAppProvider} from 'test-utilities/legacy';
-import Item from '../../Item';
-import Section from '../Section';
+import {Item} from '../../Item';
+import {Section} from '../Section';
 
 describe('<Section />', () => {
   it('renders its items', () => {

src/components/ActionList/components/index.ts

@@ -1,3 +1,3 @@
-export {default as Item, Props as ItemProps} from './Item';
+export {Item, ItemProps} from './Item';
 
-export {default as Section, Props as SectionProps} from './Section';
+export {Section, SectionProps} from './Section';

src/components/ActionMenu/components/MenuAction/MenuAction.tsx

@@ -10,12 +10,12 @@ import UnstyledLink from '../../../UnstyledLink';
 
 import styles from './MenuAction.scss';
 
-export interface Props extends ComplexAction {
+export interface MenuActionProps extends ComplexAction {
   /** Whether or not the action discloses a menu group */
   disclosure?: boolean;
 }
 
-export default function MenuAction({
+export function MenuAction({
   content,
   accessibilityLabel,
   url,
@@ -24,7 +24,7 @@ export default function MenuAction({
   disclosure,
   disabled,
   onAction,
-}: Props) {
+}: MenuActionProps) {
   const iconMarkup = icon && (
     <span className={styles.IconWrapper}>
       <Icon source={icon} />

src/components/ActionMenu/components/MenuAction/index.ts

@@ -1 +1 @@
-export {default, Props} from './MenuAction';
+export {MenuAction, MenuActionProps} from './MenuAction';

src/components/ActionMenu/components/MenuAction/tests/MenuAction.test.tsx

@@ -5,10 +5,10 @@ import {mountWithAppProvider, trigger} from 'test-utilities/legacy';
 import Icon from '../../../../Icon';
 import UnstyledLink from '../../../../UnstyledLink';
 
-import MenuAction, {Props} from '../MenuAction';
+import {MenuAction} from '../MenuAction';
 
 describe('<MenuAction />', () => {
-  const mockProps: Props = {
+  const mockProps = {
     content: 'content',
   };
 

src/components/ActionMenu/components/MenuGroup/MenuGroup.tsx

@@ -4,11 +4,11 @@ import {MenuGroupDescriptor} from '../../../../types';
 
 import ActionList from '../../../ActionList';
 import Popover from '../../../Popover';
-import MenuAction from '../MenuAction';
+import {MenuAction} from '../MenuAction';
 
 import styles from './MenuGroup.scss';
 
-export interface Props extends MenuGroupDescriptor {
+export interface MenuGroupProps extends MenuGroupDescriptor {
   /** Visually hidden menu description for screen readers */
   accessibilityLabel?: string;
   /** Whether or not the menu is open */
@@ -19,7 +19,7 @@ export interface Props extends MenuGroupDescriptor {
   onClose(title: string): void;
 }
 
-export default class MenuGroup extends React.Component<Props, never> {
+export class MenuGroup extends React.Component<MenuGroupProps, never> {
   render() {
     const {
       accessibilityLabel,

src/components/ActionMenu/components/MenuGroup/index.ts

@@ -1 +1 @@
-export {default, Props} from './MenuGroup';
+export {MenuGroup, MenuGroupProps} from './MenuGroup';

src/components/ActionMenu/components/MenuGroup/tests/MenuGroup.test.tsx

@@ -4,11 +4,11 @@ import {SaveMinor} from '@shopify/polaris-icons';
 import {mountWithAppProvider, trigger} from 'test-utilities/legacy';
 
 import {Popover, ActionList} from 'components';
-import MenuAction from '../../MenuAction';
-import MenuGroup, {Props} from '../MenuGroup';
+import {MenuAction} from '../../MenuAction';
+import {MenuGroup} from '../MenuGroup';
 
 describe('<MenuGroup />', () => {
-  const mockProps: Props = {
+  const mockProps = {
     title: 'title',
     actions: [],
     active: undefined,
@@ -80,7 +80,7 @@ describe('<MenuGroup />', () => {
     });
 
     it('passes `actions` into the <ActionList />', () => {
-      const mockActions: Props['actions'] = [
+      const mockActions = [
         {content: 'mock content 1'},
         {content: 'mock content 2'},
       ];

src/components/ActionMenu/components/RollupActions/RollupActions.tsx

@@ -13,14 +13,14 @@ import Popover from '../../../Popover';
 
 import styles from './RollupActions.scss';
 
-export interface Props {
+export interface RollupActionsProps {
   /** Collection of actions for the list */
   items?: ActionListItemDescriptor[];
   /** Collection of sectioned action items */
   sections?: ActionListSection[];
 }
 
-type ComposedProps = Props & WithAppProviderProps;
+type ComposedProps = RollupActionsProps & WithAppProviderProps;
 
 interface State {
   rollupOpen: boolean;
@@ -77,4 +77,4 @@ class RollupActions extends React.PureComponent<ComposedProps, State> {
   };
 }
 
-export default withAppProvider<Props>()(RollupActions);
+export default withAppProvider<RollupActionsProps>()(RollupActions);

src/components/ActionMenu/components/RollupActions/index.ts

@@ -1 +1 @@
-export {default, Props} from './RollupActions';
+export {default as RollupActions, RollupActionsProps} from './RollupActions';

src/components/ActionMenu/components/RollupActions/tests/RollupActions.test.tsx

@@ -11,12 +11,12 @@ import {
   Section as ActionListSection,
 } from '../../../../ActionList/components';
 
-import RollupActions, {Props} from '../RollupActions';
+import RollupActions, {RollupActionsProps} from '../RollupActions';
 
-type Wrapper = ReactWrapper<Props, any>;
+type Wrapper = ReactWrapper<RollupActionsProps, any>;
 
 describe('<RollupActions />', () => {
-  const mockProps: Props = {
+  const mockProps = {
     items: undefined,
     sections: undefined,
   };
@@ -28,7 +28,7 @@ describe('<RollupActions />', () => {
   });
 
   describe('items', () => {
-    const mockItems: Props['items'] = [
+    const mockItems = [
       {
         content: 'mock content 1',
         url: 'https://www.google.com',
@@ -68,7 +68,7 @@ describe('<RollupActions />', () => {
   });
 
   describe('sections', () => {
-    const mockSections: Props['sections'] = [
+    const mockSections = [
       {
         title: 'mock title 1',
         items: [

src/components/ActionMenu/components/index.ts

@@ -1,8 +1,5 @@
-export {default as MenuAction, Props as MenuActionProps} from './MenuAction';
+export {MenuAction, MenuActionProps} from './MenuAction';
 
-export {default as MenuGroup, Props as MenuGroupProps} from './MenuGroup';
+export {MenuGroup, MenuGroupProps} from './MenuGroup';
 
-export {
-  default as RollupActions,
-  Props as RollupActionsProps,
-} from './RollupActions';
+export {RollupActions, RollupActionsProps} from './RollupActions';

src/components/Autocomplete/components/ComboBox/ComboBox.tsx

@@ -23,7 +23,7 @@ interface State {
   popoverWasActive: boolean;
 }
 
-export interface Props {
+export interface ComboBoxProps {
   /** A unique identifier for the ComboBox */
   id?: string;
   /** Collection of options to be listed */
@@ -54,14 +54,14 @@ export interface Props {
   onEndReached?(): void;
 }
 
-export default class ComboBox extends React.PureComponent<Props, State> {
+export class ComboBox extends React.PureComponent<ComboBoxProps, State> {
   static getDerivedStateFromProps(
     {
       options: nextOptions,
       selected: nextSelected,
       actionsBefore: nextActionsBefore,
       actionsAfter: nextActionsAfter,
-    }: Props,
+    }: ComboBoxProps,
     {navigableOptions, selectedOptions, comboBoxId}: State,
   ) {
     const optionsChanged =
@@ -129,7 +129,7 @@ export default class ComboBox extends React.PureComponent<Props, State> {
     });
   }
 
-  componentDidUpdate(_: Props, prevState: State) {
+  componentDidUpdate(_: ComboBoxProps, prevState: State) {
     const {contentBefore, contentAfter, emptyState} = this.props;
     const {navigableOptions, popoverWasActive} = this.state;
 

src/components/Autocomplete/components/ComboBox/index.ts

@@ -1,4 +1 @@
-import ComboBox from './ComboBox';
-
-export {Props} from './ComboBox';
-export default ComboBox;
+export {ComboBox} from './ComboBox';

src/components/Autocomplete/components/ComboBox/tests/ComboBox.test.tsx

@@ -2,9 +2,9 @@ import React from 'react';
 import {shallow} from 'enzyme';
 import {OptionList, ActionList, Popover} from 'components';
 import {mountWithAppProvider, trigger} from 'test-utilities/legacy';
-import TextField from '../../TextField';
+import {TextField} from '../../TextField';
 import {Key} from '../../../../../types';
-import ComboBox from '..';
+import {ComboBox} from '..';
 
 describe('<ComboBox/>', () => {
   const options = [

src/components/Autocomplete/components/TextField/TextField.tsx

@@ -4,7 +4,7 @@ import React from 'react';
 import {ComboBoxContext} from '../ComboBox/context';
 import BaseTextField, {Props as TextFieldProps} from '../../../TextField';
 
-export default function TextField(props: TextFieldProps) {
+export function TextField(props: TextFieldProps) {
   return (
     <ComboBoxContext.Consumer>
       {({selectedOptionId, comboBoxId}) => (

src/components/Autocomplete/components/TextField/index.ts

@@ -1,3 +1 @@
-import TextField from './TextField';
-
-export default TextField;
+export {TextField} from './TextField';

src/components/Autocomplete/components/index.ts

@@ -1,3 +1,3 @@
-export {default as ComboBox} from './ComboBox';
+export {ComboBox} from './ComboBox';
 
-export {default as TextField} from './TextField';
+export {TextField} from './TextField';

src/components/Avatar/images/index.ts

@@ -1,9 +1,17 @@
 export {default as avatarOne} from './avatar-1.svg';
+
 export {default as avatarTwo} from './avatar-2.svg';
+
 export {default as avatarThree} from './avatar-3.svg';
+
 export {default as avatarFour} from './avatar-4.svg';
+
 export {default as avatarFive} from './avatar-5.svg';
+
 export {default as avatarSix} from './avatar-6.svg';
+
 export {default as avatarSeven} from './avatar-7.svg';
+
 export {default as avatarEight} from './avatar-8.svg';
+
 export {default as avatarNine} from './avatar-9.svg';

src/components/ButtonGroup/components/Item/Item.tsx

@@ -5,15 +5,15 @@ import {Props as ButtonProps} from '../../../Button';
 
 import styles from '../../ButtonGroup.scss';
 
-export interface Props {
+export interface ItemProps {
   button: React.ReactElement<ButtonProps>;
 }
 
 interface State {
   focused: boolean;
 }
 
-export default class Item extends React.PureComponent<Props, State> {
+export class Item extends React.PureComponent<ItemProps, State> {
   state: State = {focused: false};
 
   render() {

src/components/ButtonGroup/components/Item/index.ts

@@ -1,4 +1 @@
-import Item from './Item';
-
-export {Props} from './Item';
-export default Item;
+export {Item, ItemProps} from './Item';

src/components/ButtonGroup/components/Item/tests/Item.test.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import {mountWithAppProvider} from 'test-utilities/legacy';
 import {Button} from 'components';
-import Item from '../Item';
+import {Item} from '../Item';
 
 describe('<Item />', () => {
   describe('button', () => {

src/components/ButtonGroup/components/index.ts

@@ -1 +1 @@
-export {default as Item, Props as ItemProps} from './Item';
+export {Item, ItemProps} from './Item';

src/components/Card/components/Header/Header.tsx

@@ -8,13 +8,13 @@ import Heading from '../../../Heading';
 
 import styles from '../../Card.scss';
 
-export interface Props {
+export interface HeaderProps {
   title?: React.ReactNode;
   actions?: DisableableAction[];
   children?: React.ReactNode;
 }
 
-export default function Header({children, title, actions}: Props) {
+export function Header({children, title, actions}: HeaderProps) {
   const actionMarkup = actions ? (
     <ButtonGroup>{buttonsFrom(actions, {plain: true})}</ButtonGroup>
   ) : null;

src/components/Card/components/Header/index.ts

@@ -1,4 +1 @@
-import Header from './Header';
-
-export {Props} from './Header';
-export default Header;
+export {Header, HeaderProps} from './Header';