logo

eola Style Guide 2024: Conditional Wrapper

Conditional Wrapper

Input is used in place of a traditional `input` element. This has formik baked into it for ease of use.

Examples

If condition is true

<ConditionalWrapper
  condition={true}
  wrapper={children => {
    return (
      <div>
        <h2>This is the wrapper</h2>
        {children}
      </div>
    )
  }}
>
  <p>This is the child component</p>
</ConditionalWrapper>
    

If condition is false

<ConditionalWrapper
  condition={false}
  wrapper={children => {
    return (
      <div>
      <h2>This is the wrapper</h2>
        {children}
      </div>
    )
  }}
>
  <p>This is the child component</p>
</ConditionalWrapper>