// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`CountryDropdown renders 1`] = `
<div
  className="container"
>
  <div
    className="button"
    onClick={[MockFunction]}
    onKeyDown={[Function]}
    role="button"
    tabIndex="0"
  >
    flag
  </div>
  <CSSTransition
    classNames={
      Object {
        "enter": "list-enter",
        "enterActive": "list-enter-active",
        "exit": "list-exit",
        "exitActive": "list-exit-active",
      }
    }
    in={true}
    mountOnEnter={true}
    nodeRef={
      Object {
        "current": null,
      }
    }
    timeout={200}
    unmountOnExit={true}
  >
    <div
      className="list"
      role="menu"
    >
      <input
        autoFocus={true}
        className="search"
        onChange={[Function]}
        onKeyDown={[Function]}
        type="text"
        value=""
      />
      <CountryItem
        code={null}
        country="All Countries"
        onSelect={[Function]}
      />
    </div>
  </CSSTransition>
</div>
`;

exports[`CountryDropdown renders closed 1`] = `
<div
  className="container"
>
  <div
    className="button"
    onClick={[MockFunction]}
    onKeyDown={[Function]}
    role="button"
    tabIndex="0"
  >
    flag
  </div>
  <CSSTransition
    classNames={
      Object {
        "enter": "list-enter",
        "enterActive": "list-enter-active",
        "exit": "list-exit",
        "exitActive": "list-exit-active",
      }
    }
    mountOnEnter={true}
    nodeRef={
      Object {
        "current": null,
      }
    }
    timeout={200}
    unmountOnExit={true}
  >
    <div
      className="list"
      role="menu"
    >
      <input
        autoFocus={true}
        className="search"
        onChange={[Function]}
        onKeyDown={[Function]}
        type="text"
        value=""
      />
      <CountryItem
        code={null}
        country="All Countries"
        onSelect={[Function]}
      />
    </div>
  </CSSTransition>
</div>
`;

exports[`CountryDropdown renders with countries 1`] = `
<div
  className="container"
>
  <div
    className="button"
    onClick={[MockFunction]}
    onKeyDown={[Function]}
    role="button"
    tabIndex="0"
  >
    flag
  </div>
  <CSSTransition
    classNames={
      Object {
        "enter": "list-enter",
        "enterActive": "list-enter-active",
        "exit": "list-exit",
        "exitActive": "list-exit-active",
      }
    }
    in={true}
    mountOnEnter={true}
    nodeRef={
      Object {
        "current": null,
      }
    }
    timeout={200}
    unmountOnExit={true}
  >
    <div
      className="list"
      role="menu"
    >
      <input
        autoFocus={true}
        className="search"
        onChange={[Function]}
        onKeyDown={[Function]}
        type="text"
        value=""
      />
      <CountryItem
        code="a21"
        country="c1"
        key="a21"
        onSelect={[Function]}
      />
      <CountryItem
        code="a22"
        country="c2"
        key="a22"
        onSelect={[Function]}
      />
      <CountryItem
        code="a23"
        country="c3"
        key="a23"
        onSelect={[Function]}
      />
      <CountryItem
        code={null}
        country="All Countries"
        onSelect={[Function]}
      />
    </div>
  </CSSTransition>
</div>
`;

exports[`CountryItem renders 1`] = `
<div
  className="item"
  onClick={[Function]}
  onKeyDown={[Function]}
  role="menuitem"
  tabIndex="0"
>
  flag
   - 
  test-country
</div>
`;

exports[`Dropdown renders closed 1`] = `
<div
  className="container"
>
  <div
    className="button"
    onClick={[MockFunction]}
    onKeyDown={[Function]}
    role="button"
    tabIndex="0"
  />
  <CSSTransition
    classNames={
      Object {
        "enter": "list-enter",
        "enterActive": "list-enter-active",
        "exit": "list-exit",
        "exitActive": "list-exit-active",
      }
    }
    mountOnEnter={true}
    nodeRef={
      Object {
        "current": null,
      }
    }
    timeout={200}
    unmountOnExit={true}
  >
    <div
      className="list"
      role="menu"
    />
  </CSSTransition>
</div>
`;

exports[`Dropdown renders with items 1`] = `
<div
  className="container"
