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

exports[`ResourceTable no search renders as expected 1`] = `
Array [
  <div
    className="bx--data-table-v2-container"
    id="table-container"
  >
    <section
      aria-label="search"
      className="bx--table-toolbar"
      role="region"
    >
      <div
        className="bx--toolbar-search-container"
      >
        <div
          aria-labelledby="search-label"
          className="bx--search bx--search--sm bx--search--light"
          role="search"
        >
          <svg
            alt="Filter table"
            aria-label="Filter table"
            className="bx--search-magnifier"
            fillRule="evenodd"
            height="16"
            role="img"
            viewBox="0 0 16 16"
            width="16"
          >
            <title>
              Filter table
            </title>
            <path
              d="M6.5 12a5.5 5.5 0 1 0 0-11 5.5 5.5 0 0 0 0 11zm4.936-1.27l4.563 4.557-.707.708-4.563-4.558a6.5 6.5 0 1 1 .707-.707z"
            />
          </svg>
          <label
            className="bx--label"
            htmlFor="search"
            id="search-label"
          >
            Filter table
          </label>
          <input
            aria-label="search"
            className="bx--search-input"
            id="search"
            onChange={[Function]}
            placeholder="Search policies"
            type="text"
            value=""
          />
          <button
            className="bx--search-close bx--search-close--hidden"
            onClick={[Function]}
            type="button"
          >
            <svg
              alt="Provide a description that will be used as the title"
              aria-label="Provide a description that will be used as the title"
              fillRule="evenodd"
              height="16"
              role="img"
              viewBox="0 0 16 16"
              width="16"
            >
              <title>
                Provide a description that will be used as the title
              </title>
              <path
                d="M8 6.586L5.879 4.464 4.464 5.88 6.586 8l-2.122 2.121 1.415 1.415L8 9.414l2.121 2.122 1.415-1.415L9.414 8l2.122-2.121-1.415-1.415L8 6.586zM8 16A8 8 0 1 1 8 0a8 8 0 0 1 0 16z"
              />
            </svg>
          </button>
        </div>
      </div>
      <div
        className="bx--toolbar-content"
      />
    </section>
    <table
      className="bx--data-table-v2 resource-table bx--data-table-v2--zebra"
    >
      <thead>
        <tr>
          <th
            scope="col"
          />
          <th
            scope="col"
          >
            <div
              className="bx--table-sort-v2 bx--table-sort-v2--ascending"
              data-default-key="metadata.name"
              data-key="metadata.name"
              onClick={[MockFunction]}
              onKeyPress={[MockFunction]}
              role="button"
              tabIndex={0}
              title="Sort rows by this header in ascending order."
            >
              <span
                className="bx--table-header-label"
              >
                Policy name
              </span>
              
              <svg
                alt="Sort rows by this header in ascending order."
                aria-label="Sort rows by this header in ascending order."
                className="bx--table-sort-v2__icon"
                fillRule="evenodd"
                height="5"
                name="caret--down"
                role="img"
                viewBox="0 0 10 5"
                width="10"
              >
                <title>
                  Sort rows by this header in ascending order.
                </title>
                <path
                  d="M0 0l5 4.998L10 0z"
                />
              </svg>
            </div>
          </th>
          <th
            scope="col"
          >
            <div
              className="bx--table-sort-v2 bx--table-sort-v2--ascending"
              data-default-key="metadata.name"
              data-key="remediation"
              onClick={[MockFunction]}
              onKeyPress={[MockFunction]}
              role="button"
              tabIndex={0}
              title="Sort rows by this header in ascending order."
            >
              <span
                className="bx--table-header-label"
              >
                Remediation
              </span>
              
              <svg
                alt="Sort rows by this header in ascending order."
                aria-label="Sort rows by this header in ascending order."
                className="bx--table-sort-v2__icon"
                fillRule="evenodd"
                height="5"
                name="caret--down"
                role="img"
                viewBox="0 0 10 5"
                width="10"
              >
                <title>
                  Sort rows by this header in ascending order.
                </title>
                <path
                  d="M0 0l5 4.998L10 0z"
                />
              </svg>
            </div>
          </th>
          <th
            scope="col"
          >
            <div
              className="bx--table-sort-v2 bx--table-sort-v2--ascending"
              data-default-key="metadata.name"
              data-key="clusterCompliant"
              onClick={[MockFunction]}
              onKeyPress={[MockFunction]}
              role="button"
              tabIndex={0}
              title="Sort rows by this header in ascending order."
            >
              <span
                className="bx--table-header-label"
              >
                Cluster violations
              </span>
              
              <svg
                alt="Sort rows by this header in ascending order."
                aria-label="Sort rows by this header in ascending order."
                className="bx--table-sort-v2__icon"
                fillRule="evenodd"
                height="5"
                name="caret--down"
                role="img"
                viewBox="0 0 10 5"
                width="10"
              >
                <title>
                  Sort rows by this header in ascending order.
                </title>
                <path
                  d="M0 0l5 4.998L10 0z"
                />
              </svg>
            </div>
          </th>
          <th
            scope="col"
          >
            <div
              className="bx--table-sort-v2 bx--table-sort-v2--ascending"
              data-default-key="metadata.name"
              data-key="metadata.annotations[\\"policy.open-cluster-management.io/standards\\"]"
              onClick={[MockFunction]}
              onKeyPress={[MockFunction]}
              role="button"
              tabIndex={0}
              title="Sort rows by this header in ascending order."
            >
              <span
                className="bx--table-header-label"
              >
                Standards
              </span>
              
              <svg
                alt="Sort rows by this header in ascending order."
                aria-label="Sort rows by this header in ascending order."
                className="bx--table-sort-v2__icon"
                fillRule="evenodd"
                height="5"
                name="caret--down"
                role="img"
                viewBox="0 0 10 5"
                width="10"
              >
                <title>
                  Sort rows by this header in ascending order.
                </title>
                <path
                  d="M0 0l5 4.998L10 0z"
                />
              </svg>
            </div>
          </th>
          <th
            scope="col"
          >
            <div
              className="bx--table-sort-v2 bx--table-sort-v2--ascending"
              data-default-key="metadata.name"
              data-key="metadata.annotations[\\"policy.open-cluster-management.io/controls\\"]"
              onClick={[MockFunction]}
              onKeyPress={[MockFunction]}
              role="button"
              tabIndex={0}
              title="Sort rows by this header in ascending order."
            >
              <span
                className="bx--table-header-label"
              >
                Controls
              </span>
              
              <svg
                alt="Sort rows by this header in ascending order."
                aria-label="Sort rows by this header in ascending order."
                className="bx--table-sort-v2__icon"
                fillRule="evenodd"
                height="5"
                name="caret--down"
                role="img"
                viewBox="0 0 10 5"
                width="10"
              >
                <title>
                  Sort rows by this header in ascending order.
                </title>
                <path
                  d="M0 0l5 4.998L10 0z"
                />
              </svg>
            </div>
          </th>
          <th
            scope="col"
          >
            <div
              className="bx--table-sort-v2 bx--table-sort-v2--ascending"
              data-default-key="metadata.name"
              data-key="metadata.annotations[\\"policy.open-cluster-management.io/categories\\"]"
              onClick={[MockFunction]}
              onKeyPress={[MockFunction]}
              role="button"
              tabIndex={0}
              title="Sort rows by this header in ascending order."
            >
              <span
                className="bx--table-header-label"
              >
                Categories
              </span>
              
              <svg
                alt="Sort rows by this header in ascending order."
                aria-label="Sort rows by this header in ascending order."
                className="bx--table-sort-v2__icon"
                fillRule="evenodd"
                height="5"
                name="caret--down"
                role="img"
                viewBox="0 0 10 5"
                width="10"
              >
                <title>
                  Sort rows by this header in ascending order.
                </title>
                <path
                  d="M0 0l5 4.998L10 0z"
                />
              </svg>
            </div>
          </th>
          <th
            scope="col"
          />
        </tr>
      </thead>
      <tbody>
        <tr
          aria-hidden={false}
          className="bx--parent-row-v2"
          data-parent-row={true}
          data-row-name="1569249226915-policy-test"
          disabled={false}
        >
          <td
            className="bx--table-expand-v2"
            headers="expand"
          >
            <button
              aria-label="TableExpandRow"
              className="bx--table-expand-v2__button"
              onClick={[Function]}
            >
              <svg
                alt="Provide a description that will be used as the title"
                aria-label="Provide a description that will be used as the title"
                className="bx--table-expand-v2__svg"
                fillRule="evenodd"
                height="12"
                role="img"
                viewBox="0 0 7 12"
                width="7"
              >
                <title>
                  Provide a description that will be used as the title
                </title>
                <path
                  d="M5.569 5.994L0 .726.687 0l6.336 5.994-6.335 6.002L0 11.27z"
                />
              </svg>
            </button>
          </td>
          <td>
            1569249226915-policy-test
          </td>
          <td>
            inform
          </td>
          <td>
            2/2
          </td>
          <td>
            NIST
          </td>
          <td>
            VA
          </td>
          <td>
            SystemAndInformationIntegrity
          </td>
          <td />
        </tr>
        <tr
          aria-hidden={false}
          className="bx--parent-row-v2"
          data-parent-row={true}
          data-row-name="policy-auditpolicy"
          disabled={false}
        >
          <td
            className="bx--table-expand-v2"
            headers="expand"
          >
            <button
              aria-label="TableExpandRow"
              className="bx--table-expand-v2__button"
              onClick={[Function]}
            >
              <svg
                alt="Provide a description that will be used as the title"
                aria-label="Provide a description that will be used as the title"
                className="bx--table-expand-v2__svg"
                fillRule="evenodd"
                height="12"
                role="img"
                viewBox="0 0 7 12"
                width="7"
              >
                <title>
                  Provide a description that will be used as the title
                </title>
                <path
                  d="M5.569 5.994L0 .726.687 0l6.336 5.994-6.335 6.002L0 11.27z"
                />
              </svg>
            </button>
          </td>
          <td>
            policy-auditpolicy
          </td>
          <td>
            inform
          </td>
          <td>
            0/1
          </td>
          <td>
            FISMA
          </td>
          <td>
            secretEncryption
          </td>
          <td>
            SystemAndCommunicationsProtections
          </td>
          <td />
        </tr>
        <tr
          aria-hidden={false}
          className="bx--parent-row-v2"
          data-parent-row={true}
          data-row-name="policy-certificatepolicy"
          disabled={false}
        >
          <td
            className="bx--table-expand-v2"
            headers="expand"
          >
            <button
              aria-label="TableExpandRow"
              className="bx--table-expand-v2__button"
              onClick={[Function]}
            >
              <svg
                alt="Provide a description that will be used as the title"
                aria-label="Provide a description that will be used as the title"
                className="bx--table-expand-v2__svg"
                fillRule="evenodd"
                height="12"
                role="img"
                viewBox="0 0 7 12"
                width="7"
              >
                <title>
                  Provide a description that will be used as the title
                </title>
                <path
                  d="M5.569 5.994L0 .726.687 0l6.336 5.994-6.335 6.002L0 11.27z"
                />
              </svg>
            </button>
          </td>
          <td>
            policy-certificatepolicy
          </td>
          <td>
            inform
          </td>
          <td>
            0/2
          </td>
          <td>
            FISMA, PCI
          </td>
          <td>
            CertManager
          </td>
          <td>
            SystemAndInformationIntegrity
          </td>
          <td />
        </tr>
        <tr
          aria-hidden={false}
          className="bx--parent-row-v2"
          data-parent-row={true}
          data-row-name="policy-iampolicy"
          disabled={false}
        >
          <td
            className="bx--table-expand-v2"
            headers="expand"
          >
            <button
              aria-label="TableExpandRow"
              className="bx--table-expand-v2__button"
              onClick={[Function]}
            >
              <svg
                alt="Provide a description that will be used as the title"
                aria-label="Provide a description that will be used as the title"
                className="bx--table-expand-v2__svg"
                fillRule="evenodd"
                height="12"
                role="img"
                viewBox="0 0 7 12"
                width="7"
              >
                <title>
                  Provide a description that will be used as the title
                </title>
                <path
                  d="M5.569 5.994L0 .726.687 0l6.336 5.994-6.335 6.002L0 11.27z"
                />
              </svg>
            </button>
          </td>
          <td>
            policy-iampolicy
          </td>
          <td>
            inform
          </td>
          <td>
            2/2
          </td>
          <td>
            FISMA
          </td>
          <td>
            MutationAdvisor
          </td>
          <td>
            SystemAndCommunicationsProtections
          </td>
          <td />
        </tr>
        <tr
          aria-hidden={false}
          className="bx--parent-row-v2"
          data-parent-row={true}
          data-row-name="policy-image"
          disabled={false}
        >
          <td
            className="bx--table-expand-v2"
            headers="expand"
          >
            <button
              aria-label="TableExpandRow"
              className="bx--table-expand-v2__button"
              onClick={[Function]}
            >
              <svg
                alt="Provide a description that will be used as the title"
                aria-label="Provide a description that will be used as the title"
                className="bx--table-expand-v2__svg"
                fillRule="evenodd"
                height="12"
                role="img"
                viewBox="0 0 7 12"
                width="7"
              >
                <title>
                  Provide a description that will be used as the title
                </title>
                <path
                  d="M5.569 5.994L0 .726.687 0l6.336 5.994-6.335 6.002L0 11.27z"
                />
              </svg>
            </button>
          </td>
          <td>
            policy-image
          </td>
          <td>
            inform
          </td>
          <td>
            2/2
          </td>
          <td>
            FISMA
          </td>
          <td>
            VA
          </td>
          <td>
            SystemAndCommunicationsProtections
          </td>
          <td />
        </tr>
        <tr
          aria-hidden={false}
          className="bx--parent-row-v2"
          data-parent-row={true}
          data-row-name="policy-limitrange"
          disabled={false}
        >
          <td
            className="bx--table-expand-v2"
            headers="expand"
          >
            <button
              aria-label="TableExpandRow"
              className="bx--table-expand-v2__button"
              onClick={[Function]}
            >
              <svg
                alt="Provide a description that will be used as the title"
                aria-label="Provide a description that will be used as the title"
                className="bx--table-expand-v2__svg"
                fillRule="evenodd"
                height="12"
                role="img"
                viewBox="0 0 7 12"
                width="7"
              >
                <title>
                  Provide a description that will be used as the title
                </title>
                <path
                  d="M5.569 5.994L0 .726.687 0l6.336 5.994-6.335 6.002L0 11.27z"
                />
              </svg>
            </button>
          </td>
          <td>
            policy-limitrange
          </td>
          <td>
            inform
          </td>
          <td>
            2/2
          </td>
          <td>
            HIPAA
          </td>
          <td>
            CertManager
          </td>
          <td>
            SystemAndCommunicationsProtections
          </td>
          <td />
        </tr>
        <tr
          aria-hidden={false}
          className="bx--parent-row-v2"
          data-parent-row={true}
          data-row-name="policy-namespace"
          disabled={false}
        >
          <td
            className="bx--table-expand-v2"
            headers="expand"
          >
            <button
              aria-label="TableExpandRow"
              className="bx--table-expand-v2__button"
              onClick={[Function]}
            >
              <svg
                alt="Provide a description that will be used as the title"
                aria-label="Provide a description that will be used as the title"
                className="bx--table-expand-v2__svg"
                fillRule="evenodd"
                height="12"
                role="img"
                viewBox="0 0 7 12"
                width="7"
              >
                <title>
                  Provide a description that will be used as the title
                </title>
                <path
                  d="M5.569 5.994L0 .726.687 0l6.336 5.994-6.335 6.002L0 11.27z"
                />
              </svg>
            </button>
          </td>
          <td>
            policy-namespace
          </td>
          <td>
            enforce
          </td>
          <td>
            2/2
          </td>
          <td>
            NIST,HIPAA
          </td>
          <td>
            MutationAdvisor
          </td>
          <td>
            SystemAndCommunicationsProtections,SystemAndInformationIntegrity
          </td>
          <td />
        </tr>
        <tr
          aria-hidden={false}
          className="bx--parent-row-v2"
          data-parent-row={true}
          data-row-name="policy-pod"
          disabled={false}
        >
          <td
            className="bx--table-expand-v2"
            headers="expand"
          >
            <button
              aria-label="TableExpandRow"
              className="bx--table-expand-v2__button"
              onClick={[Function]}
            >
              <svg
                alt="Provide a description that will be used as the title"
                aria-label="Provide a description that will be used as the title"
                className="bx--table-expand-v2__svg"
                fillRule="evenodd"
                height="12"
                role="img"
                viewBox="0 0 7 12"
                width="7"
              >
                <title>
                  Provide a description that will be used as the title
                </title>
                <path
                  d="M5.569 5.994L0 .726.687 0l6.336 5.994-6.335 6.002L0 11.27z"
                />
              </svg>
            </button>
          </td>
          <td>
            policy-pod
          </td>
          <td>
            inform
          </td>
          <td>
            2/2
          </td>
          <td>
            FISMA
          </td>
          <td>
            MutationAdvisor
          </td>
          <td>
            SystemAndCommunicationsProtections
          </td>
          <td />
        </tr>
        <tr
          aria-hidden={false}
          className="bx--parent-row-v2"
          data-parent-row={true}
          data-row-name="policy-pod-2"
          disabled={false}
        >
          <td
            className="bx--table-expand-v2"
            headers="expand"
          >
            <button
              aria-label="TableExpandRow"
              className="bx--table-expand-v2__button"
              onClick={[Function]}
            >
              <svg
                alt="Provide a description that will be used as the title"
                aria-label="Provide a description that will be used as the title"
                className="bx--table-expand-v2__svg"
                fillRule="evenodd"
                height="12"
                role="img"
                viewBox="0 0 7 12"
                width="7"
              >
                <title>
                  Provide a description that will be used as the title
                </title>
                <path
                  d="M5.569 5.994L0 .726.687 0l6.336 5.994-6.335 6.002L0 11.27z"
                />
              </svg>
            </button>
          </td>
          <td>
            policy-pod-2
          </td>
          <td>
            inform
          </td>
          <td>
            2/2
          </td>
          <td>
            HIPAA
          </td>
          <td>
            VA
          </td>
          <td>
            SystemAndCommunicationsProtections
          </td>
          <td />
        </tr>
        <tr
          aria-hidden={false}
          className="bx--parent-row-v2"
          data-parent-row={true}
          data-row-name="policy-pod-edge"
          disabled={false}
        >
          <td
            className="bx--table-expand-v2"
            headers="expand"
          >
            <button
              aria-label="TableExpandRow"
              className="bx--table-expand-v2__button"
              onClick={[Function]}
            >
              <svg
                alt="Provide a description that will be used as the title"
                aria-label="Provide a description that will be used as the title"
                className="bx--table-expand-v2__svg"
                fillRule="evenodd"
                height="12"
                role="img"
                viewBox="0 0 7 12"
                width="7"
              >
                <title>
                  Provide a description that will be used as the title
                </title>
                <path
                  d="M5.569 5.994L0 .726.687 0l6.336 5.994-6.335 6.002L0 11.27z"
                />
              </svg>
            </button>
          </td>
          <td>
            policy-pod-edge
          </td>
          <td>
            inform
          </td>
          <td>
            2/2
          </td>
          <td>
            HIPAA
          </td>
          <td>
            VA
          </td>
          <td>
            SystemAndCommunicationsProtections
          </td>
          <td />
        </tr>
      </tbody>
    </table>
  </div>,
  <div
    className="bx--pagination"
    disabled={false}
  >
    <div
      className="bx--pagination__left"
    >
      <span
        className="bx--pagination__text"
      >
        items per page
      </span>
      <div
        className="bx--form-item"
      >
        <div
          className="bx--select bx--select--inline"
        >
          <label
            className="bx--label bx--visually-hidden"
            htmlFor="bx-pagination-select-resource-table-pagination"
          >
            items per page
          </label>
          <select
            className="bx--select-input"
            id="bx-pagination-select-resource-table-pagination"
            onChange={[Function]}
            value={10}
          >
            <option
              className="bx--select-option"
              disabled={false}
              hidden={false}
              value={5}
            >
              5
            </option>
            <option
              className="bx--select-option"
              disabled={false}
              hidden={false}
              value={10}
            >
              10
            </option>
            <option
              className="bx--select-option"
              disabled={false}
              hidden={false}
              value={20}
            >
              20
            </option>
            <option
              className="bx--select-option"
              disabled={false}
              hidden={false}
              value={50}
            >
              50
            </option>
            <option
              className="bx--select-option"
              disabled={false}
              hidden={false}
              value={75}
            >
              75
            </option>
            <option
              className="bx--select-option"
              disabled={false}
              hidden={false}
              value={100}
            >
              100
            </option>
          </select>
          <svg
            alt="open list of options"
            aria-label="open list of options"
            className="bx--select__arrow"
            fillRule="evenodd"
            height="5"
            role="img"
            viewBox="0 0 10 5"
            width="10"
          >
            <title>
              open list of options
            </title>
            <path
              d="M0 0l5 4.998L10 0z"
            />
          </svg>
        </div>
      </div>
      <span
        className="bx--pagination__text"
      >
         |  
        {0}-{1} of {0} items
      </span>
    </div>
    <div
      className="bx--pagination__right bx--pagination--inline"
    >
      <span
        className="bx--pagination__text"
      >
        {0} of {1} pages
      </span>
      <button
        aria-label="Previous page"
        className="bx--pagination__button bx--pagination__button--backward bx--pagination__button--no-index"
        disabled={true}
        onClick={[Function]}
      >
        <svg
          alt="Previous page"
          aria-label="Previous page"
          className="bx--pagination__button-icon"
          fillRule="evenodd"
          height="12"
          role="img"
          viewBox="0 0 7 12"
          width="7"
        >
          <title>
            Previous page
          </title>
          <path
            d="M1.45 6.002L7 11.27l-.685.726L0 6.003 6.315 0 7 .726z"
          />
        </svg>
      </button>
      <div
        className="bx--form-item"
      >
        <div
          className="bx--select bx--select--inline"
        >
          <label
            className="bx--label bx--visually-hidden"
            htmlFor="bx-pagination-select-resource-table-pagination2"
          >
            items per page
          </label>
          <select
            className="bx--select-input"
            id="bx-pagination-select-resource-table-pagination2"
            onChange={[Function]}
            value={1}
          >
            <option
              className="bx--select-option"
              disabled={false}
              hidden={false}
              value={1}
            >
              1
            </option>
            <option
              className="bx--select-option"
              disabled={false}
              hidden={false}
              value={2}
            >
              2
            </option>
          </select>
          <svg
            alt="open list of options"
            aria-label="open list of options"
            className="bx--select__arrow"
            fillRule="evenodd"
            height="5"
            role="img"
            viewBox="0 0 10 5"
            width="10"
          >
            <title>
              open list of options
            </title>
            <path
              d="M0 0l5 4.998L10 0z"
            />
          </svg>
        </div>
      </div>
      <button
        aria-label="Next page"
        className="bx--pagination__button bx--pagination__button--forward"
        disabled={false}
        onClick={[Function]}
      >
        <svg
          alt="Next page"
          aria-label="Next page"
          className="bx--pagination__button-icon"
          fillRule="evenodd"
          height="12"
          role="img"
          viewBox="0 0 7 12"
          width="7"
        >
          <title>
            Next page
          </title>
          <path
            d="M5.569 5.994L0 .726.687 0l6.336 5.994-6.335 6.002L0 11.27z"
          />
        </svg>
      </button>
    </div>
  </div>,
]
`;

exports[`ResourceTable no search renders as expected 2`] = `
Array [
  <div
    className="bx--data-table-v2-container"
    id="table-container"
  >
    <section
      aria-label="search"
      className="bx--table-toolbar"
      role="region"
    >
      <div
        className="bx--toolbar-search-container"
      >
        <div
          aria-labelledby="search-label"
          className="bx--search bx--search--sm bx--search--light"
          role="search"
        >
          <svg
            alt="Filter table"
            aria-label="Filter table"
            className="bx--search-magnifier"
            fillRule="evenodd"
            height="16"
            role="img"
            viewBox="0 0 16 16"
            width="16"
          >
            <title>
              Filter table
            </title>
            <path
              d="M6.5 12a5.5 5.5 0 1 0 0-11 5.5 5.5 0 0 0 0 11zm4.936-1.27l4.563 4.557-.707.708-4.563-4.558a6.5 6.5 0 1 1 .707-.707z"
            />
          </svg>
          <label
            className="bx--label"
            htmlFor="search"
            id="search-label"
          >
            Filter table
          </label>
          <input
            aria-label="search"
            className="bx--search-input"
            id="search"
            onChange={[Function]}
            placeholder="Search policies"
            type="text"
            value=""
          />
          <button
            className="bx--search-close bx--search-close--hidden"
            onClick={[Function]}
            type="button"
          >
            <svg
              alt="Provide a description that will be used as the title"
              aria-label="Provide a description that will be used as the title"
              fillRule="evenodd"
              height="16"
              role="img"
              viewBox="0 0 16 16"
              width="16"
            >
              <title>
                Provide a description that will be used as the title
              </title>
              <path
                d="M8 6.586L5.879 4.464 4.464 5.88 6.586 8l-2.122 2.121 1.415 1.415L8 9.414l2.121 2.122 1.415-1.415L9.414 8l2.122-2.121-1.415-1.415L8 6.586zM8 16A8 8 0 1 1 8 0a8 8 0 0 1 0 16z"
              />
            </svg>
          </button>
        </div>
      </div>
      <div
        className="bx--toolbar-content"
      />
    </section>
    <table
      className="bx--data-table-v2 resource-table bx--data-table-v2--zebra"
    >
      <thead>
        <tr>
          <th
            scope="col"
          />
          <th
            scope="col"
          >
            <div
              className="bx--table-sort-v2 bx--table-sort-v2--ascending"
              data-default-key="metadata.name"
              data-key="metadata.name"
              onClick={[MockFunction]}
              onKeyPress={[MockFunction]}
              role="button"
              tabIndex={0}
              title="Sort rows by this header in ascending order."
            >
              <span
                className="bx--table-header-label"
              >
                Policy name
              </span>
              
              <svg
                alt="Sort rows by this header in ascending order."
                aria-label="Sort rows by this header in ascending order."
                className="bx--table-sort-v2__icon"
                fillRule="evenodd"
                height="5"
                name="caret--down"
                role="img"
                viewBox="0 0 10 5"
                width="10"
              >
                <title>
                  Sort rows by this header in ascending order.
                </title>
                <path
                  d="M0 0l5 4.998L10 0z"
                />
              </svg>
            </div>
          </th>
          <th
            scope="col"
          >
            <div
              className="bx--table-sort-v2 bx--table-sort-v2--ascending"
              data-default-key="metadata.name"
              data-key="remediation"
              onClick={[MockFunction]}
              onKeyPress={[MockFunction]}
              role="button"
              tabIndex={0}
              title="Sort rows by this header in ascending order."
            >
              <span
                className="bx--table-header-label"
              >
                Remediation
              </span>
              
              <svg
                alt="Sort rows by this header in ascending order."
                aria-label="Sort rows by this header in ascending order."
                className="bx--table-sort-v2__icon"
                fillRule="evenodd"
                height="5"
                name="caret--down"
                role="img"
                viewBox="0 0 10 5"
                width="10"
              >
                <title>
                  Sort rows by this header in ascending order.
                </title>
                <path
                  d="M0 0l5 4.998L10 0z"
                />
              </svg>
            </div>
          </th>
          <th
            scope="col"
          >
            <div
              className="bx--table-sort-v2 bx--table-sort-v2--ascending"
              data-default-key="metadata.name"
              data-key="clusterCompliant"
              onClick={[MockFunction]}
              onKeyPress={[MockFunction]}
              role="button"
              tabIndex={0}
              title="Sort rows by this header in ascending order."
            >
              <span
                className="bx--table-header-label"
              >
                Cluster violations
              </span>
              
              <svg
                alt="Sort rows by this header in ascending order."
                aria-label="Sort rows by this header in ascending order."
                className="bx--table-sort-v2__icon"
                fillRule="evenodd"
                height="5"
                name="caret--down"
                role="img"
                viewBox="0 0 10 5"
                width="10"
              >
                <title>
                  Sort rows by this header in ascending order.
                </title>
                <path
                  d="M0 0l5 4.998L10 0z"
                />
              </svg>
            </div>
          </th>
          <th
            scope="col"
          >
            <div
              className="bx--table-sort-v2 bx--table-sort-v2--ascending"
              data-default-key="metadata.name"
              data-key="metadata.annotations[\\"policy.open-cluster-management.io/standards\\"]"
              onClick={[MockFunction]}
              onKeyPress={[MockFunction]}
              role="button"
              tabIndex={0}
              title="Sort rows by this header in ascending order."
            >
              <span
                className="bx--table-header-label"
              >
                Standards
              </span>
              
              <svg
                alt="Sort rows by this header in ascending order."
                aria-label="Sort rows by this header in ascending order."
                className="bx--table-sort-v2__icon"
                fillRule="evenodd"
                height="5"
                name="caret--down"
                role="img"
                viewBox="0 0 10 5"
                width="10"
              >
                <title>
                  Sort rows by this header in ascending order.
                </title>
                <path
                  d="M0 0l5 4.998L10 0z"
                />
              </svg>
            </div>
          </th>
          <th
            scope="col"
          >
            <div
              className="bx--table-sort-v2 bx--table-sort-v2--ascending"
              data-default-key="metadata.name"
              data-key="metadata.annotations[\\"policy.open-cluster-management.io/controls\\"]"
              onClick={[MockFunction]}
              onKeyPress={[MockFunction]}
              role="button"
              tabIndex={0}
              title="Sort rows by this header in ascending order."
            >
              <span
                className="bx--table-header-label"
              >
                Controls
              </span>
              
              <svg
                alt="Sort rows by this header in ascending order."
                aria-label="Sort rows by this header in ascending order."
                className="bx--table-sort-v2__icon"
                fillRule="evenodd"
                height="5"
                name="caret--down"
                role="img"
                viewBox="0 0 10 5"
                width="10"
              >
                <title>
                  Sort rows by this header in ascending order.
                </title>
                <path
                  d="M0 0l5 4.998L10 0z"
                />
              </svg>
            </div>
          </th>
          <th
            scope="col"
          >
            <div
              className="bx--table-sort-v2 bx--table-sort-v2--ascending"
              data-default-key="metadata.name"
              data-key="metadata.annotations[\\"policy.open-cluster-management.io/categories\\"]"
              onClick={[MockFunction]}
              onKeyPress={[MockFunction]}
              role="button"
              tabIndex={0}
              title="Sort rows by this header in ascending order."
            >
              <span
                className="bx--table-header-label"
              >
                Categories
              </span>
              
              <svg
                alt="Sort rows by this header in ascending order."
                aria-label="Sort rows by this header in ascending order."
                className="bx--table-sort-v2__icon"
                fillRule="evenodd"
                height="5"
                name="caret--down"
                role="img"
                viewBox="0 0 10 5"
                width="10"
              >
                <title>
                  Sort rows by this header in ascending order.
                </title>
                <path
                  d="M0 0l5 4.998L10 0z"
                />
              </svg>
            </div>
          </th>
          <th
            scope="col"
          />
        </tr>
      </thead>
      <tbody>
        <tr
          aria-hidden={false}
          className="bx--parent-row-v2"
          data-parent-row={true}
          data-row-name="1569249226915-policy-test"
          disabled={false}
        >
          <td
            className="bx--table-expand-v2"
            headers="expand"
          >
            <button
              aria-label="TableExpandRow"
              className="bx--table-expand-v2__button"
              onClick={[Function]}
            >
              <svg
                alt="Provide a description that will be used as the title"
                aria-label="Provide a description that will be used as the title"
                className="bx--table-expand-v2__svg"
                fillRule="evenodd"
                height="12"
                role="img"
                viewBox="0 0 7 12"
                width="7"
              >
                <title>
                  Provide a description that will be used as the title
                </title>
                <path
                  d="M5.569 5.994L0 .726.687 0l6.336 5.994-6.335 6.002L0 11.27z"
                />
              </svg>
            </button>
          </td>
          <td>
            1569249226915-policy-test
          </td>
          <td>
            inform
          </td>
          <td>
            2/2
          </td>
          <td>
            NIST
          </td>
          <td>
            VA
          </td>
          <td>
            SystemAndInformationIntegrity
          </td>
          <td />
        </tr>
        <tr
          aria-hidden={false}
          className="bx--parent-row-v2"
          data-parent-row={true}
          data-row-name="policy-auditpolicy"
          disabled={false}
        >
          <td
            className="bx--table-expand-v2"
            headers="expand"
          >
            <button
              aria-label="TableExpandRow"
              className="bx--table-expand-v2__button"
              onClick={[Function]}
            >
              <svg
                alt="Provide a description that will be used as the title"
                aria-label="Provide a description that will be used as the title"
                className="bx--table-expand-v2__svg"
                fillRule="evenodd"
                height="12"
                role="img"
                viewBox="0 0 7 12"
                width="7"
              >
                <title>
                  Provide a description that will be used as the title
                </title>
                <path
                  d="M5.569 5.994L0 .726.687 0l6.336 5.994-6.335 6.002L0 11.27z"
                />
              </svg>
            </button>
          </td>
          <td>
            policy-auditpolicy
          </td>
          <td>
            inform
          </td>
          <td>
            0/1
          </td>
          <td>
            FISMA
          </td>
          <td>
            secretEncryption
          </td>
          <td>
            SystemAndCommunicationsProtections
          </td>
          <td />
        </tr>
        <tr
          aria-hidden={false}
          className="bx--parent-row-v2"
          data-parent-row={true}
          data-row-name="policy-certificatepolicy"
          disabled={false}
        >
          <td
            className="bx--table-expand-v2"
            headers="expand"
          >
            <button
              aria-label="TableExpandRow"
              className="bx--table-expand-v2__button"
              onClick={[Function]}
            >
              <svg
                alt="Provide a description that will be used as the title"
                aria-label="Provide a description that will be used as the title"
                className="bx--table-expand-v2__svg"
                fillRule="evenodd"
                height="12"
                role="img"
                viewBox="0 0 7 12"
                width="7"
              >
                <title>
                  Provide a description that will be used as the title
                </title>
                <path
                  d="M5.569 5.994L0 .726.687 0l6.336 5.994-6.335 6.002L0 11.27z"
                />
              </svg>
            </button>
          </td>
          <td>
            policy-certificatepolicy
          </td>
          <td>
            inform
          </td>
          <td>
            0/2
          </td>
          <td>
            FISMA, PCI
          </td>
          <td>
            CertManager
          </td>
          <td>
            SystemAndInformationIntegrity
          </td>
          <td />
        </tr>
        <tr
          aria-hidden={false}
          className="bx--parent-row-v2"
          data-parent-row={true}
          data-row-name="policy-iampolicy"
          disabled={false}
        >
          <td
            className="bx--table-expand-v2"
            headers="expand"
          >
            <button
              aria-label="TableExpandRow"
              className="bx--table-expand-v2__button"
              onClick={[Function]}
            >
              <svg
                alt="Provide a description that will be used as the title"
                aria-label="Provide a description that will be used as the title"
                className="bx--table-expand-v2__svg"
                fillRule="evenodd"
                height="12"
                role="img"
                viewBox="0 0 7 12"
                width="7"
              >
                <title>
                  Provide a description that will be used as the title
                </title>
                <path
                  d="M5.569 5.994L0 .726.687 0l6.336 5.994-6.335 6.002L0 11.27z"
                />
              </svg>
            </button>
          </td>
          <td>
            policy-iampolicy
          </td>
          <td>
            inform
          </td>
          <td>
            2/2
          </td>
          <td>
            FISMA
          </td>
          <td>
            MutationAdvisor
          </td>
          <td>
            SystemAndCommunicationsProtections
          </td>
          <td />
        </tr>
        <tr
          aria-hidden={false}
          className="bx--parent-row-v2"
          data-parent-row={true}
          data-row-name="policy-image"
          disabled={false}
        >
          <td
            className="bx--table-expand-v2"
            headers="expand"
          >
            <button
              aria-label="TableExpandRow"
              className="bx--table-expand-v2__button"
              onClick={[Function]}
            >
              <svg
                alt="Provide a description that will be used as the title"
                aria-label="Provide a description that will be used as the title"
                className="bx--table-expand-v2__svg"
                fillRule="evenodd"
                height="12"
                role="img"
                viewBox="0 0 7 12"
                width="7"
              >
                <title>
                  Provide a description that will be used as the title
                </title>
                <path
                  d="M5.569 5.994L0 .726.687 0l6.336 5.994-6.335 6.002L0 11.27z"
                />
              </svg>
            </button>
          </td>
          <td>
            policy-image
          </td>
          <td>
            inform
          </td>
          <td>
            2/2
          </td>
          <td>
            FISMA
          </td>
          <td>
            VA
          </td>
          <td>
            SystemAndCommunicationsProtections
          </td>
          <td />
        </tr>
        <tr
          aria-hidden={false}
          className="bx--parent-row-v2"
          data-parent-row={true}
          data-row-name="policy-limitrange"
          disabled={false}
        >
          <td
            className="bx--table-expand-v2"
            headers="expand"
          >
            <button
              aria-label="TableExpandRow"
              className="bx--table-expand-v2__button"
              onClick={[Function]}
            >
              <svg
                alt="Provide a description that will be used as the title"
                aria-label="Provide a description that will be used as the title"
                className="bx--table-expand-v2__svg"
                fillRule="evenodd"
                height="12"
                role="img"
                viewBox="0 0 7 12"
                width="7"
              >
                <title>
                  Provide a description that will be used as the title
                </title>
                <path
                  d="M5.569 5.994L0 .726.687 0l6.336 5.994-6.335 6.002L0 11.27z"
                />
              </svg>
            </button>
          </td>
          <td>
            policy-limitrange
          </td>
          <td>
            inform
          </td>
          <td>
            2/2
          </td>
          <td>
            HIPAA
          </td>
          <td>
            CertManager
          </td>
          <td>
            SystemAndCommunicationsProtections
          </td>
          <td />
        </tr>
        <tr
          aria-hidden={false}
          className="bx--parent-row-v2"
          data-parent-row={true}
          data-row-name="policy-namespace"
          disabled={false}
        >
          <td
            className="bx--table-expand-v2"
            headers="expand"
          >
            <button
              aria-label="TableExpandRow"
              className="bx--table-expand-v2__button"
              onClick={[Function]}
            >
              <svg
                alt="Provide a description that will be used as the title"
                aria-label="Provide a description that will be used as the title"
                className="bx--table-expand-v2__svg"
                fillRule="evenodd"
                height="12"
                role="img"
                viewBox="0 0 7 12"
                width="7"
              >
                <title>
                  Provide a description that will be used as the title
                </title>
                <path
                  d="M5.569 5.994L0 .726.687 0l6.336 5.994-6.335 6.002L0 11.27z"
                />
              </svg>
            </button>
          </td>
          <td>
            policy-namespace
          </td>
          <td>
            enforce
          </td>
          <td>
            2/2
          </td>
          <td>
            NIST,HIPAA
          </td>
          <td>
            MutationAdvisor
          </td>
          <td>
            SystemAndCommunicationsProtections,SystemAndInformationIntegrity
          </td>
          <td />
        </tr>
        <tr
          aria-hidden={false}
          className="bx--parent-row-v2"
          data-parent-row={true}
          data-row-name="policy-pod"
          disabled={false}
        >
          <td
            className="bx--table-expand-v2"
            headers="expand"
          >
            <button
              aria-label="TableExpandRow"
              className="bx--table-expand-v2__button"
              onClick={[Function]}
            >
              <svg
                alt="Provide a description that will be used as the title"
                aria-label="Provide a description that will be used as the title"
                className="bx--table-expand-v2__svg"
                fillRule="evenodd"
                height="12"
                role="img"
                viewBox="0 0 7 12"
                width="7"
              >
                <title>
                  Provide a description that will be used as the title
                </title>
                <path
                  d="M5.569 5.994L0 .726.687 0l6.336 5.994-6.335 6.002L0 11.27z"
                />
              </svg>
            </button>
          </td>
          <td>
            policy-pod
          </td>
          <td>
            inform
          </td>
          <td>
            2/2
          </td>
          <td>
            FISMA
          </td>
          <td>
            MutationAdvisor
          </td>
          <td>
            SystemAndCommunicationsProtections
          </td>
          <td />
        </tr>
        <tr
          aria-hidden={false}
          className="bx--parent-row-v2"
          data-parent-row={true}
          data-row-name="policy-pod-2"
          disabled={false}
        >
          <td
            className="bx--table-expand-v2"
            headers="expand"
          >
            <button
              aria-label="TableExpandRow"
              className="bx--table-expand-v2__button"
              onClick={[Function]}
            >
              <svg
                alt="Provide a description that will be used as the title"
                aria-label="Provide a description that will be used as the title"
                className="bx--table-expand-v2__svg"
                fillRule="evenodd"
                height="12"
                role="img"
                viewBox="0 0 7 12"
                width="7"
              >
                <title>
                  Provide a description that will be used as the title
                </title>
                <path
                  d="M5.569 5.994L0 .726.687 0l6.336 5.994-6.335 6.002L0 11.27z"
                />
              </svg>
            </button>
          </td>
          <td>
            policy-pod-2
          </td>
          <td>
            inform
          </td>
          <td>
            2/2
          </td>
          <td>
            HIPAA
          </td>
          <td>
            VA
          </td>
          <td>
            SystemAndCommunicationsProtections
          </td>
          <td />
        </tr>
        <tr
          aria-hidden={false}
          className="bx--parent-row-v2"
          data-parent-row={true}
          data-row-name="policy-pod-edge"
          disabled={false}
        >
          <td
            className="bx--table-expand-v2"
            headers="expand"
          >
            <button
              aria-label="TableExpandRow"
              className="bx--table-expand-v2__button"
              onClick={[Function]}
            >
              <svg
                alt="Provide a description that will be used as the title"
                aria-label="Provide a description that will be used as the title"
                className="bx--table-expand-v2__svg"
                fillRule="evenodd"
                height="12"
                role="img"
                viewBox="0 0 7 12"
                width="7"
              >
                <title>
                  Provide a description that will be used as the title
                </title>
                <path
                  d="M5.569 5.994L0 .726.687 0l6.336 5.994-6.335 6.002L0 11.27z"
                />
              </svg>
            </button>
          </td>
          <td>
            policy-pod-edge
          </td>
          <td>
            inform
          </td>
          <td>
            2/2
          </td>
          <td>
            HIPAA
          </td>
          <td>
            VA
          </td>
          <td>
            SystemAndCommunicationsProtections
          </td>
          <td />
        </tr>
      </tbody>
    </table>
  </div>,
  <div
    className="bx--pagination"
    disabled={false}
  >
    <div
      className="bx--pagination__left"
    >
      <span
        className="bx--pagination__text"
      >
        items per page
      </span>
      <div
        className="bx--form-item"
      >
        <div
          className="bx--select bx--select--inline"
        >
          <label
            className="bx--label bx--visually-hidden"
            htmlFor="bx-pagination-select-resource-table-pagination"
          >
            items per page
          </label>
          <select
            className="bx--select-input"
            id="bx-pagination-select-resource-table-pagination"
            onChange={[Function]}
            value={10}
          >
            <option
              className="bx--select-option"
              disabled={false}
              hidden={false}
              value={5}
            >
              5
            </option>
            <option
              className="bx--select-option"
              disabled={false}
              hidden={false}
              value={10}
            >
              10
            </option>
            <option
              className="bx--select-option"
              disabled={false}
              hidden={false}
              value={20}
            >
              20
            </option>
            <option
              className="bx--select-option"
              disabled={false}
              hidden={false}
              value={50}
            >
              50
            </option>
            <option
              className="bx--select-option"
              disabled={false}
              hidden={false}
              value={75}
            >
              75
            </option>
            <option
              className="bx--select-option"
              disabled={false}
              hidden={false}
              value={100}
            >
              100
            </option>
          </select>
          <svg
            alt="open list of options"
            aria-label="open list of options"
            className="bx--select__arrow"
            fillRule="evenodd"
            height="5"
            role="img"
            viewBox="0 0 10 5"
            width="10"
          >
            <title>
              open list of options
            </title>
            <path
              d="M0 0l5 4.998L10 0z"
            />
          </svg>
        </div>
      </div>
      <span
        className="bx--pagination__text"
      >
         |  
        {0}-{1} of {0} items
      </span>
    </div>
    <div
      className="bx--pagination__right bx--pagination--inline"
    >
      <span
        className="bx--pagination__text"
      >
        {0} of {1} pages
      </span>
      <button
        aria-label="Previous page"
        className="bx--pagination__button bx--pagination__button--backward bx--pagination__button--no-index"
        disabled={true}
        onClick={[Function]}
      >
        <svg
          alt="Previous page"
          aria-label="Previous page"
          className="bx--pagination__button-icon"
          fillRule="evenodd"
          height="12"
          role="img"
          viewBox="0 0 7 12"
          width="7"
        >
          <title>
            Previous page
          </title>
          <path
            d="M1.45 6.002L7 11.27l-.685.726L0 6.003 6.315 0 7 .726z"
          />
        </svg>
      </button>
      <div
        className="bx--form-item"
      >
        <div
          className="bx--select bx--select--inline"
        >
          <label
            className="bx--label bx--visually-hidden"
            htmlFor="bx-pagination-select-resource-table-pagination2"
          >
            items per page
          </label>
          <select
            className="bx--select-input"
            id="bx-pagination-select-resource-table-pagination2"
            onChange={[Function]}
            value={1}
          >
            <option
              className="bx--select-option"
              disabled={false}
              hidden={false}
              value={1}
            >
              1
            </option>
            <option
              className="bx--select-option"
              disabled={false}
              hidden={false}
              value={2}
            >
              2
            </option>
          </select>
          <svg
            alt="open list of options"
            aria-label="open list of options"
            className="bx--select__arrow"
            fillRule="evenodd"
            height="5"
            role="img"
            viewBox="0 0 10 5"
            width="10"
          >
            <title>
              open list of options
            </title>
            <path
              d="M0 0l5 4.998L10 0z"
            />
          </svg>
        </div>
      </div>
      <button
        aria-label="Next page"
        className="bx--pagination__button bx--pagination__button--forward"
        disabled={false}
        onClick={[Function]}
      >
        <svg
          alt="Next page"
          aria-label="Next page"
          className="bx--pagination__button-icon"
          fillRule="evenodd"
          height="12"
          role="img"
          viewBox="0 0 7 12"
          width="7"
        >
          <title>
            Next page
          </title>
          <path
            d="M5.569 5.994L0 .726.687 0l6.336 5.994-6.335 6.002L0 11.27z"
          />
        </svg>
      </button>
    </div>
  </div>,
]
`;

exports[`ResourceTable no search with console url renders as expected 1`] = `
Array [
  <div
    className="bx--data-table-v2-container"
    id="table-container"
  >
    <section
      aria-label="search"
      className="bx--table-toolbar"
      role="region"
    >
      <div
        className="bx--toolbar-search-container"
      >
        <div
          aria-labelledby="search-label"
          className="bx--search bx--search--sm bx--search--light"
          role="search"
        >
          <svg
            alt="Filter table"
            aria-label="Filter table"
            className="bx--search-magnifier"
            fillRule="evenodd"
            height="16"
            role="img"
            viewBox="0 0 16 16"
            width="16"
          >
            <title>
              Filter table
            </title>
            <path
              d="M6.5 12a5.5 5.5 0 1 0 0-11 5.5 5.5 0 0 0 0 11zm4.936-1.27l4.563 4.557-.707.708-4.563-4.558a6.5 6.5 0 1 1 .707-.707z"
            />
          </svg>
          <label
            className="bx--label"
            htmlFor="search"
            id="search-label"
          >
            Filter table
          </label>
          <input
            aria-label="search"
            className="bx--search-input"
            id="search"
            onChange={[Function]}
            placeholder="Find clusters"
            type="text"
            value=""
          />
          <button
            className="bx--search-close bx--search-close--hidden"
            onClick={[Function]}
            type="button"
          >
            <svg
              alt="Provide a description that will be used as the title"
              aria-label="Provide a description that will be used as the title"
              fillRule="evenodd"
              height="16"
              role="img"
              viewBox="0 0 16 16"
              width="16"
            >
              <title>
                Provide a description that will be used as the title
              </title>
              <path
                d="M8 6.586L5.879 4.464 4.464 5.88 6.586 8l-2.122 2.121 1.415 1.415L8 9.414l2.121 2.122 1.415-1.415L9.414 8l2.122-2.121-1.415-1.415L8 6.586zM8 16A8 8 0 1 1 8 0a8 8 0 0 1 0 16z"
              />
            </svg>
          </button>
        </div>
      </div>
      <div
        className="bx--toolbar-content"
      />
    </section>
    <table
      className="bx--data-table-v2 resource-table bx--data-table-v2--zebra"
    >
      <thead>
        <tr>
          <th
            scope="col"
          />
          <th
            scope="col"
          >
            <div
              className="bx--table-sort-v2 bx--table-sort-v2--ascending"
              data-default-key="cluster"
              data-key="cluster"
              onClick={[MockFunction]}
              onKeyPress={[MockFunction]}
              role="button"
              tabIndex={0}
              title="Sort rows by this header in ascending order."
            >
              <span
                className="bx--table-header-label"
              >
                Cluster name
              </span>
              
              <svg
                alt="Sort rows by this header in ascending order."
                aria-label="Sort rows by this header in ascending order."
                className="bx--table-sort-v2__icon"
                fillRule="evenodd"
                height="5"
                name="caret--down"
                role="img"
                viewBox="0 0 10 5"
                width="10"
              >
                <title>
                  Sort rows by this header in ascending order.
                </title>
                <path
                  d="M0 0l5 4.998L10 0z"
                />
              </svg>
            </div>
          </th>
          <th
            scope="col"
          >
            <div
              className="bx--table-sort-v2 bx--table-sort-v2--ascending"
              data-default-key="cluster"
              data-key="namespace"
              onClick={[MockFunction]}
              onKeyPress={[MockFunction]}
              role="button"
              tabIndex={0}
              title="Sort rows by this header in ascending order."
            >
              <span
                className="bx--table-header-label"
              >
                Cluster namespace
              </span>
              
              <svg
                alt="Sort rows by this header in ascending order."
                aria-label="Sort rows by this header in ascending order."
                className="bx--table-sort-v2__icon"
                fillRule="evenodd"
                height="5"
                name="caret--down"
                role="img"
                viewBox="0 0 10 5"
                width="10"
              >
                <title>
                  Sort rows by this header in ascending order.
                </title>
                <path
                  d="M0 0l5 4.998L10 0z"
                />
              </svg>
            </div>
          </th>
          <th
            scope="col"
          >
            <div
              className="bx--table-sort-v2 bx--table-sort-v2--ascending"
              data-default-key="cluster"
              data-key="violation"
              onClick={[MockFunction]}
              onKeyPress={[MockFunction]}
              role="button"
              tabIndex={0}
              title="Sort rows by this header in ascending order."
            >
              <span
                className="bx--table-header-label"
              >
                Violations
              </span>
              
              <svg
                alt="Sort rows by this header in ascending order."
                aria-label="Sort rows by this header in ascending order."
                className="bx--table-sort-v2__icon"
                fillRule="evenodd"
                height="5"
                name="caret--down"
                role="img"
                viewBox="0 0 10 5"
                width="10"
              >
                <title>
                  Sort rows by this header in ascending order.
                </title>
                <path
                  d="M0 0l5 4.998L10 0z"
                />
              </svg>
            </div>
          </th>
          <th
            scope="col"
          >
            <div
              className="bx--table-sort-v2 bx--table-sort-v2--ascending"
              data-default-key="cluster"
              data-key="nonCompliant"
              onClick={[MockFunction]}
              onKeyPress={[MockFunction]}
              role="button"
              tabIndex={0}
              title="Sort rows by this header in ascending order."
            >
              <span
                className="bx--table-header-label"
              >
                Policy violations
              </span>
              
              <svg
                alt="Sort rows by this header in ascending order."
                aria-label="Sort rows by this header in ascending order."
                className="bx--table-sort-v2__icon"
                fillRule="evenodd"
                height="5"
                name="caret--down"
                role="img"
                viewBox="0 0 10 5"
                width="10"
              >
                <title>
                  Sort rows by this header in ascending order.
                </title>
                <path
                  d="M0 0l5 4.998L10 0z"
                />
              </svg>
            </div>
          </th>
          <th
            scope="col"
          />
        </tr>
      </thead>
      <tbody>
        <tr
          aria-hidden={true}
          className="bx--parent-row-v2 row-not-expanded"
          data-parent-row={true}
          data-row-name="calamari"
          disabled={false}
        >
          <td
            className="bx--table-expand-v2"
            headers="expand"
          >
            <button
              aria-label="TableExpandRow"
              className="bx--table-expand-v2__button"
              onClick={[Function]}
            >
              <svg
                alt="Provide a description that will be used as the title"
                aria-label="Provide a description that will be used as the title"
                className="bx--table-expand-v2__svg"
                fillRule="evenodd"
                height="12"
                role="img"
                viewBox="0 0 7 12"
                width="7"
              >
                <title>
                  Provide a description that will be used as the title
                </title>
                <path
                  d="M5.569 5.994L0 .726.687 0l6.336 5.994-6.335 6.002L0 11.27z"
                />
              </svg>
            </button>
          </td>
          <td>
            calamari
          </td>
          <td>
            calamari
          </td>
          <td>
            1/5
          </td>
          <td>
            policy-imagemanifestvulnpolicy
          </td>
          <td>
            <div
              aria-expanded={false}
              aria-haspopup={true}
              aria-label="Overflow-menu"
              className="bx--overflow-menu"
              onBlur={[Function]}
              onClick={[Function]}
              onClose={[Function]}
              onKeyDown={[Function]}
              open={false}
              role="menu"
              tabIndex={0}
            >
              <svg
                alt="Actions"
                aria-label="Actions"
                className="bx--overflow-menu__icon"
                fillRule="evenodd"
                focusable="false"
                height="15"
                onClick={[Function]}
                onKeyDown={[Function]}
                role="img"
                viewBox="0 0 3 15"
                width="3"
              >
                <title>
                  Actions
                </title>
                <path
                  d="M0 1.5a1.5 1.5 0 1 1 3 0 1.5 1.5 0 1 1-3 0M0 7.5a1.5 1.5 0 1 1 3 0 1.5 1.5 0 1 1-3 0M0 13.5a1.5 1.5 0 1 1 3 0 1.5 1.5 0 1 1-3 0"
                />
              </svg>
            </div>
          </td>
        </tr>
      </tbody>
    </table>
  </div>,
  <div
    className="bx--pagination"
    disabled={false}
  >
    <div
      className="bx--pagination__left"
    >
      <span
        className="bx--pagination__text"
      >
        items per page
      </span>
      <div
        className="bx--form-item"
      >
        <div
          className="bx--select bx--select--inline"
        >
          <label
            className="bx--label bx--visually-hidden"
            htmlFor="bx-pagination-select-resource-table-pagination"
          >
            items per page
          </label>
          <select
            className="bx--select-input"
            id="bx-pagination-select-resource-table-pagination"
            onChange={[Function]}
            value={10}
          >
            <option
              className="bx--select-option"
              disabled={false}
              hidden={false}
              value={5}
            >
              5
            </option>
            <option
              className="bx--select-option"
              disabled={false}
              hidden={false}
              value={10}
            >
              10
            </option>
            <option
              className="bx--select-option"
              disabled={false}
              hidden={false}
              value={20}
            >
              20
            </option>
            <option
              className="bx--select-option"
              disabled={false}
              hidden={false}
              value={50}
            >
              50
            </option>
            <option
              className="bx--select-option"
              disabled={false}
              hidden={false}
              value={75}
            >
              75
            </option>
            <option
              className="bx--select-option"
              disabled={false}
              hidden={false}
              value={100}
            >
              100
            </option>
          </select>
          <svg
            alt="open list of options"
            aria-label="open list of options"
            className="bx--select__arrow"
            fillRule="evenodd"
            height="5"
            role="img"
            viewBox="0 0 10 5"
            width="10"
          >
            <title>
              open list of options
            </title>
            <path
              d="M0 0l5 4.998L10 0z"
            />
          </svg>
        </div>
      </div>
      <span
        className="bx--pagination__text"
      >
         |  
        {0}-{1} of {0} items
      </span>
    </div>
    <div
      className="bx--pagination__right bx--pagination--inline"
    >
      <span
        className="bx--pagination__text"
      >
        {0} of {1} pages
      </span>
      <button
        aria-label="Previous page"
        className="bx--pagination__button bx--pagination__button--backward bx--pagination__button--no-index"
        disabled={true}
        onClick={[Function]}
      >
        <svg
          alt="Previous page"
          aria-label="Previous page"
          className="bx--pagination__button-icon"
          fillRule="evenodd"
          height="12"
          role="img"
          viewBox="0 0 7 12"
          width="7"
        >
          <title>
            Previous page
          </title>
          <path
            d="M1.45 6.002L7 11.27l-.685.726L0 6.003 6.315 0 7 .726z"
          />
        </svg>
      </button>
      <div
        className="bx--form-item"
      >
        <div
          className="bx--select bx--select--inline"
        >
          <label
            className="bx--label bx--visually-hidden"
            htmlFor="bx-pagination-select-resource-table-pagination2"
          >
            items per page
          </label>
          <select
            className="bx--select-input"
            id="bx-pagination-select-resource-table-pagination2"
            onChange={[Function]}
            value={1}
          >
            <option
              className="bx--select-option"
              disabled={false}
              hidden={false}
              value={1}
            >
              1
            </option>
            <option
              className="bx--select-option"
              disabled={false}
              hidden={false}
              value={2}
            >
              2
            </option>
          </select>
          <svg
            alt="open list of options"
            aria-label="open list of options"
            className="bx--select__arrow"
            fillRule="evenodd"
            height="5"
            role="img"
            viewBox="0 0 10 5"
            width="10"
          >
            <title>
              open list of options
            </title>
            <path
              d="M0 0l5 4.998L10 0z"
            />
          </svg>
        </div>
      </div>
      <button
        aria-label="Next page"
        className="bx--pagination__button bx--pagination__button--forward"
        disabled={false}
        onClick={[Function]}
      >
        <svg
          alt="Next page"
          aria-label="Next page"
          className="bx--pagination__button-icon"
          fillRule="evenodd"
          height="12"
          role="img"
          viewBox="0 0 7 12"
          width="7"
        >
          <title>
            Next page
          </title>
          <path
            d="M5.569 5.994L0 .726.687 0l6.336 5.994-6.335 6.002L0 11.27z"
          />
        </svg>
      </button>
    </div>
  </div>,
]
`;

exports[`ResourceTable no search with empty console url renders as expected 1`] = `
Array [
  <div
    className="bx--data-table-v2-container"
    id="table-container"
  >
    <section
      aria-label="search"
      className="bx--table-toolbar"
      role="region"
    >
      <div
        className="bx--toolbar-search-container"
      >
        <div
          aria-labelledby="search-label"
          className="bx--search bx--search--sm bx--search--light"
          role="search"
        >
          <svg
            alt="Filter table"
            aria-label="Filter table"
            className="bx--search-magnifier"
            fillRule="evenodd"
            height="16"
            role="img"
            viewBox="0 0 16 16"
            width="16"
          >
            <title>
              Filter table
            </title>
            <path
              d="M6.5 12a5.5 5.5 0 1 0 0-11 5.5 5.5 0 0 0 0 11zm4.936-1.27l4.563 4.557-.707.708-4.563-4.558a6.5 6.5 0 1 1 .707-.707z"
            />
          </svg>
          <label
            className="bx--label"
            htmlFor="search"
            id="search-label"
          >
            Filter table
          </label>
          <input
            aria-label="search"
            className="bx--search-input"
            id="search"
            onChange={[Function]}
            placeholder="Find clusters"
            type="text"
            value=""
          />
          <button
            className="bx--search-close bx--search-close--hidden"
            onClick={[Function]}
            type="button"
          >
            <svg
              alt="Provide a description that will be used as the title"
              aria-label="Provide a description that will be used as the title"
              fillRule="evenodd"
              height="16"
              role="img"
              viewBox="0 0 16 16"
              width="16"
            >
              <title>
                Provide a description that will be used as the title
              </title>
              <path
                d="M8 6.586L5.879 4.464 4.464 5.88 6.586 8l-2.122 2.121 1.415 1.415L8 9.414l2.121 2.122 1.415-1.415L9.414 8l2.122-2.121-1.415-1.415L8 6.586zM8 16A8 8 0 1 1 8 0a8 8 0 0 1 0 16z"
              />
            </svg>
          </button>
        </div>
      </div>
      <div
        className="bx--toolbar-content"
      />
    </section>
    <table
      className="bx--data-table-v2 resource-table bx--data-table-v2--zebra"
    >
      <thead>
        <tr>
          <th
            scope="col"
          />
          <th
            scope="col"
          >
            <div
              className="bx--table-sort-v2 bx--table-sort-v2--ascending"
              data-default-key="cluster"
              data-key="cluster"
              onClick={[MockFunction]}
              onKeyPress={[MockFunction]}
              role="button"
              tabIndex={0}
              title="Sort rows by this header in ascending order."
            >
              <span
                className="bx--table-header-label"
              >
                Cluster name
              </span>
              
              <svg
                alt="Sort rows by this header in ascending order."
                aria-label="Sort rows by this header in ascending order."
                className="bx--table-sort-v2__icon"
                fillRule="evenodd"
                height="5"
                name="caret--down"
                role="img"
                viewBox="0 0 10 5"
                width="10"
              >
                <title>
                  Sort rows by this header in ascending order.
                </title>
                <path
                  d="M0 0l5 4.998L10 0z"
                />
              </svg>
            </div>
          </th>
          <th
            scope="col"
          >
            <div
              className="bx--table-sort-v2 bx--table-sort-v2--ascending"
              data-default-key="cluster"
              data-key="namespace"
              onClick={[MockFunction]}
              onKeyPress={[MockFunction]}
              role="button"
              tabIndex={0}
              title="Sort rows by this header in ascending order."
            >
              <span
                className="bx--table-header-label"
              >
                Cluster namespace
              </span>
              
              <svg
                alt="Sort rows by this header in ascending order."
                aria-label="Sort rows by this header in ascending order."
                className="bx--table-sort-v2__icon"
                fillRule="evenodd"
                height="5"
                name="caret--down"
                role="img"
                viewBox="0 0 10 5"
                width="10"
              >
                <title>
                  Sort rows by this header in ascending order.
                </title>
                <path
                  d="M0 0l5 4.998L10 0z"
                />
              </svg>
            </div>
          </th>
          <th
            scope="col"
          >
            <div
              className="bx--table-sort-v2 bx--table-sort-v2--ascending"
              data-default-key="cluster"
              data-key="violation"
              onClick={[MockFunction]}
              onKeyPress={[MockFunction]}
              role="button"
              tabIndex={0}
              title="Sort rows by this header in ascending order."
            >
              <span
                className="bx--table-header-label"
              >
                Violations
              </span>
              
              <svg
                alt="Sort rows by this header in ascending order."
                aria-label="Sort rows by this header in ascending order."
                className="bx--table-sort-v2__icon"
                fillRule="evenodd"
                height="5"
                name="caret--down"
                role="img"
                viewBox="0 0 10 5"
                width="10"
              >
                <title>
                  Sort rows by this header in ascending order.
                </title>
                <path
                  d="M0 0l5 4.998L10 0z"
                />
              </svg>
            </div>
          </th>
          <th
            scope="col"
          >
            <div
              className="bx--table-sort-v2 bx--table-sort-v2--ascending"
              data-default-key="cluster"
              data-key="nonCompliant"
              onClick={[MockFunction]}
              onKeyPress={[MockFunction]}
              role="button"
              tabIndex={0}
              title="Sort rows by this header in ascending order."
            >
              <span
                className="bx--table-header-label"
              >
                Policy violations
              </span>
              
              <svg
                alt="Sort rows by this header in ascending order."
                aria-label="Sort rows by this header in ascending order."
                className="bx--table-sort-v2__icon"
                fillRule="evenodd"
                height="5"
                name="caret--down"
                role="img"
                viewBox="0 0 10 5"
                width="10"
              >
                <title>
                  Sort rows by this header in ascending order.
                </title>
                <path
                  d="M0 0l5 4.998L10 0z"
                />
              </svg>
            </div>
          </th>
          <th
            scope="col"
          />
        </tr>
      </thead>
      <tbody>
        <tr
          aria-hidden={true}
          className="bx--parent-row-v2 row-not-expanded"
          data-parent-row={true}
          data-row-name="calamari"
          disabled={false}
        >
          <td
            className="bx--table-expand-v2"
            headers="expand"
          >
            <button
              aria-label="TableExpandRow"
              className="bx--table-expand-v2__button"
              onClick={[Function]}
            >
              <svg
                alt="Provide a description that will be used as the title"
                aria-label="Provide a description that will be used as the title"
                className="bx--table-expand-v2__svg"
                fillRule="evenodd"
                height="12"
                role="img"
                viewBox="0 0 7 12"
                width="7"
              >
                <title>
                  Provide a description that will be used as the title
                </title>
                <path
                  d="M5.569 5.994L0 .726.687 0l6.336 5.994-6.335 6.002L0 11.27z"
                />
              </svg>
            </button>
          </td>
          <td>
            calamari
          </td>
          <td>
            calamari
          </td>
          <td>
            1/5
          </td>
          <td>
            policy-imagemanifestvulnpolicy
          </td>
          <td>
            <div
              aria-expanded={false}
              aria-haspopup={true}
              aria-label="Overflow-menu"
              className="bx--overflow-menu"
              onBlur={[Function]}
              onClick={[Function]}
              onClose={[Function]}
              onKeyDown={[Function]}
              open={false}
              role="menu"
              tabIndex={0}
            >
              <svg
                alt="Actions"
                aria-label="Actions"
                className="bx--overflow-menu__icon"
                fillRule="evenodd"
                focusable="false"
                height="15"
                onClick={[Function]}
                onKeyDown={[Function]}
                role="img"
                viewBox="0 0 3 15"
                width="3"
              >
                <title>
                  Actions
                </title>
                <path
                  d="M0 1.5a1.5 1.5 0 1 1 3 0 1.5 1.5 0 1 1-3 0M0 7.5a1.5 1.5 0 1 1 3 0 1.5 1.5 0 1 1-3 0M0 13.5a1.5 1.5 0 1 1 3 0 1.5 1.5 0 1 1-3 0"
                />
              </svg>
            </div>
          </td>
        </tr>
      </tbody>
    </table>
  </div>,
  <div
    className="bx--pagination"
    disabled={false}
  >
    <div
      className="bx--pagination__left"
    >
      <span
        className="bx--pagination__text"
      >
        items per page
      </span>
      <div
        className="bx--form-item"
      >
        <div
          className="bx--select bx--select--inline"
        >
          <label
            className="bx--label bx--visually-hidden"
            htmlFor="bx-pagination-select-resource-table-pagination"
          >
            items per page
          </label>
          <select
            className="bx--select-input"
            id="bx-pagination-select-resource-table-pagination"
            onChange={[Function]}
            value={10}
          >
            <option
              className="bx--select-option"
              disabled={false}
              hidden={false}
              value={5}
            >
              5
            </option>
            <option
              className="bx--select-option"
              disabled={false}
              hidden={false}
              value={10}
            >
              10
            </option>
            <option
              className="bx--select-option"
              disabled={false}
              hidden={false}
              value={20}
            >
              20
            </option>
            <option
              className="bx--select-option"
              disabled={false}
              hidden={false}
              value={50}
            >
              50
            </option>
            <option
              className="bx--select-option"
              disabled={false}
              hidden={false}
              value={75}
            >
              75
            </option>
            <option
              className="bx--select-option"
              disabled={false}
              hidden={false}
              value={100}
            >
              100
            </option>
          </select>
          <svg
            alt="open list of options"
            aria-label="open list of options"
            className="bx--select__arrow"
            fillRule="evenodd"
            height="5"
            role="img"
            viewBox="0 0 10 5"
            width="10"
          >
            <title>
              open list of options
            </title>
            <path
              d="M0 0l5 4.998L10 0z"
            />
          </svg>
        </div>
      </div>
      <span
        className="bx--pagination__text"
      >
         |  
        {0}-{1} of {0} items
      </span>
    </div>
    <div
      className="bx--pagination__right bx--pagination--inline"
    >
      <span
        className="bx--pagination__text"
      >
        {0} of {1} pages
      </span>
      <button
        aria-label="Previous page"
        className="bx--pagination__button bx--pagination__button--backward bx--pagination__button--no-index"
        disabled={true}
        onClick={[Function]}
      >
        <svg
          alt="Previous page"
          aria-label="Previous page"
          className="bx--pagination__button-icon"
          fillRule="evenodd"
          height="12"
          role="img"
          viewBox="0 0 7 12"
          width="7"
        >
          <title>
            Previous page
          </title>
          <path
            d="M1.45 6.002L7 11.27l-.685.726L0 6.003 6.315 0 7 .726z"
          />
        </svg>
      </button>
      <div
        className="bx--form-item"
      >
        <div
          className="bx--select bx--select--inline"
        >
          <label
            className="bx--label bx--visually-hidden"
            htmlFor="bx-pagination-select-resource-table-pagination2"
          >
            items per page
          </label>
          <select
            className="bx--select-input"
            id="bx-pagination-select-resource-table-pagination2"
            onChange={[Function]}
            value={1}
          >
            <option
              className="bx--select-option"
              disabled={false}
              hidden={false}
              value={1}
            >
              1
            </option>
            <option
              className="bx--select-option"
              disabled={false}
              hidden={false}
              value={2}
            >
              2
            </option>
          </select>
          <svg
            alt="open list of options"
            aria-label="open list of options"
            className="bx--select__arrow"
            fillRule="evenodd"
            height="5"
            role="img"
            viewBox="0 0 10 5"
            width="10"
          >
            <title>
              open list of options
            </title>
            <path
              d="M0 0l5 4.998L10 0z"
            />
          </svg>
        </div>
      </div>
      <button
        aria-label="Next page"
        className="bx--pagination__button bx--pagination__button--forward"
        disabled={false}
        onClick={[Function]}
      >
        <svg
          alt="Next page"
          aria-label="Next page"
          className="bx--pagination__button-icon"
          fillRule="evenodd"
          height="12"
          role="img"
          viewBox="0 0 7 12"
          width="7"
        >
          <title>
            Next page
          </title>
          <path
            d="M5.569 5.994L0 .726.687 0l6.336 5.994-6.335 6.002L0 11.27z"
          />
        </svg>
      </button>
    </div>
  </div>,
]
`;

exports[`ResourceTable no search with empty console url renders as expected 2`] = `
Array [
  <div
    className="bx--data-table-v2-container"
    id="table-container"
  >
    <section
      aria-label="search"
      className="bx--table-toolbar"
      role="region"
    >
      <div
        className="bx--toolbar-search-container"
      >
        <div
          aria-labelledby="search-label"
          className="bx--search bx--search--sm bx--search--light"
          role="search"
        >
          <svg
            alt="Filter table"
            aria-label="Filter table"
            className="bx--search-magnifier"
            fillRule="evenodd"
            height="16"
            role="img"
            viewBox="0 0 16 16"
            width="16"
          >
            <title>
              Filter table
            </title>
            <path
              d="M6.5 12a5.5 5.5 0 1 0 0-11 5.5 5.5 0 0 0 0 11zm4.936-1.27l4.563 4.557-.707.708-4.563-4.558a6.5 6.5 0 1 1 .707-.707z"
            />
          </svg>
          <label
            className="bx--label"
            htmlFor="search"
            id="search-label"
          >
            Filter table
          </label>
          <input
            aria-label="search"
            className="bx--search-input"
            id="search"
            onChange={[Function]}
            placeholder="Find clusters"
            type="text"
            value=""
          />
          <button
            className="bx--search-close bx--search-close--hidden"
            onClick={[Function]}
            type="button"
          >
            <svg
              alt="Provide a description that will be used as the title"
              aria-label="Provide a description that will be used as the title"
              fillRule="evenodd"
              height="16"
              role="img"
              viewBox="0 0 16 16"
              width="16"
            >
              <title>
                Provide a description that will be used as the title
              </title>
              <path
                d="M8 6.586L5.879 4.464 4.464 5.88 6.586 8l-2.122 2.121 1.415 1.415L8 9.414l2.121 2.122 1.415-1.415L9.414 8l2.122-2.121-1.415-1.415L8 6.586zM8 16A8 8 0 1 1 8 0a8 8 0 0 1 0 16z"
              />
            </svg>
          </button>
        </div>
      </div>
      <div
        className="bx--toolbar-content"
      />
    </section>
    <table
      className="bx--data-table-v2 resource-table bx--data-table-v2--zebra"
    >
      <thead>
        <tr>
          <th
            scope="col"
          />
          <th
            scope="col"
          >
            <div
              className="bx--table-sort-v2 bx--table-sort-v2--ascending"
              data-default-key="cluster"
              data-key="cluster"
              onClick={[MockFunction]}
              onKeyPress={[MockFunction]}
              role="button"
              tabIndex={0}
              title="Sort rows by this header in ascending order."
            >
              <span
                className="bx--table-header-label"
              >
                Cluster name
              </span>
              
              <svg
                alt="Sort rows by this header in ascending order."
                aria-label="Sort rows by this header in ascending order."
                className="bx--table-sort-v2__icon"
                fillRule="evenodd"
                height="5"
                name="caret--down"
                role="img"
                viewBox="0 0 10 5"
                width="10"
              >
                <title>
                  Sort rows by this header in ascending order.
                </title>
                <path
                  d="M0 0l5 4.998L10 0z"
                />
              </svg>
            </div>
          </th>
          <th
            scope="col"
          >
            <div
              className="bx--table-sort-v2 bx--table-sort-v2--ascending"
              data-default-key="cluster"
              data-key="namespace"
              onClick={[MockFunction]}
              onKeyPress={[MockFunction]}
              role="button"
              tabIndex={0}
              title="Sort rows by this header in ascending order."
            >
              <span
                className="bx--table-header-label"
              >
                Cluster namespace
              </span>
              
              <svg
                alt="Sort rows by this header in ascending order."
                aria-label="Sort rows by this header in ascending order."
                className="bx--table-sort-v2__icon"
                fillRule="evenodd"
                height="5"
                name="caret--down"
                role="img"
                viewBox="0 0 10 5"
                width="10"
              >
                <title>
                  Sort rows by this header in ascending order.
                </title>
                <path
                  d="M0 0l5 4.998L10 0z"
                />
              </svg>
            </div>
          </th>
          <th
            scope="col"
          >
            <div
              className="bx--table-sort-v2 bx--table-sort-v2--ascending"
              data-default-key="cluster"
              data-key="violation"
              onClick={[MockFunction]}
              onKeyPress={[MockFunction]}
              role="button"
              tabIndex={0}
              title="Sort rows by this header in ascending order."
            >
              <span
                className="bx--table-header-label"
              >
                Violations
              </span>
              
              <svg
                alt="Sort rows by this header in ascending order."
                aria-label="Sort rows by this header in ascending order."
                className="bx--table-sort-v2__icon"
                fillRule="evenodd"
                height="5"
                name="caret--down"
                role="img"
                viewBox="0 0 10 5"
                width="10"
              >
                <title>
                  Sort rows by this header in ascending order.
                </title>
                <path
                  d="M0 0l5 4.998L10 0z"
                />
              </svg>
            </div>
          </th>
          <th
            scope="col"
          >
            <div
              className="bx--table-sort-v2 bx--table-sort-v2--ascending"
              data-default-key="cluster"
              data-key="nonCompliant"
              onClick={[MockFunction]}
              onKeyPress={[MockFunction]}
              role="button"
              tabIndex={0}
              title="Sort rows by this header in ascending order."
            >
              <span
                className="bx--table-header-label"
              >
                Policy violations
              </span>
              
              <svg
                alt="Sort rows by this header in ascending order."
                aria-label="Sort rows by this header in ascending order."
                className="bx--table-sort-v2__icon"
                fillRule="evenodd"
                height="5"
                name="caret--down"
                role="img"
                viewBox="0 0 10 5"
                width="10"
              >
                <title>
                  Sort rows by this header in ascending order.
                </title>
                <path
                  d="M0 0l5 4.998L10 0z"
                />
              </svg>
            </div>
          </th>
          <th
            scope="col"
          />
        </tr>
      </thead>
      <tbody>
        <tr
          aria-hidden={true}
          className="bx--parent-row-v2 row-not-expanded"
          data-parent-row={true}
          data-row-name="calamari"
          disabled={false}
        >
          <td
            className="bx--table-expand-v2"
            headers="expand"
          >
            <button
              aria-label="TableExpandRow"
              className="bx--table-expand-v2__button"
              onClick={[Function]}
            >
              <svg
                alt="Provide a description that will be used as the title"
                aria-label="Provide a description that will be used as the title"
                className="bx--table-expand-v2__svg"
                fillRule="evenodd"
                height="12"
                role="img"
                viewBox="0 0 7 12"
                width="7"
              >
                <title>
                  Provide a description that will be used as the title
                </title>
                <path
                  d="M5.569 5.994L0 .726.687 0l6.336 5.994-6.335 6.002L0 11.27z"
                />
              </svg>
            </button>
          </td>
          <td>
            calamari
          </td>
          <td>
            calamari
          </td>
          <td>
            1/5
          </td>
          <td>
            policy-imagemanifestvulnpolicy
          </td>
          <td>
            <div
              aria-expanded={false}
              aria-haspopup={true}
              aria-label="Overflow-menu"
              className="bx--overflow-menu"
              onBlur={[Function]}
              onClick={[Function]}
              onClose={[Function]}
              onKeyDown={[Function]}
              open={false}
              role="menu"
              tabIndex={0}
            >
              <svg
                alt="Actions"
                aria-label="Actions"
                className="bx--overflow-menu__icon"
                fillRule="evenodd"
                focusable="false"
                height="15"
                onClick={[Function]}
                onKeyDown={[Function]}
                role="img"
                viewBox="0 0 3 15"
                width="3"
              >
                <title>
                  Actions
                </title>
                <path
                  d="M0 1.5a1.5 1.5 0 1 1 3 0 1.5 1.5 0 1 1-3 0M0 7.5a1.5 1.5 0 1 1 3 0 1.5 1.5 0 1 1-3 0M0 13.5a1.5 1.5 0 1 1 3 0 1.5 1.5 0 1 1-3 0"
                />
              </svg>
            </div>
          </td>
        </tr>
      </tbody>
    </table>
  </div>,
  <div
    className="bx--pagination"
    disabled={false}
  >
    <div
      className="bx--pagination__left"
    >
      <span
        className="bx--pagination__text"
      >
        items per page
      </span>
      <div
        className="bx--form-item"
      >
        <div
          className="bx--select bx--select--inline"
        >
          <label
            className="bx--label bx--visually-hidden"
            htmlFor="bx-pagination-select-resource-table-pagination"
          >
            items per page
          </label>
          <select
            className="bx--select-input"
            id="bx-pagination-select-resource-table-pagination"
            onChange={[Function]}
            value={10}
          >
            <option
              className="bx--select-option"
              disabled={false}
              hidden={false}
              value={5}
            >
              5
            </option>
            <option
              className="bx--select-option"
              disabled={false}
              hidden={false}
              value={10}
            >
              10
            </option>
            <option
              className="bx--select-option"
              disabled={false}
              hidden={false}
              value={20}
            >
              20
            </option>
            <option
              className="bx--select-option"
              disabled={false}
              hidden={false}
              value={50}
            >
              50
            </option>
            <option
              className="bx--select-option"
              disabled={false}
              hidden={false}
              value={75}
            >
              75
            </option>
            <option
              className="bx--select-option"
              disabled={false}
              hidden={false}
              value={100}
            >
              100
            </option>
          </select>
          <svg
            alt="open list of options"
            aria-label="open list of options"
            className="bx--select__arrow"
            fillRule="evenodd"
            height="5"
            role="img"
            viewBox="0 0 10 5"
            width="10"
          >
            <title>
              open list of options
            </title>
            <path
              d="M0 0l5 4.998L10 0z"
            />
          </svg>
        </div>
      </div>
      <span
        className="bx--pagination__text"
      >
         |  
        {0}-{1} of {0} items
      </span>
    </div>
    <div
      className="bx--pagination__right bx--pagination--inline"
    >
      <span
        className="bx--pagination__text"
      >
        {0} of {1} pages
      </span>
      <button
        aria-label="Previous page"
        className="bx--pagination__button bx--pagination__button--backward bx--pagination__button--no-index"
        disabled={true}
        onClick={[Function]}
      >
        <svg
          alt="Previous page"
          aria-label="Previous page"
          className="bx--pagination__button-icon"
          fillRule="evenodd"
          height="12"
          role="img"
          viewBox="0 0 7 12"
          width="7"
        >
          <title>
            Previous page
          </title>
          <path
            d="M1.45 6.002L7 11.27l-.685.726L0 6.003 6.315 0 7 .726z"
          />
        </svg>
      </button>
      <div
        className="bx--form-item"
      >
        <div
          className="bx--select bx--select--inline"
        >
          <label
            className="bx--label bx--visually-hidden"
            htmlFor="bx-pagination-select-resource-table-pagination2"
          >
            items per page
          </label>
          <select
            className="bx--select-input"
            id="bx-pagination-select-resource-table-pagination2"
            onChange={[Function]}
            value={1}
          >
            <option
              className="bx--select-option"
              disabled={false}
              hidden={false}
              value={1}
            >
              1
            </option>
            <option
              className="bx--select-option"
              disabled={false}
              hidden={false}
              value={2}
            >
              2
            </option>
          </select>
          <svg
            alt="open list of options"
            aria-label="open list of options"
            className="bx--select__arrow"
            fillRule="evenodd"
            height="5"
            role="img"
            viewBox="0 0 10 5"
            width="10"
          >
            <title>
              open list of options
            </title>
            <path
              d="M0 0l5 4.998L10 0z"
            />
          </svg>
        </div>
      </div>
      <button
        aria-label="Next page"
        className="bx--pagination__button bx--pagination__button--forward"
        disabled={false}
        onClick={[Function]}
      >
        <svg
          alt="Next page"
          aria-label="Next page"
          className="bx--pagination__button-icon"
          fillRule="evenodd"
          height="12"
          role="img"
          viewBox="0 0 7 12"
          width="7"
        >
          <title>
            Next page
          </title>
          <path
            d="M5.569 5.994L0 .726.687 0l6.336 5.994-6.335 6.002L0 11.27z"
          />
        </svg>
      </button>
    </div>
  </div>,
]
`;

exports[`ResourceTable not expandable renders as expected 1`] = `
Array [
  <div
    className="bx--data-table-v2-container"
    id="table-container"
  >
    <section
      aria-label="search"
      className="bx--table-toolbar"
      role="region"
    >
      <div
        className="bx--toolbar-search-container"
      >
        <div
          aria-labelledby="search-label"
          className="bx--search bx--search--sm bx--search--light"
          role="search"
        >
          <svg
            alt="Filter table"
            aria-label="Filter table"
            className="bx--search-magnifier"
            fillRule="evenodd"
            height="16"
            role="img"
            viewBox="0 0 16 16"
            width="16"
          >
            <title>
              Filter table
            </title>
            <path
              d="M6.5 12a5.5 5.5 0 1 0 0-11 5.5 5.5 0 0 0 0 11zm4.936-1.27l4.563 4.557-.707.708-4.563-4.558a6.5 6.5 0 1 1 .707-.707z"
            />
          </svg>
          <label
            className="bx--label"
            htmlFor="search"
            id="search-label"
          >
            Filter table
          </label>
          <input
            aria-label="search"
            className="bx--search-input"
            id="search"
            onChange={[Function]}
            placeholder="Search policies"
            type="text"
            value="policy"
          />
          <button
            className="bx--search-close"
            onClick={[Function]}
            type="button"
          >
            <svg
              alt="Provide a description that will be used as the title"
              aria-label="Provide a description that will be used as the title"
              fillRule="evenodd"
              height="16"
              role="img"
              viewBox="0 0 16 16"
              width="16"
            >
              <title>
                Provide a description that will be used as the title
              </title>
              <path
                d="M8 6.586L5.879 4.464 4.464 5.88 6.586 8l-2.122 2.121 1.415 1.415L8 9.414l2.121 2.122 1.415-1.415L9.414 8l2.122-2.121-1.415-1.415L8 6.586zM8 16A8 8 0 1 1 8 0a8 8 0 0 1 0 16z"
              />
            </svg>
          </button>
        </div>
      </div>
      <div
        className="bx--toolbar-content"
      />
    </section>
    <table
      className="bx--data-table-v2 resource-table bx--data-table-v2--zebra"
    >
      <thead>
        <tr>
          <th
            scope="col"
          >
            <div
              className="bx--table-sort-v2 bx--table-sort-v2--ascending"
              data-default-key="metadata.name"
              data-key="metadata.name"
              onClick={[MockFunction]}
              onKeyPress={[MockFunction]}
              role="button"
              tabIndex={0}
              title="Sort rows by this header in ascending order."
            >
              <span
                className="bx--table-header-label"
              >
                Policy name
              </span>
              
              <svg
                alt="Sort rows by this header in ascending order."
                aria-label="Sort rows by this header in ascending order."
                className="bx--table-sort-v2__icon"
                fillRule="evenodd"
                height="5"
                name="caret--down"
                role="img"
                viewBox="0 0 10 5"
                width="10"
              >
                <title>
                  Sort rows by this header in ascending order.
                </title>
                <path
                  d="M0 0l5 4.998L10 0z"
                />
              </svg>
            </div>
          </th>
          <th
            scope="col"
          >
            <div
              className="bx--table-sort-v2 bx--table-sort-v2--ascending"
              data-default-key="metadata.name"
              data-key="remediation"
              onClick={[MockFunction]}
              onKeyPress={[MockFunction]}
              role="button"
              tabIndex={0}
              title="Sort rows by this header in ascending order."
            >
              <span
                className="bx--table-header-label"
              >
                Remediation
              </span>
              
              <svg
                alt="Sort rows by this header in ascending order."
                aria-label="Sort rows by this header in ascending order."
                className="bx--table-sort-v2__icon"
                fillRule="evenodd"
                height="5"
                name="caret--down"
                role="img"
                viewBox="0 0 10 5"
                width="10"
              >
                <title>
                  Sort rows by this header in ascending order.
                </title>
                <path
                  d="M0 0l5 4.998L10 0z"
                />
              </svg>
            </div>
          </th>
          <th
            scope="col"
          >
            <div
              className="bx--table-sort-v2 bx--table-sort-v2--ascending"
              data-default-key="metadata.name"
              data-key="clusterCompliant"
              onClick={[MockFunction]}
              onKeyPress={[MockFunction]}
              role="button"
              tabIndex={0}
              title="Sort rows by this header in ascending order."
            >
              <span
                className="bx--table-header-label"
              >
                Cluster violations
              </span>
              
              <svg
                alt="Sort rows by this header in ascending order."
                aria-label="Sort rows by this header in ascending order."
                className="bx--table-sort-v2__icon"
                fillRule="evenodd"
                height="5"
                name="caret--down"
                role="img"
                viewBox="0 0 10 5"
                width="10"
              >
                <title>
                  Sort rows by this header in ascending order.
                </title>
                <path
                  d="M0 0l5 4.998L10 0z"
                />
              </svg>
            </div>
          </th>
          <th
            scope="col"
          >
            <div
              className="bx--table-sort-v2 bx--table-sort-v2--ascending"
              data-default-key="metadata.name"
              data-key="metadata.annotations[\\"policy.open-cluster-management.io/standards\\"]"
              onClick={[MockFunction]}
              onKeyPress={[MockFunction]}
              role="button"
              tabIndex={0}
              title="Sort rows by this header in ascending order."
            >
              <span
                className="bx--table-header-label"
              >
                Standards
              </span>
              
              <svg
                alt="Sort rows by this header in ascending order."
                aria-label="Sort rows by this header in ascending order."
                className="bx--table-sort-v2__icon"
                fillRule="evenodd"
                height="5"
                name="caret--down"
                role="img"
                viewBox="0 0 10 5"
                width="10"
              >
                <title>
                  Sort rows by this header in ascending order.
                </title>
                <path
                  d="M0 0l5 4.998L10 0z"
                />
              </svg>
            </div>
          </th>
          <th
            scope="col"
          >
            <div
              className="bx--table-sort-v2 bx--table-sort-v2--ascending"
              data-default-key="metadata.name"
              data-key="metadata.annotations[\\"policy.open-cluster-management.io/controls\\"]"
              onClick={[MockFunction]}
              onKeyPress={[MockFunction]}
              role="button"
              tabIndex={0}
              title="Sort rows by this header in ascending order."
            >
              <span
                className="bx--table-header-label"
              >
                Controls
              </span>
              
              <svg
                alt="Sort rows by this header in ascending order."
                aria-label="Sort rows by this header in ascending order."
                className="bx--table-sort-v2__icon"
                fillRule="evenodd"
                height="5"
                name="caret--down"
                role="img"
                viewBox="0 0 10 5"
                width="10"
              >
                <title>
                  Sort rows by this header in ascending order.
                </title>
                <path
                  d="M0 0l5 4.998L10 0z"
                />
              </svg>
            </div>
          </th>
          <th
            scope="col"
          >
            <div
              className="bx--table-sort-v2 bx--table-sort-v2--ascending"
              data-default-key="metadata.name"
              data-key="metadata.annotations[\\"policy.open-cluster-management.io/categories\\"]"
              onClick={[MockFunction]}
              onKeyPress={[MockFunction]}
              role="button"
              tabIndex={0}
              title="Sort rows by this header in ascending order."
            >
              <span
                className="bx--table-header-label"
              >
                Categories
              </span>
              
              <svg
                alt="Sort rows by this header in ascending order."
                aria-label="Sort rows by this header in ascending order."
                className="bx--table-sort-v2__icon"
                fillRule="evenodd"
                height="5"
                name="caret--down"
                role="img"
                viewBox="0 0 10 5"
                width="10"
              >
                <title>
                  Sort rows by this header in ascending order.
                </title>
                <path
                  d="M0 0l5 4.998L10 0z"
                />
              </svg>
            </div>
          </th>
          <th
            scope="col"
          />
        </tr>
      </thead>
      <tbody>
        <tr
          data-row-name="1569249226915-policy-test"
        >
          <td>
            1569249226915-policy-test
          </td>
          <td>
            inform
          </td>
          <td>
            2/2
          </td>
          <td>
            NIST
          </td>
          <td>
            VA
          </td>
          <td>
            SystemAndInformationIntegrity
          </td>
          <td />
        </tr>
        <tr
          data-row-name="policy-auditpolicy"
        >
          <td>
            policy-auditpolicy
          </td>
          <td>
            inform
          </td>
          <td>
            0/1
          </td>
          <td>
            FISMA
          </td>
          <td>
            secretEncryption
          </td>
          <td>
            SystemAndCommunicationsProtections
          </td>
          <td />
        </tr>
        <tr
          data-row-name="policy-certificatepolicy"
        >
          <td>
            policy-certificatepolicy
          </td>
          <td>
            inform
          </td>
          <td>
            0/2
          </td>
          <td>
            FISMA, PCI
          </td>
          <td>
            CertManager
          </td>
          <td>
            SystemAndInformationIntegrity
          </td>
          <td />
        </tr>
        <tr
          data-row-name="policy-iampolicy"
        >
          <td>
            policy-iampolicy
          </td>
          <td>
            inform
          </td>
          <td>
            2/2
          </td>
          <td>
            FISMA
          </td>
          <td>
            MutationAdvisor
          </td>
          <td>
            SystemAndCommunicationsProtections
          </td>
          <td />
        </tr>
        <tr
          data-row-name="policy-image"
        >
          <td>
            policy-image
          </td>
          <td>
            inform
          </td>
          <td>
            2/2
          </td>
          <td>
            FISMA
          </td>
          <td>
            VA
          </td>
          <td>
            SystemAndCommunicationsProtections
          </td>
          <td />
        </tr>
        <tr
          data-row-name="policy-limitrange"
        >
          <td>
            policy-limitrange
          </td>
          <td>
            inform
          </td>
          <td>
            2/2
          </td>
          <td>
            HIPAA
          </td>
          <td>
            CertManager
          </td>
          <td>
            SystemAndCommunicationsProtections
          </td>
          <td />
        </tr>
        <tr
          data-row-name="policy-namespace"
        >
          <td>
            policy-namespace
          </td>
          <td>
            enforce
          </td>
          <td>
            2/2
          </td>
          <td>
            NIST,HIPAA
          </td>
          <td>
            MutationAdvisor
          </td>
          <td>
            SystemAndCommunicationsProtections,SystemAndInformationIntegrity
          </td>
          <td />
        </tr>
        <tr
          data-row-name="policy-pod"
        >
          <td>
            policy-pod
          </td>
          <td>
            inform
          </td>
          <td>
            2/2
          </td>
          <td>
            FISMA
          </td>
          <td>
            MutationAdvisor
          </td>
          <td>
            SystemAndCommunicationsProtections
          </td>
          <td />
        </tr>
        <tr
          data-row-name="policy-pod-2"
        >
          <td>
            policy-pod-2
          </td>
          <td>
            inform
          </td>
          <td>
            2/2
          </td>
          <td>
            HIPAA
          </td>
          <td>
            VA
          </td>
          <td>
            SystemAndCommunicationsProtections
          </td>
          <td />
        </tr>
        <tr
          data-row-name="policy-pod-edge"
        >
          <td>
            policy-pod-edge
          </td>
          <td>
            inform
          </td>
          <td>
            2/2
          </td>
          <td>
            HIPAA
          </td>
          <td>
            VA
          </td>
          <td>
            SystemAndCommunicationsProtections
          </td>
          <td />
        </tr>
      </tbody>
    </table>
  </div>,
  <div
    className="bx--pagination"
    disabled={true}
  >
    <div
      className="bx--pagination__left"
    >
      <span
        className="bx--pagination__text"
      >
        items per page
      </span>
      <div
        className="bx--form-item"
      >
        <div
          className="bx--select bx--select--inline"
        >
          <label
            className="bx--label bx--visually-hidden"
            htmlFor="bx-pagination-select-resource-table-pagination"
          >
            items per page
          </label>
          <select
            className="bx--select-input"
            id="bx-pagination-select-resource-table-pagination"
            onChange={[Function]}
            value={20}
          >
            <option
              className="bx--select-option"
              disabled={false}
              hidden={false}
              value={5}
            >
              5
            </option>
            <option
              className="bx--select-option"
              disabled={false}
              hidden={false}
              value={10}
            >
              10
            </option>
            <option
              className="bx--select-option"
              disabled={false}
              hidden={false}
              value={20}
            >
              20
            </option>
            <option
              className="bx--select-option"
              disabled={false}
              hidden={false}
              value={50}
            >
              50
            </option>
            <option
              className="bx--select-option"
              disabled={false}
              hidden={false}
              value={75}
            >
              75
            </option>
            <option
              className="bx--select-option"
              disabled={false}
              hidden={false}
              value={100}
            >
              100
            </option>
          </select>
          <svg
            alt="open list of options"
            aria-label="open list of options"
            className="bx--select__arrow"
            fillRule="evenodd"
            height="5"
            role="img"
            viewBox="0 0 10 5"
            width="10"
          >
            <title>
              open list of options
            </title>
            <path
              d="M0 0l5 4.998L10 0z"
            />
          </svg>
        </div>
      </div>
      <span
        className="bx--pagination__text"
      >
         |  
        {0}-{1} of {0} items
      </span>
    </div>
    <div
      className="bx--pagination__right bx--pagination--inline"
    >
      <button
        aria-label="Previous page"
        className="bx--pagination__button bx--pagination__button--backward bx--pagination__button--no-index"
        disabled={true}
        onClick={[Function]}
      >
        <svg
          alt="Previous page"
          aria-label="Previous page"
          className="bx--pagination__button-icon"
          fillRule="evenodd"
          height="12"
          role="img"
          viewBox="0 0 7 12"
          width="7"
        >
          <title>
            Previous page
          </title>
          <path
            d="M1.45 6.002L7 11.27l-.685.726L0 6.003 6.315 0 7 .726z"
          />
        </svg>
      </button>
      <button
        aria-label="Next page"
        className="bx--pagination__button bx--pagination__button--forward"
        disabled={true}
        onClick={[Function]}
      >
        <svg
          alt="Next page"
          aria-label="Next page"
          className="bx--pagination__button-icon"
          fillRule="evenodd"
          height="12"
          role="img"
          viewBox="0 0 7 12"
          width="7"
        >
          <title>
            Next page
          </title>
          <path
            d="M5.569 5.994L0 .726.687 0l6.336 5.994-6.335 6.002L0 11.27z"
          />
        </svg>
      </button>
    </div>
  </div>,
]
`;

exports[`ResourceTable with search renders as expected 1`] = `
Array [
  <div
    className="bx--data-table-v2-container"
    id="table-container"
  >
    <section
      aria-label="search"
      className="bx--table-toolbar"
      role="region"
    >
      <div
        className="bx--toolbar-search-container"
      >
        <div
          aria-labelledby="search-label"
          className="bx--search bx--search--sm bx--search--light"
          role="search"
        >
          <svg
            alt="Filter table"
            aria-label="Filter table"
            className="bx--search-magnifier"
            fillRule="evenodd"
            height="16"
            role="img"
            viewBox="0 0 16 16"
            width="16"
          >
            <title>
              Filter table
            </title>
            <path
              d="M6.5 12a5.5 5.5 0 1 0 0-11 5.5 5.5 0 0 0 0 11zm4.936-1.27l4.563 4.557-.707.708-4.563-4.558a6.5 6.5 0 1 1 .707-.707z"
            />
          </svg>
          <label
            className="bx--label"
            htmlFor="search"
            id="search-label"
          >
            Filter table
          </label>
          <input
            aria-label="search"
            className="bx--search-input"
            id="search"
            onChange={[Function]}
            placeholder="Search policies"
            type="text"
            value="policy"
          />
          <button
            className="bx--search-close"
            onClick={[Function]}
            type="button"
          >
            <svg
              alt="Provide a description that will be used as the title"
              aria-label="Provide a description that will be used as the title"
              fillRule="evenodd"
              height="16"
              role="img"
              viewBox="0 0 16 16"
              width="16"
            >
              <title>
                Provide a description that will be used as the title
              </title>
              <path
                d="M8 6.586L5.879 4.464 4.464 5.88 6.586 8l-2.122 2.121 1.415 1.415L8 9.414l2.121 2.122 1.415-1.415L9.414 8l2.122-2.121-1.415-1.415L8 6.586zM8 16A8 8 0 1 1 8 0a8 8 0 0 1 0 16z"
              />
            </svg>
          </button>
        </div>
      </div>
      <div
        className="bx--toolbar-content"
      />
    </section>
    <table
      className="bx--data-table-v2 resource-table bx--data-table-v2--zebra"
    >
      <thead>
        <tr>
          <th
            scope="col"
          />
          <th
            scope="col"
          >
            <div
              className="bx--table-sort-v2 bx--table-sort-v2--ascending"
              data-default-key="metadata.name"
              data-key="metadata.name"
              onClick={[MockFunction]}
              onKeyPress={[MockFunction]}
              role="button"
              tabIndex={0}
              title="Sort rows by this header in ascending order."
            >
              <span
                className="bx--table-header-label"
              >
                Policy name
              </span>
              
              <svg
                alt="Sort rows by this header in ascending order."
                aria-label="Sort rows by this header in ascending order."
                className="bx--table-sort-v2__icon"
                fillRule="evenodd"
                height="5"
                name="caret--down"
                role="img"
                viewBox="0 0 10 5"
                width="10"
              >
                <title>
                  Sort rows by this header in ascending order.
                </title>
                <path
                  d="M0 0l5 4.998L10 0z"
                />
              </svg>
            </div>
          </th>
          <th
            scope="col"
          >
            <div
              className="bx--table-sort-v2 bx--table-sort-v2--ascending"
              data-default-key="metadata.name"
              data-key="remediation"
              onClick={[MockFunction]}
              onKeyPress={[MockFunction]}
              role="button"
              tabIndex={0}
              title="Sort rows by this header in ascending order."
            >
              <span
                className="bx--table-header-label"
              >
                Remediation
              </span>
              
              <svg
                alt="Sort rows by this header in ascending order."
                aria-label="Sort rows by this header in ascending order."
                className="bx--table-sort-v2__icon"
                fillRule="evenodd"
                height="5"
                name="caret--down"
                role="img"
                viewBox="0 0 10 5"
                width="10"
              >
                <title>
                  Sort rows by this header in ascending order.
                </title>
                <path
                  d="M0 0l5 4.998L10 0z"
                />
              </svg>
            </div>
          </th>
          <th
            scope="col"
          >
            <div
              className="bx--table-sort-v2 bx--table-sort-v2--ascending"
              data-default-key="metadata.name"
              data-key="clusterCompliant"
              onClick={[MockFunction]}
              onKeyPress={[MockFunction]}
              role="button"
              tabIndex={0}
              title="Sort rows by this header in ascending order."
            >
              <span
                className="bx--table-header-label"
              >
                Cluster violations
              </span>
              
              <svg
                alt="Sort rows by this header in ascending order."
                aria-label="Sort rows by this header in ascending order."
                className="bx--table-sort-v2__icon"
                fillRule="evenodd"
                height="5"
                name="caret--down"
                role="img"
                viewBox="0 0 10 5"
                width="10"
              >
                <title>
                  Sort rows by this header in ascending order.
                </title>
                <path
                  d="M0 0l5 4.998L10 0z"
                />
              </svg>
            </div>
          </th>
          <th
            scope="col"
          >
            <div
              className="bx--table-sort-v2 bx--table-sort-v2--ascending"
              data-default-key="metadata.name"
              data-key="metadata.annotations[\\"policy.open-cluster-management.io/standards\\"]"
              onClick={[MockFunction]}
              onKeyPress={[MockFunction]}
              role="button"
              tabIndex={0}
              title="Sort rows by this header in ascending order."
            >
              <span
                className="bx--table-header-label"
              >
                Standards
              </span>
              
              <svg
                alt="Sort rows by this header in ascending order."
                aria-label="Sort rows by this header in ascending order."
                className="bx--table-sort-v2__icon"
                fillRule="evenodd"
                height="5"
                name="caret--down"
                role="img"
                viewBox="0 0 10 5"
                width="10"
              >
                <title>
                  Sort rows by this header in ascending order.
                </title>
                <path
                  d="M0 0l5 4.998L10 0z"
                />
              </svg>
            </div>
          </th>
          <th
            scope="col"
          >
            <div
              className="bx--table-sort-v2 bx--table-sort-v2--ascending"
              data-default-key="metadata.name"
              data-key="metadata.annotations[\\"policy.open-cluster-management.io/controls\\"]"
              onClick={[MockFunction]}
              onKeyPress={[MockFunction]}
              role="button"
              tabIndex={0}
              title="Sort rows by this header in ascending order."
            >
              <span
                className="bx--table-header-label"
              >
                Controls
              </span>
              
              <svg
                alt="Sort rows by this header in ascending order."
                aria-label="Sort rows by this header in ascending order."
                className="bx--table-sort-v2__icon"
                fillRule="evenodd"
                height="5"
                name="caret--down"
                role="img"
                viewBox="0 0 10 5"
                width="10"
              >
                <title>
                  Sort rows by this header in ascending order.
                </title>
                <path
                  d="M0 0l5 4.998L10 0z"
                />
              </svg>
            </div>
          </th>
          <th
            scope="col"
          >
            <div
              className="bx--table-sort-v2 bx--table-sort-v2--ascending"
              data-default-key="metadata.name"
              data-key="metadata.annotations[\\"policy.open-cluster-management.io/categories\\"]"
              onClick={[MockFunction]}
              onKeyPress={[MockFunction]}
              role="button"
              tabIndex={0}
              title="Sort rows by this header in ascending order."
            >
              <span
                className="bx--table-header-label"
              >
                Categories
              </span>
              
              <svg
                alt="Sort rows by this header in ascending order."
                aria-label="Sort rows by this header in ascending order."
                className="bx--table-sort-v2__icon"
                fillRule="evenodd"
                height="5"
                name="caret--down"
                role="img"
                viewBox="0 0 10 5"
                width="10"
              >
                <title>
                  Sort rows by this header in ascending order.
                </title>
                <path
                  d="M0 0l5 4.998L10 0z"
                />
              </svg>
            </div>
          </th>
          <th
            scope="col"
          />
        </tr>
      </thead>
      <tbody>
        <tr
          aria-hidden={false}
          className="bx--parent-row-v2"
          data-parent-row={true}
          data-row-name="1569249226915-policy-test"
          disabled={false}
        >
          <td
            className="bx--table-expand-v2"
            headers="expand"
          >
            <button
              aria-label="TableExpandRow"
              className="bx--table-expand-v2__button"
              onClick={[Function]}
            >
              <svg
                alt="Provide a description that will be used as the title"
                aria-label="Provide a description that will be used as the title"
                className="bx--table-expand-v2__svg"
                fillRule="evenodd"
                height="12"
                role="img"
                viewBox="0 0 7 12"
                width="7"
              >
                <title>
                  Provide a description that will be used as the title
                </title>
                <path
                  d="M5.569 5.994L0 .726.687 0l6.336 5.994-6.335 6.002L0 11.27z"
                />
              </svg>
            </button>
          </td>
          <td>
            1569249226915-policy-test
          </td>
          <td>
            inform
          </td>
          <td>
            2/2
          </td>
          <td>
            NIST
          </td>
          <td>
            VA
          </td>
          <td>
            SystemAndInformationIntegrity
          </td>
          <td />
        </tr>
        <tr
          aria-hidden={false}
          className="bx--parent-row-v2"
          data-parent-row={true}
          data-row-name="policy-auditpolicy"
          disabled={false}
        >
          <td
            className="bx--table-expand-v2"
            headers="expand"
          >
            <button
              aria-label="TableExpandRow"
              className="bx--table-expand-v2__button"
              onClick={[Function]}
            >
              <svg
                alt="Provide a description that will be used as the title"
                aria-label="Provide a description that will be used as the title"
                className="bx--table-expand-v2__svg"
                fillRule="evenodd"
                height="12"
                role="img"
                viewBox="0 0 7 12"
                width="7"
              >
                <title>
                  Provide a description that will be used as the title
                </title>
                <path
                  d="M5.569 5.994L0 .726.687 0l6.336 5.994-6.335 6.002L0 11.27z"
                />
              </svg>
            </button>
          </td>
          <td>
            policy-auditpolicy
          </td>
          <td>
            inform
          </td>
          <td>
            0/1
          </td>
          <td>
            FISMA
          </td>
          <td>
            secretEncryption
          </td>
          <td>
            SystemAndCommunicationsProtections
          </td>
          <td />
        </tr>
        <tr
          aria-hidden={false}
          className="bx--parent-row-v2"
          data-parent-row={true}
          data-row-name="policy-certificatepolicy"
          disabled={false}
        >
          <td
            className="bx--table-expand-v2"
            headers="expand"
          >
            <button
              aria-label="TableExpandRow"
              className="bx--table-expand-v2__button"
              onClick={[Function]}
            >
              <svg
                alt="Provide a description that will be used as the title"
                aria-label="Provide a description that will be used as the title"
                className="bx--table-expand-v2__svg"
                fillRule="evenodd"
                height="12"
                role="img"
                viewBox="0 0 7 12"
                width="7"
              >
                <title>
                  Provide a description that will be used as the title
                </title>
                <path
                  d="M5.569 5.994L0 .726.687 0l6.336 5.994-6.335 6.002L0 11.27z"
                />
              </svg>
            </button>
          </td>
          <td>
            policy-certificatepolicy
          </td>
          <td>
            inform
          </td>
          <td>
            0/2
          </td>
          <td>
            FISMA, PCI
          </td>
          <td>
            CertManager
          </td>
          <td>
            SystemAndInformationIntegrity
          </td>
          <td />
        </tr>
        <tr
          aria-hidden={false}
          className="bx--parent-row-v2"
          data-parent-row={true}
          data-row-name="policy-iampolicy"
          disabled={false}
        >
          <td
            className="bx--table-expand-v2"
            headers="expand"
          >
            <button
              aria-label="TableExpandRow"
              className="bx--table-expand-v2__button"
              onClick={[Function]}
            >
              <svg
                alt="Provide a description that will be used as the title"
                aria-label="Provide a description that will be used as the title"
                className="bx--table-expand-v2__svg"
                fillRule="evenodd"
                height="12"
                role="img"
                viewBox="0 0 7 12"
                width="7"
              >
                <title>
                  Provide a description that will be used as the title
                </title>
                <path
                  d="M5.569 5.994L0 .726.687 0l6.336 5.994-6.335 6.002L0 11.27z"
                />
              </svg>
            </button>
          </td>
          <td>
            policy-iampolicy
          </td>
          <td>
            inform
          </td>
          <td>
            2/2
          </td>
          <td>
            FISMA
          </td>
          <td>
            MutationAdvisor
          </td>
          <td>
            SystemAndCommunicationsProtections
          </td>
          <td />
        </tr>
        <tr
          aria-hidden={false}
          className="bx--parent-row-v2"
          data-parent-row={true}
          data-row-name="policy-image"
          disabled={false}
        >
          <td
            className="bx--table-expand-v2"
            headers="expand"
          >
            <button
              aria-label="TableExpandRow"
              className="bx--table-expand-v2__button"
              onClick={[Function]}
            >
              <svg
                alt="Provide a description that will be used as the title"
                aria-label="Provide a description that will be used as the title"
                className="bx--table-expand-v2__svg"
                fillRule="evenodd"
                height="12"
                role="img"
                viewBox="0 0 7 12"
                width="7"
              >
                <title>
                  Provide a description that will be used as the title
                </title>
                <path
                  d="M5.569 5.994L0 .726.687 0l6.336 5.994-6.335 6.002L0 11.27z"
                />
              </svg>
            </button>
          </td>
          <td>
            policy-image
          </td>
          <td>
            inform
          </td>
          <td>
            2/2
          </td>
          <td>
            FISMA
          </td>
          <td>
            VA
          </td>
          <td>
            SystemAndCommunicationsProtections
          </td>
          <td />
        </tr>
        <tr
          aria-hidden={false}
          className="bx--parent-row-v2"
          data-parent-row={true}
          data-row-name="policy-limitrange"
          disabled={false}
        >
          <td
            className="bx--table-expand-v2"
            headers="expand"
          >
            <button
              aria-label="TableExpandRow"
              className="bx--table-expand-v2__button"
              onClick={[Function]}
            >
              <svg
                alt="Provide a description that will be used as the title"
                aria-label="Provide a description that will be used as the title"
                className="bx--table-expand-v2__svg"
                fillRule="evenodd"
                height="12"
                role="img"
                viewBox="0 0 7 12"
                width="7"
              >
                <title>
                  Provide a description that will be used as the title
                </title>
                <path
                  d="M5.569 5.994L0 .726.687 0l6.336 5.994-6.335 6.002L0 11.27z"
                />
              </svg>
            </button>
          </td>
          <td>
            policy-limitrange
          </td>
          <td>
            inform
          </td>
          <td>
            2/2
          </td>
          <td>
            HIPAA
          </td>
          <td>
            CertManager
          </td>
          <td>
            SystemAndCommunicationsProtections
          </td>
          <td />
        </tr>
        <tr
          aria-hidden={false}
          className="bx--parent-row-v2"
          data-parent-row={true}
          data-row-name="policy-namespace"
          disabled={false}
        >
          <td
            className="bx--table-expand-v2"
            headers="expand"
          >
            <button
              aria-label="TableExpandRow"
              className="bx--table-expand-v2__button"
              onClick={[Function]}
            >
              <svg
                alt="Provide a description that will be used as the title"
                aria-label="Provide a description that will be used as the title"
                className="bx--table-expand-v2__svg"
                fillRule="evenodd"
                height="12"
                role="img"
                viewBox="0 0 7 12"
                width="7"
              >
                <title>
                  Provide a description that will be used as the title
                </title>
                <path
                  d="M5.569 5.994L0 .726.687 0l6.336 5.994-6.335 6.002L0 11.27z"
                />
              </svg>
            </button>
          </td>
          <td>
            policy-namespace
          </td>
          <td>
            enforce
          </td>
          <td>
            2/2
          </td>
          <td>
            NIST,HIPAA
          </td>
          <td>
            MutationAdvisor
          </td>
          <td>
            SystemAndCommunicationsProtections,SystemAndInformationIntegrity
          </td>
          <td />
        </tr>
        <tr
          aria-hidden={false}
          className="bx--parent-row-v2"
          data-parent-row={true}
          data-row-name="policy-pod"
          disabled={false}
        >
          <td
            className="bx--table-expand-v2"
            headers="expand"
          >
            <button
              aria-label="TableExpandRow"
              className="bx--table-expand-v2__button"
              onClick={[Function]}
            >
              <svg
                alt="Provide a description that will be used as the title"
                aria-label="Provide a description that will be used as the title"
                className="bx--table-expand-v2__svg"
                fillRule="evenodd"
                height="12"
                role="img"
                viewBox="0 0 7 12"
                width="7"
              >
                <title>
                  Provide a description that will be used as the title
                </title>
                <path
                  d="M5.569 5.994L0 .726.687 0l6.336 5.994-6.335 6.002L0 11.27z"
                />
              </svg>
            </button>
          </td>
          <td>
            policy-pod
          </td>
          <td>
            inform
          </td>
          <td>
            2/2
          </td>
          <td>
            FISMA
          </td>
          <td>
            MutationAdvisor
          </td>
          <td>
            SystemAndCommunicationsProtections
          </td>
          <td />
        </tr>
        <tr
          aria-hidden={false}
          className="bx--parent-row-v2"
          data-parent-row={true}
          data-row-name="policy-pod-2"
          disabled={false}
        >
          <td
            className="bx--table-expand-v2"
            headers="expand"
          >
            <button
              aria-label="TableExpandRow"
              className="bx--table-expand-v2__button"
              onClick={[Function]}
            >
              <svg
                alt="Provide a description that will be used as the title"
                aria-label="Provide a description that will be used as the title"
                className="bx--table-expand-v2__svg"
                fillRule="evenodd"
                height="12"
                role="img"
                viewBox="0 0 7 12"
                width="7"
              >
                <title>
                  Provide a description that will be used as the title
                </title>
                <path
                  d="M5.569 5.994L0 .726.687 0l6.336 5.994-6.335 6.002L0 11.27z"
                />
              </svg>
            </button>
          </td>
          <td>
            policy-pod-2
          </td>
          <td>
            inform
          </td>
          <td>
            2/2
          </td>
          <td>
            HIPAA
          </td>
          <td>
            VA
          </td>
          <td>
            SystemAndCommunicationsProtections
          </td>
          <td />
        </tr>
        <tr
          aria-hidden={false}
          className="bx--parent-row-v2"
          data-parent-row={true}
          data-row-name="policy-pod-edge"
          disabled={false}
        >
          <td
            className="bx--table-expand-v2"
            headers="expand"
          >
            <button
              aria-label="TableExpandRow"
              className="bx--table-expand-v2__button"
              onClick={[Function]}
            >
              <svg
                alt="Provide a description that will be used as the title"
                aria-label="Provide a description that will be used as the title"
                className="bx--table-expand-v2__svg"
                fillRule="evenodd"
                height="12"
                role="img"
                viewBox="0 0 7 12"
                width="7"
              >
                <title>
                  Provide a description that will be used as the title
                </title>
                <path
                  d="M5.569 5.994L0 .726.687 0l6.336 5.994-6.335 6.002L0 11.27z"
                />
              </svg>
            </button>
          </td>
          <td>
            policy-pod-edge
          </td>
          <td>
            inform
          </td>
          <td>
            2/2
          </td>
          <td>
            HIPAA
          </td>
          <td>
            VA
          </td>
          <td>
            SystemAndCommunicationsProtections
          </td>
          <td />
        </tr>
      </tbody>
    </table>
  </div>,
  <div
    className="bx--pagination"
    disabled={false}
  >
    <div
      className="bx--pagination__left"
    >
      <span
        className="bx--pagination__text"
      >
        items per page
      </span>
      <div
        className="bx--form-item"
      >
        <div
          className="bx--select bx--select--inline"
        >
          <label
            className="bx--label bx--visually-hidden"
            htmlFor="bx-pagination-select-resource-table-pagination"
          >
            items per page
          </label>
          <select
            className="bx--select-input"
            id="bx-pagination-select-resource-table-pagination"
            onChange={[Function]}
            value={10}
          >
            <option
              className="bx--select-option"
              disabled={false}
              hidden={false}
              value={5}
            >
              5
            </option>
            <option
              className="bx--select-option"
              disabled={false}
              hidden={false}
              value={10}
            >
              10
            </option>
            <option
              className="bx--select-option"
              disabled={false}
              hidden={false}
              value={20}
            >
              20
            </option>
            <option
              className="bx--select-option"
              disabled={false}
              hidden={false}
              value={50}
            >
              50
            </option>
            <option
              className="bx--select-option"
              disabled={false}
              hidden={false}
              value={75}
            >
              75
            </option>
            <option
              className="bx--select-option"
              disabled={false}
              hidden={false}
              value={100}
            >
              100
            </option>
          </select>
          <svg
            alt="open list of options"
            aria-label="open list of options"
            className="bx--select__arrow"
            fillRule="evenodd"
            height="5"
            role="img"
            viewBox="0 0 10 5"
            width="10"
          >
            <title>
              open list of options
            </title>
            <path
              d="M0 0l5 4.998L10 0z"
            />
          </svg>
        </div>
      </div>
      <span
        className="bx--pagination__text"
      >
         |  
        {0}-{1} of {0} items
      </span>
    </div>
    <div
      className="bx--pagination__right bx--pagination--inline"
    >
      <span
        className="bx--pagination__text"
      >
        {0} of {1} pages
      </span>
      <button
        aria-label="Previous page"
        className="bx--pagination__button bx--pagination__button--backward bx--pagination__button--no-index"
        disabled={true}
        onClick={[Function]}
      >
        <svg
          alt="Previous page"
          aria-label="Previous page"
          className="bx--pagination__button-icon"
          fillRule="evenodd"
          height="12"
          role="img"
          viewBox="0 0 7 12"
          width="7"
        >
          <title>
            Previous page
          </title>
          <path
            d="M1.45 6.002L7 11.27l-.685.726L0 6.003 6.315 0 7 .726z"
          />
        </svg>
      </button>
      <div
        className="bx--form-item"
      >
        <div
          className="bx--select bx--select--inline"
        >
          <label
            className="bx--label bx--visually-hidden"
            htmlFor="bx-pagination-select-resource-table-pagination2"
          >
            items per page
          </label>
          <select
            className="bx--select-input"
            id="bx-pagination-select-resource-table-pagination2"
            onChange={[Function]}
            value={1}
          >
            <option
              className="bx--select-option"
              disabled={false}
              hidden={false}
              value={1}
            >
              1
            </option>
            <option
              className="bx--select-option"
              disabled={false}
              hidden={false}
              value={2}
            >
              2
            </option>
          </select>
          <svg
            alt="open list of options"
            aria-label="open list of options"
            className="bx--select__arrow"
            fillRule="evenodd"
            height="5"
            role="img"
            viewBox="0 0 10 5"
            width="10"
          >
            <title>
              open list of options
            </title>
            <path
              d="M0 0l5 4.998L10 0z"
            />
          </svg>
        </div>
      </div>
      <button
        aria-label="Next page"
        className="bx--pagination__button bx--pagination__button--forward"
        disabled={false}
        onClick={[Function]}
      >
        <svg
          alt="Next page"
          aria-label="Next page"
          className="bx--pagination__button-icon"
          fillRule="evenodd"
          height="12"
          role="img"
          viewBox="0 0 7 12"
          width="7"
        >
          <title>
            Next page
          </title>
          <path
            d="M5.569 5.994L0 .726.687 0l6.336 5.994-6.335 6.002L0 11.27z"
          />
        </svg>
      </button>
    </div>
  </div>,
]
`;
