Skip to content

Migrate to prettier #22

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
17 changes: 13 additions & 4 deletions .eslintrc
Original file line number Diff line number Diff line change
@@ -1,17 +1,26 @@
{
"extends": "eslint-config-rackt",
"extends": "prettier",
"env": {
"browser": true,
"mocha": true,
"node": true
},
"parser": "babel-eslint",
"parserOptions": {
"ecmaVersion": 6,
"sourceType": "module",
"ecmaFeatures": {
"jsx": true,
"modules": true,
"experimentalObjectRestSpread": true
}
},
"rules": {
"prettier/prettier": "warn",
"valid-jsdoc": 2,
"react/jsx-uses-vars": 1,
"react/jsx-uses-react": 1,
"react/jsx-no-undef": 2
},
"plugins": [
"react"
]
"plugins": ["prettier", "react"]
}
5 changes: 5 additions & 0 deletions .prettierrc
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
{
"trailingComma": "none",
"semi": false,
"singleQuote": true
}
14 changes: 7 additions & 7 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -28,19 +28,20 @@
"@types/react": "^16.4.7",
"babel-cli": "^6.26.0",
"babel-core": "^6.26.3",
"babel-eslint": "^7.2.3",
"babel-eslint": "^8.2.6",
"babel-plugin-transform-decorators-legacy": "^1.3.5",
"babel-preset-es2015": "^6.24.1",
"babel-preset-react": "^6.24.1",
"babel-preset-stage-0": "^6.24.1",
"eslint": "^3.19.0",
"eslint-config-rackt": "^1.1.1",
"eslint-plugin-babel": "^4.1.1",
"eslint": "^5.3.0",
"eslint-config-prettier": "^2.9.0",
"eslint-plugin-prettier": "^2.6.2",
"eslint-plugin-react": "^7.10.0",
"expect": "^1.18.0",
"fbjs": "^0.8.17",
"jsdom": "^9.8.3",
"mocha": "^3.3.0",
"prettier": "^1.14.0",
"prop-types": "^15.6.2",
"react": "^16.4.2",
"react-dom": "^16.4.2",
Expand All @@ -55,6 +56,7 @@
"scripts": {
"build": "babel src --out-dir lib",
"lint": "eslint src test",
"lint-check": "eslint --print-config .eslintrc.js | eslint-config-prettier-check",
"prepublish": "rimraf lib && npm run build",
"test": "mocha --compilers js:babel-core/register --recursive --reporter spec --require ./test/setup.js",
"test:watch": "npm test -- --watch"
Expand All @@ -73,9 +75,7 @@
"expect",
"mocha",
"sinon",
"jsdom",
"eslint",
"babel-eslint"
"jsdom"
]
}
}
75 changes: 50 additions & 25 deletions src/components/themr.js
Original file line number Diff line number Diff line change
Expand Up @@ -21,9 +21,10 @@ const DEFAULT_OPTIONS = {
mapThemrProps: defaultMapThemrProps
}

const THEMR_CONFIG = typeof Symbol !== 'undefined' ?
Symbol('THEMR_CONFIG') :
'__REACT_CSS_THEMR_CONFIG__'
const THEMR_CONFIG =
typeof Symbol !== 'undefined'
? Symbol('THEMR_CONFIG')
: '__REACT_CSS_THEMR_CONFIG__'

