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

exports[`OuiInMemoryTable behavior pagination 1`] = `
<OuiInMemoryTable
  aria-label="aria-label"
  className="testClass1 testClass2"
  columns={
    Array [
      Object {
        "description": "description",
        "field": "name",
        "name": "Name",
      },
    ]
  }
  data-test-subj="test subject string"
  items={
    Array [
      Object {
        "id": "1",
        "name": "name1",
      },
      Object {
        "id": "2",
        "name": "name2",
      },
      Object {
        "id": "3",
        "name": "name3",
      },
      Object {
        "id": "4",
        "name": "name4",
      },
    ]
  }
  pagination={
    Object {
      "pageSizeOptions": Array [
        2,
        4,
        6,
      ],
    }
  }
  responsive={true}
  tableLayout="fixed"
>
  <OuiBasicTable
    aria-label="aria-label"
    className="testClass1 testClass2"
    columns={
      Array [
        Object {
          "description": "description",
          "field": "name",
          "name": "Name",
        },
      ]
    }
    data-test-subj="test subject string"
    items={
      Array [
        Object {
          "id": "3",
          "name": "name3",
        },
        Object {
          "id": "4",
          "name": "name4",
        },
      ]
    }
    noItemsMessage="No items found"
    onChange={[Function]}
    pagination={
      Object {
        "hidePerPageOptions": undefined,
        "pageIndex": 1,
        "pageSize": 2,
        "pageSizeOptions": Array [
          2,
          4,
          6,
        ],
        "totalItemCount": 4,
      }
    }
    responsive={true}
    tableLayout="fixed"
  >
    <div
      aria-label="aria-label"
      className="ouiBasicTable testClass1 testClass2"
      data-test-subj="test subject string"
    >
      <div>
        <OuiTableHeaderMobile>
          <div
            className="ouiTableHeaderMobile"
          >
            <OuiFlexGroup
              alignItems="baseline"
              justifyContent="spaceBetween"
              responsive={false}
            >
              <div
                className="ouiFlexGroup ouiFlexGroup--gutterLarge ouiFlexGroup--alignItemsBaseline ouiFlexGroup--justifyContentSpaceBetween ouiFlexGroup--directionRow"
              >
                <OuiFlexItem
                  grow={false}
                >
                  <div
                    className="ouiFlexItem ouiFlexItem--flexGrowZero"
                  />
                </OuiFlexItem>
                <OuiFlexItem
                  grow={false}
                >
                  <div
                    className="ouiFlexItem ouiFlexItem--flexGrowZero"
                  />
                </OuiFlexItem>
              </div>
            </OuiFlexGroup>
          </div>
        </OuiTableHeaderMobile>
        <OuiTable
          id="__table_generated-id"
          responsive={true}
          tableLayout="fixed"
        >
          <table
            className="ouiTable ouiTable--responsive"
            id="__table_generated-id"
            tabIndex={-1}
          >
            <OuiScreenReaderOnly>
              <caption
                className="ouiScreenReaderOnly ouiTableCaption"
              >
                <OuiDelayRender
                  delay={500}
                />
              </caption>
            </OuiScreenReaderOnly>
            <OuiTableHeader>
              <thead>
                <tr>
                  <OuiTableHeaderCell
                    align="left"
                    data-test-subj="tableHeaderCell_name_0"
                    description="description"
                    key="_data_h_name_0"
                  >
                    <th
                      className="ouiTableHeaderCell"
                      data-test-subj="tableHeaderCell_name_0"
                      role="columnheader"
                      scope="col"
                      style={
                        Object {
                          "width": undefined,
                        }
                      }
                    >
                      <CellContents
                        className="ouiTableCellContent"
                        description="description"
                        showSortMsg={false}
                      >
                        <span
                          className="ouiTableCellContent"
                        >
                          <OuiInnerText>
                            <OuiI18n
                              default="{innerText}; {description}"
                              token="ouiTableHeaderCell.titleTextWithDesc"
                              values={
                                Object {
                                  "description": "description",
                                  "innerText": "Name",
                                }
                              }
                            >
                              <span
                                className="ouiTableCellContent__text"
                                title="Name; description"
                              >
                                Name
                              </span>
                            </OuiI18n>
                          </OuiInnerText>
                          <OuiScreenReaderOnly>
                            <span
                              className="ouiScreenReaderOnly"
                            >
                              description
                            </span>
                          </OuiScreenReaderOnly>
                        </span>
                      </CellContents>
                    </th>
                  </OuiTableHeaderCell>
                </tr>
              </thead>
            </OuiTableHeader>
            <OuiTableBody
              bodyRef={[Function]}
            >
              <tbody>
                <OuiTableRow
                  isSelected={false}
                >
                  <tr
                    className="ouiTableRow"
                  >
                    <OuiTableRowCell
                      align="left"
                      key="_data_column_name_2_0"
                      mobileOptions={
                        Object {
                          "header": "Name",
                          "render": undefined,
                        }
                      }
                      setScopeRow={false}
                      textOnly={true}
                    >
                      <td
                        className="ouiTableRowCell"
                        style={
                          Object {
                            "width": undefined,
                          }
                        }
                      >
                        <div
                          className="ouiTableRowCell__mobileHeader ouiTableRowCell--hideForDesktop"
                        >
                          Name
                        </div>
                        <div
                          className="ouiTableCellContent"
                        >
                          <span
                            className="ouiTableCellContent__text"
                          >
                            name3
                          </span>
                        </div>
                      </td>
                    </OuiTableRowCell>
                  </tr>
                </OuiTableRow>
                <OuiTableRow
                  isSelected={false}
                >
                  <tr
                    className="ouiTableRow"
                  >
                    <OuiTableRowCell
                      align="left"
                      key="_data_column_name_3_0"
                      mobileOptions={
                        Object {
                          "header": "Name",
                          "render": undefined,
                        }
                      }
                      setScopeRow={false}
                      textOnly={true}
                    >
                      <td
                        className="ouiTableRowCell"
                        style={
                          Object {
                            "width": undefined,
                          }
                        }
                      >
                        <div
                          className="ouiTableRowCell__mobileHeader ouiTableRowCell--hideForDesktop"
                        >
                          Name
                        </div>
                        <div
                          className="ouiTableCellContent"
                        >
                          <span
                            className="ouiTableCellContent__text"
                          >
                            name4
                          </span>
                        </div>
                      </td>
                    </OuiTableRowCell>
                  </tr>
                </OuiTableRow>
              </tbody>
            </OuiTableBody>
          </table>
        </OuiTable>
      </div>
      <PaginationBar
        aria-controls="__table_generated-id"
        onPageChange={[Function]}
        onPageSizeChange={[Function]}
        pagination={
          Object {
            "hidePerPageOptions": undefined,
            "pageIndex": 1,
            "pageSize": 2,
            "pageSizeOptions": Array [
              2,
              4,
              6,
            ],
            "totalItemCount": 4,
          }
        }
      >
        <div>
          <OuiSpacer
            size="m"
          >
            <div
              className="ouiSpacer ouiSpacer--m"
            />
          </OuiSpacer>
          <OuiTablePagination
            activePage={1}
            aria-controls="__table_generated-id"
            itemsPerPage={2}
            itemsPerPageOptions={
              Array [
                2,
                4,
                6,
              ]
            }
            onChangeItemsPerPage={[Function]}
            onChangePage={[Function]}
            pageCount={2}
          >
            <OuiFlexGroup
              alignItems="center"
              justifyContent="spaceBetween"
              responsive={false}
            >
              <div
                className="ouiFlexGroup ouiFlexGroup--gutterLarge ouiFlexGroup--alignItemsCenter ouiFlexGroup--justifyContentSpaceBetween ouiFlexGroup--directionRow"
              >
                <OuiFlexItem
                  grow={false}
                >
                  <div
                    className="ouiFlexItem ouiFlexItem--flexGrowZero"
                  >
                    <OuiPopover
                      anchorPosition="upRight"
                      button={
                        <OuiButtonEmpty
                          color="text"
                          data-test-subj="tablePaginationPopoverButton"
                          iconSide="right"
                          iconType="arrowDown"
                          onClick={[Function]}
                          size="xs"
                        >
                          <OuiI18n
                            default="Rows per page"
                            token="ouiTablePagination.rowsPerPage"
                          />
                          : 
                          2
                        </OuiButtonEmpty>
                      }
                      closePopover={[Function]}
                      display="inlineBlock"
                      hasArrow={true}
                      isOpen={false}
                      ownFocus={true}
                      panelPaddingSize="none"
                    >
                      <div
                        className="ouiPopover ouiPopover--anchorUpRight"
                      >
                        <div
                          className="ouiPopover__anchor"
                        >
                          <OuiButtonEmpty
                            color="text"
                            data-test-subj="tablePaginationPopoverButton"
                            iconSide="right"
                            iconType="arrowDown"
                            onClick={[Function]}
                            size="xs"
                          >
                            <button
                              className="ouiButtonEmpty ouiButtonEmpty--text ouiButtonEmpty--xSmall"
                              data-test-subj="tablePaginationPopoverButton"
                              disabled={false}
                              onClick={[Function]}
                              type="button"
                            >
                              <OuiButtonContent
                                className="ouiButtonEmpty__content"
                                iconSide="right"
                                iconSize="s"
                                iconType="arrowDown"
                                textProps={
                                  Object {
                                    "className": "ouiButtonEmpty__text",
                                  }
                                }
                              >
                                <span
                                  className="ouiButtonContent ouiButtonContent--iconRight ouiButtonEmpty__content"
                                >
                                  <OuiIcon
                                    className="ouiButtonContent__icon"
                                    color="inherit"
                                    size="s"
                                    type="arrowDown"
                                  >
                                    <span
                                      className="ouiButtonContent__icon"
                                      color="inherit"
                                      data-ouiicon-type="arrowDown"
                                      size="s"
                                    />
                                  </OuiIcon>
                                  <span
                                    className="ouiButtonEmpty__text"
                                  >
                                    <OuiI18n
                                      default="Rows per page"
                                      token="ouiTablePagination.rowsPerPage"
                                    >
                                      Rows per page
                                    </OuiI18n>
                                    : 
                                    2
                                  </span>
                                </span>
                              </OuiButtonContent>
                            </button>
                          </OuiButtonEmpty>
                        </div>
                      </div>
                    </OuiPopover>
                  </div>
                </OuiFlexItem>
                <OuiFlexItem
                  grow={false}
                >
                  <div
                    className="ouiFlexItem ouiFlexItem--flexGrowZero"
                  >
                    <OuiPagination
                      activePage={1}
                      aria-controls="__table_generated-id"
                      onPageClick={[Function]}
                      pageCount={2}
                    >
                      <nav
                        className="ouiPagination"
                      >
                        <OuiI18n
                          default="Previous page, {page}"
                          token="ouiPagination.previousPage"
                          values={
                            Object {
                              "page": 1,
                            }
                          }
                        >
                          <OuiI18n
                            default="Previous page"
                            token="ouiPagination.disabledPreviousPage"
                          >
                            <OuiButtonIcon
                              aria-controls="__table_generated-id"
                              aria-label="Previous page, 1"
                              color="text"
                              data-test-subj="pagination-button-previous"
                              href="#__table_generated-id"
                              iconType="arrowLeft"
                              onClick={[Function]}
                            >
                              <a
                                aria-controls="__table_generated-id"
                                aria-label="Previous page, 1"
                                className="ouiButtonIcon ouiButtonIcon--text ouiButtonIcon--empty ouiButtonIcon--xSmall"
                                data-test-subj="pagination-button-previous"
                                href="#__table_generated-id"
                                onClick={[Function]}
                                rel="noreferrer"
                              >
                                <OuiIcon
                                  aria-hidden="true"
                                  className="ouiButtonIcon__icon"
                                  color="inherit"
                                  size="m"
                                  type="arrowLeft"
                                >
                                  <span
                                    aria-hidden="true"
                                    className="ouiButtonIcon__icon"
                                    color="inherit"
                                    data-ouiicon-type="arrowLeft"
                                    size="m"
                                  />
                                </OuiIcon>
                              </a>
                            </OuiButtonIcon>
                          </OuiI18n>
                        </OuiI18n>
                        <ul
                          className="ouiPagination__list"
                        >
                          <PaginationButton
                            key="0"
                            pageIndex={0}
                          >
                            <li
                              className="ouiPagination__item"
                            >
                              <OuiPaginationButton
                                aria-controls="__table_generated-id"
                                hideOnMobile={true}
                                isActive={false}
                                onClick={[Function]}
                                pageIndex={0}
                                totalPages={2}
                              >
                                <OuiI18n
                                  default="Page {page} of {totalPages}"
                                  token="ouiPaginationButton.longPageString"
                                  values={
                                    Object {
                                      "page": 1,
                                      "totalPages": 2,
                                    }
                                  }
                                >
                                  <OuiI18n
                                    default="Page {page}"
                                    token="ouiPaginationButton.shortPageString"
                                    values={
                                      Object {
                                        "page": 1,
                                      }
                                    }
                                  >
                                    <OuiButtonEmpty
                                      aria-controls="__table_generated-id"
                                      aria-label="Page 1 of 2"
                                      className="ouiPaginationButton ouiPaginationButton--hideOnMobile"
                                      color="text"
                                      data-test-subj="pagination-button-0"
                                      href="#__table_generated-id"
                                      isDisabled={false}
                                      onClick={[Function]}
                                      size="s"
                                    >
                                      <a
                                        aria-controls="__table_generated-id"
                                        aria-label="Page 1 of 2"
                                        className="ouiButtonEmpty ouiButtonEmpty--text ouiButtonEmpty--small ouiPaginationButton ouiPaginationButton--hideOnMobile"
                                        data-test-subj="pagination-button-0"
                                        href="#__table_generated-id"
                                        onClick={[Function]}
                                        rel="noreferrer"
                                      >
                                        <OuiButtonContent
                                          className="ouiButtonEmpty__content"
                                          iconSide="left"
                                          iconSize="m"
                                          textProps={
                                            Object {
                                              "className": "ouiButtonEmpty__text",
                                            }
                                          }
                                        >
                                          <span
                                            className="ouiButtonContent ouiButtonEmpty__content"
                                          >
                                            <span
                                              className="ouiButtonEmpty__text"
                                            >
                                              1
                                            </span>
                                          </span>
                                        </OuiButtonContent>
                                      </a>
                                    </OuiButtonEmpty>
                                  </OuiI18n>
                                </OuiI18n>
                              </OuiPaginationButton>
                            </li>
                          </PaginationButton>
                          <PaginationButton
                            key="1"
                            pageIndex={1}
                          >
                            <li
                              className="ouiPagination__item"
                            >
                              <OuiPaginationButton
                                aria-controls="__table_generated-id"
                                hideOnMobile={true}
                                isActive={true}
                                onClick={[Function]}
                                pageIndex={1}
                                totalPages={2}
                              >
                                <OuiI18n
                                  default="Page {page} of {totalPages}"
                                  token="ouiPaginationButton.longPageString"
                                  values={
                                    Object {
                                      "page": 2,
                                      "totalPages": 2,
                                    }
                                  }
                                >
                                  <OuiI18n
                                    default="Page {page}"
                                    token="ouiPaginationButton.shortPageString"
                                    values={
                                      Object {
                                        "page": 2,
                                      }
                                    }
                                  >
                                    <OuiButtonEmpty
                                      aria-controls="__table_generated-id"
                                      aria-current={true}
                                      aria-label="Page 2 of 2"
                                      className="ouiPaginationButton ouiPaginationButton-isActive ouiPaginationButton--hideOnMobile"
                                      color="text"
                                      data-test-subj="pagination-button-1"
                                      href="#__table_generated-id"
                                      isDisabled={true}
                                      onClick={[Function]}
                                      size="s"
                                    >
                                      <button
                                        aria-controls="__table_generated-id"
                                        aria-current={true}
                                        aria-label="Page 2 of 2"
                                        className="ouiButtonEmpty ouiButtonEmpty--text ouiButtonEmpty--small ouiButtonEmpty-isDisabled ouiPaginationButton ouiPaginationButton-isActive ouiPaginationButton--hideOnMobile"
                                        data-test-subj="pagination-button-1"
                                        disabled={true}
                                        onClick={[Function]}
                                        type="button"
                                      >
                                        <OuiButtonContent
                                          className="ouiButtonEmpty__content"
                                          iconSide="left"
                                          iconSize="m"
                                          textProps={
                                            Object {
                                              "className": "ouiButtonEmpty__text",
                                            }
                                          }
                                        >
                                          <span
                                            className="ouiButtonContent ouiButtonEmpty__content"
                                          >
                                            <span
                                              className="ouiButtonEmpty__text"
                                            >
                                              2
                                            </span>
                                          </span>
                                        </OuiButtonContent>
                                      </button>
                                    </OuiButtonEmpty>
                                  </OuiI18n>
                                </OuiI18n>
                              </OuiPaginationButton>
                            </li>
                          </PaginationButton>
                        </ul>
                        <OuiI18n
                          default="Next page, {page}"
                          token="ouiPagination.nextPage"
                          values={
                            Object {
                              "page": 3,
                            }
                          }
                        >
                          <OuiI18n
                            default="Next page"
                            token="ouiPagination.disabledNextPage"
                          >
                            <OuiButtonIcon
                              aria-label="Next page"
                              color="text"
                              data-test-subj="pagination-button-next"
                              disabled={true}
                              iconType="arrowRight"
                              onClick={[Function]}
                            >
                              <button
                                aria-label="Next page"
                                className="ouiButtonIcon ouiButtonIcon--text ouiButtonIcon--empty ouiButtonIcon--xSmall"
                                data-test-subj="pagination-button-next"
                                disabled={true}
                                onClick={[Function]}
                                type="button"
                              >
                                <OuiIcon
                                  aria-hidden="true"
                                  className="ouiButtonIcon__icon"
                                  color="inherit"
                                  size="m"
                                  type="arrowRight"
                                >
                                  <span
                                    aria-hidden="true"
                                    className="ouiButtonIcon__icon"
                                    color="inherit"
                                    data-ouiicon-type="arrowRight"
                                    size="m"
                                  />
                                </OuiIcon>
                              </button>
                            </OuiButtonIcon>
                          </OuiI18n>
                        </OuiI18n>
                      </nav>
                    </OuiPagination>
                  </div>
                </OuiFlexItem>
              </div>
            </OuiFlexGroup>
          </OuiTablePagination>
        </div>
      </PaginationBar>
    </div>
  </OuiBasicTable>
</OuiInMemoryTable>
`;

