index.js
1.36 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
// @flow
import * as React from 'react'
import { withCSSContext, Provider } from '@emotion/core'
import weakMemoize from '@emotion/weak-memoize'
type Props = {
theme: Object | (Object => Object),
children: React.Node
}
let getTheme = (outerTheme: Object, theme: Object | (Object => Object)) => {
if (typeof theme === 'function') {
const mergedTheme = theme(outerTheme)
if (
process.env.NODE_ENV !== 'production' &&
Object.prototype.toString.call(mergedTheme) !== '[object Object]'
) {
throw new Error(
'[@emotion/provider] Please return an object from your theme function, i.e. theme={() => ({})}!'
)
}
return mergedTheme
}
if (
process.env.NODE_ENV !== 'production' &&
Object.prototype.toString.call(theme) !== '[object Object]'
) {
throw new Error(
'[@emotion/provider] Please make your theme prop a plain object'
)
}
return { ...outerTheme, ...theme }
}
let createCreateCacheWithTheme = weakMemoize(cache => {
return weakMemoize(theme => {
let actualTheme = getTheme(cache.theme, theme)
return {
...cache,
theme: actualTheme
}
})
})
export default withCSSContext((props: Props, context) => {
if (props.theme !== context.theme) {
context = createCreateCacheWithTheme(context)(props.theme)
}
return <Provider value={context}>{props.children}</Provider>
})