cn-react-helpers
v1.0.2
Published
some react helpers
Downloads
5
Readme
Some useful react utilities.
Install
$ npm install cn-react-helpers
Development
Made with create-react-library
Test
$ npm test
Build
$ npm run build
Components
import { Show } from "cn-react-helpers"
function App(){
return (
<Show if={true}>
<h1> hello world! <h1/>
</Show>
)
}
if
- boolean - condition to show the component
import { Hide } from "cn-react-helpers"
function App(){
return (
<Hide if={true}>
<h1> hello world! <h1/>
</Hide>
)
}
if
- boolean - condition to hide the component
import { Each } from "cn-react-helpers"
function App(){
return (
<Each items={["first", "second", "third"]}>
{(item, index) => (
<h1>
{index}-{item}
</h1>
)}
</Each>
)
}
items
- array - iterate items
children
- function(index, item, arr) - returns items
import { Filter } from "cn-react-helpers"
function App(){
return (
<Filter items={[1, 2, 3]} if={item => item > 1}>
{(item, index) => (
<h1>
{index}-{item}
</h1>
)}
</Filter>
)
}
items
- array - filtable elements
children
- function(index, item, arr) - returns filtered elements
import { Truncate } from "cn-react-helpers"
function App(){
return (
<Truncate size={3} end="...">
Hello world
</Truncate>
)
}
size
- number - string length
end
- string - custom end of string
License
MIT © C4co