exports[`OuiInMemoryTable empty array 1`] = `
<OuiBasicTable
  aria-label="aria-label"
  className="testClass1 testClass2"
  columns={
    Array [
      Object {
        "description": "description",
        "field": "name",
        "name": "Name",
      },
    ]
  }
  data-test-subj="test subject string"
  items={Array []}
  noItemsMessage="No items found"
  onChange={[Function]}
  responsive={true}
  tableLayout="fixed"
/>
`;

exports[`OuiInMemoryTable with executeQueryOptions 1`] = `
<OuiBasicTable
  aria-label="aria-label"
  className="testClass1 testClass2"
  columns={
    Array [
      Object {
        "description": "description",
        "field": "name",
        "name": "Name",
      },
    ]
  }
  data-test-subj="test subject string"
  items={Array []}
  noItemsMessage="No items found"
  onChange={[Function]}
  responsive={true}
  tableLayout="fixed"
/>
`;

exports[`OuiInMemoryTable with initial selection 1`] = `
<OuiInMemoryTable
  aria-label="aria-label"
  className="testClass1 testClass2"
  columns={
    Array [
      Object {
        "description": "description",
        "field": "name",
        "name": "Name",
      },
    ]
  }
  data-test-subj="test subject string"
  itemId="id"
  items={
    Array [
      Object {
        "id": "1",
        "name": "name1",
      },
      Object {
        "id": "2",
        "name": "name2",
      },
      Object {
        "id": "3",
        "name": "name3",
      },
    ]
  }
  responsive={true}
  selection={
    Object {
      "initialSelected": Array [
        Object {
          "id": "1",
          "name": "name1",
        },
      ],
      "onSelectionChange": [Function],
    }
  }
  tableLayout="fixed"
>
  <OuiBasicTable
    aria-label="aria-label"
    className="testClass1 testClass2"
    columns={
      Array [
        Object {
          "description": "description",
          "field": "name",
          "name": "Name",
        },
      ]
    }
    data-test-subj="test subject string"
    itemId="id"
    items={
      Array [
        Object {
          "id": "1",
          "name": "name1",
        },
        Object {
          "id": "2",
          "name": "name2",
        },
        Object {
          "id": "3",
          "name": "name3",
        },
      ]
    }
    noItemsMessage="No items found"
    onChange={[Function]}
    responsive={true}
    selection={
      Object {
        "initialSelected": Array [
          Object {
            "id": "1",
            "name": "name1",
          },
        ],
        "onSelectionChange": [Function],
      }
    }
    tableLayout="fixed"
  >
    <div
      aria-label="aria-label"
      className="ouiBasicTable testClass1 testClass2"
      data-test-subj="test subject string"
    >
      <div>
        <OuiTableHeaderMobile>
          <div
            className="ouiTableHeaderMobile"
          >
            <OuiFlexGroup
              alignItems="baseline"
              justifyContent="spaceBetween"
              responsive={false}
            >
              <div
                className="ouiFlexGroup ouiFlexGroup--gutterLarge ouiFlexGroup--alignItemsBaseline ouiFlexGroup--justifyContentSpaceBetween ouiFlexGroup--directionRow"
              >
                <OuiFlexItem
                  grow={false}
                >
                  <div
                    className="ouiFlexItem ouiFlexItem--flexGrowZero"
                  >
                    <OuiI18n
                      default="Select all rows"
                      token="ouiBasicTable.selectAllRows"
                    >
                      <OuiCheckbox
                        aria-label="Select all rows"
                        checked={false}
                        compressed={false}
                        disabled={false}
                        id="_selection_column-checkbox_generated-id"
                        indeterminate={false}
                        label="Select all rows"
                        onChange={[Function]}
                      >
                        <div
                          className="ouiCheckbox"
                        >
                          <input
                            aria-label="Select all rows"
                            checked={false}
                            className="ouiCheckbox__input"
                            disabled={false}
                            id="_selection_column-checkbox_generated-id"
                            onChange={[Function]}
                            type="checkbox"
                          />
                          <div
                            className="ouiCheckbox__square"
                          />
                          <label
                            className="ouiCheckbox__label"
                            htmlFor="_selection_column-checkbox_generated-id"
                          >
                            Select all rows
                          </label>
                        </div>
                      </OuiCheckbox>
                    </OuiI18n>
                  </div>
                </OuiFlexItem>
                <OuiFlexItem
                  grow={false}
                >
                  <div
                    className="ouiFlexItem ouiFlexItem--flexGrowZero"
                  />
                </OuiFlexItem>
              </div>
            </OuiFlexGroup>
          </div>
        </OuiTableHeaderMobile>
        <OuiTable
          id="__table_generated-id"
          responsive={true}
          tableLayout="fixed"
        >
          <table
            className="ouiTable ouiTable--responsive"
            id="__table_generated-id"
            tabIndex={-1}
          >
            <OuiScreenReaderOnly>
              <caption
                className="ouiScreenReaderOnly ouiTableCaption"
              >
                <OuiDelayRender
                  delay={500}
                />
              </caption>
            </OuiScreenReaderOnly>
            <OuiTableHeader>
              <thead>
                <tr>
                  <OuiTableHeaderCellCheckbox
                    key="_selection_column_h"
                  >
                    <th
                      className="ouiTableHeaderCellCheckbox"
                      scope="col"
                      style={
                        Object {
                          "width": undefined,
                        }
                      }
                    >
                      <div
                        className="ouiTableCellContent"
                      >
                        <OuiI18n
                          default="Select all rows"
                          token="ouiBasicTable.selectAllRows"
                        >
                          <OuiCheckbox
                            aria-label="Select all rows"
                            checked={false}
                            compressed={false}
                            data-test-subj="checkboxSelectAll"
                            disabled={false}
                            id="_selection_column-checkbox_generated-id"
                            indeterminate={false}
                            label={null}
                            onChange={[Function]}
                            type="inList"
                          >
                            <div
                              className="ouiCheckbox ouiCheckbox--inList ouiCheckbox--noLabel"
                            >
                              <input
                                aria-label="Select all rows"
                                checked={false}
                                className="ouiCheckbox__input"
                                data-test-subj="checkboxSelectAll"
                                disabled={false}
                                id="_selection_column-checkbox_generated-id"
                                onChange={[Function]}
                                type="checkbox"
                              />
                              <div
                                className="ouiCheckbox__square"
                              />
                            </div>
                          </OuiCheckbox>
                        </OuiI18n>
                      </div>
                    </th>
                  </OuiTableHeaderCellCheckbox>
                  <OuiTableHeaderCell
                    align="left"
                    data-test-subj="tableHeaderCell_name_0"
                    description="description"
                    key="_data_h_name_0"
                  >
                    <th
                      className="ouiTableHeaderCell"
                      data-test-subj="tableHeaderCell_name_0"
                      role="columnheader"
                      scope="col"
                      style={
                        Object {
                          "width": undefined,
                        }
                      }
                    >
                      <CellContents
                        className="ouiTableCellContent"
                        description="description"
                        showSortMsg={false}
                      >
                        <span
                          className="ouiTableCellContent"
                        >
                          <OuiInnerText>
                            <OuiI18n
                              default="{innerText}; {description}"
                              token="ouiTableHeaderCell.titleTextWithDesc"
                              values={
                                Object {
                                  "description": "description",
                                  "innerText": "Name",
                                }
                              }
                            >
                              <span
                                className="ouiTableCellContent__text"
                                title="Name; description"
                              >
                                Name
                              </span>
                            </OuiI18n>
                          </OuiInnerText>
                          <OuiScreenReaderOnly>
                            <span
                              className="ouiScreenReaderOnly"
                            >
                              description
                            </span>
                          </OuiScreenReaderOnly>
                        </span>
                      </CellContents>
                    </th>
                  </OuiTableHeaderCell>
                </tr>
              </thead>
            </OuiTableHeader>
            <OuiTableBody
              bodyRef={[Function]}
            >
              <tbody>
                <OuiTableRow
                  isSelectable={true}
                  isSelected={true}
                >
                  <tr
                    className="ouiTableRow ouiTableRow-isSelectable ouiTableRow-isSelected"
                  >
                    <OuiTableRowCellCheckbox
                      key="_selection_column_1"
                    >
                      <td
                        className="ouiTableRowCellCheckbox"
                      >
                        <div
                          className="ouiTableCellContent"
                        >
                          <OuiI18n
                            default="Select this row"
                            token="ouiBasicTable.selectThisRow"
                          >
                            <OuiCheckbox
                              aria-label="Select this row"
                              checked={true}
                              compressed={false}
                              data-test-subj="checkboxSelectRow-1"
                              disabled={false}
                              id="_selection_column_1-checkbox"
                              indeterminate={false}
                              onChange={[Function]}
                              title="Select this row"
                              type="inList"
                            >
                              <div
                                className="ouiCheckbox ouiCheckbox--inList ouiCheckbox--noLabel"
                              >
                                <input
                                  aria-label="Select this row"
                                  checked={true}
                                  className="ouiCheckbox__input"
                                  data-test-subj="checkboxSelectRow-1"
                                  disabled={false}
                                  id="_selection_column_1-checkbox"
                                  onChange={[Function]}
                                  title="Select this row"
                                  type="checkbox"
                                />
                                <div
                                  className="ouiCheckbox__square"
                                />
                              </div>
                            </OuiCheckbox>
                          </OuiI18n>
                        </div>
                      </td>
                    </OuiTableRowCellCheckbox>
                    <OuiTableRowCell
                      align="left"
                      key="_data_column_name_1_0"
                      mobileOptions={
                        Object {
                          "header": "Name",
                          "render": undefined,
                        }
                      }
                      setScopeRow={false}
                      textOnly={true}
                    >
                      <td
                        className="ouiTableRowCell"
                        style={
                          Object {
                            "width": undefined,
                          }
                        }
                      >
                        <div
                          className="ouiTableRowCell__mobileHeader ouiTableRowCell--hideForDesktop"
                        >
                          Name
                        </div>
                        <div
                          className="ouiTableCellContent"
                        >
                          <span
                            className="ouiTableCellContent__text"
                          >
                            name1
                          </span>
                        </div>
                      </td>
                    </OuiTableRowCell>
                  </tr>
                </OuiTableRow>
                <OuiTableRow
                  isSelectable={true}
                  isSelected={false}
                >
                  <tr
                    className="ouiTableRow ouiTableRow-isSelectable"
                  >
                    <OuiTableRowCellCheckbox
                      key="_selection_column_2"
                    >
                      <td
                        className="ouiTableRowCellCheckbox"
                      >
                        <div
                          className="ouiTableCellContent"
                        >
                          <OuiI18n
                            default="Select this row"
                            token="ouiBasicTable.selectThisRow"
                          >
                            <OuiCheckbox
                              aria-label="Select this row"
                              checked={false}
                              compressed={false}
                              data-test-subj="checkboxSelectRow-2"
                              disabled={false}
                              id="_selection_column_2-checkbox"
                              indeterminate={false}
                              onChange={[Function]}
                              title="Select this row"
                              type="inList"
                            >
                              <div
                                className="ouiCheckbox ouiCheckbox--inList ouiCheckbox--noLabel"
                              >
                                <input
                                  aria-label="Select this row"
                                  checked={false}
                                  className="ouiCheckbox__input"
                                  data-test-subj="checkboxSelectRow-2"
                                  disabled={false}
                                  id="_selection_column_2-checkbox"
                                  onChange={[Function]}
                                  title="Select this row"
                                  type="checkbox"
                                />
                                <div
                                  className="ouiCheckbox__square"
                                />
                              </div>
                            </OuiCheckbox>
                          </OuiI18n>
                        </div>
                      </td>
                    </OuiTableRowCellCheckbox>
                    <OuiTableRowCell
                      align="left"
                      key="_data_column_name_2_0"
                      mobileOptions={
                        Object {
                          "header": "Name",
                          "render": undefined,
                        }
                      }
                      setScopeRow={false}
                      textOnly={true}
                    >
                      <td
                        className="ouiTableRowCell"
                        style={
                          Object {
                            "width": undefined,
                          }
                        }
                      >
                        <div
                          className="ouiTableRowCell__mobileHeader ouiTableRowCell--hideForDesktop"
                        >
                          Name
                        </div>
                        <div
                          className="ouiTableCellContent"
                        >
                          <span
                            className="ouiTableCellContent__text"
                          >
                            name2
                          </span>
                        </div>
                      </td>
                    </OuiTableRowCell>
                  </tr>
                </OuiTableRow>
                <OuiTableRow
                  isSelectable={true}
                  isSelected={false}
                >
                  <tr
                    className="ouiTableRow ouiTableRow-isSelectable"
                  >
                    <OuiTableRowCellCheckbox
                      key="_selection_column_3"
                    >
                      <td
                        className="ouiTableRowCellCheckbox"
                      >
                        <div
                          className="ouiTableCellContent"
                        >
                          <OuiI18n
                            default="Select this row"
                            token="ouiBasicTable.selectThisRow"
                          >
                            <OuiCheckbox
                              aria-label="Select this row"
                              checked={false}
                              compressed={false}
                              data-test-subj="checkboxSelectRow-3"
                              disabled={false}
                              id="_selection_column_3-checkbox"
                              indeterminate={false}
                              onChange={[Function]}
                              title="Select this row"
                              type="inList"
                            >
                              <div
                                className="ouiCheckbox ouiCheckbox--inList ouiCheckbox--noLabel"
                              >
                                <input
                                  aria-label="Select this row"
                                  checked={false}
                                  className="ouiCheckbox__input"
                                  data-test-subj="checkboxSelectRow-3"
                                  disabled={false}
                                  id="_selection_column_3-checkbox"
                                  onChange={[Function]}
                                  title="Select this row"
                                  type="checkbox"
                                />
                                <div
                                  className="ouiCheckbox__square"
                                />
                              </div>
                            </OuiCheckbox>
                          </OuiI18n>
                        </div>
                      </td>
                    </OuiTableRowCellCheckbox>
                    <OuiTableRowCell
                      align="left"
                      key="_data_column_name_3_0"
                      mobileOptions={
                        Object {
                          "header": "Name",
                          "render": undefined,
                        }
                      }
                      setScopeRow={false}
                      textOnly={true}
                    >
                      <td
                        className="ouiTableRowCell"
                        style={
                          Object {
                            "width": undefined,
                          }
                        }
                      >
                        <div
                          className="ouiTableRowCell__mobileHeader ouiTableRowCell--hideForDesktop"
                        >
                          Name
                        </div>
                        <div
                          className="ouiTableCellContent"
                        >
                          <span
                            className="ouiTableCellContent__text"
                          >
                            name3
                          </span>
                        </div>
                      </td>
                    </OuiTableRowCell>
                  </tr>
                </OuiTableRow>
              </tbody>
            </OuiTableBody>
          </table>
        </OuiTable>
      </div>
    </div>
  </OuiBasicTable>
</OuiInMemoryTable>
`;

