Add a condition property to the Mount component

[creativecreature]

Overview

With these changes I hope to make it easier, and slightly more efficient, to perform conditional rendering.

Sometimes I've had to derive two boolean facets like this:

const itemsFacet = useFacetMap((facet) => facet.items, [], [useRemoteFacet(someFacetSelector)])
const hasItems = useFacetMap((facet) => Boolean(facet.items.length), [], [itemsFacet])
const hasNoItems = useFacetMap((facet) => Boolean(!facet.items.length), [], [itemsFacet])

return (
  <>
    <Mount when={hasItems}>
      <p>Has items</p>
    </Mount>
    <Mount when={hasNoItems}>
      <p>Has no items</p>
    </Mount>
  </>
)

My suggestion is to make the Mount component accept an optional condition prop to be able to flip booleans from the same facet:

const itemsFacet = useFacetMap((facet) => facet.items, [], [useRemoteFacet(someFacetSelector)])
const hasItems = useFacetMap((facet) => Boolean(facet.items.length), [], [itemsFacet])

return (
  <>
    <Mount when={hasItems}>
      <p>Has items</p>
    </Mount>
    <Mount when={hasItems} condition={false}>
      <p>Has no items</p>
    </Mount>
  </>
)