https://github.com/jamiebuilds/react-prop-matrix
Render something using every possible combination of props
https://github.com/jamiebuilds/react-prop-matrix
demo docs examples react
Last synced: 3 months ago
JSON representation
Render something using every possible combination of props
- Host: GitHub
- URL: https://github.com/jamiebuilds/react-prop-matrix
- Owner: jamiebuilds
- License: other
- Created: 2018-08-21T21:37:21.000Z (almost 7 years ago)
- Default Branch: master
- Last Pushed: 2018-08-24T21:41:47.000Z (almost 7 years ago)
- Last Synced: 2025-03-12T21:02:50.741Z (3 months ago)
- Topics: demo, docs, examples, react
- Language: JavaScript
- Size: 38.1 KB
- Stars: 66
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# react-prop-matrix
> Render something using every possible combination of props
## Install
```sh
yarn add react-prop-matrix
```
## Example
```js
import PropMatrix from 'react-prop-matrix';
let options = {
background: ['red', 'green', 'blue'],
children: ['Hello', 'World'],
};
{props => }
```
Will generate:
```js
```
##### With Filters
```js
import PropMatrix from 'react-prop-matrix';
let options = {
background: ['red', 'green', 'blue'],
children: ['Hello', 'World'],
};
let filters = {
background: ['red', 'green'],
children: ['Hello'],
};
{props => }
```
Will generate:
```js
```
## API
### ``
#### `props.options`
An object of props containing arrays with possible values.
```js
```
#### `props.filters`
Optionally filter the generated matrix to only include items that have matching
props. An empty array will match all items.
```js
```
#### `props.children`
A function that gets called for each item in the generated matrix and returns
React elements.
```js
(
)}/>
```
> **Note:** If you want to pass an array as a prop, you still need to nest it
> inside an options array. `{ items: [[1, 2], [3, 4]] }`