exports[`OuiInMemoryTable with initial sorting 1`] = `
<OuiBasicTable
  aria-label="aria-label"
  className="testClass1 testClass2"
  columns={
    Array [
      Object {
        "description": "description",
        "field": "name",
        "name": "Name",
        "sortable": true,
      },
    ]
  }
  data-test-subj="test subject string"
  items={
    Array [
      Object {
        "id": "3",
        "name": "name3",
      },
      Object {
        "id": "2",
        "name": "name2",
      },
      Object {
        "id": "1",
        "name": "name1",
      },
    ]
  }
  noItemsMessage="No items found"
  onChange={[Function]}
  responsive={true}
  sorting={
    Object {
      "allowNeutralSort": true,
      "sort": Object {
        "direction": "desc",
        "field": "Name",
      },
    }
  }
  tableLayout="fixed"
/>
`;

exports[`OuiInMemoryTable with items 1`] = `
<OuiBasicTable
  aria-label="aria-label"
  className="testClass1 testClass2"
  columns={
    Array [
      Object {
        "description": "description",
        "field": "name",
        "name": "Name",
      },
    ]
  }
  data-test-subj="test subject string"
  items={
    Array [
      Object {
        "id": "1",
        "name": "name1",
      },
      Object {
        "id": "2",
        "name": "name2",
      },
      Object {
        "id": "3",
        "name": "name3",
      },
    ]
  }
  noItemsMessage="No items found"
  onChange={[Function]}
  responsive={true}
  tableLayout="fixed"
/>
`;

