Declarative ternary operations for the masses!

THE DOCS

npm install --save conditional-react

It's pretty simple, really. Import the components and declare your logic!

<Conditional>
  <If>
    <p>IT'S TRUE 🗿🗿🗿</p>
  </If>

  <Else>Darn it it's false!</Else>
</Conditional>

const [option, setoption] = useState(true);

return (
  <Conditional>
    <If>
      <p>IT'S TRUE 🗿🗿🗿</p>
    </If>

    <Else>Darn it it's false!</Else>
  </Conditional>
);

const [option, setoption] = useState("initial value");

return (
  <Conditional condition={option}>
    <Switch>
      <Case value="initial value"></Case>

      <Default></Default>
    </Switch>
  </Conditional>
);

What does this thing provide?

Conditional React provides a utilitarian set of components that will make your life SO much easier !

This is the overarching API exposed by this library that takes in the condition. Boolean for if/else statements and strings/objects whatever for switch statements.

The two babies of the conditional component. If the statement resolves to true, it'll show the If component, else it will show the Else component and it's children.

The Switch component can only show one component at a time and resolves the condition from it's parent Conditional component. The case takes in a value and checks if the condition is equal to the condition in the parent Conditional component. The Switch component defaults to the Default component if no conditions are met.

MIT © alekangelov