Repository: tkh44/emotion
Pull request #130 (2017-07-11 10:39:20)

Move theming into its own file
⚠️ Breaking Change ⚠️ 
<!--
Thanks for your interest in the project. I appreciate bugs filed and PRs submitted!

Please make sure that you are familiar with and follow the Code of Conduct for
this project (found in the CODE_OF_CONDUCT.md file).

Also, please make sure you're familiar with and follow the instructions in the
contributing guidelines (found in the CONTRIBUTING.md file).

If you're new to contributing to open source projects, you might find this free
video course helpful: http://kcd.im/pull-request

Please fill out the information below to expedite the review and (hopefully)
merge of your pull request!
-->

<!-- What changes are being made? (What feature/bug is being fixed here?) -->
**What**:

Move `ThemeProvider` and `withTheme` exports to `emotion/react/theming`.

<!-- Why are these changes necessary? -->
**Why**:

Because not everyone wants theming and this doesn't force people to include it if they don't want it.

<!-- How were these changes implemented? -->
**How**:

<!-- Have you done all of these things?  -->
**Checklist**:
<!-- add "N/A" to the end of each line that's irrelevant to your changes -->
<!-- to check an item, place an "x" in the box like so: "- [x] Documentation" -->
- [x] Documentation
- [x] Tests
- [x] Code complete

<!-- feel free to add additional comments -->


thangngoc89: Yes. Yes. Yes. I'm upset about the size of emotion after adding theming feature
codecov-io: # [Codecov](https://codecov.io/gh/tkh44/emotion/pull/130?src=pr&el=h1) Report
> Merging [#130](https://codecov.io/gh/tkh44/emotion/pull/130?src=pr&el=desc) into [master](https://codecov.io/gh/tkh44/emotion/commit/3a856bed38c481851c7b1705731ea31d28095583?src=pr&el=desc) will **increase** coverage by `0.01%`.
> The diff coverage is `100%`.

[![Impacted file tree graph](https://codecov.io/gh/tkh44/emotion/pull/130/graphs/tree.svg?height=150&src=pr&token=B1bWuYNE2t&width=650)](https://codecov.io/gh/tkh44/emotion/pull/130?src=pr&el=tree)

```diff
@@            Coverage Diff             @@
##           master     #130      +/-   ##
==========================================
+ Coverage    88.4%   88.42%   +0.01%     
==========================================
  Files          16       18       +2     
  Lines         595      596       +1     
  Branches      131      131              
==========================================
+ Hits          526      527       +1     
  Misses         55       55              
  Partials       14       14
```


| [Impacted Files](https://codecov.io/gh/tkh44/emotion/pull/130?src=pr&el=tree) | Coverage Δ | |
|---|---|---|
| [src/react/index.js](https://codecov.io/gh/tkh44/emotion/pull/130?src=pr&el=tree#diff-c3JjL3JlYWN0L2luZGV4Lmpz) | `85.71% <ø> (ø)` | |
| [src/react/constants.js](https://codecov.io/gh/tkh44/emotion/pull/130?src=pr&el=tree#diff-c3JjL3JlYWN0L2NvbnN0YW50cy5qcw==) | `100% <100%> (ø)` | |
| [src/react/theming.js](https://codecov.io/gh/tkh44/emotion/pull/130?src=pr&el=tree#diff-c3JjL3JlYWN0L3RoZW1pbmcuanM=) | `100% <100%> (ø)` | |

------

[Continue to review full report at Codecov](https://codecov.io/gh/tkh44/emotion/pull/130?src=pr&el=continue).
> **Legend** - [Click here to learn more](https://docs.codecov.io/docs/codecov-delta)
> `Δ = absolute <relative> (impact)`, `ø = not affected`, `? = missing data`
> Powered by [Codecov](https://codecov.io/gh/tkh44/emotion/pull/130?src=pr&el=footer). Last update [3a856be...6cba2f9](https://codecov.io/gh/tkh44/emotion/pull/130?src=pr&el=lastupdated). Read the [comment docs](https://docs.codecov.io/docs/pull-request-comments).

tkh44: @mitchellhamilton I'm sitting on this until I figure out the glamor and className merging.

Patch:
diff --git a/docs/theming.md b/docs/theming.md
index 7a285cda..181d482e 100644
--- a/docs/theming.md
+++ b/docs/theming.md
@@ -1,7 +1,7 @@
 ## Theming
 
 ```jsx
-import { ThemeProvider, withTheme } from 'emotion/react'
+import { ThemeProvider, withTheme } from 'emotion/react/theming'
 ```
 
 Theming is provided by the theming library. 
diff --git a/package.json b/package.json
index 596cb382..4797b763 100644
--- a/package.json
+++ b/package.json
@@ -8,7 +8,7 @@
     "src",
     "dist",
     "lib",
-    "react.js",
+    "react",
     "server.js",
     "vue.js",
     "dist/DO-NOT-USE.min.js"
diff --git a/react.js b/react.js
deleted file mode 100644
index 8a86673d..00000000
--- a/react.js
+++ /dev/null
@@ -1,1 +0,0 @@
-module.exports = require('./lib/react')
diff --git a/react/index.js b/react/index.js
new file mode 100644
index 00000000..0438f0f9
--- /dev/null
+++ b/react/index.js
@@ -0,0 +1,1 @@
+module.exports = require('../lib/react')
diff --git a/react/theming.js b/react/theming.js
new file mode 100644
index 00000000..7df9a51d
--- /dev/null
+++ b/react/theming.js
@@ -0,0 +1,1 @@
+module.exports = require('../lib/react/theming')
diff --git a/src/react/constants.js b/src/react/constants.js
new file mode 100644
index 00000000..0652cd14
--- /dev/null
+++ b/src/react/constants.js
@@ -0,0 +1,1 @@
+export const CHANNEL = '__emotion__'
diff --git a/src/react.js b/src/react/index.js
similarity index 87%
rename from src/react.js
rename to src/react/index.js
index 66b0b163..ab5254d7 100644
--- a/src/react.js
+++ b/src/react/index.js
@@ -1,13 +1,9 @@
 import { Component, createElement as h } from 'react'
-import { createTheming } from 'theming'
 import PropTypes from 'prop-types'
 import map from '@arr/map'
-import { css } from './index'
-import { omit } from './utils'
-
-const theming = createTheming('__emotion__')
-const { channel: CHANNEL, withTheme, ThemeProvider } = theming
-export { CHANNEL, withTheme, ThemeProvider }
+import { css } from '../index'
+import { omit } from '../utils'
+import { CHANNEL } from './constants'
 
 export default function (tag, cls, vars = [], content) {
   if (!tag) {
diff --git a/src/react/theming.js b/src/react/theming.js
new file mode 100644
index 00000000..a44b8679
--- /dev/null
+++ b/src/react/theming.js
@@ -0,0 +1,6 @@
+import { createTheming } from 'theming'
+import { CHANNEL } from './constants'
+
+const theming = createTheming(CHANNEL)
+const { withTheme, ThemeProvider } = theming
+export { CHANNEL, withTheme, ThemeProvider }


Test patch:
diff --git a/test/react.test.js b/test/react.test.js
index f0122092..d0102b03 100644
--- a/test/react.test.js
+++ b/test/react.test.js
@@ -3,7 +3,8 @@ import React from 'react'
 import renderer from 'react-test-renderer'
 import { matcher, serializer } from '../jest-utils'
 import { css } from '../src/index'
-import styled, { ThemeProvider } from '../src/react'
+import styled from '../src/react'
+import { ThemeProvider } from '../src/react/theming'
 
 import { lighten, hiDPI, modularScale, borderWidth } from 'polished'