exports[`OuiInMemoryTable with items and expanded item 1`] = `
<OuiBasicTable
  aria-label="aria-label"
  className="testClass1 testClass2"
  columns={
    Array [
      Object {
        "description": "description",
        "field": "name",
        "name": "Name",
      },
    ]
  }
  data-test-subj="test subject string"
  itemId="id"
  itemIdToExpandedRowMap={
    Object {
      "1": <div>
        expanded row content
      </div>,
    }
  }
  items={
    Array [
      Object {
        "id": "1",
        "name": "name1",
      },
      Object {
        "id": "2",
        "name": "name2",
      },
      Object {
        "id": "3",
        "name": "name3",
      },
    ]
  }
  noItemsMessage="No items found"
  onChange={[Function]}
  responsive={true}
  tableLayout="fixed"
/>
`;

exports[`OuiInMemoryTable with items and message - expecting to show the items 1`] = `
<OuiBasicTable
  aria-label="aria-label"
  className="testClass1 testClass2"
  columns={
    Array [
      Object {
        "description": "description",
        "field": "name",
        "name": "Name",
      },
    ]
  }
  data-test-subj="test subject string"
  items={
    Array [
      Object {
        "id": "1",
        "name": "name1",
      },
      Object {
        "id": "2",
        "name": "name2",
      },
      Object {
        "id": "3",
        "name": "name3",
      },
    ]
  }
  noItemsMessage="show me!"
  onChange={[Function]}
  responsive={true}
  tableLayout="fixed"
/>
`;

