chore: use named import/export instead of default ones in addons/a11y

storybookjs · Mar 7, 2019 · a22b88e · a22b88e
1 parent e913428
commit a22b88e
Show file tree

Hide file tree

Showing 12 changed files with 25 additions and 46 deletions.
diff --git a/addons/a11y/src/components/Panel.tsx → addons/a11y/src/components/A11YPanel.tsx b/addons/a11y/src/components/Panel.tsx → addons/a11y/src/components/A11YPanel.tsx
@@ -3,14 +3,12 @@ import React, { Component, Fragment } from 'react';
 import { styled } from '@storybook/theming';
 
 import { STORY_RENDERED } from '@storybook/core-events';
-import { ActionBar, Icons } from '@storybook/components';
+import { ActionBar, Icons, ScrollArea } from '@storybook/components';
 
-import { ScrollArea } from '@storybook/components/dist/ScrollArea/ScrollArea';
-import EVENTS from '../constants';
-
-import Tabs from './Tabs';
-import Report from './Report';
 import { AxeResults, Result } from 'axe-core';
+import { Report } from './Report';
+import { Tabs } from './Tabs';
+import { EVENTS } from '../constants';
 
 const Icon = styled(Icons)(
   {
@@ -49,7 +47,7 @@ interface A11YPanelProps {
   };
 }
 
-class A11YPanel extends Component<A11YPanelProps, A11YPanelState> {
+export class A11YPanel extends Component<A11YPanelProps, A11YPanelState> {
   state: A11YPanelState = {
     status: 'ready',
     passes: [],
@@ -159,5 +157,3 @@ class A11YPanel extends Component<A11YPanelProps, A11YPanelState> {
     ) : null;
   }
 }
-
-export default A11YPanel;
diff --git a/addons/a11y/src/components/ColorBlindness.tsx b/addons/a11y/src/components/ColorBlindness.tsx
@@ -32,7 +32,7 @@ interface ColorBlindnessState {
   filter: string | null;
 }
 
-class ColorBlindness extends Component<ColorBlindnessProps, ColorBlindnessState> {
+export class ColorBlindness extends Component<ColorBlindnessProps, ColorBlindnessState> {
   state: ColorBlindnessState = {
     expanded: false,
     filter: null,
@@ -104,5 +104,3 @@ class ColorBlindness extends Component<ColorBlindnessProps, ColorBlindnessState>
     );
   }
 }
-
-export default ColorBlindness;
diff --git a/addons/a11y/src/components/Report/Elements.tsx b/addons/a11y/src/components/Report/Elements.tsx
@@ -2,8 +2,8 @@ import React, { FunctionComponent } from 'react';
 
 import { styled } from '@storybook/theming';
 
-import Rules from './Rules';
 import { NodeResult } from 'axe-core';
+import { Rules } from './Rules';
 
 const Item = styled.li({
   fontWeight: 600,
@@ -39,12 +39,10 @@ interface ElementsProps {
   passes: boolean;
 }
 
-const Elements: FunctionComponent<ElementsProps> = ({ elements, passes }) => (
+export const Elements: FunctionComponent<ElementsProps> = ({ elements, passes }) => (
   <ol>
     {elements.map((element, index) => (
       <Element passes={passes} element={element} key={index} />
     ))}
   </ol>
 );
-
-export default Elements;
diff --git a/addons/a11y/src/components/Report/Info.tsx b/addons/a11y/src/components/Report/Info.tsx
@@ -22,7 +22,7 @@ interface InfoProps {
   item: Result;
 }
 
-const Info: FunctionComponent<InfoProps> = ({ item }) => {
+export const Info: FunctionComponent<InfoProps> = ({ item }) => {
   return (
     <Wrapper>
       <Help>{item.help}</Help>
@@ -32,5 +32,3 @@ const Info: FunctionComponent<InfoProps> = ({ item }) => {
     </Wrapper>
   );
 };
-
-export default Info;
diff --git a/addons/a11y/src/components/Report/Item.tsx b/addons/a11y/src/components/Report/Item.tsx
@@ -3,10 +3,10 @@ import React, { Component, Fragment } from 'react';
 import { styled } from '@storybook/theming';
 import { Icons } from '@storybook/components';
 
-import Info from './Info';
-import Tags from './Tags';
-import Elements from './Elements';
 import { Result } from 'axe-core';
+import { Info } from './Info';
+import { Elements } from './Elements';
+import { Tags } from './Tags';
 
 const Wrapper = styled.div();
 
@@ -46,7 +46,7 @@ interface ItemState {
   open: boolean;
 }
 
-class Item extends Component<ItemProps, ItemState> {
+export class Item extends Component<ItemProps, ItemState> {
   state = {
     open: false,
   };
@@ -84,5 +84,3 @@ class Item extends Component<ItemProps, ItemState> {
     );
   }
 }
-
-export default Item;
diff --git a/addons/a11y/src/components/Report/Rules.tsx b/addons/a11y/src/components/Report/Rules.tsx
@@ -61,7 +61,7 @@ interface RulesProps {
   passes: boolean;
 }
 
-const Rules: FunctionComponent<RulesProps> = ({ rules, passes }) => {
+export const Rules: FunctionComponent<RulesProps> = ({ rules, passes }) => {
   return (
     <List>
       {rules.map((rule, index) => (
@@ -70,5 +70,3 @@ const Rules: FunctionComponent<RulesProps> = ({ rules, passes }) => {
     </List>
   );
 };
-
-export default Rules;
diff --git a/addons/a11y/src/components/Report/Tags.tsx b/addons/a11y/src/components/Report/Tags.tsx
@@ -20,7 +20,7 @@ interface TagsProps {
   tags: TagValue[];
 }
 
-const Tags: FunctionComponent<TagsProps> = ({ tags }) => {
+export const Tags: FunctionComponent<TagsProps> = ({ tags }) => {
   return (
     <Wrapper>
       {tags.map(tag => (
@@ -29,5 +29,3 @@ const Tags: FunctionComponent<TagsProps> = ({ tags }) => {
     </Wrapper>
   );
 };
-
-export default Tags;
diff --git a/addons/a11y/src/components/Report/index.tsx b/addons/a11y/src/components/Report/index.tsx
@@ -1,23 +1,21 @@
 import React, { Fragment, FunctionComponent } from 'react';
 import { Placeholder } from '@storybook/components';
 
-import Item from './Item';
 import { Result } from 'axe-core';
+import { Item } from './Item';
 
 export interface ReportProps {
   items: Result[];
   empty: string;
   passes: boolean;
 }
 
-const Report: FunctionComponent<ReportProps> = ({ items, empty, passes }) => (
+export const Report: FunctionComponent<ReportProps> = ({ items, empty, passes }) => (
   <Fragment>
     {items.length ? (
-      items.map((item) => <Item passes={passes} item={item} key={item.id} />)
+      items.map(item => <Item passes={passes} item={item} key={item.id} />)
     ) : (
       <Placeholder key="placeholder">{empty}</Placeholder>
     )}
   </Fragment>
 );
-
-export default Report;
diff --git a/addons/a11y/src/components/Tabs.tsx b/addons/a11y/src/components/Tabs.tsx
@@ -56,7 +56,7 @@ interface TabsState {
   active: number;
 }
 
-class Tabs extends Component<TabsProps, TabsState> {
+export class Tabs extends Component<TabsProps, TabsState> {
   state: TabsState = {
     active: 0,
   };
@@ -90,5 +90,3 @@ class Tabs extends Component<TabsProps, TabsState> {
     );
   }
 }
-
-export default Tabs;
diff --git a/addons/a11y/src/constants.ts b/addons/a11y/src/constants.ts
@@ -5,4 +5,4 @@ export const PARAM_KEY = `a11y`;
 const RESULT = `${ADDON_ID}/result`;
 const REQUEST = `${ADDON_ID}/request`;
 
-export default { RESULT, REQUEST };
+export const EVENTS = { RESULT, REQUEST };
diff --git a/addons/a11y/src/index.ts b/addons/a11y/src/index.ts
@@ -5,7 +5,7 @@ import { stripIndents } from 'common-tags';
 
 import addons, { StoryWrapper } from '@storybook/addons';
 import { STORY_RENDERED } from '@storybook/core-events';
-import EVENTS, { PARAM_KEY } from './constants';
+import { EVENTS, PARAM_KEY } from './constants';
 
 const channel = addons.getChannel();
 let progress = Promise.resolve();

diff --git a/addons/a11y/src/register.tsx b/addons/a11y/src/register.tsx
@@ -1,11 +1,10 @@
 import React, { Fragment, FunctionComponent } from 'react';
-import addons, { types } from '@storybook/addons';
 import { styled } from '@storybook/theming';
 
-import Panel from './components/Panel';
-import ColorBlindness from './components/ColorBlindness';
-
 import { ADDON_ID, PANEL_ID } from './constants';
+import { ColorBlindness } from './components/ColorBlindness';
+import { A11YPanel } from './components/A11YPanel';
+import { addons, types } from '@storybook/addons';
 
 const Hidden = styled.div(() => ({
   display: 'none',
@@ -90,7 +89,7 @@ addons.register(ADDON_ID, api => {
   addons.add(PANEL_ID, {
     title: 'Accessibility',
     type: types.PANEL,
-    render: ({ active, key }) => <Panel key={key} api={api} active={active} />,
+    render: ({ active, key }) => <A11YPanel key={key} api={api} active={active} />,
   });
 
   addons.add(PANEL_ID, {