Hidden does not render multiple children regardless of breakpoints

[Izhaki]

When Hidden is provided with more than one child (at least in the css implementation), it does not throw an error and simply hides the content altogether.

<Hidden xsDown implementation="css">
  <NavLink href="/">Home</NavLink>
  <NavLink href="/audio">Audio</NavLink>
</Hidden>

• Material-UI: 1.0.0-beta.8

---

This is probably due to this check:

  if (!React.isValidElement(children)) {
    return null;
  }

which I assume returns false being given more than one element.

Before looking deeper into this, I'm not sure if this is actually the desired behaviour:

• why not allow more than one child?
• why is this check is there to begin with?

May submit a PR.

[rosskevin]

I expect Hidden and it's implementations HiddenJs and HiddenCss should allow multiple children, but it appears that it is typed for a single child.

I also expect that it hides all children.

@oliviertassinari is there a reason why a flow type restriction exists to a single child? I would expect the type to be children?: $ReadOnlyArray<ChildrenArray<Node>>,, meaning undefined to many of anything.

[oliviertassinari]

@rosskevin No reason I can remember. I was fighting with flow to get a green build.

[rosskevin]

why not allow more than one child?

@Izhaki I just submitted a PR to fix the flow type.

(isValidElemen) why is this check is there to begin with?

I assume it is there to prevent React.cloneElement from failing.

Here is the implementation:

/**
 * Verifies the object is a ReactElement.
 * See https://facebook.github.io/react/docs/top-level-api.html#react.isvalidelement
 * @param {?object} object
 * @return {boolean} True if `object` is a valid component.
 * @final
 */
ReactElement.isValidElement = function (object) {
  return typeof object === 'object' && object !== null && object.$$typeof === REACT_ELEMENT_TYPE;
};

---

Now, the title of your issue is Hidden always hides multiple children, which is what I expect.

So, with all of that said (and children type fixed), I don't think I understand the issue you have. Can you explain?

[Izhaki]

@rosskevin Sorry, the title was indeed confusing; I've updated it.

Essentially, if there's more than one child, Hidden will render none, regardless of the breakpoint set.