exports[`OuiInMemoryTable with message 1`] = `
<OuiBasicTable
  aria-label="aria-label"
  className="testClass1 testClass2"
  columns={
    Array [
      Object {
        "description": "description",
        "field": "name",
        "name": "Name",
      },
    ]
  }
  data-test-subj="test subject string"
  items={Array []}
  noItemsMessage="where my items at?"
  onChange={[Function]}
  responsive={true}
  tableLayout="fixed"
/>
`;

exports[`OuiInMemoryTable with message and loading 1`] = `
<OuiBasicTable
  aria-label="aria-label"
  className="testClass1 testClass2"
  columns={
    Array [
      Object {
        "description": "description",
        "field": "name",
        "name": "Name",
      },
    ]
  }
  data-test-subj="test subject string"
  items={Array []}
  loading={true}
  noItemsMessage="Loading items...."
  onChange={[Function]}
  responsive={true}
  tableLayout="fixed"
/>
`;

exports[`OuiInMemoryTable with pagination 1`] = `
<OuiBasicTable
  aria-label="aria-label"
  className="testClass1 testClass2"
  columns={
    Array [
      Object {
        "description": "description",
        "field": "name",
        "name": "Name",
      },
    ]
  }
  data-test-subj="test subject string"
  items={
    Array [
      Object {
        "id": "1",
        "name": "name1",
      },
      Object {
        "id": "2",
        "name": "name2",
      },
    ]
  }
  noItemsMessage="No items found"
  onChange={[Function]}
  pagination={
    Object {
      "hidePerPageOptions": undefined,
      "pageIndex": 0,
      "pageSize": 2,
      "pageSizeOptions": Array [
        2,
        4,
        6,
      ],
      "totalItemCount": 3,
    }
  }
  responsive={true}
  tableLayout="fixed"
/>
`;