>
  <div
    className="button"
    onClick={[MockFunction]}
    onKeyDown={[Function]}
    role="button"
    tabIndex="0"
  />
  <CSSTransition
    classNames={
      Object {
        "enter": "list-enter",
        "enterActive": "list-enter-active",
        "exit": "list-exit",
        "exitActive": "list-exit-active",
      }
    }
    in={true}
    mountOnEnter={true}
    nodeRef={
      Object {
        "current": null,
      }
    }
    timeout={200}
    unmountOnExit={true}
  >
    <div
      className="list"
      role="menu"
    >
      <Item
        key="\\"test1\\""
        onSelect={[Function]}
        value="test1"
      />
      <Item
        key="\\"test2\\""
        onSelect={[Function]}
        value="test2"
      />
    </div>
  </CSSTransition>
</div>
`;

exports[`Dropdown renders with no items 1`] = `
<div
  className="container"
>
  <div
    className="button"
    onClick={[MockFunction]}
    onKeyDown={[Function]}
    role="button"
    tabIndex="0"
  />
  <CSSTransition
    classNames={
      Object {
        "enter": "list-enter",
        "enterActive": "list-enter-active",
        "exit": "list-exit",
        "exitActive": "list-exit-active",
      }
    }
    in={true}
    mountOnEnter={true}
    nodeRef={
      Object {
        "current": null,
      }
    }
    timeout={200}
    unmountOnExit={true}
  >
    <div
      className="list"
      role="menu"
    />
  </CSSTransition>
</div>
`;

exports[`Dropdown responds to item selection 1`] = `
<div
  className="container"
>
  <div
    className="button"
    onClick={[MockFunction]}
    onKeyDown={[Function]}
    role="button"
    tabIndex="0"
  >
    display
  </div>
  <CSSTransition
    classNames={
      Object {
        "enter": "list-enter",
        "enterActive": "list-enter-active",
        "exit": "list-exit",
        "exitActive": "list-exit-active",
      }
    }
    in={true}
    mountOnEnter={true}
    nodeRef={
      Object {
        "current": null,
      }
    }
    timeout={200}
    unmountOnExit={true}
  >
    <div
      className="list"
      role="menu"
    >
      <Item
        key="\\"test1\\""
        onSelect={[Function]}
        value="test1"
      />
      <Item
        key="\\"test2\\""
        onSelect={[Function]}
        value="test2"
      />
    </div>
  </CSSTransition>
</div>
`;

exports[`DropdownGroup can have a dropdown closed after opening 1`] = `
<Fragment>
  <Dropdown
    key="dd1"
    onClick={[Function]}
    onSelect={[Function]}
    open={false}
  />
  <Dropdown
    key="dd2"
    onClick={[Function]}
    onSelect={[Function]}
    open={false}
  />
  <Dropdown
    key="dd3"
    onClick={[Function]}
    onSelect={[Function]}
    open={false}
  />
</Fragment>
`;

exports[`DropdownGroup can have a dropdown opened 1`] = `
<Fragment>
  <Dropdown
    key="dd1"
    onClick={[Function]}
    onSelect={[Function]}
    open={false}
  />
  <Dropdown
    key="dd2"
    onClick={[Function]}
    onSelect={[Function]}
    open={true}
  />
  <Dropdown
    key="dd3"
    onClick={[Function]}
    onSelect={[Function]}
    open={false}
  />
</Fragment>
`;

exports[`DropdownGroup renders with dropdowns 1`] = `
<Fragment>
  <Dropdown
    key="dd1"
    onClick={[Function]}
    onSelect={[Function]}
    open={false}
  />
  <Dropdown
    key="dd2"
    onClick={[Function]}
    onSelect={[Function]}
    open={false}
  />
  <Dropdown
    key="dd3"
    onClick={[Function]}
    onSelect={[Function]}
    open={false}
  />
</Fragment>
`;

exports[`DropdownGroup renders with no dropdowns 1`] = `<Fragment />`;

exports[`DropdownGroup selecting a dropdown re-closes it 1`] = `
<Fragment>
  <Dropdown
    key="dd1"
    onClick={[Function]}
    onSelect={[Function]}
    open={false}
  />
  <Dropdown
    key="dd2"
    onClick={[Function]}
    onSelect={[Function]}
    open={false}
  />
  <Dropdown
    key="dd3"
    onClick={[Function]}
    onSelect={[Function]}
    open={false}
  />
</Fragment>
`;

exports[`Item renders with no text 1`] = `
<div
  className="item"
  onClick={[Function]}
  onKeyDown={[Function]}
  role="menuitem"
  tabIndex="0"
>
  display
</div>
`;
