hiding-header - npm Package Compare versions

Comparing version 0.1.1 to 0.1.2

package.json

 {
 	"name": "hiding-header",
-	"version": "0.1.1",
+	"version": "0.1.2",
 	"description": "Toggles header visibility on scroll.",
@@ -5,0 +5,0 @@ "main": "dist/index.js",

README.md

@@ -64,1 +64,24 @@ # Hiding Header [![npm](https://img.shields.io/npm/v/hiding-header.svg)](https://www.npmjs.com/package/hiding-header) [![Dependencies](https://img.shields.io/david/FilipChalupa/hiding-header.svg)](https://www.npmjs.com/package/hiding-header?activeTab=dependencies) ![npm type definitions](https://img.shields.io/npm/types/hiding-header.svg)
 ```
+
+### React component (HTML alternative)
+
+```jsx
+import React, { useEffect } from 'react'
+import { hidingHeader } from 'hiding-header'
+
+export const HidingHeader = (props) => {
+	const container = React.useRef()
+
+	useEffect(() => {
+		hidingHeader(container.current)
+	}, [])
+
+	return (
+		<div className="hidingHeader" ref={container}>
+			<div className="hidingHeader-in">
+				<div className="hidingHeader-content">{props.children}</div>
+			</div>
+		</div>
+	)
+}
+```

No alert changes

Improved metrics

Total package byte prevSize

11993

increased by4.01%

Number of lines in readme file

87

increased by35.94%

No dependency changes