Fix custom hljs distribution

Author: danez

README.md

@@ -21,7 +21,7 @@ or
 
 ```js
 import React, { Component } from 'react';
-import { Highlight } from 'react-fast-highlight';
+import Highlight from 'react-fast-highlight';
 
 class App extends Component {
 
@@ -66,9 +66,9 @@ A custom distribution might look like this
 import hljs from 'highlight.js/lib/highlight';
 
 // Lets only register javascript, scss, html/xml
-hljs.registerLanguage('scss', require('highlight.js/languages/scss'));
-hljs.registerLanguage('javascript', require('highlight.js/languages/javascript'));
-hljs.registerLanguage('xml', require('highlight.js/languages/xml'));
+hljs.registerLanguage('scss', require('highlight.js/lib/languages/scss'));
+hljs.registerLanguage('javascript', require('highlight.js/lib/languages/javascript'));
+hljs.registerLanguage('xml', require('highlight.js/lib/languages/xml'));
 
 export default hljs;
 ```
@@ -78,7 +78,7 @@ you can build your wrapper for highlighting code.
 
 ```js
 import React, { Component } from 'react';
-import { BareHighlight } from 'react-fast-highlight';
+import BareHighlight from 'react-fast-highlight/lib/BareHighlight';
 import hljs from './customhljs';
 
 class CustomHighlight extends Component {
@@ -93,7 +93,10 @@ class CustomHighlight extends Component {
 ```
 
 Now you can use this wrapper the same way as the default `Highlight` component with only support for
-certain languages.
+certain languages included.
+
+> In case you also want to use a webworker you should not use the supplied worker, as it includes all
+> languages. Instead you will need to copy the worker from this repo and adjust the `highlight.js` import.
 
 #### Webworker
 

src/components/BareHighlight.js renamed to src/BareHighlight.js

@@ -62,14 +62,14 @@ export default class BareHighlight extends PureComponent {
   }
 
   _highlightCode() {
-    const { highlightjs, languages, worker } = this.props;
+    const { languages, worker } = this.props;
 
     if (worker) {
       worker.onmessage = event => this.setState({
         highlightedCode: event.data.value,
         language: event.data.language,
       });
-      worker.postMessage({ code: this.getInitialCode(), languages, highlightjs });
+      worker.postMessage({ code: this.getInitialCode(), languages });
     } else {
       this.getHighlightPromise()
         .then(

src/components/Highlight.js renamed to src/Highlight.js

@@ -1,5 +1,4 @@
 /* @flow */
-import BareHighlight from './components/BareHighlight';
-import Highlight from './components/Highlight';
+import Highlight from './Highlight';
 
-export { BareHighlight, Highlight };
+export default Highlight;

src/index.js

@@ -1,15 +1,16 @@
 /* eslint-env worker */
 /* @flow */
+import hjs from 'highlight.js';
 
 declare function postMessage(result: Object): void;
 
 onmessage = (event) => {
-  const { code, languages, highlightjs } = event.data;
+  const { code, languages } = event.data;
   let result;
   if (languages && languages.length === 1) {
-    result = highlightjs.highlight(languages[0], code, true);
+    result = hjs.highlight(languages[0], code, true);
   } else {
-    result = highlightjs.highlightAuto(code, languages);
+    result = hjs.highlightAuto(code, languages);
   }
 
   postMessage(result);

src/worker.js

@@ -2,7 +2,7 @@ import React from 'react';
 import td from 'testdouble';
 import test from 'ava';
 import { mount, shallow } from 'enzyme';
-import BareHighlight from '../../src/components/BareHighlight';
+import BareHighlight from '../src/BareHighlight';
 
 test.cb('no language - calls correct highlightCall', (t) => {
   const hjs = td.replace('highlight.js');

test/components/BareHighlight.js renamed to test/BareHighlight.js

@@ -1,12 +1,8 @@
 import React from 'react';
 import { shallow } from 'enzyme';
 import test from 'ava';
-import { BareHighlight, Highlight } from '../src/index';
+import Highlight from '../src/index';
 
-test('exports Highlight component', (t) => {
-  t.notThrows(() => shallow(<Highlight>test</Highlight>));
-});
-
-test('exports BareHighlight component', (t) => {
+test('exports default component', (t) => {
   t.notThrows(() => shallow(<Highlight>test</Highlight>));
 });