/**
* Themr decorator
Expand All @@ -32,7 +33,7 @@ const THEMR_CONFIG = typeof Symbol !== 'undefined' ?
* @param {{}} [options] - Themr options
* @returns {function(ThemedComponent:Function):Function} - ThemedComponent
*/
export default (componentName, localTheme, options = {}) => (ThemedComponent) => {
export default (componentName, localTheme, options = {}) => ThemedComponent => {
const {
composeTheme: optionComposeTheme,
mapThemrProps: optionMapThemrProps
Expand All @@ -54,15 +55,21 @@ export default (componentName, localTheme, options = {}) => (ThemedComponent) =>
* @property {{wrappedInstance: *}} refs
*/
class Themed extends Component {
static displayName = `Themed${(ThemedComponent.displayName || ThemedComponent.name || "Component")}`;
static displayName = `Themed${ThemedComponent.displayName ||
ThemedComponent.name ||
'Component'}`

static contextTypes = {
themr: PropTypes.object
}

static propTypes = {
...ThemedComponent.propTypes,
composeTheme: PropTypes.oneOf([ COMPOSE_DEEPLY, COMPOSE_SOFTLY, DONT_COMPOSE ]),
composeTheme: PropTypes.oneOf([
COMPOSE_DEEPLY,
COMPOSE_SOFTLY,
DONT_COMPOSE
]),
innerRef: PropTypes.func,
theme: PropTypes.object,
themeNamespace: PropTypes.string,
Expand All @@ -81,9 +88,10 @@ export default (componentName, localTheme, options = {}) => (ThemedComponent) =>
}

getWrappedInstance() {
invariant(true,
invariant(
true,
'DEPRECATED: To access the wrapped instance, you have to pass ' +
'{ innerRef: fn } and retrieve with a callback ref style.'
'{ innerRef: fn } and retrieve with a callback ref style.'
)

return this.refs.wrappedInstance
Expand All @@ -94,13 +102,21 @@ export default (componentName, localTheme, options = {}) => (ThemedComponent) =>
if (!themeNamespace) return theme

if (themeNamespace && !theme) {
throw new Error('Invalid themeNamespace use in friendsofreactjs/react-css-themr. ' +
'themeNamespace prop should be used only with theme prop.')
throw new Error(
'Invalid themeNamespace use in friendsofreactjs/react-css-themr. ' +
'themeNamespace prop should be used only with theme prop.'
)
}

return Object.keys(theme)
.filter(key => key.startsWith(themeNamespace))
.reduce((result, key) => ({ ...result, [removeNamespace(key, themeNamespace)]: theme[key] }), {})
.reduce(
(result, key) => ({
...result,
[removeNamespace(key, themeNamespace)]: theme[key]
}),
{}
)
}

getThemeNotComposed(props) {
Expand All @@ -118,14 +134,14 @@ export default (componentName, localTheme, options = {}) => (ThemedComponent) =>
getTheme(props) {
return props.composeTheme === COMPOSE_SOFTLY
? {
...this.getContextTheme(),
...config.localTheme,
...this.getNamespacedTheme(props)
}
...this.getContextTheme(),
...config.localTheme,
...this.getNamespacedTheme(props)
}
: themeable(
themeable(this.getContextTheme(), config.localTheme),
this.getNamespacedTheme(props)
)
themeable(this.getContextTheme(), config.localTheme),
this.getNamespacedTheme(props)
)
}

calcTheme(props) {
Expand Down Expand Up @@ -208,7 +224,9 @@ function merge(original = {}, mixin = {}) {

default: {
//can't merge an object with a non-object
throw new Error(`You are merging object ${key} with a non-object ${originalValue}`)
throw new Error(
`You are merging object ${key} with a non-object ${originalValue}`
)
}
}
break
Expand All @@ -225,7 +243,9 @@ function merge(original = {}, mixin = {}) {
switch (typeof originalValue) {
case 'object': {
//can't merge a non-object with an object
throw new Error(`You are merging non-object ${mixinValue} with an object ${key}, (can occur when using empty or :global only base theme stylesheet)`)
throw new Error(
`You are merging non-object ${mixinValue} with an object ${key}, (can occur when using empty or :global only base theme stylesheet)`
)
}

case 'undefined': {
Expand All @@ -240,9 +260,12 @@ function merge(original = {}, mixin = {}) {

default: {
//finally we can merge
result[key] = originalValue.split(' ')
result[key] = originalValue
.split(' ')
.concat(mixinValue.split(' '))
.filter((item, pos, self) => self.indexOf(item) === pos && item !== '')
.filter(
(item, pos, self) => self.indexOf(item) === pos && item !== ''
)
.join(' ')
break
}
Expand All @@ -263,7 +286,9 @@ function merge(original = {}, mixin = {}) {
* @returns {undefined}
*/
function validateComposeOption(composeTheme) {
if ([ COMPOSE_DEEPLY, COMPOSE_SOFTLY, DONT_COMPOSE ].indexOf(composeTheme) === -1) {
if (
[COMPOSE_DEEPLY, COMPOSE_SOFTLY, DONT_COMPOSE].indexOf(composeTheme) === -1
) {
throw new Error(
`Invalid composeTheme option for friendsofreactjs/react-css-themr. Valid composition options\
are ${COMPOSE_DEEPLY}, ${COMPOSE_SOFTLY} and ${DONT_COMPOSE}. The given\
Expand Down Expand Up @@ -294,10 +319,10 @@ function removeNamespace(key, themeNamespace) {
*/
function defaultMapThemrProps(ownProps, theme) {
const {
composeTheme, //eslint-disable-line no-unused-vars
composeTheme, //eslint-disable-line no-unused-vars
innerRef,
themeNamespace, //eslint-disable-line no-unused-vars
mapThemrProps, //eslint-disable-line no-unused-vars
mapThemrProps, //eslint-disable-line no-unused-vars
...rest
} = ownProps

Expand Down
40 changes: 21 additions & 19 deletions test/components/ThemeProvider.spec.js
Original file line number Diff line number Diff line change
Expand Up @@ -4,13 +4,12 @@ import PropTypes from 'prop-types'
import TestUtils from 'react-dom/test-utils'
import { ThemeProvider } from '../../src/index'


before(function () {
before(function() {
/* eslint-disable no-console */
console.error = function () {}
console.error = function() {}
})

after(function () {
after(function() {
delete console.error
})

Expand All @@ -33,23 +32,26 @@ describe('ThemeProvider', () => {
ThemeProvider.propTypes = {}

try {
expect(() => TestUtils.renderIntoDocument(
<ThemeProvider theme={theme}>
<div />
</ThemeProvider>
)).toNotThrow()
expect(() =>
TestUtils.renderIntoDocument(
<ThemeProvider theme={theme}>
<div />
</ThemeProvider>
)
).toNotThrow()

expect(() => TestUtils.renderIntoDocument(
<ThemeProvider theme={theme}>
<div />
<div />
</ThemeProvider>
)).toThrow(/expected to receive a single React element child/)
expect(() =>
TestUtils.renderIntoDocument(
<ThemeProvider theme={theme}>
<div />
<div />
</ThemeProvider>
)
).toThrow(/expected to receive a single React element child/)

expect(() => TestUtils.renderIntoDocument(
<ThemeProvider theme={theme}>
</ThemeProvider>
)).toThrow(/expected to receive a single React element child/)
expect(() =>
TestUtils.renderIntoDocument(<ThemeProvider theme={theme} />)
).toThrow(/expected to receive a single React element child/)
} finally {
ThemeProvider.propTypes = propTypes
}
Expand Down
Loading