tsx-statements
v1.0.9
Published
useful components for working with conditions and statements in react
Downloads
81
Readme
TSX-STATEMENTS
Installation
yarn add tsx-statements
Or if you prefer npm :
npm i tsx-statements
Usage
import components
import { If, Else, Select, When, OtherWise, Map } from 'tsx-statements';
IF - Else
<If condition={age > 18}> <p>You are an adult !</p> <Else>Sorry, you can't see this content</Else> </If>
Select
<Select> <When condition={age > 70}>You are too old </When> <When condition={age > 18}>You are an adult</When> <When condition={age < 10}>You are too young </When> <OtherWise>none of above conditions are true</OtherWise> </Select>
Map
Full ts type support for items
Map :
<Map items={['alex', 'maria', 'max']}> {name => ( <div> <p>hello {name} !</p> </div> )} </Map>
Filtered-Map :
<Map items={[10, 12, 32, 67, 20, 30, 40]} filter={n => n > 25}> {num => ( <div> <p> {num} is greater than 25 ! </p> </div> )} </Map>