#Visibility

<Visibility visible={true}>This is visible</Visibility>

<Visibility
  visible={
    {
      foo: 'foo',
    }.foo === 'bar'
  }
>
  This is not visible
</Visibility>

<DataContext.Context.Provider
  value={{
    ...defaultContextState,
    data: {
      toBe: true,
      notToBe: false,
    },
  }}
>
  <Visibility pathTrue="/toBe">
    <p>This will show, as long as `toBe` is true.</p>
  </Visibility>
  <Visibility pathTrue="/notToBe">
    <p>This will not show until `notToBe` is true.</p>
  </Visibility>
</DataContext.Context.Provider>