exports[`OuiInMemoryTable with pagination and default page size and index 1`] = `
<OuiBasicTable
  aria-label="aria-label"
  className="testClass1 testClass2"
  columns={
    Array [
      Object {
        "description": "description",
        "field": "name",
        "name": "Name",
      },
    ]
  }
  data-test-subj="test subject string"
  items={
    Array [
      Object {
        "id": "3",
        "name": "name3",
      },
    ]
  }
  noItemsMessage="No items found"
  onChange={[Function]}
  pagination={
    Object {
      "hidePerPageOptions": undefined,
      "pageIndex": 1,
      "pageSize": 2,
      "pageSizeOptions": Array [
        1,
        2,
        3,
      ],
      "totalItemCount": 3,
    }
  }
  responsive={true}
  tableLayout="fixed"
/>
`;

exports[`OuiInMemoryTable with pagination and selection 1`] = `
<OuiBasicTable
  aria-label="aria-label"
  className="testClass1 testClass2"
  columns={
    Array [
      Object {
        "description": "description",
        "field": "name",
        "name": "Name",
      },
    ]
  }
  data-test-subj="test subject string"
  itemId="id"
  items={
    Array [
      Object {
        "id": "1",
        "name": "name1",
      },
      Object {
        "id": "2",
        "name": "name2",
      },
      Object {
        "id": "3",
        "name": "name3",
      },
    ]
  }
  noItemsMessage="No items found"
  onChange={[Function]}
  pagination={
    Object {
      "hidePerPageOptions": undefined,
      "pageIndex": 0,
      "pageSize": 10,
      "pageSizeOptions": Array [
        10,
        25,
        50,
      ],
      "totalItemCount": 3,
    }
  }
  responsive={true}
  selection={
    Object {
      "onSelectionChange": [Function],
    }
  }
  tableLayout="fixed"
/>
`;

