chore(package): use shallowequal instead of fbjs and use alias in docs (

#2940)

docs/src/components/ComponentDoc/ComponentExample/ComponentExample.js

@@ -1,11 +1,12 @@
 import * as Babel from '@babel/standalone'
+import copyToClipboard from 'copy-to-clipboard'
+import { html } from 'js-beautify'
 import _ from 'lodash'
 import PropTypes from 'prop-types'
 import React, { PureComponent, createElement, isValidElement } from 'react'
 import { withRouter } from 'react-router'
 import { renderToStaticMarkup } from 'react-dom/server'
-import { html } from 'js-beautify'
-import copyToClipboard from 'copy-to-clipboard'
+import { Divider, Grid, Menu, Visibility } from 'semantic-ui-react'
 
 import {
   exampleContext,
@@ -14,7 +15,6 @@ import {
   repoURL,
   scrollToAnchor,
 } from 'docs/src/utils'
-import { Divider, Grid, Menu, Visibility } from 'src'
 import Editor from 'docs/src/components/Editor/Editor'
 import ComponentControls from '../ComponentControls'
 import ComponentExampleTitle from './ComponentExampleTitle'

docs/src/components/ComponentDoc/ContributionPrompt.js

@@ -1,8 +1,8 @@
 import PropTypes from 'prop-types'
 import React from 'react'
+import { Message, Icon } from 'semantic-ui-react'
 
 import { repoURL } from 'docs/src/utils'
-import { Message, Icon } from 'src'
 
 const ContributionPrompt = ({ children }) => (
   <Message info icon>

docs/src/components/ComponentDoc/ExampleSection.js

@@ -1,7 +1,6 @@
 import PropTypes from 'prop-types'
 import React from 'react'
-
-import { Grid, Header } from 'src'
+import { Grid, Header } from 'semantic-ui-react'
 
 const headerStyle = { marginBottom: '1.5em' }
 const sectionStyle = {

docs/src/components/IconSearch/IconSearch.js

@@ -2,9 +2,9 @@ import copyToClipboard from 'copy-to-clipboard'
 import _ from 'lodash/fp'
 import leven from 'leven'
 import React, { Component } from 'react'
+import { Form, Grid, Header, Icon, Message, Popup } from 'semantic-ui-react'
 
-import { SUI } from 'src/lib'
-import { Form, Grid, Header, Icon, Message, Popup } from 'src'
+import * as SUI from 'src/lib/SUI'
 
 const gridStyle = {
   background: '#fff',

docs/src/components/LayoutsLayout.js

@@ -2,8 +2,8 @@ import _ from 'lodash'
 import PropTypes from 'prop-types'
 import React, { Component } from 'react'
 import { NavLink, Route } from 'react-router-dom'
+import { Button } from 'semantic-ui-react'
 
-import { Button } from 'src'
 import { getUnhandledProps } from 'src/lib'
 import { repoURL } from 'docs/src/utils'
 

docs/src/components/Logo/Logo.js

@@ -1,5 +1,5 @@
 import React from 'react'
-import { Image } from 'src'
+import { Image } from 'semantic-ui-react'
 
 const Logo = props => <Image {...props} src='/logo.png' />
 

docs/src/examples/addons/Radio/Types/index.js

@@ -1,9 +1,9 @@
 import React from 'react'
+import { Message } from 'semantic-ui-react'
+
 import ComponentExample from 'docs/src/components/ComponentDoc/ComponentExample'
 import ExampleSection from 'docs/src/components/ComponentDoc/ExampleSection'
 
-import { Message } from 'src'
-
 const RadioTypesExamples = () => (
   <ExampleSection title='Types'>
     <ComponentExample

docs/src/examples/collections/Form/Types/index.js

@@ -1,9 +1,9 @@
 import React from 'react'
+import { Message, Icon } from 'semantic-ui-react'
+
 import ExampleSection from 'docs/src/components/ComponentDoc/ExampleSection'
 import ComponentExample from 'docs/src/components/ComponentDoc/ComponentExample'
 
-import { Message, Icon } from 'src'
-
 const FormTypesExamples = () => (
   <ExampleSection title='Types'>
     <ComponentExample

docs/src/examples/collections/Form/Usage/index.js

@@ -1,9 +1,9 @@
 import React from 'react'
+import { Message, Icon } from 'semantic-ui-react'
+
 import ExampleSection from 'docs/src/components/ComponentDoc/ExampleSection'
 import ComponentExample from 'docs/src/components/ComponentDoc/ComponentExample'
 
-import { Message, Icon } from 'src'
-
 const FormFormUsageExamples = () => (
   <ExampleSection title='Usage'>
     <Message info icon>

docs/src/examples/elements/Icon/index.js

@@ -1,7 +1,7 @@
 import React, { Component } from 'react'
+import { Menu } from 'semantic-ui-react'
 
-import { Menu } from 'src'
-import IconSearch from '../../../components/IconSearch/IconSearch'
+import IconSearch from 'docs/src/components/IconSearch/IconSearch'
 import States from './States'
 import Variations from './Variations'
 import Groups from './Groups'

docs/src/hoc/updateForKeys.js

@@ -1,7 +1,6 @@
 import _ from 'lodash'
 import React, { Component } from 'react'
-
-import { shallowEqual } from 'src/lib'
+import shallowEqual from 'shallowequal'
 
 const updateForKeys = propKeys => ChildComponent =>
   class extends Component {

docs/src/views/Introduction.js

@@ -1,12 +1,12 @@
 import PropTypes from 'prop-types'
 import React from 'react'
 import { Link } from 'react-router-dom'
+import { Container, Divider, Grid, Header, Icon, Label, List, Segment } from 'semantic-ui-react'
 
 import Editor from 'docs/src/components/Editor/Editor'
+import Logo from 'docs/src/components/Logo/Logo'
 import { semanticUIDocsURL, repoURL } from 'docs/src/utils'
 import pkg from 'package.json'
-import { Container, Divider, Grid, Header, Icon, Label, List, Segment } from 'src'
-import Logo from '../components/Logo/Logo'
 
 const AccordionJSX = `const panels = [{
   title: 'What is a dog?',

docs/src/views/PageNotFound.js

@@ -1,5 +1,5 @@
 import React from 'react'
-import { Grid, Segment, Header, Icon } from 'src'
+import { Grid, Segment, Header, Icon } from 'semantic-ui-react'
 
 const PageNotFound = () => (
   <Grid padded textAlign='center' stretched>

docs/src/views/Usage.js

@@ -1,10 +1,10 @@
 import React from 'react'
 import pkg from 'package.json'
 import { NavLink } from 'react-router-dom'
+import { Button, Container, Header, List, Message, Segment } from 'semantic-ui-react'
 
+import Logo from 'docs/src/components/Logo/Logo'
 import { semanticUIDocsURL, semanticUIRepoURL, semanticUICSSRepoURL } from 'docs/src/utils'
-import { Button, Container, Header, List, Message, Segment } from 'src'
-import Logo from '../components/Logo/Logo'
 
 const suiCSSVersion = pkg.devDependencies['semantic-ui-css'].replace(/[~^]/, '')
 

package.json

@@ -65,10 +65,10 @@
   "dependencies": {
     "@babel/runtime": "^7.0.0-beta.49",
     "classnames": "^2.2.5",
-    "fbjs": "^0.8.16",
     "keyboard-key": "^1.0.1",
     "lodash": "^4.17.10",
-    "prop-types": "^15.6.1"
+    "prop-types": "^15.6.1",
+    "shallowequal": "^1.0.2"
   },
   "devDependencies": {
     "@babel/cli": "^7.0.0-beta.49",

src/lib/shallowEqual.js

@@ -1,3 +1,3 @@
-import shallowEqual from 'fbjs/lib/shallowEqual'
+import shallowEqual from 'shallowequal'
 
 export default shallowEqual