Browser API's turned into React Hooks and Suspense-friendly components.
the-platform is a uber fun module that has React Hooks and Suspense friendly componets, it provides the below:
Hooks:
1
2
3
4
5
6
7
8
9
| useDeviceMotion()
useDeviceOrientation()
useGeoPosition()
useNetworkStatus()
useMedia()
useScript()
useStylesheet()
useWindowScrollPosition()
useWindowSize()
|
Components:
1
2
3
4
5
6
| <Img>
<Script>
<Video>
<Audio>
<Preload>
<Stylesheet>
|
P.S: Looks like it's a pun on #useThePlatform none the less it's an intresting module.
Sample usage:
1
2
3
4
5
6
7
8
9
| import { useGeoPosition } from 'the-platform';
const Example = () => {
const {
coords: { latitude, longitude },
} = useGeoPosition();
// ...
};
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
| import React from 'react';
import { Img } from 'the-platform';
function App() {
return (
<div>
<h1>Hello</h1>
<React.Suspense maxDuration={300} fallback={'loading...'}>
<Img src="https://source.unsplash.com/random/4000x2000" />
</React.Suspense>
</div>
);
}
export default App;
|
GIT FTW!