exports[`OuiInMemoryTable with pagination, default page size and error 1`] = `
<OuiBasicTable
  aria-label="aria-label"
  className="testClass1 testClass2"
  columns={
    Array [
      Object {
        "description": "description",
        "field": "name",
        "name": "Name",
      },
    ]
  }
  data-test-subj="test subject string"
  error="ouch!"
  items={
    Array [
      Object {
        "id": "1",
        "name": "name1",
      },
    ]
  }
  noItemsMessage="No items found"
  onChange={[Function]}
  pagination={
    Object {
      "hidePerPageOptions": undefined,
      "pageIndex": 0,
      "pageSize": 4,
      "pageSizeOptions": Array [
        2,
        4,
        6,
      ],
      "totalItemCount": 1,
    }
  }
  responsive={true}
  tableLayout="fixed"
/>
`;

exports[`OuiInMemoryTable with pagination, hiding the per page options 1`] = `
<OuiBasicTable
  aria-label="aria-label"
  className="testClass1 testClass2"
  columns={
    Array [
      Object {
        "description": "description",
        "field": "name",
        "name": "Name",
      },
    ]
  }
  data-test-subj="test subject string"
  items={
    Array [
      Object {
        "id": "1",
        "name": "name1",
      },
      Object {
        "id": "2",
        "name": "name2",
      },
      Object {
        "id": "3",
        "name": "name3",
      },
    ]
  }
  noItemsMessage="No items found"
  onChange={[Function]}
  pagination={
    Object {
      "hidePerPageOptions": true,
      "pageIndex": 0,
      "pageSize": 10,
      "pageSizeOptions": Array [
        10,
        25,
        50,
      ],
      "totalItemCount": 3,
    }
  }
  responsive={true}
  tableLayout="fixed"
/>
`;

exports[`OuiInMemoryTable with pagination, selection and sorting 1`] = `
<OuiBasicTable
  aria-label="aria-label"
  className="testClass1 testClass2"
  columns={
    Array [
      Object {
        "description": "description",
        "field": "name",
        "name": "Name",
        "sortable": true,
      },
    ]
  }
  data-test-subj="test subject string"
  itemId="id"
  items={
    Array [
      Object {
        "id": "1",
        "name": "name1",
      },
      Object {
        "id": "2",
        "name": "name2",
      },
      Object {
        "id": "3",
        "name": "name3",
      },
    ]
  }
  noItemsMessage="No items found"
  onChange={[Function]}
  pagination={
    Object {
      "hidePerPageOptions": undefined,
      "pageIndex": 0,
      "pageSize": 10,
      "pageSizeOptions": Array [
        10,
        25,
        50,
      ],
      "totalItemCount": 3,
    }
  }
  responsive={true}
  selection={
    Object {
      "onSelectionChange": [Function],
    }
  }
  sorting={
    Object {
      "allowNeutralSort": true,
      "sort": undefined,
    }
  }
  tableLayout="fixed"
/>
`;

