Releases: thebuilder/react-intersection-observer
Releases · thebuilder/react-intersection-observer
v9.0.0
9.0.0 (2022-04-21)
This release is mainly to fix an issue with the exports not being properly tree-shaken.
Features
Size of exports
After tree shaking, this is the current size impact of the exports, as reported by size-limit.
InView
- 1.6 kB with all dependencies, minified and gzippeduseInView
- 1.13 kB with all dependencies, minified and gzippedobserve
- 835 B with all dependencies, minified and gzipped
BREAKING CHANGES
- Removed the
default
export of theInView
component. Use the namedInView
import instead
-import InView from 'react-intersection-observer
+import { InView } from 'react-intersection-observer
v9.0.0-beta.3
v9.0.0-beta.2
v9.0.0-beta.1
9.0.0-beta.1 (2022-04-20)
Features
- remove the default export (53123cc)
BREAKING CHANGES
- Can no longer do the default import of InView.
v8.34.0
8.34.0 (2022-04-12)
Features
Breaking changes
- This removes the old
tag
prop from<InView>
, that was deprecated byas
some years ago. If you haven't changed it, this could break your build. The fix would be to replace all instances oftag
withas
. - Changed the type of
as
from the oldReactType
toElementType
. This would only be a problem if you are still using the old version of the React Types.
v8.33.1
v8.33.0
8.33.0 (2021-12-09)
Features
This is solution for #495 that adds support for a fallbackInView
value.
You can set the fallback globally:
import { defaultFallbackInView } from 'react-intersection-observer';
defaultFallbackInView(true); // or 'false'
You can also define the fallback locally on useInView
or <InView>
as an
option. This will override the global fallback value.
import React from 'react';
import { useInView } from 'react-intersection-observer';
const Component = () => {
const { ref, inView, entry } = useInView({
fallbackInView: true,
});
return (
<div ref={ref}>
<h2>{`Header inside viewport ${inView}.`}</h2>
</div>
);
};