Code Minified

Author: Oliver ALR

.prettierrc

@@ -0,0 +1,6 @@
+{
+ "trailingComma": "es5",
+ "tabWidth": 4,
+ "semi": false,
+ "singleQuote": true
+ }

README.md

@@ -10,7 +10,7 @@
 <div align="center">
 <!-- Badges -->
 
-![Release](https://img.shields.io/badge/release-v1.0.0-success)&nbsp;![Dependencies](https://img.shields.io/badge/dependencies-up%20to%20date-success)&nbsp;![Version](https://img.shields.io/github/v/release/facebook/react?logo=react)&nbsp;![License](https://img.shields.io/npm/l/react?color=blue)
+![Release](https://img.shields.io/badge/release-v1.0.3-success)&nbsp;![Dependencies](https://img.shields.io/badge/dependencies-up%20to%20date-success)&nbsp;![Version](https://img.shields.io/github/v/release/facebook/react?logo=react)&nbsp;![License](https://img.shields.io/npm/l/react?color=blue)
 
 </div>
 
@@ -49,8 +49,8 @@ npm install react-hider
 import Hider from 'react-hider'
 ```
 
-Wrap first the component to show and second the component to hide 
-inside Hider(library provided) or use pure raw jsx and provide a <strong>boolean(true/false)</strong> state: 
+Wrap first the component to show and second the component to hide
+inside Hider(library provided) or use pure raw jsx and provide a <strong>boolean(true/false)</strong> state:
 
 ```jsx
 <Hider state={boolean}>

package-lock.json

@@ -1,32 +1,45 @@
 {
- "name": "react-hider",
- "version": "1.0.0",
- "description": "",
- "main": "dist/index.js",
- "scripts": {
- "build": "rollup -c",
- "start": "rollup -c -w"
- },
- "keywords": [],
- "author": "",
- "license": "ISC",
- "peerDependencies": {
- "react": "^16.8.0",
- "react-dom": "^16.8.0"
- },
- "files": [
- "dist"
- ],
- "devDependencies": {
- "@babel/core": "^7.10.2",
- "@babel/preset-react": "^7.10.1",
- "babel-core": "^6.26.3",
- "babel-preset-react": "^6.24.1",
- "babel-runtime": "^6.26.0",
- "react": "^16.13.1",
- "react-dom": "^16.13.1",
- "rollup": "^2.13.1",
- "rollup-plugin-babel": "^4.4.0",
- "rollup-plugin-commonjs": "^10.1.0"
- }
+ "name": "react-hider",
+ "version": "1.0.3",
+ "description": "Conditional Rendering Made Easy",
+ "main": "dist/index.js",
+ "scripts": {
+ "build": "rollup -c",
+ "start": "rollup -c -w"
+ },
+ "keywords": [
+ "Conditional Rendering",
+ "react hider",
+ "hider",
+ "react",
+ "rendering",
+ "logical rendering",
+ "hide elements",
+ "hide",
+ "conditional rendering"
+ ],
+ "author": "",
+ "license": "ISC",
+ "peerDependencies": {
+ "react": "^16.8.0",
+ "react-dom": "^16.8.0"
+ },
+ "files": [
+ "dist"
+ ],
+ "devDependencies": {
+ "@babel/core": "^7.10.2",
+ "@babel/preset-react": "^7.10.1",
+ "babel-core": "^6.26.3",
+ "babel-preset-react": "^6.24.1",
+ "babel-runtime": "^6.26.0",
+ "react": "^16.13.1",
+ "react-dom": "^16.13.1",
+ "rollup": "^2.13.1",
+ "rollup-plugin-babel": "^4.4.0",
+ "rollup-plugin-commonjs": "^10.1.0"
+ },
+ "dependencies": {
+ "prettier": "^2.0.5"
+ }
 }

package.json

@@ -12,27 +12,15 @@ const Hider = ({ state, children }) => {
  const count = React.Children.count(children)
  // Show/Hide a single element based on boolean status
  if (count === 1) {
- return (
- <>
- {state && <>{children}</>}
- </>
- )
+ return <>{state && <>{children}</>}</>
  }
  // Show/Hide elements based on component's boolean status
  else if (count === 2) {
- return (
- <>
- {state ? (
- <>{children[0]}</>
- ) : (
- <>{children[1]}</>
- )}
- </>
- )
+ return <>{state ? <>{children[0]}</> : <>{children[1]}</>}</>
  }
  // Nothing is returned if there are n = 0 OR n > 2 children nodes
  else {
- return <></>
+ return <>{children}</>
  }
 }
 //Export default module "d(^o^)p"