exports[`OuiInMemoryTable with pagination, selection, sorting  and simple search 1`] = `
<div>
  <OuiSearchBar
    onChange={[Function]}
  />
  <OuiSpacer
    size="l"
  />
  <OuiBasicTable
    aria-label="aria-label"
    className="testClass1 testClass2"
    columns={
      Array [
        Object {
          "description": "description",
          "field": "name",
          "name": "Name",
          "sortable": true,
        },
        Object {
          "actions": Array [
            Object {
              "description": "edit",
              "name": "Edit",
              "onClick": [Function],
            },
          ],
          "name": "Actions",
        },
      ]
    }
    data-test-subj="test subject string"
    itemId="id"
    items={
      Array [
        Object {
          "id": "1",
          "name": "name1",
        },
        Object {
          "id": "2",
          "name": "name2",
        },
        Object {
          "id": "3",
          "name": "name3",
        },
      ]
    }
    noItemsMessage="No items found"
    onChange={[Function]}
    pagination={
      Object {
        "hidePerPageOptions": undefined,
        "pageIndex": 0,
        "pageSize": 10,
        "pageSizeOptions": Array [
          10,
          25,
          50,
        ],
        "totalItemCount": 3,
      }
    }
    responsive={true}
    selection={
      Object {
        "onSelectionChange": [Function],
      }
    }
    sorting={
      Object {
        "allowNeutralSort": true,
        "sort": undefined,
      }
    }
    tableLayout="fixed"
  />
</div>
`;

exports[`OuiInMemoryTable with pagination, selection, sorting and a single record action 1`] = `
<OuiBasicTable
  aria-label="aria-label"
  className="testClass1 testClass2"
  columns={
    Array [
      Object {
        "description": "description",
        "field": "name",
        "name": "Name",
        "sortable": true,
      },
      Object {
        "actions": Array [
          Object {
            "description": "edit",
            "name": "Edit",
            "onClick": [Function],
          },
        ],
        "name": "Actions",
      },
    ]
  }
  data-test-subj="test subject string"
  itemId="id"
  items={
    Array [
      Object {
        "id": "1",
        "name": "name1",
      },
      Object {
        "id": "2",
        "name": "name2",
      },
      Object {
        "id": "3",
        "name": "name3",
      },
    ]
  }
  noItemsMessage="No items found"
  onChange={[Function]}
  pagination={
    Object {
      "hidePerPageOptions": undefined,
      "pageIndex": 0,
      "pageSize": 10,
      "pageSizeOptions": Array [
        10,
        25,
        50,
      ],
      "totalItemCount": 3,
    }
  }
  responsive={true}
  selection={
    Object {
      "onSelectionChange": [Function],
    }
  }
  sorting={
    Object {
      "allowNeutralSort": true,
      "sort": undefined,
    }
  }
  tableLayout="fixed"
/>
`;

exports[`OuiInMemoryTable with pagination, selection, sorting and column renderer 1`] = `
<OuiBasicTable
  aria-label="aria-label"
  className="testClass1 testClass2"
  columns={
    Array [
      Object {
        "description": "description",
        "field": "name",
        "name": "Name",
        "render": [Function],
        "sortable": true,
      },
    ]
  }
  data-test-subj="test subject string"
  itemId="id"
  items={
    Array [
      Object {
        "id": "1",
        "name": "name1",
      },
      Object {
        "id": "2",
        "name": "name2",
      },
    ]
  }
  noItemsMessage="No items found"
  onChange={[Function]}
  pagination={
    Object {
      "hidePerPageOptions": undefined,
      "pageIndex": 0,
      "pageSize": 2,
      "pageSizeOptions": Array [
        2,
        4,
        6,
      ],
      "totalItemCount": 3,
    }
  }
  responsive={true}
  selection={
    Object {
      "onSelectionChange": [Function],
    }
  }
  sorting={
    Object {
      "allowNeutralSort": true,
      "sort": undefined,
    }
  }
  tableLayout="fixed"
/>
`;

exports[`OuiInMemoryTable with pagination, selection, sorting and configured search 1`] = `
<div>
  <OuiSearchBar
    box={
      Object {
        "incremental": true,
      }
    }
    defaultQuery="name:name1"
    filters={
      Array [
        Object {
          "field": "name",
          "name": "Name1",
          "negatedName": "Not Name1",
          "type": "field_value_toggle",
          "value": "name1",
        },
      ]
    }
    onChange={[Function]}
  />
  <OuiSpacer
    size="l"
  />
  <OuiBasicTable
    aria-label="aria-label"
    className="testClass1 testClass2"
    columns={
      Array [
        Object {
          "description": "description",
          "field": "name",
          "name": "Name",
          "sortable": true,
        },
        Object {
          "actions": Array [
            Object {
              "description": "edit",
              "name": "Edit",
              "onClick": [Function],
            },
          ],
          "name": "Actions",
        },
      ]
    }
    data-test-subj="test subject string"
    itemId="id"
    items={
      Array [
        Object {
          "id": "1",
          "name": "name1",
        },
      ]
    }
    noItemsMessage="No items found"
    onChange={[Function]}
    pagination={
      Object {
        "hidePerPageOptions": undefined,
        "pageIndex": 0,
        "pageSize": 10,
        "pageSizeOptions": Array [
          10,
          25,
          50,
        ],
        "totalItemCount": 1,
      }
    }
    responsive={true}
    selection={
      Object {
        "onSelectionChange": [Function],
      }
    }
    sorting={
      Object {
        "allowNeutralSort": true,
        "sort": undefined,
      }
    }
    tableLayout="fixed"
  />
</div>
`;

exports[`OuiInMemoryTable with search and component between search and table 1`] = `
<div>
  <OuiSearchBar
    onChange={[Function]}
  />
  <OuiSpacer
    size="l"
  />
  <div>
    Children Between
  </div>
  <OuiBasicTable
    aria-label="aria-label"
    className="testClass1 testClass2"
    columns={
      Array [
        Object {
          "description": "description",
          "field": "name",
          "name": "Name",
          "sortable": true,
        },
        Object {
          "actions": Array [
            Object {
              "description": "edit",
              "name": "Edit",
              "onClick": [Function],
            },
          ],
          "name": "Actions",
        },
      ]
    }
    data-test-subj="test subject string"
    itemId="id"
    items={
      Array [
        Object {
          "id": "1",
          "name": "name1",
        },
        Object {
          "id": "2",
          "name": "name2",
        },
        Object {
          "id": "3",
          "name": "name3",
        },
      ]
    }
    noItemsMessage="No items found"
    onChange={[Function]}
    responsive={true}
    tableLayout="fixed"
  />
</div>
`;