diff --git a/README.md b/README.md index 25fb33e..e02b955 100644 --- a/README.md +++ b/README.md @@ -59,22 +59,21 @@ const MyStyledComponent = injectSheet(styled.styles)(MyComponent) ### With custom JSS setup: -#### For Styled Creator: - ```js import { create as createJss } from 'jss' -import { create as createInjectSheet } from 'react-jss' import vendorPrefixer from 'jss-vendor-prefixer' -import { setStyledCreator, prepareStyled } from 'styled-jss' + +import { createStyled } from 'styled-jss' const jss = createJss() jss.use(vendorPrefixer()) -const injectSheet = createInjectSheet(jss) +// Create custom Styled, that allows to set BaseStyles +const Styled = createStyled(jss) -export const styled = prepareStyled(injectSheet) +// Create custom styled function without BaseStyles accordingly +export const styled = createStyled() -const Styled = setStyledCreator(styled) export default Styled ``` diff --git a/src/index.js b/src/index.js index 2aeefb0..31f6116 100644 --- a/src/index.js +++ b/src/index.js @@ -14,12 +14,15 @@ type StyledElementPropsType = { className: ?string, } -export const createStyled = (jss?: Function = jssDefault) => (baseStyles: Object = {}) => { +const createStyled = (jss?: Function = jssDefault) => (baseStyles: Object = {}) => { let sheet let dynamicSheet let counter = 0 - return (tagOrStyledElement: tagOrStyledElementTypeype, ownStyles: Object): StyledElementType => { + const styled = ( + tagOrStyledElement: tagOrStyledElementTypeype, + ownStyles: Object + ): StyledElementType => { const {tag, styles}: StyledElementAttrsType = typeof tagOrStyledElement === 'string' ? {tag: tagOrStyledElement, styles: {}} : tagOrStyledElement @@ -93,19 +96,16 @@ export const createStyled = (jss?: Function = jssDefault) => (baseStyles: Object } } } + + return Object.assign(styled, {styles: baseStyles}) } const defaultStyledCreator = createStyled() - const defaultStyled = defaultStyledCreator() -const createStyledCreator = (styled: Function = defaultStyledCreator) => ( - (baseStyles: Object) => Object.assign(styled(baseStyles), {styles: baseStyles}) -) - export { + createStyled, defaultStyled as styled, - createStyledCreator } -export default createStyledCreator() +export default defaultStyledCreator