Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

react-extras

Package Overview
Dependencies
Maintainers
1
Versions
15
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

react-extras - npm Package Compare versions

Comparing version 0.5.0 to 0.6.0

dist/.DS_Store

26

dist/index.js

@@ -6,3 +6,3 @@ 'use strict';

});
exports.canUseDOM = exports.getDisplayName = exports.isStatelessComponent = exports.BodyClass = exports.RootClass = exports.For = exports.Choose = exports.If = exports.classNames = exports.autoBind = undefined;
exports.BodyClass = exports.RootClass = exports.For = exports.Choose = exports.If = exports.canUseDOM = exports.getDisplayName = exports.isStatelessComponent = exports.classNames = exports.autoBind = undefined;

@@ -23,3 +23,3 @@ var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();

var _autoBind2 = require('auto-bind');
var _autoBind2 = require('./auto-bind');

@@ -112,2 +112,12 @@ var _autoBind3 = _interopRequireDefault(_autoBind2);

var isStatelessComponent = exports.isStatelessComponent = function isStatelessComponent(Component) {
return !(typeof Component.prototype !== 'undefined' && typeof Component.prototype.render === 'function');
};
var getDisplayName = exports.getDisplayName = function getDisplayName(Component) {
return Component.displayName || Component.name || 'Component';
};
var canUseDOM = exports.canUseDOM = typeof window !== 'undefined' && 'document' in window && 'createElement' in window.document;
var If = exports.If = function If(props) {

@@ -254,12 +264,2 @@ return props.condition ? props.render ? props.render() : props.children : null;

BodyClass.propTypes = ElementClass.propTypes;
var isStatelessComponent = exports.isStatelessComponent = function isStatelessComponent(Component) {
return !(typeof Component.prototype !== 'undefined' && typeof Component.prototype.render === 'function');
};
var getDisplayName = exports.getDisplayName = function getDisplayName(Component) {
return Component.displayName || Component.name || 'Component';
};
var canUseDOM = exports.canUseDOM = typeof window !== 'undefined' && 'document' in window && 'createElement' in window.document;
BodyClass.propTypes = ElementClass.propTypes;
{
"name": "react-extras",
"version": "0.5.0",
"version": "0.6.0",
"description": "Useful components and utilities for working with React",

@@ -13,2 +13,3 @@ "license": "MIT",

"main": "./dist/index.js",
"typings": "./index.d.ts",
"engines": {

@@ -18,3 +19,3 @@ "node": ">=8"

"scripts": {
"build": "babel index.js --out-dir=dist",
"build": "babel index.js auto-bind.js --out-dir=dist",
"test": "xo && ava",

@@ -24,3 +25,4 @@ "prepublishOnly": "npm run build"

"files": [
"dist"
"dist",
"index.d.ts"
],

@@ -27,0 +29,0 @@ "keywords": [

@@ -12,3 +12,7 @@ # react-extras [![Build Status](https://travis-ci.org/sindresorhus/react-extras.svg?branch=master)](https://travis-ci.org/sindresorhus/react-extras)

<a href="https://www.patreon.com/sindresorhus">
<img src="https://c5.patreon.com/external/logo/become_a_patron_button@2x.png" width="160">
</a>
## Usage

@@ -116,5 +120,6 @@

React component similar to a switch case. `<Choose>` has 2 children components:
- `<Choose.When>` that renders the children if the `condition` prop is `true`.
- `<Choose.Otherwise>` that renders the children if has no `<Choose.When>` with `true` prop `condition`.
- `<Choose.When>` that renders the children if the `condition` prop is `true`.
- `<Choose.Otherwise>` that renders the children if has no `<Choose.When>` with `true` prop `condition`.
Note that even when the children are not rendered, they're still evaluated.

@@ -138,2 +143,20 @@

Or you could just use plain JavaScript:
```js
<div>
{(() => {
if (props.success) {
return <h1>{props.success}</h1>;
}
if (props.error) {
return <h1>{props.error}</h1>;
}
return <h1>😎</h1>;
})()}
</div>
```
### `<For/>`

@@ -155,5 +178,5 @@

<div>
{['🌈', '🦄', '😎'].map((item, index) =>
<button key={index}>{item}</button>
)}
{['🌈', '🦄', '😎'].map((item, index) =>
<button key={index}>{item}</button>
)}
</div>

@@ -220,2 +243,3 @@ ```

- [react-router-util](https://github.com/sindresorhus/react-router-util) - Useful components and utilities for working with React Router
- [sass-extras](https://github.com/sindresorhus/sass-extras) - Useful utilities for working with Sass

@@ -222,0 +246,0 @@

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc