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

exports[`OuiBasicTable cellProps renders cells with custom props from a callback 1`] = `
<div
  className="ouiBasicTable"
>
  <div>
    <OuiTableHeaderMobile>
      <OuiFlexGroup
        alignItems="baseline"
        justifyContent="spaceBetween"
        responsive={false}
      >
        <OuiFlexItem
          grow={false}
        />
        <OuiFlexItem
          grow={false}
        />
      </OuiFlexGroup>
    </OuiTableHeaderMobile>
    <OuiTable
      id="__table_generated-id"
      responsive={true}
      tableLayout="fixed"
    >
      <OuiScreenReaderOnly>
        <caption
          className="ouiTableCaption"
        >
          <OuiDelayRender
            delay={500}
          >
            <OuiI18n
              default="This table contains {itemCount} rows."
              token="ouiBasicTable.tableAutoCaptionWithoutPagination"
              values={
                Object {
                  "itemCount": 3,
                }
              }
            />
          </OuiDelayRender>
        </caption>
      </OuiScreenReaderOnly>
      <OuiTableHeader>
        <OuiTableHeaderCell
          align="left"
          data-test-subj="tableHeaderCell_name_0"
          description="description"
          key="_data_h_name_0"
        >
          Name
        </OuiTableHeaderCell>
      </OuiTableHeader>
      <OuiTableBody
        bodyRef={[Function]}
      >
        <OuiTableRow
          isSelected={false}
        >
          <OuiTableRowCell
            align="left"
            className="customRowClass"
            data-test-subj="cell-1-name"
            key="_data_column_name_0_0"
            mobileOptions={
              Object {
                "header": "Name",
                "render": undefined,
              }
            }
            onClick={[Function]}
            setScopeRow={false}
            textOnly={true}
          >
            name1
          </OuiTableRowCell>
        </OuiTableRow>
        <OuiTableRow
          isSelected={false}
        >
          <OuiTableRowCell
            align="left"
            className="customRowClass"
            data-test-subj="cell-2-name"
            key="_data_column_name_1_0"
            mobileOptions={
              Object {
                "header": "Name",
                "render": undefined,
              }
            }
            onClick={[Function]}
            setScopeRow={false}
            textOnly={true}
          >
            name2
          </OuiTableRowCell>
        </OuiTableRow>
        <OuiTableRow
          isSelected={false}
        >
          <OuiTableRowCell
            align="left"
            className="customRowClass"
            data-test-subj="cell-3-name"
            key="_data_column_name_2_0"
            mobileOptions={
              Object {
                "header": "Name",
                "render": undefined,
              }
            }
            onClick={[Function]}
            setScopeRow={false}
            textOnly={true}
          >
            name3
          </OuiTableRowCell>
        </OuiTableRow>
      </OuiTableBody>
    </OuiTable>
  </div>
</div>
`;

exports[`OuiBasicTable cellProps renders rows with custom props from an object 1`] = `
<div
  className="ouiBasicTable"
>
  <div>
    <OuiTableHeaderMobile>
      <OuiFlexGroup
        alignItems="baseline"
        justifyContent="spaceBetween"
        responsive={false}
      >
        <OuiFlexItem
          grow={false}
        />
        <OuiFlexItem
          grow={false}
        />
      </OuiFlexGroup>
    </OuiTableHeaderMobile>
    <OuiTable
      id="__table_generated-id"
      responsive={true}
      tableLayout="fixed"
    >
      <OuiScreenReaderOnly>
        <caption
          className="ouiTableCaption"
        >
          <OuiDelayRender
            delay={500}
          >
            <OuiI18n
              default="This table contains {itemCount} rows."
              token="ouiBasicTable.tableAutoCaptionWithoutPagination"
              values={
                Object {
                  "itemCount": 3,
                }
              }
            />
          </OuiDelayRender>
        </caption>
      </OuiScreenReaderOnly>
      <OuiTableHeader>
        <OuiTableHeaderCell
          align="left"
          data-test-subj="tableHeaderCell_name_0"
          description="description"
          key="_data_h_name_0"
        >
          Name
        </OuiTableHeaderCell>
      </OuiTableHeader>
      <OuiTableBody
        bodyRef={[Function]}
      >
        <OuiTableRow
          isSelected={false}
        >
          <OuiTableRowCell
            align="left"
            className="customClass"
            data-test-subj="cell"
            key="_data_column_name_0_0"
            mobileOptions={
              Object {
                "header": "Name",
                "render": undefined,
              }
            }
            onClick={[Function]}
            setScopeRow={false}
            textOnly={true}
          >
            name1
          </OuiTableRowCell>
        </OuiTableRow>
        <OuiTableRow
          isSelected={false}
        >
          <OuiTableRowCell
            align="left"
            className="customClass"
            data-test-subj="cell"
            key="_data_column_name_1_0"
            mobileOptions={
              Object {
                "header": "Name",
                "render": undefined,
              }
            }
            onClick={[Function]}
            setScopeRow={false}
            textOnly={true}
          >
            name2
          </OuiTableRowCell>
        </OuiTableRow>
        <OuiTableRow
          isSelected={false}
        >
          <OuiTableRowCell
            align="left"
            className="customClass"
            data-test-subj="cell"
            key="_data_column_name_2_0"
            mobileOptions={
              Object {
                "header": "Name",
                "render": undefined,
              }
            }
            onClick={[Function]}
            setScopeRow={false}
            textOnly={true}
          >
            name3
          </OuiTableRowCell>
        </OuiTableRow>
      </OuiTableBody>
    </OuiTable>
  </div>
</div>
`;

exports[`OuiBasicTable empty is rendered 1`] = `
<div
  aria-label="aria-label"
  className="ouiBasicTable testClass1 testClass2"
  data-test-subj="test subject string"
>
  <div>
    <OuiTableHeaderMobile>
      <OuiFlexGroup
        alignItems="baseline"
        justifyContent="spaceBetween"
        responsive={false}
      >
        <OuiFlexItem
          grow={false}
        />
        <OuiFlexItem
          grow={false}
        />
      </OuiFlexGroup>
    </OuiTableHeaderMobile>
    <OuiTable
      id="__table_generated-id"
      responsive={true}
      tableLayout="fixed"
    >
      <OuiScreenReaderOnly>
        <caption
          className="ouiTableCaption"
        >
          <OuiDelayRender
            delay={500}
          >
            <OuiI18n
              default="This table contains {itemCount} rows."
              token="ouiBasicTable.tableAutoCaptionWithoutPagination"
              values={
                Object {
                  "itemCount": 0,
                }
              }
            />
          </OuiDelayRender>
        </caption>
      </OuiScreenReaderOnly>
      <OuiTableHeader>
        <OuiTableHeaderCell
          align="left"
          data-test-subj="tableHeaderCell_name_0"
          description="description"
          key="_data_h_name_0"
        >
          Name
        </OuiTableHeaderCell>
      </OuiTableHeader>
      <OuiTableBody>
        <OuiTableRow>
          <OuiTableRowCell
            align="center"
            colSpan={1}
            isMobileFullWidth={true}
          >
            No items found
          </OuiTableRowCell>
        </OuiTableRow>
      </OuiTableBody>
    </OuiTable>
  </div>
</div>
`;

exports[`OuiBasicTable empty renders a node as a custom message 1`] = `
<div
  className="ouiBasicTable"
>
  <div>
    <OuiTableHeaderMobile>
      <OuiFlexGroup
        alignItems="baseline"
        justifyContent="spaceBetween"
        responsive={false}
      >
        <OuiFlexItem
          grow={false}
        />
        <OuiFlexItem
          grow={false}
        />
      </OuiFlexGroup>
    </OuiTableHeaderMobile>
    <OuiTable
      id="__table_generated-id"
      responsive={true}
      tableLayout="fixed"
    >
      <OuiScreenReaderOnly>
        <caption
          className="ouiTableCaption"
        >
          <OuiDelayRender
            delay={500}
          >
            <OuiI18n
              default="This table contains {itemCount} rows."
              token="ouiBasicTable.tableAutoCaptionWithoutPagination"
              values={
                Object {
                  "itemCount": 0,
                }
              }
            />
          </OuiDelayRender>
        </caption>
      </OuiScreenReaderOnly>
      <OuiTableHeader>
        <OuiTableHeaderCell
          align="left"
          data-test-subj="tableHeaderCell_name_0"
          description="description"
          key="_data_h_name_0"
        >
          Name
        </OuiTableHeaderCell>
      </OuiTableHeader>
      <OuiTableBody>
        <OuiTableRow>
          <OuiTableRowCell
            align="center"
            colSpan={1}
            isMobileFullWidth={true}
          >
            <p>
              no items, click 
              <a
                href=""
              >
                here
              </a>
               to make some
            </p>
          </OuiTableRowCell>
        </OuiTableRow>
      </OuiTableBody>
    </OuiTable>
  </div>
</div>
`;

exports[`OuiBasicTable empty renders a string as a custom message 1`] = `
<div
  className="ouiBasicTable"
>
  <div>
    <OuiTableHeaderMobile>
      <OuiFlexGroup
        alignItems="baseline"
        justifyContent="spaceBetween"
        responsive={false}
      >
        <OuiFlexItem
          grow={false}
        />
        <OuiFlexItem
          grow={false}
        />
      </OuiFlexGroup>
    </OuiTableHeaderMobile>
    <OuiTable
      id="__table_generated-id"
      responsive={true}
      tableLayout="fixed"
    >
      <OuiScreenReaderOnly>
        <caption
          className="ouiTableCaption"
        >
          <OuiDelayRender
            delay={500}
          >
            <OuiI18n
              default="This table contains {itemCount} rows."
              token="ouiBasicTable.tableAutoCaptionWithoutPagination"
              values={
                Object {
                  "itemCount": 0,
                }
              }
            />
          </OuiDelayRender>
        </caption>
      </OuiScreenReaderOnly>
      <OuiTableHeader>
        <OuiTableHeaderCell
          align="left"
          data-test-subj="tableHeaderCell_name_0"
          description="description"
          key="_data_h_name_0"
        >
          Name
        </OuiTableHeaderCell>
      </OuiTableHeader>
      <OuiTableBody>
        <OuiTableRow>
          <OuiTableRowCell
            align="center"
            colSpan={1}
            isMobileFullWidth={true}
          >
            where my items at?
          </OuiTableRowCell>
        </OuiTableRow>
      </OuiTableBody>
    </OuiTable>
  </div>
</div>
`;

exports[`OuiBasicTable footers do not render without a column footer definition 1`] = `
<div
  className="ouiBasicTable"
>
  <div>
    <OuiTableHeaderMobile>
      <OuiFlexGroup
        alignItems="baseline"
        justifyContent="spaceBetween"
        responsive={false}
      >
        <OuiFlexItem
          grow={false}
        />
        <OuiFlexItem
          grow={false}
        />
      </OuiFlexGroup>
    </OuiTableHeaderMobile>
    <OuiTable
      id="__table_generated-id"
      responsive={true}
      tableLayout="fixed"
    >
      <OuiScreenReaderOnly>
        <caption
          className="ouiTableCaption"
        >
          <OuiDelayRender
            delay={500}
          >
            <OuiI18n
              default="This table contains {itemCount} rows."
              token="ouiBasicTable.tableAutoCaptionWithoutPagination"
              values={
                Object {
                  "itemCount": 3,
                }
              }
            />
          </OuiDelayRender>
        </caption>
      </OuiScreenReaderOnly>
      <OuiTableHeader>
        <OuiTableHeaderCell
          align="left"
          data-test-subj="tableHeaderCell_name_0"
          description="your name"
          key="_data_h_name_0"
        >
          Name
        </OuiTableHeaderCell>
        <OuiTableHeaderCell
          align="left"
          data-test-subj="tableHeaderCell_id_1"
          description="your id"
          key="_data_h_id_1"
        >
          ID
        </OuiTableHeaderCell>
        <OuiTableHeaderCell
          align="left"
          data-test-subj="tableHeaderCell_age_2"
          description="your age"
          key="_data_h_age_2"
        >
          Age
        </OuiTableHeaderCell>
      </OuiTableHeader>
      <OuiTableBody
        bodyRef={[Function]}
      >
        <OuiTableRow
          isSelected={false}
        >
          <OuiTableRowCell
            align="left"
            key="_data_column_name_1_0"
            mobileOptions={
              Object {
                "header": "Name",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={true}
          >
            name1
          </OuiTableRowCell>
          <OuiTableRowCell
            align="left"
            key="_data_column_id_1_1"
            mobileOptions={
              Object {
                "header": "ID",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={true}
          >
            1
          </OuiTableRowCell>
          <OuiTableRowCell
            align="left"
            key="_data_column_age_1_2"
            mobileOptions={
              Object {
                "header": "Age",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={true}
          >
            20
          </OuiTableRowCell>
        </OuiTableRow>
        <OuiTableRow
          isSelected={false}
        >
          <OuiTableRowCell
            align="left"
            key="_data_column_name_2_0"
            mobileOptions={
              Object {
                "header": "Name",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={true}
          >
            name2
          </OuiTableRowCell>
          <OuiTableRowCell
            align="left"
            key="_data_column_id_2_1"
            mobileOptions={
              Object {
                "header": "ID",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={true}
          >
            2
          </OuiTableRowCell>
          <OuiTableRowCell
            align="left"
            key="_data_column_age_2_2"
            mobileOptions={
              Object {
                "header": "Age",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={true}
          >
            21
          </OuiTableRowCell>
        </OuiTableRow>
        <OuiTableRow
          isSelected={false}
        >
          <OuiTableRowCell
            align="left"
            key="_data_column_name_3_0"
            mobileOptions={
              Object {
                "header": "Name",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={true}
          >
            name3
          </OuiTableRowCell>
          <OuiTableRowCell
            align="left"
            key="_data_column_id_3_1"
            mobileOptions={
              Object {
                "header": "ID",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={true}
          >
            3
          </OuiTableRowCell>
          <OuiTableRowCell
            align="left"
            key="_data_column_age_3_2"
            mobileOptions={
              Object {
                "header": "Age",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={true}
          >
            22
          </OuiTableRowCell>
        </OuiTableRow>
      </OuiTableBody>
    </OuiTable>
  </div>
</div>
`;

exports[`OuiBasicTable footers render with pagination, selection, sorting, and footer 1`] = `
<div
  className="ouiBasicTable"
>
  <div>
    <OuiTableHeaderMobile>
      <OuiFlexGroup
        alignItems="baseline"
        justifyContent="spaceBetween"
        responsive={false}
      >
        <OuiFlexItem
          grow={false}
        >
          <OuiI18n
            default="Select all rows"
            token="ouiBasicTable.selectAllRows"
          >
            <Component />
          </OuiI18n>
        </OuiFlexItem>
        <OuiFlexItem
          grow={false}
        >
          <OuiTableSortMobile
            items={
              Array [
                Object {
                  "isSortAscending": true,
                  "isSorted": true,
                  "key": "_data_s_name_0",
                  "name": "Name",
                  "onSort": [Function],
                },
              ]
            }
          />
        </OuiFlexItem>
      </OuiFlexGroup>
    </OuiTableHeaderMobile>
    <OuiTable
      id="__table_generated-id"
      responsive={true}
      tableLayout="fixed"
    >
      <OuiScreenReaderOnly>
        <caption
          className="ouiTableCaption"
        >
          <OuiDelayRender
            delay={500}
          >
            <OuiI18n
              default="This table contains {itemCount} rows out of {totalItemCount} rows; Page {page} of {pageCount}."
              token="ouiBasicTable.tableAutoCaptionWithPagination"
              values={
                Object {
                  "itemCount": 3,
                  "page": 1,
                  "pageCount": 2,
                  "totalItemCount": 5,
                }
              }
            />
          </OuiDelayRender>
        </caption>
      </OuiScreenReaderOnly>
      <OuiTableHeader>
        <OuiTableHeaderCellCheckbox
          key="_selection_column_h"
        >
          <OuiI18n
            default="Select all rows"
            token="ouiBasicTable.selectAllRows"
          >
            <Component />
          </OuiI18n>
        </OuiTableHeaderCellCheckbox>
        <OuiTableHeaderCell
          align="left"
          data-test-subj="tableHeaderCell_name_0"
          description="your name"
          isSortAscending={true}
          isSorted={true}
          key="_data_h_name_0"
          onSort={[Function]}
        >
          Name
        </OuiTableHeaderCell>
        <OuiTableHeaderCell
          align="left"
          data-test-subj="tableHeaderCell_id_1"
          description="your id"
          key="_data_h_id_1"
        >
          ID
        </OuiTableHeaderCell>
        <OuiTableHeaderCell
          align="left"
          data-test-subj="tableHeaderCell_age_2"
          description="your age"
          key="_data_h_age_2"
        >
          Age
        </OuiTableHeaderCell>
      </OuiTableHeader>
      <OuiTableBody
        bodyRef={[Function]}
      >
        <OuiTableRow
          isSelectable={true}
          isSelected={false}
        >
          <OuiTableRowCellCheckbox
            key="_selection_column_1"
          >
            <OuiI18n
              default="Select this row"
              token="ouiBasicTable.selectThisRow"
            >
              <Component />
            </OuiI18n>
          </OuiTableRowCellCheckbox>
          <OuiTableRowCell
            align="left"
            key="_data_column_name_1_0"
            mobileOptions={
              Object {
                "header": "Name",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={true}
          >
            name1
          </OuiTableRowCell>
          <OuiTableRowCell
            align="left"
            key="_data_column_id_1_1"
            mobileOptions={
              Object {
                "header": "ID",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={true}
          >
            1
          </OuiTableRowCell>
          <OuiTableRowCell
            align="left"
            key="_data_column_age_1_2"
            mobileOptions={
              Object {
                "header": "Age",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={true}
          >
            20
          </OuiTableRowCell>
        </OuiTableRow>
        <OuiTableRow
          isSelectable={true}
          isSelected={false}
        >
          <OuiTableRowCellCheckbox
            key="_selection_column_2"
          >
            <OuiI18n
              default="Select this row"
              token="ouiBasicTable.selectThisRow"
            >
              <Component />
            </OuiI18n>
          </OuiTableRowCellCheckbox>
          <OuiTableRowCell
            align="left"
            key="_data_column_name_2_0"
            mobileOptions={
              Object {
                "header": "Name",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={true}
          >
            name2
          </OuiTableRowCell>
          <OuiTableRowCell
            align="left"
            key="_data_column_id_2_1"
            mobileOptions={
              Object {
                "header": "ID",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={true}
          >
            2
          </OuiTableRowCell>
          <OuiTableRowCell
            align="left"
            key="_data_column_age_2_2"
            mobileOptions={
              Object {
                "header": "Age",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={true}
          >
            21
          </OuiTableRowCell>
        </OuiTableRow>
        <OuiTableRow
          isSelectable={true}
          isSelected={false}
        >
          <OuiTableRowCellCheckbox
            key="_selection_column_3"
          >
            <OuiI18n
              default="Select this row"
              token="ouiBasicTable.selectThisRow"
            >
              <Component />
            </OuiI18n>
          </OuiTableRowCellCheckbox>
          <OuiTableRowCell
            align="left"
            key="_data_column_name_3_0"
            mobileOptions={
              Object {
                "header": "Name",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={true}
          >
            name3
          </OuiTableRowCell>
          <OuiTableRowCell
            align="left"
            key="_data_column_id_3_1"
            mobileOptions={
              Object {
                "header": "ID",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={true}
          >
            3
          </OuiTableRowCell>
          <OuiTableRowCell
            align="left"
            key="_data_column_age_3_2"
            mobileOptions={
              Object {
                "header": "Age",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={true}
          >
            22
          </OuiTableRowCell>
        </OuiTableRow>
      </OuiTableBody>
      <OuiTableFooter>
        <OuiTableFooterCell
          key="_selection_column_f"
        />
        <OuiTableFooterCell
          key="footer_name_0"
        >
          <strong>
            Name
          </strong>
        </OuiTableFooterCell>
        <OuiTableFooterCell
          key="footer_id_1"
        >
          ID
        </OuiTableFooterCell>
        <OuiTableFooterCell
          key="footer_age_2"
        >
          <strong>
            sum:
            63
            <br />
            total items:
            5
          </strong>
        </OuiTableFooterCell>
      </OuiTableFooter>
    </OuiTable>
  </div>
  <PaginationBar
    aria-controls="__table_generated-id"
    onPageChange={[Function]}
    onPageSizeChange={[Function]}
    pagination={
      Object {
        "pageIndex": 0,
        "pageSize": 3,
        "totalItemCount": 5,
      }
    }
  />
</div>
`;

exports[`OuiBasicTable itemIdToExpandedRowMap renders an expanded row 1`] = `
<div
  className="ouiBasicTable"
>
  <div>
    <OuiTableHeaderMobile>
      <OuiFlexGroup
        alignItems="baseline"
        justifyContent="spaceBetween"
        responsive={false}
      >
        <OuiFlexItem
          grow={false}
        />
        <OuiFlexItem
          grow={false}
        />
      </OuiFlexGroup>
    </OuiTableHeaderMobile>
    <OuiTable
      id="__table_generated-id"
      responsive={true}
      tableLayout="fixed"
    >
      <OuiScreenReaderOnly>
        <caption
          className="ouiTableCaption"
        >
          <OuiDelayRender
            delay={500}
          >
            <OuiI18n
              default="This table contains {itemCount} rows."
              token="ouiBasicTable.tableAutoCaptionWithoutPagination"
              values={
                Object {
                  "itemCount": 3,
                }
              }
            />
          </OuiDelayRender>
        </caption>
      </OuiScreenReaderOnly>
      <OuiTableHeader>
        <OuiTableHeaderCell
          align="left"
          data-test-subj="tableHeaderCell_name_0"
          description="description"
          key="_data_h_name_0"
        >
          Name
        </OuiTableHeaderCell>
      </OuiTableHeader>
      <OuiTableBody
        bodyRef={[Function]}
      >
        <OuiTableRow
          aria-owns="row_1_expansion"
          isSelected={false}
        >
          <OuiTableRowCell
            align="left"
            key="_data_column_name_1_0"
            mobileOptions={
              Object {
                "header": "Name",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={true}
          >
            name1
          </OuiTableRowCell>
        </OuiTableRow>
        <OuiTableRow
          id="row_1_expansion"
          isExpandedRow={true}
        >
          <OuiTableRowCell
            colSpan={1}
            textOnly={false}
          >
            <div>
              Expanded row
            </div>
          </OuiTableRowCell>
        </OuiTableRow>
        <OuiTableRow
          isSelected={false}
        >
          <OuiTableRowCell
            align="left"
            key="_data_column_name_2_0"
            mobileOptions={
              Object {
                "header": "Name",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={true}
          >
            name2
          </OuiTableRowCell>
        </OuiTableRow>
        <OuiTableRow
          isSelected={false}
        >
          <OuiTableRowCell
            align="left"
            key="_data_column_name_3_0"
            mobileOptions={
              Object {
                "header": "Name",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={true}
          >
            name3
          </OuiTableRowCell>
        </OuiTableRow>
      </OuiTableBody>
    </OuiTable>
  </div>
</div>
`;

exports[`OuiBasicTable rowProps renders rows with custom props from a callback 1`] = `
<div
  className="ouiBasicTable"
>
  <div>
    <OuiTableHeaderMobile>
      <OuiFlexGroup
        alignItems="baseline"
        justifyContent="spaceBetween"
        responsive={false}
      >
        <OuiFlexItem
          grow={false}
        />
        <OuiFlexItem
          grow={false}
        />
      </OuiFlexGroup>
    </OuiTableHeaderMobile>
    <OuiTable
      id="__table_generated-id"
      responsive={true}
      tableLayout="fixed"
    >
      <OuiScreenReaderOnly>
        <caption
          className="ouiTableCaption"
        >
          <OuiDelayRender
            delay={500}
          >
            <OuiI18n
              default="This table contains {itemCount} rows."
              token="ouiBasicTable.tableAutoCaptionWithoutPagination"
              values={
                Object {
                  "itemCount": 3,
                }
              }
            />
          </OuiDelayRender>
        </caption>
      </OuiScreenReaderOnly>
      <OuiTableHeader>
        <OuiTableHeaderCell
          align="left"
          data-test-subj="tableHeaderCell_name_0"
          description="description"
          key="_data_h_name_0"
        >
          Name
        </OuiTableHeaderCell>
      </OuiTableHeader>
      <OuiTableBody
        bodyRef={[Function]}
      >
        <OuiKeyboardAccessible>
          <OuiTableRow
            className="customRowClass"
            data-test-subj="row-1"
            isSelected={false}
            onClick={[Function]}
          >
            <OuiTableRowCell
              align="left"
              key="_data_column_name_0_0"
              mobileOptions={
                Object {
                  "header": "Name",
                  "render": undefined,
                }
              }
              setScopeRow={false}
              textOnly={true}
            >
              name1
            </OuiTableRowCell>
          </OuiTableRow>
        </OuiKeyboardAccessible>
        <OuiKeyboardAccessible>
          <OuiTableRow
            className="customRowClass"
            data-test-subj="row-2"
            isSelected={false}
            onClick={[Function]}
          >
            <OuiTableRowCell
              align="left"
              key="_data_column_name_1_0"
              mobileOptions={
                Object {
                  "header": "Name",
                  "render": undefined,
                }
              }
              setScopeRow={false}
              textOnly={true}
            >
              name2
            </OuiTableRowCell>
          </OuiTableRow>
        </OuiKeyboardAccessible>
        <OuiKeyboardAccessible>
          <OuiTableRow
            className="customRowClass"
            data-test-subj="row-3"
            isSelected={false}
            onClick={[Function]}
          >
            <OuiTableRowCell
              align="left"
              key="_data_column_name_2_0"
              mobileOptions={
                Object {
                  "header": "Name",
                  "render": undefined,
                }
              }
              setScopeRow={false}
              textOnly={true}
            >
              name3
            </OuiTableRowCell>
          </OuiTableRow>
        </OuiKeyboardAccessible>
      </OuiTableBody>
    </OuiTable>
  </div>
</div>
`;

exports[`OuiBasicTable rowProps renders rows with custom props from an object 1`] = `
<div
  className="ouiBasicTable"
>
  <div>
    <OuiTableHeaderMobile>
      <OuiFlexGroup
        alignItems="baseline"
        justifyContent="spaceBetween"
        responsive={false}
      >
        <OuiFlexItem
          grow={false}
        />
        <OuiFlexItem
          grow={false}
        />
      </OuiFlexGroup>
    </OuiTableHeaderMobile>
    <OuiTable
      id="__table_generated-id"
      responsive={true}
      tableLayout="fixed"
    >
      <OuiScreenReaderOnly>
        <caption
          className="ouiTableCaption"
        >
          <OuiDelayRender
            delay={500}
          >
            <OuiI18n
              default="This table contains {itemCount} rows."
              token="ouiBasicTable.tableAutoCaptionWithoutPagination"
              values={
                Object {
                  "itemCount": 3,
                }
              }
            />
          </OuiDelayRender>
        </caption>
      </OuiScreenReaderOnly>
      <OuiTableHeader>
        <OuiTableHeaderCell
          align="left"
          data-test-subj="tableHeaderCell_name_0"
          description="description"
          key="_data_h_name_0"
        >
          Name
        </OuiTableHeaderCell>
      </OuiTableHeader>
      <OuiTableBody
        bodyRef={[Function]}
      >
        <OuiKeyboardAccessible>
          <OuiTableRow
            className="customClass"
            data-test-subj="row"
            isSelected={false}
            onClick={[Function]}
          >
            <OuiTableRowCell
              align="left"
              key="_data_column_name_0_0"
              mobileOptions={
                Object {
                  "header": "Name",
                  "render": undefined,
                }
              }
              setScopeRow={false}
              textOnly={true}
            >
              name1
            </OuiTableRowCell>
          </OuiTableRow>
        </OuiKeyboardAccessible>
        <OuiKeyboardAccessible>
          <OuiTableRow
            className="customClass"
            data-test-subj="row"
            isSelected={false}
            onClick={[Function]}
          >
            <OuiTableRowCell
              align="left"
              key="_data_column_name_1_0"
              mobileOptions={
                Object {
                  "header": "Name",
                  "render": undefined,
                }
              }
              setScopeRow={false}
              textOnly={true}
            >
              name2
            </OuiTableRowCell>
          </OuiTableRow>
        </OuiKeyboardAccessible>
        <OuiKeyboardAccessible>
          <OuiTableRow
            className="customClass"
            data-test-subj="row"
            isSelected={false}
            onClick={[Function]}
          >
            <OuiTableRowCell
              align="left"
              key="_data_column_name_2_0"
              mobileOptions={
                Object {
                  "header": "Name",
                  "render": undefined,
                }
              }
              setScopeRow={false}
              textOnly={true}
            >
              name3
            </OuiTableRowCell>
          </OuiTableRow>
        </OuiKeyboardAccessible>
      </OuiTableBody>
    </OuiTable>
  </div>
</div>
`;

exports[`OuiBasicTable with initial selection 1`] = `
<OuiBasicTable
  columns={
    Array [
      Object {
        "description": "description",
        "field": "name",
        "name": "Name",
      },
    ]
  }
  itemId="id"
  items={
    Array [
      Object {
        "id": "1",
        "name": "name1",
      },
      Object {
        "id": "2",
        "name": "name2",
      },
      Object {
        "id": "3",
        "name": "name3",
      },
    ]
  }
  noItemsMessage="No items found"
  responsive={true}
  selection={
    Object {
      "initialSelected": Array [
        Object {
          "id": "1",
          "name": "name1",
        },
      ],
      "onSelectionChange": [Function],
    }
  }
  tableLayout="fixed"
>
  <div
    className="ouiBasicTable"
  >
    <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>
`;

exports[`OuiBasicTable with multiple record actions with custom availability 1`] = `
<div
  className="ouiBasicTable"
>
  <div>
    <OuiTableHeaderMobile>
      <OuiFlexGroup
        alignItems="baseline"
        justifyContent="spaceBetween"
        responsive={false}
      >
        <OuiFlexItem
          grow={false}
        />
        <OuiFlexItem
          grow={false}
        />
      </OuiFlexGroup>
    </OuiTableHeaderMobile>
    <OuiTable
      id="__table_generated-id"
      responsive={true}
      tableLayout="fixed"
    >
      <OuiScreenReaderOnly>
        <caption
          className="ouiTableCaption"
        >
          <OuiDelayRender
            delay={500}
          >
            <OuiI18n
              default="This table contains {itemCount} rows."
              token="ouiBasicTable.tableAutoCaptionWithoutPagination"
              values={
                Object {
                  "itemCount": 4,
                }
              }
            />
          </OuiDelayRender>
        </caption>
      </OuiScreenReaderOnly>
      <OuiTableHeader>
        <OuiTableHeaderCell
          align="left"
          data-test-subj="tableHeaderCell_name_0"
          description="description"
          key="_data_h_name_0"
        >
          Name
        </OuiTableHeaderCell>
        <OuiTableHeaderCell
          align="right"
          key="_actions_h_1"
        >
          Actions
        </OuiTableHeaderCell>
      </OuiTableHeader>
      <OuiTableBody
        bodyRef={[Function]}
      >
        <OuiTableRow
          hasActions={true}
          isSelected={false}
        >
          <OuiTableRowCell
            align="left"
            key="_data_column_name_1_0"
            mobileOptions={
              Object {
                "header": "Name",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={true}
          >
            name1
          </OuiTableRowCell>
          <OuiTableRowCell
            align="right"
            hasActions={true}
            key="record_actions_1_1"
            showOnHover={true}
            textOnly={false}
          >
            <ExpandedItemActions
              actionEnabled={[Function]}
              actions={
                Array [
                  Object {
                    "description": "copy",
                    "icon": "copy",
                    "isPrimary": true,
                    "name": "Copy",
                    "onClick": [Function],
                    "type": "icon",
                  },
                  Object {
                    "description": "delete",
                    "icon": "trash",
                    "isPrimary": true,
                    "name": "Delete",
                    "onClick": [Function],
                    "type": "icon",
                  },
                  Object {
                    "name": "All actions",
                    "render": [Function],
                  },
                ]
              }
              item={
                Object {
                  "id": "1",
                  "name": "name1",
                }
              }
              itemId="1"
            />
          </OuiTableRowCell>
        </OuiTableRow>
        <OuiTableRow
          hasActions={true}
          isSelected={false}
        >
          <OuiTableRowCell
            align="left"
            key="_data_column_name_2_0"
            mobileOptions={
              Object {
                "header": "Name",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={true}
          >
            name2
          </OuiTableRowCell>
          <OuiTableRowCell
            align="right"
            hasActions={true}
            key="record_actions_2_1"
            showOnHover={true}
            textOnly={false}
          >
            <ExpandedItemActions
              actionEnabled={[Function]}
              actions={
                Array [
                  Object {
                    "available": [Function],
                    "description": "edit",
                    "icon": "pencil",
                    "isPrimary": true,
                    "name": "Edit",
                    "onClick": [Function],
                    "type": "icon",
                  },
                  Object {
                    "description": "copy",
                    "icon": "copy",
                    "isPrimary": true,
                    "name": "Copy",
                    "onClick": [Function],
                    "type": "icon",
                  },
                  Object {
                    "name": "All actions",
                    "render": [Function],
                  },
                ]
              }
              item={
                Object {
                  "id": "2",
                  "name": "name2",
                }
              }
              itemId="2"
            />
          </OuiTableRowCell>
        </OuiTableRow>
        <OuiTableRow
          hasActions={true}
          isSelected={false}
        >
          <OuiTableRowCell
            align="left"
            key="_data_column_name_3_0"
            mobileOptions={
              Object {
                "header": "Name",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={true}
          >
            name3
          </OuiTableRowCell>
          <OuiTableRowCell
            align="right"
            hasActions={true}
            key="record_actions_3_1"
            showOnHover={true}
            textOnly={false}
          >
            <ExpandedItemActions
              actionEnabled={[Function]}
              actions={
                Array [
                  Object {
                    "description": "copy",
                    "icon": "copy",
                    "isPrimary": true,
                    "name": "Copy",
                    "onClick": [Function],
                    "type": "icon",
                  },
                  Object {
                    "description": "delete",
                    "icon": "trash",
                    "isPrimary": true,
                    "name": "Delete",
                    "onClick": [Function],
                    "type": "icon",
                  },
                ]
              }
              item={
                Object {
                  "id": "3",
                  "name": "name3",
                }
              }
              itemId="3"
            />
          </OuiTableRowCell>
        </OuiTableRow>
        <OuiTableRow
          hasActions={true}
          isSelected={false}
        >
          <OuiTableRowCell
            align="left"
            key="_data_column_name_4_0"
            mobileOptions={
              Object {
                "header": "Name",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={true}
          >
            name3
          </OuiTableRowCell>
          <OuiTableRowCell
            align="right"
            hasActions={true}
            key="record_actions_4_1"
            showOnHover={true}
            textOnly={false}
          >
            <ExpandedItemActions
              actionEnabled={[Function]}
              actions={
                Array [
                  Object {
                    "available": [Function],
                    "description": "edit",
                    "icon": "pencil",
                    "isPrimary": true,
                    "name": "Edit",
                    "onClick": [Function],
                    "type": "icon",
                  },
                  Object {
                    "description": "copy",
                    "icon": "copy",
                    "isPrimary": true,
                    "name": "Copy",
                    "onClick": [Function],
                    "type": "icon",
                  },
                  Object {
                    "name": "All actions",
                    "render": [Function],
                  },
                ]
              }
              item={
                Object {
                  "id": "4",
                  "name": "name3",
                }
              }
              itemId="4"
            />
          </OuiTableRowCell>
        </OuiTableRow>
      </OuiTableBody>
    </OuiTable>
  </div>
</div>
`;

exports[`OuiBasicTable with pagination - 2nd page 1`] = `
<div
  className="ouiBasicTable"
>
  <div>
    <OuiTableHeaderMobile>
      <OuiFlexGroup
        alignItems="baseline"
        justifyContent="spaceBetween"
        responsive={false}
      >
        <OuiFlexItem
          grow={false}
        />
        <OuiFlexItem
          grow={false}
        />
      </OuiFlexGroup>
    </OuiTableHeaderMobile>
    <OuiTable
      id="__table_generated-id"
      responsive={true}
      tableLayout="fixed"
    >
      <OuiScreenReaderOnly>
        <caption
          className="ouiTableCaption"
        >
          <OuiDelayRender
            delay={500}
          >
            <OuiI18n
              default="This table contains {itemCount} rows out of {totalItemCount} rows; Page {page} of {pageCount}."
              token="ouiBasicTable.tableAutoCaptionWithPagination"
              values={
                Object {
                  "itemCount": 2,
                  "page": 2,
                  "pageCount": 2,
                  "totalItemCount": 5,
                }
              }
            />
          </OuiDelayRender>
        </caption>
      </OuiScreenReaderOnly>
      <OuiTableHeader>
        <OuiTableHeaderCell
          align="left"
          data-test-subj="tableHeaderCell_name_0"
          description="description"
          key="_data_h_name_0"
        >
          Name
        </OuiTableHeaderCell>
      </OuiTableHeader>
      <OuiTableBody
        bodyRef={[Function]}
      >
        <OuiTableRow
          isSelected={false}
        >
          <OuiTableRowCell
            align="left"
            key="_data_column_name_3_0"
            mobileOptions={
              Object {
                "header": "Name",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={true}
          >
            name1
          </OuiTableRowCell>
        </OuiTableRow>
        <OuiTableRow
          isSelected={false}
        >
          <OuiTableRowCell
            align="left"
            key="_data_column_name_4_0"
            mobileOptions={
              Object {
                "header": "Name",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={true}
          >
            name2
          </OuiTableRowCell>
        </OuiTableRow>
      </OuiTableBody>
    </OuiTable>
  </div>
  <PaginationBar
    aria-controls="__table_generated-id"
    onPageChange={[Function]}
    onPageSizeChange={[Function]}
    pagination={
      Object {
        "pageIndex": 1,
        "pageSize": 3,
        "totalItemCount": 5,
      }
    }
  />
</div>
`;

exports[`OuiBasicTable with pagination 1`] = `
<div
  className="ouiBasicTable"
>
  <div>
    <OuiTableHeaderMobile>
      <OuiFlexGroup
        alignItems="baseline"
        justifyContent="spaceBetween"
        responsive={false}
      >
        <OuiFlexItem
          grow={false}
        />
        <OuiFlexItem
          grow={false}
        />
      </OuiFlexGroup>
    </OuiTableHeaderMobile>
    <OuiTable
      id="__table_generated-id"
      responsive={true}
      tableLayout="fixed"
    >
      <OuiScreenReaderOnly>
        <caption
          className="ouiTableCaption"
        >
          <OuiDelayRender
            delay={500}
          >
            <OuiI18n
              default="This table contains {itemCount} rows out of {totalItemCount} rows; Page {page} of {pageCount}."
              token="ouiBasicTable.tableAutoCaptionWithPagination"
              values={
                Object {
                  "itemCount": 3,
                  "page": 1,
                  "pageCount": 2,
                  "totalItemCount": 5,
                }
              }
            />
          </OuiDelayRender>
        </caption>
      </OuiScreenReaderOnly>
      <OuiTableHeader>
        <OuiTableHeaderCell
          align="left"
          data-test-subj="tableHeaderCell_name_0"
          description="description"
          key="_data_h_name_0"
        >
          Name
        </OuiTableHeaderCell>
      </OuiTableHeader>
      <OuiTableBody
        bodyRef={[Function]}
      >
        <OuiTableRow
          isSelected={false}
        >
          <OuiTableRowCell
            align="left"
            key="_data_column_name_0_0"
            mobileOptions={
              Object {
                "header": "Name",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={true}
          >
            name1
          </OuiTableRowCell>
        </OuiTableRow>
        <OuiTableRow
          isSelected={false}
        >
          <OuiTableRowCell
            align="left"
            key="_data_column_name_1_0"
            mobileOptions={
              Object {
                "header": "Name",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={true}
          >
            name2
          </OuiTableRowCell>
        </OuiTableRow>
        <OuiTableRow
          isSelected={false}
        >
          <OuiTableRowCell
            align="left"
            key="_data_column_name_2_0"
            mobileOptions={
              Object {
                "header": "Name",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={true}
          >
            name3
          </OuiTableRowCell>
        </OuiTableRow>
      </OuiTableBody>
    </OuiTable>
  </div>
  <PaginationBar
    aria-controls="__table_generated-id"
    onPageChange={[Function]}
    onPageSizeChange={[Function]}
    pagination={
      Object {
        "pageIndex": 0,
        "pageSize": 3,
        "totalItemCount": 5,
      }
    }
  />
</div>
`;

exports[`OuiBasicTable with pagination and error 1`] = `
<div
  className="ouiBasicTable"
>
  <div>
    <OuiTableHeaderMobile>
      <OuiFlexGroup
        alignItems="baseline"
        justifyContent="spaceBetween"
        responsive={false}
      >
        <OuiFlexItem
          grow={false}
        />
        <OuiFlexItem
          grow={false}
        />
      </OuiFlexGroup>
    </OuiTableHeaderMobile>
    <OuiTable
      id="__table_generated-id"
      responsive={true}
      tableLayout="fixed"
    >
      <OuiScreenReaderOnly>
        <caption
          className="ouiTableCaption"
        >
          <OuiDelayRender
            delay={500}
          >
            <OuiI18n
              default="This table contains {itemCount} rows out of {totalItemCount} rows; Page {page} of {pageCount}."
              token="ouiBasicTable.tableAutoCaptionWithPagination"
              values={
                Object {
                  "itemCount": 3,
                  "page": 1,
                  "pageCount": 2,
                  "totalItemCount": 5,
                }
              }
            />
          </OuiDelayRender>
        </caption>
      </OuiScreenReaderOnly>
      <OuiTableHeader>
        <OuiTableHeaderCell
          align="left"
          data-test-subj="tableHeaderCell_name_0"
          description="description"
          key="_data_h_name_0"
        >
          Name
        </OuiTableHeaderCell>
      </OuiTableHeader>
      <OuiTableBody>
        <OuiTableRow>
          <OuiTableRowCell
            align="center"
            colSpan={1}
            isMobileFullWidth={true}
          >
            <OuiIcon
              color="danger"
              type="minusInCircle"
            />
             
            no can do
          </OuiTableRowCell>
        </OuiTableRow>
      </OuiTableBody>
    </OuiTable>
  </div>
</div>
`;

exports[`OuiBasicTable with pagination and selection 1`] = `
<div
  className="ouiBasicTable"
>
  <div>
    <OuiTableHeaderMobile>
      <OuiFlexGroup
        alignItems="baseline"
        justifyContent="spaceBetween"
        responsive={false}
      >
        <OuiFlexItem
          grow={false}
        >
          <OuiI18n
            default="Select all rows"
            token="ouiBasicTable.selectAllRows"
          >
            <Component />
          </OuiI18n>
        </OuiFlexItem>
        <OuiFlexItem
          grow={false}
        />
      </OuiFlexGroup>
    </OuiTableHeaderMobile>
    <OuiTable
      id="__table_generated-id"
      responsive={true}
      tableLayout="fixed"
    >
      <OuiScreenReaderOnly>
        <caption
          className="ouiTableCaption"
        >
          <OuiDelayRender
            delay={500}
          >
            <OuiI18n
              default="This table contains {itemCount} rows out of {totalItemCount} rows; Page {page} of {pageCount}."
              token="ouiBasicTable.tableAutoCaptionWithPagination"
              values={
                Object {
                  "itemCount": 3,
                  "page": 1,
                  "pageCount": 2,
                  "totalItemCount": 5,
                }
              }
            />
          </OuiDelayRender>
        </caption>
      </OuiScreenReaderOnly>
      <OuiTableHeader>
        <OuiTableHeaderCellCheckbox
          key="_selection_column_h"
        >
          <OuiI18n
            default="Select all rows"
            token="ouiBasicTable.selectAllRows"
          >
            <Component />
          </OuiI18n>
        </OuiTableHeaderCellCheckbox>
        <OuiTableHeaderCell
          align="left"
          data-test-subj="tableHeaderCell_name_0"
          description="description"
          key="_data_h_name_0"
        >
          Name
        </OuiTableHeaderCell>
      </OuiTableHeader>
      <OuiTableBody
        bodyRef={[Function]}
      >
        <OuiTableRow
          isSelectable={true}
          isSelected={false}
        >
          <OuiTableRowCellCheckbox
            key="_selection_column_1"
          >
            <OuiI18n
              default="Select this row"
              token="ouiBasicTable.selectThisRow"
            >
              <Component />
            </OuiI18n>
          </OuiTableRowCellCheckbox>
          <OuiTableRowCell
            align="left"
            key="_data_column_name_1_0"
            mobileOptions={
              Object {
                "header": "Name",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={true}
          >
            name1
          </OuiTableRowCell>
        </OuiTableRow>
        <OuiTableRow
          isSelectable={true}
          isSelected={false}
        >
          <OuiTableRowCellCheckbox
            key="_selection_column_2"
          >
            <OuiI18n
              default="Select this row"
              token="ouiBasicTable.selectThisRow"
            >
              <Component />
            </OuiI18n>
          </OuiTableRowCellCheckbox>
          <OuiTableRowCell
            align="left"
            key="_data_column_name_2_0"
            mobileOptions={
              Object {
                "header": "Name",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={true}
          >
            name2
          </OuiTableRowCell>
        </OuiTableRow>
        <OuiTableRow
          isSelectable={true}
          isSelected={false}
        >
          <OuiTableRowCellCheckbox
            key="_selection_column_3"
          >
            <OuiI18n
              default="Select this row"
              token="ouiBasicTable.selectThisRow"
            >
              <Component />
            </OuiI18n>
          </OuiTableRowCellCheckbox>
          <OuiTableRowCell
            align="left"
            key="_data_column_name_3_0"
            mobileOptions={
              Object {
                "header": "Name",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={true}
          >
            name3
          </OuiTableRowCell>
        </OuiTableRow>
      </OuiTableBody>
    </OuiTable>
  </div>
  <PaginationBar
    aria-controls="__table_generated-id"
    onPageChange={[Function]}
    onPageSizeChange={[Function]}
    pagination={
      Object {
        "pageIndex": 0,
        "pageSize": 3,
        "totalItemCount": 5,
      }
    }
  />
</div>
`;

exports[`OuiBasicTable with pagination, hiding the per page options 1`] = `
<div
  className="ouiBasicTable"
>
  <div>
    <OuiTableHeaderMobile>
      <OuiFlexGroup
        alignItems="baseline"
        justifyContent="spaceBetween"
        responsive={false}
      >
        <OuiFlexItem
          grow={false}
        />
        <OuiFlexItem
          grow={false}
        />
      </OuiFlexGroup>
    </OuiTableHeaderMobile>
    <OuiTable
      id="__table_generated-id"
      responsive={true}
      tableLayout="fixed"
    >
      <OuiScreenReaderOnly>
        <caption
          className="ouiTableCaption"
        >
          <OuiDelayRender
            delay={500}
          >
            <OuiI18n
              default="This table contains {itemCount} rows out of {totalItemCount} rows; Page {page} of {pageCount}."
              token="ouiBasicTable.tableAutoCaptionWithPagination"
              values={
                Object {
                  "itemCount": 3,
                  "page": 1,
                  "pageCount": 2,
                  "totalItemCount": 5,
                }
              }
            />
          </OuiDelayRender>
        </caption>
      </OuiScreenReaderOnly>
      <OuiTableHeader>
        <OuiTableHeaderCell
          align="left"
          data-test-subj="tableHeaderCell_name_0"
          description="description"
          key="_data_h_name_0"
        >
          Name
        </OuiTableHeaderCell>
      </OuiTableHeader>
      <OuiTableBody
        bodyRef={[Function]}
      >
        <OuiTableRow
          isSelected={false}
        >
          <OuiTableRowCell
            align="left"
            key="_data_column_name_0_0"
            mobileOptions={
              Object {
                "header": "Name",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={true}
          >
            name1
          </OuiTableRowCell>
        </OuiTableRow>
        <OuiTableRow
          isSelected={false}
        >
          <OuiTableRowCell
            align="left"
            key="_data_column_name_1_0"
            mobileOptions={
              Object {
                "header": "Name",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={true}
          >
            name2
          </OuiTableRowCell>
        </OuiTableRow>
        <OuiTableRow
          isSelected={false}
        >
          <OuiTableRowCell
            align="left"
            key="_data_column_name_2_0"
            mobileOptions={
              Object {
                "header": "Name",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={true}
          >
            name3
          </OuiTableRowCell>
        </OuiTableRow>
      </OuiTableBody>
    </OuiTable>
  </div>
  <PaginationBar
    aria-controls="__table_generated-id"
    onPageChange={[Function]}
    onPageSizeChange={[Function]}
    pagination={
      Object {
        "hidePerPageOptions": true,
        "pageIndex": 0,
        "pageSize": 3,
        "totalItemCount": 5,
      }
    }
  />
</div>
`;

exports[`OuiBasicTable with pagination, selection and sorting 1`] = `
<div
  className="ouiBasicTable"
>
  <div>
    <OuiTableHeaderMobile>
      <OuiFlexGroup
        alignItems="baseline"
        justifyContent="spaceBetween"
        responsive={false}
      >
        <OuiFlexItem
          grow={false}
        >
          <OuiI18n
            default="Select all rows"
            token="ouiBasicTable.selectAllRows"
          >
            <Component />
          </OuiI18n>
        </OuiFlexItem>
        <OuiFlexItem
          grow={false}
        >
          <OuiTableSortMobile
            items={
              Array [
                Object {
                  "isSortAscending": true,
                  "isSorted": true,
                  "key": "_data_s_name_0",
                  "name": "Name",
                  "onSort": [Function],
                },
              ]
            }
          />
        </OuiFlexItem>
      </OuiFlexGroup>
    </OuiTableHeaderMobile>
    <OuiTable
      id="__table_generated-id"
      responsive={true}
      tableLayout="fixed"
    >
      <OuiScreenReaderOnly>
        <caption
          className="ouiTableCaption"
        >
          <OuiDelayRender
            delay={500}
          >
            <OuiI18n
              default="This table contains {itemCount} rows out of {totalItemCount} rows; Page {page} of {pageCount}."
              token="ouiBasicTable.tableAutoCaptionWithPagination"
              values={
                Object {
                  "itemCount": 3,
                  "page": 1,
                  "pageCount": 2,
                  "totalItemCount": 5,
                }
              }
            />
          </OuiDelayRender>
        </caption>
      </OuiScreenReaderOnly>
      <OuiTableHeader>
        <OuiTableHeaderCellCheckbox
          key="_selection_column_h"
        >
          <OuiI18n
            default="Select all rows"
            token="ouiBasicTable.selectAllRows"
          >
            <Component />
          </OuiI18n>
        </OuiTableHeaderCellCheckbox>
        <OuiTableHeaderCell
          align="left"
          data-test-subj="tableHeaderCell_name_0"
          description="description"
          isSortAscending={true}
          isSorted={true}
          key="_data_h_name_0"
          onSort={[Function]}
        >
          Name
        </OuiTableHeaderCell>
      </OuiTableHeader>
      <OuiTableBody
        bodyRef={[Function]}
      >
        <OuiTableRow
          isSelectable={true}
          isSelected={false}
        >
          <OuiTableRowCellCheckbox
            key="_selection_column_1"
          >
            <OuiI18n
              default="Select this row"
              token="ouiBasicTable.selectThisRow"
            >
              <Component />
            </OuiI18n>
          </OuiTableRowCellCheckbox>
          <OuiTableRowCell
            align="left"
            key="_data_column_name_1_0"
            mobileOptions={
              Object {
                "header": "Name",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={true}
          >
            name1
          </OuiTableRowCell>
        </OuiTableRow>
        <OuiTableRow
          isSelectable={true}
          isSelected={false}
        >
          <OuiTableRowCellCheckbox
            key="_selection_column_2"
          >
            <OuiI18n
              default="Select this row"
              token="ouiBasicTable.selectThisRow"
            >
              <Component />
            </OuiI18n>
          </OuiTableRowCellCheckbox>
          <OuiTableRowCell
            align="left"
            key="_data_column_name_2_0"
            mobileOptions={
              Object {
                "header": "Name",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={true}
          >
            name2
          </OuiTableRowCell>
        </OuiTableRow>
        <OuiTableRow
          isSelectable={true}
          isSelected={false}
        >
          <OuiTableRowCellCheckbox
            key="_selection_column_3"
          >
            <OuiI18n
              default="Select this row"
              token="ouiBasicTable.selectThisRow"
            >
              <Component />
            </OuiI18n>
          </OuiTableRowCellCheckbox>
          <OuiTableRowCell
            align="left"
            key="_data_column_name_3_0"
            mobileOptions={
              Object {
                "header": "Name",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={true}
          >
            name3
          </OuiTableRowCell>
        </OuiTableRow>
      </OuiTableBody>
    </OuiTable>
  </div>
  <PaginationBar
    aria-controls="__table_generated-id"
    onPageChange={[Function]}
    onPageSizeChange={[Function]}
    pagination={
      Object {
        "pageIndex": 0,
        "pageSize": 3,
        "totalItemCount": 5,
      }
    }
  />
</div>
`;

exports[`OuiBasicTable with pagination, selection, sorting and a single record action 1`] = `
<div
  className="ouiBasicTable"
>
  <div>
    <OuiTableHeaderMobile>
      <OuiFlexGroup
        alignItems="baseline"
        justifyContent="spaceBetween"
        responsive={false}
      >
        <OuiFlexItem
          grow={false}
        >
          <OuiI18n
            default="Select all rows"
            token="ouiBasicTable.selectAllRows"
          >
            <Component />
          </OuiI18n>
        </OuiFlexItem>
        <OuiFlexItem
          grow={false}
        >
          <OuiTableSortMobile
            items={
              Array [
                Object {
                  "isSortAscending": true,
                  "isSorted": true,
                  "key": "_data_s_name_0",
                  "name": "Name",
                  "onSort": [Function],
                },
              ]
            }
          />
        </OuiFlexItem>
      </OuiFlexGroup>
    </OuiTableHeaderMobile>
    <OuiTable
      id="__table_generated-id"
      responsive={true}
      tableLayout="fixed"
    >
      <OuiScreenReaderOnly>
        <caption
          className="ouiTableCaption"
        >
          <OuiDelayRender
            delay={500}
          >
            <OuiI18n
              default="This table contains {itemCount} rows out of {totalItemCount} rows; Page {page} of {pageCount}."
              token="ouiBasicTable.tableAutoCaptionWithPagination"
              values={
                Object {
                  "itemCount": 3,
                  "page": 1,
                  "pageCount": 2,
                  "totalItemCount": 5,
                }
              }
            />
          </OuiDelayRender>
        </caption>
      </OuiScreenReaderOnly>
      <OuiTableHeader>
        <OuiTableHeaderCellCheckbox
          key="_selection_column_h"
        >
          <OuiI18n
            default="Select all rows"
            token="ouiBasicTable.selectAllRows"
          >
            <Component />
          </OuiI18n>
        </OuiTableHeaderCellCheckbox>
        <OuiTableHeaderCell
          align="left"
          data-test-subj="tableHeaderCell_name_0"
          description="description"
          isSortAscending={true}
          isSorted={true}
          key="_data_h_name_0"
          onSort={[Function]}
        >
          Name
        </OuiTableHeaderCell>
        <OuiTableHeaderCell
          align="right"
          key="_actions_h_1"
        >
          Actions
        </OuiTableHeaderCell>
      </OuiTableHeader>
      <OuiTableBody
        bodyRef={[Function]}
      >
        <OuiTableRow
          hasActions={true}
          isSelectable={true}
          isSelected={false}
        >
          <OuiTableRowCellCheckbox
            key="_selection_column_1"
          >
            <OuiI18n
              default="Select this row"
              token="ouiBasicTable.selectThisRow"
            >
              <Component />
            </OuiI18n>
          </OuiTableRowCellCheckbox>
          <OuiTableRowCell
            align="left"
            key="_data_column_name_1_0"
            mobileOptions={
              Object {
                "header": "Name",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={true}
          >
            name1
          </OuiTableRowCell>
          <OuiTableRowCell
            align="right"
            hasActions={true}
            key="record_actions_1_1"
            showOnHover={true}
            textOnly={false}
          >
            <ExpandedItemActions
              actionEnabled={[Function]}
              actions={
                Array [
                  Object {
                    "description": "edit",
                    "name": "Edit",
                    "onClick": [Function],
                    "type": "button",
                  },
                ]
              }
              item={
                Object {
                  "id": "1",
                  "name": "name1",
                }
              }
              itemId="1"
            />
          </OuiTableRowCell>
        </OuiTableRow>
        <OuiTableRow
          hasActions={true}
          isSelectable={true}
          isSelected={false}
        >
          <OuiTableRowCellCheckbox
            key="_selection_column_2"
          >
            <OuiI18n
              default="Select this row"
              token="ouiBasicTable.selectThisRow"
            >
              <Component />
            </OuiI18n>
          </OuiTableRowCellCheckbox>
          <OuiTableRowCell
            align="left"
            key="_data_column_name_2_0"
            mobileOptions={
              Object {
                "header": "Name",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={true}
          >
            name2
          </OuiTableRowCell>
          <OuiTableRowCell
            align="right"
            hasActions={true}
            key="record_actions_2_1"
            showOnHover={true}
            textOnly={false}
          >
            <ExpandedItemActions
              actionEnabled={[Function]}
              actions={
                Array [
                  Object {
                    "description": "edit",
                    "name": "Edit",
                    "onClick": [Function],
                    "type": "button",
                  },
                ]
              }
              item={
                Object {
                  "id": "2",
                  "name": "name2",
                }
              }
              itemId="2"
            />
          </OuiTableRowCell>
        </OuiTableRow>
        <OuiTableRow
          hasActions={true}
          isSelectable={true}
          isSelected={false}
        >
          <OuiTableRowCellCheckbox
            key="_selection_column_3"
          >
            <OuiI18n
              default="Select this row"
              token="ouiBasicTable.selectThisRow"
            >
              <Component />
            </OuiI18n>
          </OuiTableRowCellCheckbox>
          <OuiTableRowCell
            align="left"
            key="_data_column_name_3_0"
            mobileOptions={
              Object {
                "header": "Name",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={true}
          >
            name3
          </OuiTableRowCell>
          <OuiTableRowCell
            align="right"
            hasActions={true}
            key="record_actions_3_1"
            showOnHover={true}
            textOnly={false}
          >
            <ExpandedItemActions
              actionEnabled={[Function]}
              actions={
                Array [
                  Object {
                    "description": "edit",
                    "name": "Edit",
                    "onClick": [Function],
                    "type": "button",
                  },
                ]
              }
              item={
                Object {
                  "id": "3",
                  "name": "name3",
                }
              }
              itemId="3"
            />
          </OuiTableRowCell>
        </OuiTableRow>
      </OuiTableBody>
    </OuiTable>
  </div>
  <PaginationBar
    aria-controls="__table_generated-id"
    onPageChange={[Function]}
    onPageSizeChange={[Function]}
    pagination={
      Object {
        "pageIndex": 0,
        "pageSize": 3,
        "totalItemCount": 5,
      }
    }
  />
</div>
`;

exports[`OuiBasicTable with pagination, selection, sorting and column dataType 1`] = `
<div
  className="ouiBasicTable"
>
  <div>
    <OuiTableHeaderMobile>
      <OuiFlexGroup
        alignItems="baseline"
        justifyContent="spaceBetween"
        responsive={false}
      >
        <OuiFlexItem
          grow={false}
        >
          <OuiI18n
            default="Select all rows"
            token="ouiBasicTable.selectAllRows"
          >
            <Component />
          </OuiI18n>
        </OuiFlexItem>
        <OuiFlexItem
          grow={false}
        >
          <OuiTableSortMobile
            items={
              Array [
                Object {
                  "isSortAscending": true,
                  "isSorted": true,
                  "key": "_data_s_count_0",
                  "name": "Count",
                  "onSort": [Function],
                },
              ]
            }
          />
        </OuiFlexItem>
      </OuiFlexGroup>
    </OuiTableHeaderMobile>
    <OuiTable
      id="__table_generated-id"
      responsive={true}
      tableLayout="fixed"
    >
      <OuiScreenReaderOnly>
        <caption
          className="ouiTableCaption"
        >
          <OuiDelayRender
            delay={500}
          >
            <OuiI18n
              default="This table contains {itemCount} rows out of {totalItemCount} rows; Page {page} of {pageCount}."
              token="ouiBasicTable.tableAutoCaptionWithPagination"
              values={
                Object {
                  "itemCount": 3,
                  "page": 1,
                  "pageCount": 2,
                  "totalItemCount": 5,
                }
              }
            />
          </OuiDelayRender>
        </caption>
      </OuiScreenReaderOnly>
      <OuiTableHeader>
        <OuiTableHeaderCellCheckbox
          key="_selection_column_h"
        >
          <OuiI18n
            default="Select all rows"
            token="ouiBasicTable.selectAllRows"
          >
            <Component />
          </OuiI18n>
        </OuiTableHeaderCellCheckbox>
        <OuiTableHeaderCell
          align="right"
          data-test-subj="tableHeaderCell_count_0"
          description="description of count"
          isSortAscending={true}
          isSorted={true}
          key="_data_h_count_0"
          onSort={[Function]}
        >
          Count
        </OuiTableHeaderCell>
      </OuiTableHeader>
      <OuiTableBody
        bodyRef={[Function]}
      >
        <OuiTableRow
          isSelectable={true}
          isSelected={false}
        >
          <OuiTableRowCellCheckbox
            key="_selection_column_1"
          >
            <OuiI18n
              default="Select this row"
              token="ouiBasicTable.selectThisRow"
            >
              <Component />
            </OuiI18n>
          </OuiTableRowCellCheckbox>
          <OuiTableRowCell
            align="right"
            key="_data_column_count_1_0"
            mobileOptions={
              Object {
                "header": "Count",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={true}
          >
            1
          </OuiTableRowCell>
        </OuiTableRow>
        <OuiTableRow
          isSelectable={true}
          isSelected={false}
        >
          <OuiTableRowCellCheckbox
            key="_selection_column_2"
          >
            <OuiI18n
              default="Select this row"
              token="ouiBasicTable.selectThisRow"
            >
              <Component />
            </OuiI18n>
          </OuiTableRowCellCheckbox>
          <OuiTableRowCell
            align="right"
            key="_data_column_count_2_0"
            mobileOptions={
              Object {
                "header": "Count",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={true}
          >
            2
          </OuiTableRowCell>
        </OuiTableRow>
        <OuiTableRow
          isSelectable={true}
          isSelected={false}
        >
          <OuiTableRowCellCheckbox
            key="_selection_column_3"
          >
            <OuiI18n
              default="Select this row"
              token="ouiBasicTable.selectThisRow"
            >
              <Component />
            </OuiI18n>
          </OuiTableRowCellCheckbox>
          <OuiTableRowCell
            align="right"
            key="_data_column_count_3_0"
            mobileOptions={
              Object {
                "header": "Count",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={true}
          >
            3
          </OuiTableRowCell>
        </OuiTableRow>
      </OuiTableBody>
    </OuiTable>
  </div>
  <PaginationBar
    aria-controls="__table_generated-id"
    onPageChange={[Function]}
    onPageSizeChange={[Function]}
    pagination={
      Object {
        "pageIndex": 0,
        "pageSize": 3,
        "totalItemCount": 5,
      }
    }
  />
</div>
`;

exports[`OuiBasicTable with pagination, selection, sorting and column renderer 1`] = `
<div
  className="ouiBasicTable"
>
  <div>
    <OuiTableHeaderMobile>
      <OuiFlexGroup
        alignItems="baseline"
        justifyContent="spaceBetween"
        responsive={false}
      >
        <OuiFlexItem
          grow={false}
        >
          <OuiI18n
            default="Select all rows"
            token="ouiBasicTable.selectAllRows"
          >
            <Component />
          </OuiI18n>
        </OuiFlexItem>
        <OuiFlexItem
          grow={false}
        >
          <OuiTableSortMobile
            items={
              Array [
                Object {
                  "isSortAscending": true,
                  "isSorted": true,
                  "key": "_data_s_name_0",
                  "name": "Name",
                  "onSort": [Function],
                },
              ]
            }
          />
        </OuiFlexItem>
      </OuiFlexGroup>
    </OuiTableHeaderMobile>
    <OuiTable
      id="__table_generated-id"
      responsive={true}
      tableLayout="fixed"
    >
      <OuiScreenReaderOnly>
        <caption
          className="ouiTableCaption"
        >
          <OuiDelayRender
            delay={500}
          >
            <OuiI18n
              default="This table contains {itemCount} rows out of {totalItemCount} rows; Page {page} of {pageCount}."
              token="ouiBasicTable.tableAutoCaptionWithPagination"
              values={
                Object {
                  "itemCount": 3,
                  "page": 1,
                  "pageCount": 2,
                  "totalItemCount": 5,
                }
              }
            />
          </OuiDelayRender>
        </caption>
      </OuiScreenReaderOnly>
      <OuiTableHeader>
        <OuiTableHeaderCellCheckbox
          key="_selection_column_h"
        >
          <OuiI18n
            default="Select all rows"
            token="ouiBasicTable.selectAllRows"
          >
            <Component />
          </OuiI18n>
        </OuiTableHeaderCellCheckbox>
        <OuiTableHeaderCell
          align="left"
          data-test-subj="tableHeaderCell_name_0"
          description="description"
          isSortAscending={true}
          isSorted={true}
          key="_data_h_name_0"
          onSort={[Function]}
        >
          Name
        </OuiTableHeaderCell>
      </OuiTableHeader>
      <OuiTableBody
        bodyRef={[Function]}
      >
        <OuiTableRow
          isSelectable={true}
          isSelected={false}
        >
          <OuiTableRowCellCheckbox
            key="_selection_column_1"
          >
            <OuiI18n
              default="Select this row"
              token="ouiBasicTable.selectThisRow"
            >
              <Component />
            </OuiI18n>
          </OuiTableRowCellCheckbox>
          <OuiTableRowCell
            align="left"
            key="_data_column_name_1_0"
            mobileOptions={
              Object {
                "header": "Name",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={false}
          >
            NAME1
          </OuiTableRowCell>
        </OuiTableRow>
        <OuiTableRow
          isSelectable={true}
          isSelected={false}
        >
          <OuiTableRowCellCheckbox
            key="_selection_column_2"
          >
            <OuiI18n
              default="Select this row"
              token="ouiBasicTable.selectThisRow"
            >
              <Component />
            </OuiI18n>
          </OuiTableRowCellCheckbox>
          <OuiTableRowCell
            align="left"
            key="_data_column_name_2_0"
            mobileOptions={
              Object {
                "header": "Name",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={false}
          >
            NAME2
          </OuiTableRowCell>
        </OuiTableRow>
        <OuiTableRow
          isSelectable={true}
          isSelected={false}
        >
          <OuiTableRowCellCheckbox
            key="_selection_column_3"
          >
            <OuiI18n
              default="Select this row"
              token="ouiBasicTable.selectThisRow"
            >
              <Component />
            </OuiI18n>
          </OuiTableRowCellCheckbox>
          <OuiTableRowCell
            align="left"
            key="_data_column_name_3_0"
            mobileOptions={
              Object {
                "header": "Name",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={false}
          >
            NAME3
          </OuiTableRowCell>
        </OuiTableRow>
      </OuiTableBody>
    </OuiTable>
  </div>
  <PaginationBar
    aria-controls="__table_generated-id"
    onPageChange={[Function]}
    onPageSizeChange={[Function]}
    pagination={
      Object {
        "pageIndex": 0,
        "pageSize": 3,
        "totalItemCount": 5,
      }
    }
  />
</div>
`;

exports[`OuiBasicTable with pagination, selection, sorting and multiple record actions 1`] = `
<div
  className="ouiBasicTable"
>
  <div>
    <OuiTableHeaderMobile>
      <OuiFlexGroup
        alignItems="baseline"
        justifyContent="spaceBetween"
        responsive={false}
      >
        <OuiFlexItem
          grow={false}
        >
          <OuiI18n
            default="Select all rows"
            token="ouiBasicTable.selectAllRows"
          >
            <Component />
          </OuiI18n>
        </OuiFlexItem>
        <OuiFlexItem
          grow={false}
        >
          <OuiTableSortMobile
            items={
              Array [
                Object {
                  "isSortAscending": true,
                  "isSorted": true,
                  "key": "_data_s_name_0",
                  "name": "Name",
                  "onSort": [Function],
                },
              ]
            }
          />
        </OuiFlexItem>
      </OuiFlexGroup>
    </OuiTableHeaderMobile>
    <OuiTable
      id="__table_generated-id"
      responsive={true}
      tableLayout="fixed"
    >
      <OuiScreenReaderOnly>
        <caption
          className="ouiTableCaption"
        >
          <OuiDelayRender
            delay={500}
          >
            <OuiI18n
              default="This table contains {itemCount} rows out of {totalItemCount} rows; Page {page} of {pageCount}."
              token="ouiBasicTable.tableAutoCaptionWithPagination"
              values={
                Object {
                  "itemCount": 3,
                  "page": 1,
                  "pageCount": 2,
                  "totalItemCount": 5,
                }
              }
            />
          </OuiDelayRender>
        </caption>
      </OuiScreenReaderOnly>
      <OuiTableHeader>
        <OuiTableHeaderCellCheckbox
          key="_selection_column_h"
        >
          <OuiI18n
            default="Select all rows"
            token="ouiBasicTable.selectAllRows"
          >
            <Component />
          </OuiI18n>
        </OuiTableHeaderCellCheckbox>
        <OuiTableHeaderCell
          align="left"
          data-test-subj="tableHeaderCell_name_0"
          description="description"
          isSortAscending={true}
          isSorted={true}
          key="_data_h_name_0"
          onSort={[Function]}
        >
          Name
        </OuiTableHeaderCell>
        <OuiTableHeaderCell
          align="right"
          key="_actions_h_1"
        >
          Actions
        </OuiTableHeaderCell>
      </OuiTableHeader>
      <OuiTableBody
        bodyRef={[Function]}
      >
        <OuiTableRow
          hasActions={true}
          isSelectable={true}
          isSelected={false}
        >
          <OuiTableRowCellCheckbox
            key="_selection_column_1"
          >
            <OuiI18n
              default="Select this row"
              token="ouiBasicTable.selectThisRow"
            >
              <Component />
            </OuiI18n>
          </OuiTableRowCellCheckbox>
          <OuiTableRowCell
            align="left"
            key="_data_column_name_1_0"
            mobileOptions={
              Object {
                "header": "Name",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={true}
          >
            name1
          </OuiTableRowCell>
          <OuiTableRowCell
            align="right"
            hasActions={true}
            key="record_actions_1_1"
            showOnHover={true}
            textOnly={false}
          >
            <ExpandedItemActions
              actionEnabled={[Function]}
              actions={
                Array [
                  Object {
                    "description": "edit",
                    "name": "Edit",
                    "onClick": [Function],
                    "type": "button",
                  },
                  Object {
                    "description": "delete",
                    "name": "Delete",
                    "onClick": [Function],
                    "type": "button",
                  },
                ]
              }
              item={
                Object {
                  "id": "1",
                  "name": "name1",
                }
              }
              itemId="1"
            />
          </OuiTableRowCell>
        </OuiTableRow>
        <OuiTableRow
          hasActions={true}
          isSelectable={true}
          isSelected={false}
        >
          <OuiTableRowCellCheckbox
            key="_selection_column_2"
          >
            <OuiI18n
              default="Select this row"
              token="ouiBasicTable.selectThisRow"
            >
              <Component />
            </OuiI18n>
          </OuiTableRowCellCheckbox>
          <OuiTableRowCell
            align="left"
            key="_data_column_name_2_0"
            mobileOptions={
              Object {
                "header": "Name",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={true}
          >
            name2
          </OuiTableRowCell>
          <OuiTableRowCell
            align="right"
            hasActions={true}
            key="record_actions_2_1"
            showOnHover={true}
            textOnly={false}
          >
            <ExpandedItemActions
              actionEnabled={[Function]}
              actions={
                Array [
                  Object {
                    "description": "edit",
                    "name": "Edit",
                    "onClick": [Function],
                    "type": "button",
                  },
                  Object {
                    "description": "delete",
                    "name": "Delete",
                    "onClick": [Function],
                    "type": "button",
                  },
                ]
              }
              item={
                Object {
                  "id": "2",
                  "name": "name2",
                }
              }
              itemId="2"
            />
          </OuiTableRowCell>
        </OuiTableRow>
        <OuiTableRow
          hasActions={true}
          isSelectable={true}
          isSelected={false}
        >
          <OuiTableRowCellCheckbox
            key="_selection_column_3"
          >
            <OuiI18n
              default="Select this row"
              token="ouiBasicTable.selectThisRow"
            >
              <Component />
            </OuiI18n>
          </OuiTableRowCellCheckbox>
          <OuiTableRowCell
            align="left"
            key="_data_column_name_3_0"
            mobileOptions={
              Object {
                "header": "Name",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={true}
          >
            name3
          </OuiTableRowCell>
          <OuiTableRowCell
            align="right"
            hasActions={true}
            key="record_actions_3_1"
            showOnHover={true}
            textOnly={false}
          >
            <ExpandedItemActions
              actionEnabled={[Function]}
              actions={
                Array [
                  Object {
                    "description": "edit",
                    "name": "Edit",
                    "onClick": [Function],
                    "type": "button",
                  },
                  Object {
                    "description": "delete",
                    "name": "Delete",
                    "onClick": [Function],
                    "type": "button",
                  },
                ]
              }
              item={
                Object {
                  "id": "3",
                  "name": "name3",
                }
              }
              itemId="3"
            />
          </OuiTableRowCell>
        </OuiTableRow>
      </OuiTableBody>
    </OuiTable>
  </div>
  <PaginationBar
    aria-controls="__table_generated-id"
    onPageChange={[Function]}
    onPageSizeChange={[Function]}
    pagination={
      Object {
        "pageIndex": 0,
        "pageSize": 3,
        "totalItemCount": 5,
      }
    }
  />
</div>
`;

exports[`OuiBasicTable with pagination, selection, sorting, column renderer and column dataType 1`] = `
<div
  className="ouiBasicTable"
>
  <div>
    <OuiTableHeaderMobile>
      <OuiFlexGroup
        alignItems="baseline"
        justifyContent="spaceBetween"
        responsive={false}
      >
        <OuiFlexItem
          grow={false}
        >
          <OuiI18n
            default="Select all rows"
            token="ouiBasicTable.selectAllRows"
          >
            <Component />
          </OuiI18n>
        </OuiFlexItem>
        <OuiFlexItem
          grow={false}
        >
          <OuiTableSortMobile
            items={
              Array [
                Object {
                  "isSortAscending": true,
                  "isSorted": true,
                  "key": "_data_s_count_0",
                  "name": "Count",
                  "onSort": [Function],
                },
              ]
            }
          />
        </OuiFlexItem>
      </OuiFlexGroup>
    </OuiTableHeaderMobile>
    <OuiTable
      id="__table_generated-id"
      responsive={true}
      tableLayout="fixed"
    >
      <OuiScreenReaderOnly>
        <caption
          className="ouiTableCaption"
        >
          <OuiDelayRender
            delay={500}
          >
            <OuiI18n
              default="This table contains {itemCount} rows out of {totalItemCount} rows; Page {page} of {pageCount}."
              token="ouiBasicTable.tableAutoCaptionWithPagination"
              values={
                Object {
                  "itemCount": 3,
                  "page": 1,
                  "pageCount": 2,
                  "totalItemCount": 5,
                }
              }
            />
          </OuiDelayRender>
        </caption>
      </OuiScreenReaderOnly>
      <OuiTableHeader>
        <OuiTableHeaderCellCheckbox
          key="_selection_column_h"
        >
          <OuiI18n
            default="Select all rows"
            token="ouiBasicTable.selectAllRows"
          >
            <Component />
          </OuiI18n>
        </OuiTableHeaderCellCheckbox>
        <OuiTableHeaderCell
          align="right"
          data-test-subj="tableHeaderCell_count_0"
          description="description of count"
          isSortAscending={true}
          isSorted={true}
          key="_data_h_count_0"
          onSort={[Function]}
        >
          Count
        </OuiTableHeaderCell>
      </OuiTableHeader>
      <OuiTableBody
        bodyRef={[Function]}
      >
        <OuiTableRow
          isSelectable={true}
          isSelected={false}
        >
          <OuiTableRowCellCheckbox
            key="_selection_column_1"
          >
            <OuiI18n
              default="Select this row"
              token="ouiBasicTable.selectThisRow"
            >
              <Component />
            </OuiI18n>
          </OuiTableRowCellCheckbox>
          <OuiTableRowCell
            align="right"
            key="_data_column_count_1_0"
            mobileOptions={
              Object {
                "header": "Count",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={false}
          >
            x
          </OuiTableRowCell>
        </OuiTableRow>
        <OuiTableRow
          isSelectable={true}
          isSelected={false}
        >
          <OuiTableRowCellCheckbox
            key="_selection_column_2"
          >
            <OuiI18n
              default="Select this row"
              token="ouiBasicTable.selectThisRow"
            >
              <Component />
            </OuiI18n>
          </OuiTableRowCellCheckbox>
          <OuiTableRowCell
            align="right"
            key="_data_column_count_2_0"
            mobileOptions={
              Object {
                "header": "Count",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={false}
          >
            xx
          </OuiTableRowCell>
        </OuiTableRow>
        <OuiTableRow
          isSelectable={true}
          isSelected={false}
        >
          <OuiTableRowCellCheckbox
            key="_selection_column_3"
          >
            <OuiI18n
              default="Select this row"
              token="ouiBasicTable.selectThisRow"
            >
              <Component />
            </OuiI18n>
          </OuiTableRowCellCheckbox>
          <OuiTableRowCell
            align="right"
            key="_data_column_count_3_0"
            mobileOptions={
              Object {
                "header": "Count",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={false}
          >
            xxx
          </OuiTableRowCell>
        </OuiTableRow>
      </OuiTableBody>
    </OuiTable>
  </div>
  <PaginationBar
    aria-controls="__table_generated-id"
    onPageChange={[Function]}
    onPageSizeChange={[Function]}
    pagination={
      Object {
        "pageIndex": 0,
        "pageSize": 3,
        "totalItemCount": 5,
      }
    }
  />
</div>
`;

exports[`OuiBasicTable with sortable columns and sorting disabled 1`] = `
<div
  className="ouiBasicTable"
>
  <div>
    <OuiTableHeaderMobile>
      <OuiFlexGroup
        alignItems="baseline"
        justifyContent="spaceBetween"
        responsive={false}
      >
        <OuiFlexItem
          grow={false}
        />
        <OuiFlexItem
          grow={false}
        />
      </OuiFlexGroup>
    </OuiTableHeaderMobile>
    <OuiTable
      id="__table_generated-id"
      responsive={true}
      tableLayout="fixed"
    >
      <OuiScreenReaderOnly>
        <caption
          className="ouiTableCaption"
        >
          <OuiDelayRender
            delay={500}
          >
            <OuiI18n
              default="This table contains {itemCount} rows."
              token="ouiBasicTable.tableAutoCaptionWithoutPagination"
              values={
                Object {
                  "itemCount": 3,
                }
              }
            />
          </OuiDelayRender>
        </caption>
      </OuiScreenReaderOnly>
      <OuiTableHeader>
        <OuiTableHeaderCell
          align="left"
          data-test-subj="tableHeaderCell_name_0"
          description="description"
          key="_data_h_name_0"
        >
          Name
        </OuiTableHeaderCell>
      </OuiTableHeader>
      <OuiTableBody
        bodyRef={[Function]}
      >
        <OuiTableRow
          isSelected={false}
        >
          <OuiTableRowCell
            align="left"
            key="_data_column_name_0_0"
            mobileOptions={
              Object {
                "header": "Name",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={true}
          >
            name1
          </OuiTableRowCell>
        </OuiTableRow>
        <OuiTableRow
          isSelected={false}
        >
          <OuiTableRowCell
            align="left"
            key="_data_column_name_1_0"
            mobileOptions={
              Object {
                "header": "Name",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={true}
          >
            name2
          </OuiTableRowCell>
        </OuiTableRow>
        <OuiTableRow
          isSelected={false}
        >
          <OuiTableRowCell
            align="left"
            key="_data_column_name_2_0"
            mobileOptions={
              Object {
                "header": "Name",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={true}
          >
            name3
          </OuiTableRowCell>
        </OuiTableRow>
      </OuiTableBody>
    </OuiTable>
  </div>
</div>
`;

exports[`OuiBasicTable with sorting 1`] = `
<div
  className="ouiBasicTable"
>
  <div>
    <OuiTableHeaderMobile>
      <OuiFlexGroup
        alignItems="baseline"
        justifyContent="spaceBetween"
        responsive={false}
      >
        <OuiFlexItem
          grow={false}
        />
        <OuiFlexItem
          grow={false}
        >
          <OuiTableSortMobile
            items={
              Array [
                Object {
                  "isSortAscending": true,
                  "isSorted": true,
                  "key": "_data_s_name_0",
                  "name": "Name",
                  "onSort": [Function],
                },
              ]
            }
          />
        </OuiFlexItem>
      </OuiFlexGroup>
    </OuiTableHeaderMobile>
    <OuiTable
      id="__table_generated-id"
      responsive={true}
      tableLayout="fixed"
    >
      <OuiScreenReaderOnly>
        <caption
          className="ouiTableCaption"
        >
          <OuiDelayRender
            delay={500}
          >
            <OuiI18n
              default="This table contains {itemCount} rows."
              token="ouiBasicTable.tableAutoCaptionWithoutPagination"
              values={
                Object {
                  "itemCount": 3,
                }
              }
            />
          </OuiDelayRender>
        </caption>
      </OuiScreenReaderOnly>
      <OuiTableHeader>
        <OuiTableHeaderCell
          align="left"
          data-test-subj="tableHeaderCell_name_0"
          description="description"
          isSortAscending={true}
          isSorted={true}
          key="_data_h_name_0"
          onSort={[Function]}
        >
          Name
        </OuiTableHeaderCell>
      </OuiTableHeader>
      <OuiTableBody
        bodyRef={[Function]}
      >
        <OuiTableRow
          isSelected={false}
        >
          <OuiTableRowCell
            align="left"
            key="_data_column_name_0_0"
            mobileOptions={
              Object {
                "header": "Name",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={true}
          >
            name1
          </OuiTableRowCell>
        </OuiTableRow>
        <OuiTableRow
          isSelected={false}
        >
          <OuiTableRowCell
            align="left"
            key="_data_column_name_1_0"
            mobileOptions={
              Object {
                "header": "Name",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={true}
          >
            name2
          </OuiTableRowCell>
        </OuiTableRow>
        <OuiTableRow
          isSelected={false}
        >
          <OuiTableRowCell
            align="left"
            key="_data_column_name_2_0"
            mobileOptions={
              Object {
                "header": "Name",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={true}
          >
            name3
          </OuiTableRowCell>
        </OuiTableRow>
      </OuiTableBody>
    </OuiTable>
  </div>
</div>
`;

exports[`OuiBasicTable with sorting enabled and enable all columns for sorting 1`] = `
<div
  className="ouiBasicTable"
>
  <div>
    <OuiTableHeaderMobile>
      <OuiFlexGroup
        alignItems="baseline"
        justifyContent="spaceBetween"
        responsive={false}
      >
        <OuiFlexItem
          grow={false}
        />
        <OuiFlexItem
          grow={false}
        >
          <OuiTableSortMobile
            items={
              Array [
                Object {
                  "isSortAscending": true,
                  "isSorted": true,
                  "key": "_data_s_name_0",
                  "name": "Name",
                  "onSort": [Function],
                },
              ]
            }
          />
        </OuiFlexItem>
      </OuiFlexGroup>
    </OuiTableHeaderMobile>
    <OuiTable
      id="__table_generated-id"
      responsive={true}
      tableLayout="fixed"
    >
      <OuiScreenReaderOnly>
        <caption
          className="ouiTableCaption"
        >
          <OuiDelayRender
            delay={500}
          >
            <OuiI18n
              default="This table contains {itemCount} rows."
              token="ouiBasicTable.tableAutoCaptionWithoutPagination"
              values={
                Object {
                  "itemCount": 3,
                }
              }
            />
          </OuiDelayRender>
        </caption>
      </OuiScreenReaderOnly>
      <OuiTableHeader>
        <OuiTableHeaderCell
          align="left"
          data-test-subj="tableHeaderCell_name_0"
          description="description"
          isSortAscending={true}
          isSorted={true}
          key="_data_h_name_0"
          onSort={[Function]}
        >
          Name
        </OuiTableHeaderCell>
      </OuiTableHeader>
      <OuiTableBody
        bodyRef={[Function]}
      >
        <OuiTableRow
          isSelected={false}
        >
          <OuiTableRowCell
            align="left"
            key="_data_column_name_0_0"
            mobileOptions={
              Object {
                "header": "Name",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={true}
          >
            name1
          </OuiTableRowCell>
        </OuiTableRow>
        <OuiTableRow
          isSelected={false}
        >
          <OuiTableRowCell
            align="left"
            key="_data_column_name_1_0"
            mobileOptions={
              Object {
                "header": "Name",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={true}
          >
            name2
          </OuiTableRowCell>
        </OuiTableRow>
        <OuiTableRow
          isSelected={false}
        >
          <OuiTableRowCell
            align="left"
            key="_data_column_name_2_0"
            mobileOptions={
              Object {
                "header": "Name",
                "render": undefined,
              }
            }
            setScopeRow={false}
            textOnly={true}
          >
            name3
          </OuiTableRowCell>
        </OuiTableRow>
      </OuiTableBody>
    </OuiTable>
  </div>
</div>
`;