diff --git a/docs/src/components/ComponentDoc/ComponentExample/ComponentExample.js b/docs/src/components/ComponentDoc/ComponentExample/ComponentExample.js index a0cddce957..d945ecf1fc 100644 --- a/docs/src/components/ComponentDoc/ComponentExample/ComponentExample.js +++ b/docs/src/components/ComponentDoc/ComponentExample/ComponentExample.js @@ -3,7 +3,8 @@ import cx from 'classnames' import copyToClipboard from 'copy-to-clipboard' import PropTypes from 'prop-types' import React, { Component } from 'react' -import VisibilitySensor from 'react-visibility-sensor' +import { InView } from 'react-intersection-observer' + import { Checkbox, Grid, Label } from 'semantic-ui-react' import { examplePathToHash, scrollToAnchor } from 'docs/src/utils' @@ -168,11 +169,7 @@ class ComponentExample extends Component { } = this.state return ( - +
@@ -224,7 +221,7 @@ class ComponentExample extends Component { {isActiveHash && }
-
+ ) } } diff --git a/package.json b/package.json index 04c7a0f3aa..e201fa03b2 100644 --- a/package.json +++ b/package.json @@ -157,6 +157,7 @@ "react-docgen": "^4.1.0", "react-dom": "^16.9.0", "react-hot-loader": "^4.12.11", + "react-intersection-observer": "^8.26.2", "react-router": "^5.0.0", "react-router-dom": "^5.0.0", "react-source-render": "^3.0.0-5", @@ -164,7 +165,6 @@ "react-static-routes": "^1.0.0", "react-test-renderer": "^16.9.0", "react-universal-component": "^3.0.3", - "react-visibility-sensor": "^5.0.2", "rimraf": "^2.6.3", "satisfied": "^1.1.2", "semantic-ui-css": "^2.4.1", diff --git a/yarn.lock b/yarn.lock index 040526ed57..3a0f06044d 100644 --- a/yarn.lock +++ b/yarn.lock @@ -10041,6 +10041,13 @@ react-hot-loader@^4, react-hot-loader@^4.12.11: shallowequal "^1.1.0" source-map "^0.7.3" +react-intersection-observer@^8.26.2: + version "8.26.2" + resolved "https://registry.yarnpkg.com/react-intersection-observer/-/react-intersection-observer-8.26.2.tgz#0562ff0c06b2b10e809190c2fa9b6ded656e6e16" + integrity sha512-GmSjLNK+oV7kS+BHfrJSaA4wF61ELA33gizKHmN+tk59UT6/aW8kkqvlrFGPwxGoaIzLKS2evfG5fgkw5MIIsg== + dependencies: + tiny-invariant "^1.1.0" + react-is@^16.6.0, react-is@^16.6.3, react-is@^16.7.0, react-is@^16.8.1, react-is@^16.8.6, react-is@^16.9.0: version "16.9.0" resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.9.0.tgz#21ca9561399aad0ff1a7701c01683e8ca981edcb" @@ -10208,13 +10215,6 @@ react-universal-component@^2.8.1, react-universal-component@^3.0.3: hoist-non-react-statics "^2.2.1" prop-types "^15.5.10" -react-visibility-sensor@^5.0.2: - version "5.0.2" - resolved "https://registry.yarnpkg.com/react-visibility-sensor/-/react-visibility-sensor-5.0.2.tgz#e360fff81572cb3a2a9fd680484447a9da09a55d" - integrity sha512-7+1lr7oQOO2vKr5u/uxoDGFWAAy7lsDy2aJU3Zy1/OymI+TRqOBk8m2L8YE1B0UyfCDWxVAWO+aifVGqNOvqeQ== - dependencies: - prop-types "^15.6.2" - react@^16, react@^16.9.0: version "16.9.0" resolved "https://registry.yarnpkg.com/react/-/react-16.9.0.tgz#40ba2f9af13bc1a38d75dbf2f4359a5185c4f7aa" @@ -11850,6 +11850,11 @@ tiny-invariant@^1.0.2: resolved "https://registry.yarnpkg.com/tiny-invariant/-/tiny-invariant-1.0.3.tgz#91efaaa0269ccb6271f0296aeedb05fc3e067b7a" integrity sha512-ytQx8T4DL8PjlX53yYzcIC0WhIZbpR0p1qcYjw2pHu3w6UtgWwFJQ/02cnhOnBBhlFx/edUIfcagCaQSe3KMWg== +tiny-invariant@^1.1.0: + version "1.1.0" + resolved "https://registry.yarnpkg.com/tiny-invariant/-/tiny-invariant-1.1.0.tgz#634c5f8efdc27714b7f386c35e6760991d230875" + integrity sha512-ytxQvrb1cPc9WBEI/HSeYYoGD0kWnGEOR8RY6KomWLBVhqz0RgTwVO9dLrGz7dC+nN9llyI7OKAgRq8Vq4ZBSw== + tiny-warning@^1.0.0: version "1.0.2" resolved "https://registry.yarnpkg.com/tiny-warning/-/tiny-warning-1.0.2.tgz#1dfae771ee1a04396bdfde27a3adcebc6b648b28"