rogain-component-if

<If data={variable} or and not equal defined empty gt gte lt lte />

Passes its children through if data passes defined attribute tests. Any trees defined after the <Else /> will be passed through if data doesn't pass attributes tests.

The attributes and, or, and not can be used to define how all tests should logically be grouped. The attribute predicates equal, defined, empty, gt, gte, lt, lte can be used to test against the data attribute value.

Attributes

Attribute | Description --- | --- data | Variable or Expression. and | Runs all tests with AND logic, short circuits when any predicate fails. The default is and if or is not defined. or | Runs all predicates with OR logic, short cicuits when any predicate passes. not | Negates the end result of all tests.

Attribute Predicates

Attribute | Description --- | --- equal | Variable or Expression. returns true if it's value is equal to data defined | if defined, returns true if data is defined empty | if defined, returns true if data is an empty array or object gt | Variable or Expression. returns true if it's value is greater than data gte |Variable or Expression. returns true if it's value is greater than or equal to data lt | Variable or Expression. returns true if it's value is less than data lte | Variable or Expression. returns true if it's value is thess than or equal to data

Examples

Default Predicates / Else

If no tests are defined, the default predicates are <If data={var} and defined empty="false"></If>

<If data={loggedIn} equal="true">
    <Dashboard />
<Else />
    <Login />
</If>

Negated Predicates

<If data={error} defined="false">Way to go, no errors!</If>
<If data={error} not defined>Way to go, no errors!</If>

Complex Predicates

If and or or attributes aren't defined the predicates will be run using AND logic by default.

<If data={index} lt="100" gte="0">10 - 99</If>
<If data={index} lt="1000" gte="100">100 - 999</If>
<If data={index} gte="1000">1000+</If>

OR Logic

<If data={mythings} or empty defined="false">MY THINGS BE MISSING</If>

Install

With npm do:

npm install rogain-component-if

License

MIT