From d9210e3bab1aeaa3ebdb98181f1b59943a203224 Mon Sep 17 00:00:00 2001 From: Artur Yorsh Date: Wed, 2 Jan 2019 17:40:21 +0300 Subject: [PATCH 1/2] refactor(theme): optimize module imports --- .../theme/component/mapping/index.ts | 5 ++- .../theme/component/mapping/mappingContext.ts | 4 +- .../mapping/mappingProvider.component.tsx | 2 +- src/framework/theme/component/style/index.ts | 3 +- .../style/styleConsumer.component.tsx | 18 ++++----- .../style/styleProvider.component.tsx | 20 +++++----- src/framework/theme/component/theme/index.ts | 1 + .../theme/themeConsumer.component.tsx | 2 +- .../theme/component/theme/themeContext.ts | 4 +- .../theme/themeProvider.component.tsx | 2 +- .../theme/service/style/style.service.ts | 2 +- .../theme/service/style/style.spec.ts | 39 +++++++++---------- .../service/style/styleConsumer.spec.tsx | 2 +- 13 files changed, 52 insertions(+), 52 deletions(-) diff --git a/src/framework/theme/component/mapping/index.ts b/src/framework/theme/component/mapping/index.ts index b59594a63..7f666d002 100644 --- a/src/framework/theme/component/mapping/index.ts +++ b/src/framework/theme/component/mapping/index.ts @@ -1,5 +1,6 @@ export * from './type'; +export * from './mappingContext'; export { - MappingProvider as ThemeMappingProvider, - Props as ThemeMappingProviderProps, + MappingProvider, + Props as MappingProviderProps, } from './mappingProvider.component'; diff --git a/src/framework/theme/component/mapping/mappingContext.ts b/src/framework/theme/component/mapping/mappingContext.ts index ae54db96a..9631b7f2f 100644 --- a/src/framework/theme/component/mapping/mappingContext.ts +++ b/src/framework/theme/component/mapping/mappingContext.ts @@ -4,4 +4,6 @@ import { ThemeMappingType } from './type'; const defaultValue: ThemeMappingType = {}; const MappingContext = React.createContext(defaultValue); -export default MappingContext; +export { + MappingContext, +}; diff --git a/src/framework/theme/component/mapping/mappingProvider.component.tsx b/src/framework/theme/component/mapping/mappingProvider.component.tsx index fdd95700f..e9d9de4b8 100644 --- a/src/framework/theme/component/mapping/mappingProvider.component.tsx +++ b/src/framework/theme/component/mapping/mappingProvider.component.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import MappingContext from './mappingContext'; +import { MappingContext } from './mappingContext'; import { ThemeMappingType } from './type'; export interface Props { diff --git a/src/framework/theme/component/style/index.ts b/src/framework/theme/component/style/index.ts index b055a9cac..45e27789d 100644 --- a/src/framework/theme/component/style/index.ts +++ b/src/framework/theme/component/style/index.ts @@ -1,3 +1,4 @@ +export * from './type'; export { StyleProvider, Props as StyleProviderProps, @@ -7,5 +8,3 @@ export { styled, Props as StyledComponentProps, } from './styleConsumer.component'; - -export * from './type'; diff --git a/src/framework/theme/component/style/styleConsumer.component.tsx b/src/framework/theme/component/style/styleConsumer.component.tsx index 710727d76..db170ccef 100644 --- a/src/framework/theme/component/style/styleConsumer.component.tsx +++ b/src/framework/theme/component/style/styleConsumer.component.tsx @@ -1,18 +1,18 @@ import React from 'react'; import hoistNonReactStatics from 'hoist-non-react-statics'; -import { ThemeMappingType } from '../mapping'; -import { - ThemeType, - StyleType, -} from '../theme'; -import ThemeContext from '../theme/themeContext'; -import MappingContext from '../mapping/mappingContext'; +import { MappingContext } from '../mapping'; +import { ThemeContext } from '../theme'; +import { getComponentMapping } from '../../service/mapping'; import { createStyle, StyleConsumerService, } from '../../service/style'; -import { getComponentMapping } from '../../service/mapping'; -import { Interaction } from './type'; +import { + ThemeMappingType, + ThemeType, + StyleType, + Interaction, +} from '../../component'; interface PrivateProps { forwardedRef: React.RefObject; diff --git a/src/framework/theme/component/style/styleProvider.component.tsx b/src/framework/theme/component/style/styleProvider.component.tsx index bc67197ae..19888f572 100644 --- a/src/framework/theme/component/style/styleProvider.component.tsx +++ b/src/framework/theme/component/style/styleProvider.component.tsx @@ -1,18 +1,16 @@ import React from 'react'; +import { + MappingProvider, + MappingProviderProps, + ThemeMappingType, +} from '../mapping'; import { ThemeProvider, + ThemeProviderProps, ThemeType, } from '../theme'; -import { - ThemeMappingProvider, - ThemeMappingType, -} from '../mapping'; -export interface Props { - mapping: ThemeMappingType; - theme: ThemeType; - children: JSX.Element | React.ReactNode; -} +export type Props = MappingProviderProps & ThemeProviderProps; interface State { mapping: ThemeMappingType; @@ -35,11 +33,11 @@ export class StyleProvider extends React.Component { render() { return ( - + {this.props.children} - + ); } } diff --git a/src/framework/theme/component/theme/index.ts b/src/framework/theme/component/theme/index.ts index 18a4f71b6..33f9e80b6 100644 --- a/src/framework/theme/component/theme/index.ts +++ b/src/framework/theme/component/theme/index.ts @@ -1,4 +1,5 @@ export * from './type'; +export * from './themeContext'; export { ThemeProvider, Props as ThemeProviderProps, diff --git a/src/framework/theme/component/theme/themeConsumer.component.tsx b/src/framework/theme/component/theme/themeConsumer.component.tsx index 4ff62812e..fbd4ee554 100644 --- a/src/framework/theme/component/theme/themeConsumer.component.tsx +++ b/src/framework/theme/component/theme/themeConsumer.component.tsx @@ -1,6 +1,6 @@ import React from 'react'; import hoistNonReactStatics from 'hoist-non-react-statics'; -import ThemeContext from './themeContext'; +import { ThemeContext } from './themeContext'; import { ThemeType, ThemedStyleType, diff --git a/src/framework/theme/component/theme/themeContext.ts b/src/framework/theme/component/theme/themeContext.ts index f6a3151c2..e4373c305 100644 --- a/src/framework/theme/component/theme/themeContext.ts +++ b/src/framework/theme/component/theme/themeContext.ts @@ -4,4 +4,6 @@ import { ThemeType } from './type'; const defaultValue: ThemeType = {}; const ThemeContext = React.createContext(defaultValue); -export default ThemeContext; +export { + ThemeContext, +}; diff --git a/src/framework/theme/component/theme/themeProvider.component.tsx b/src/framework/theme/component/theme/themeProvider.component.tsx index cd6a902f8..18fa73e68 100644 --- a/src/framework/theme/component/theme/themeProvider.component.tsx +++ b/src/framework/theme/component/theme/themeProvider.component.tsx @@ -1,5 +1,5 @@ import React, { ReactNode } from 'react'; -import ThemeContext from './themeContext'; +import { ThemeContext } from './themeContext'; import { ThemeType } from './type'; export interface Props { diff --git a/src/framework/theme/service/style/style.service.ts b/src/framework/theme/service/style/style.service.ts index 12689d948..5e7605b23 100644 --- a/src/framework/theme/service/style/style.service.ts +++ b/src/framework/theme/service/style/style.service.ts @@ -4,7 +4,7 @@ import { getStatelessVariantMapping, getStateAppearanceMapping, getStateVariantMapping, -} from '../mapping/mapping.service'; +} from '../mapping'; import { ComponentMappingType, ThemeType, diff --git a/src/framework/theme/service/style/style.spec.ts b/src/framework/theme/service/style/style.spec.ts index c57f81f9e..1ce2a0adf 100644 --- a/src/framework/theme/service/style/style.spec.ts +++ b/src/framework/theme/service/style/style.spec.ts @@ -1,13 +1,10 @@ import { APPEARANCE_DEFAULT } from '../mapping'; -import { - mapping, - theme, -} from './style.spec.config'; import * as Service from './style.service'; +import * as config from './style.spec.config'; describe('@style: service methods checks', () => { - const { Test: testMapping } = mapping; + const { Test: testMapping } = config.mapping; describe('* preprocess', () => { @@ -149,7 +146,7 @@ describe('@style: service methods checks', () => { describe('* default appearance', () => { it('* no variant and no state', () => { - const style = Service.createStyle(theme, testMapping); + const style = Service.createStyle(config.theme, testMapping); expect(style).toMatchSnapshot(); }); @@ -157,7 +154,7 @@ describe('@style: service methods checks', () => { it('* single', () => { const style = Service.createStyle( - theme, + config.theme, testMapping, APPEARANCE_DEFAULT, [], @@ -169,7 +166,7 @@ describe('@style: service methods checks', () => { it('* multiple', () => { const style = Service.createStyle( - theme, + config.theme, testMapping, APPEARANCE_DEFAULT, [], @@ -186,7 +183,7 @@ describe('@style: service methods checks', () => { it('* no state', () => { const style = Service.createStyle( - theme, + config.theme, testMapping, APPEARANCE_DEFAULT, ['success'], @@ -199,7 +196,7 @@ describe('@style: service methods checks', () => { it('* single implicit (should apply from appearance)', () => { const style = Service.createStyle( - theme, + config.theme, testMapping, APPEARANCE_DEFAULT, ['success'], @@ -211,7 +208,7 @@ describe('@style: service methods checks', () => { it('* single explicit (should apply own)', () => { const style = Service.createStyle( - theme, + config.theme, testMapping, APPEARANCE_DEFAULT, ['success'], @@ -223,7 +220,7 @@ describe('@style: service methods checks', () => { it('* multiple', () => { const style = Service.createStyle( - theme, + config.theme, testMapping, APPEARANCE_DEFAULT, ['success'], @@ -241,7 +238,7 @@ describe('@style: service methods checks', () => { it('* no state', () => { const style = Service.createStyle( - theme, + config.theme, testMapping, APPEARANCE_DEFAULT, ['success', 'big'], @@ -254,7 +251,7 @@ describe('@style: service methods checks', () => { it('* single', () => { const style = Service.createStyle( - theme, + config.theme, testMapping, APPEARANCE_DEFAULT, ['success', 'big'], @@ -266,7 +263,7 @@ describe('@style: service methods checks', () => { it('* multiple', () => { const style = Service.createStyle( - theme, + config.theme, testMapping, APPEARANCE_DEFAULT, ['success', 'big'], @@ -287,7 +284,7 @@ describe('@style: service methods checks', () => { describe('* custom appearance', () => { it('* no variant and no state', () => { - const style = Service.createStyle(theme, testMapping, 'custom'); + const style = Service.createStyle(config.theme, testMapping, 'custom'); expect(style).toMatchSnapshot(); }); @@ -296,7 +293,7 @@ describe('@style: service methods checks', () => { it('* implicit (should apply from default appearance)', () => { const style = Service.createStyle( - theme, + config.theme, testMapping, 'custom', [], @@ -308,7 +305,7 @@ describe('@style: service methods checks', () => { it('* explicit (should apply own)', () => { const style = Service.createStyle( - theme, + config.theme, testMapping, 'custom', [], @@ -324,7 +321,7 @@ describe('@style: service methods checks', () => { it('* implicit (should apply from default appearance)', () => { const style = Service.createStyle( - theme, + config.theme, testMapping, 'custom', ['big'], @@ -335,7 +332,7 @@ describe('@style: service methods checks', () => { it('* explicit (should apply own)', () => { const style = Service.createStyle( - theme, + config.theme, testMapping, 'custom', ['success'], @@ -351,7 +348,7 @@ describe('@style: service methods checks', () => { describe('* undefined appearance', () => { it('* no variant and no state (should apply default appearance)', () => { - const style = Service.createStyle(theme, testMapping, 'undefined'); + const style = Service.createStyle(config.theme, testMapping, 'undefined'); expect(style).toMatchSnapshot(); }); diff --git a/src/framework/theme/service/style/styleConsumer.spec.tsx b/src/framework/theme/service/style/styleConsumer.spec.tsx index 1de485966..41fbda96f 100644 --- a/src/framework/theme/service/style/styleConsumer.spec.tsx +++ b/src/framework/theme/service/style/styleConsumer.spec.tsx @@ -18,7 +18,7 @@ import { Interaction, State, } from '../../component'; -import { APPEARANCE_DEFAULT } from '../mapping/mapping.service'; +import { APPEARANCE_DEFAULT } from '../mapping'; import { StyleConsumerService } from './styleConsumer.service'; import { mapping, From be49510af403d73addb0b43f5755d0827a9b972c Mon Sep 17 00:00:00 2001 From: Artur Yorsh Date: Wed, 2 Jan 2019 19:42:13 +0300 Subject: [PATCH 2/2] refactor(theme): optimize module imports - patch --- src/framework/theme/component/mapping/mappingContext.ts | 5 +---- src/framework/theme/component/theme/themeContext.ts | 5 +---- 2 files changed, 2 insertions(+), 8 deletions(-) diff --git a/src/framework/theme/component/mapping/mappingContext.ts b/src/framework/theme/component/mapping/mappingContext.ts index 9631b7f2f..9230d7123 100644 --- a/src/framework/theme/component/mapping/mappingContext.ts +++ b/src/framework/theme/component/mapping/mappingContext.ts @@ -2,8 +2,5 @@ import React from 'react'; import { ThemeMappingType } from './type'; const defaultValue: ThemeMappingType = {}; -const MappingContext = React.createContext(defaultValue); -export { - MappingContext, -}; +export const MappingContext = React.createContext(defaultValue); diff --git a/src/framework/theme/component/theme/themeContext.ts b/src/framework/theme/component/theme/themeContext.ts index e4373c305..0d7fecc7b 100644 --- a/src/framework/theme/component/theme/themeContext.ts +++ b/src/framework/theme/component/theme/themeContext.ts @@ -2,8 +2,5 @@ import React from 'react'; import { ThemeType } from './type'; const defaultValue: ThemeType = {}; -const ThemeContext = React.createContext(defaultValue); -export { - ThemeContext, -}; +export const ThemeContext = React.createContext(defaultValue);