npm - @patternfly/react-data-view - Versions diffs - 1.0.0-prerelease.3 → 1.0.0-prerelease.5 - Mend

@patternfly/react-data-view 1.0.0-prerelease.3 → 1.0.0-prerelease.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (60) hide show

package/src/DataViewToolbar/__snapshots__/DataViewToolbar.test.tsx.snap ADDED Viewed

@@ -0,0 +1,538 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+exports[`DataViewToolbar component should render correctly 1`] = `
+{
+  "asFragment": [Function],
+  "baseElement": <body>
+    <div>
+      <div
+        class="pf-v6-c-toolbar"
+        data-ouia-component-id="DataViewToolbar"
+        data-ouia-component-type="PF6/Toolbar"
+        data-ouia-safe="true"
+        id="pf-random-id-0"
+      >
+        <div
+          class="pf-v6-c-toolbar__content"
+        >
+          <div
+            class="pf-v6-c-toolbar__content-section"
+          >
+            <div
+              class="pf-v6-c-toolbar__item pf-m-pagination"
+              data-ouia-component-id="DataViewToolbar-pagination"
+            >
+              <div
+                class="pf-v6-c-pagination"
+                data-ouia-component-id="OUIA-Generated-Pagination-top-1"
+                data-ouia-component-type="PF6/Pagination"
+                data-ouia-safe="true"
+                id="options-menu-top-pagination"
+                style="--pf-v6-c-pagination__nav-page-select--c-form-control--width-chars: 2;"
+              >
+                <div
+                  class="pf-v6-c-pagination__total-items"
+                >
+                  <b>
+                    1
+                     -
+                    10
+                  </b>
+                  of
+                  <b>
+                    0
+                  </b>
+                </div>
+                <button
+                  aria-expanded="false"
+                  aria-haspopup="listbox"
+                  class="pf-v6-c-menu-toggle pf-m-plain pf-m-text"
+                  id="options-menu-top-toggle"
+                  type="button"
+                >
+                  <span
+                    class="pf-v6-c-menu-toggle__text"
+                  >
+                    <b>
+                      1
+                       -
+                      10
+                    </b>
+                    of
+                    <b>
+                      0
+                    </b>
+                  </span>
+                  <span
+                    class="pf-v6-c-menu-toggle__controls"
+                  >
+                    <span
+                      class="pf-v6-c-menu-toggle__toggle-icon"
+                    >
+                      <svg
+                        aria-hidden="true"
+                        class="pf-v6-svg"
+                        fill="currentColor"
+                        height="1em"
+                        role="img"
+                        viewBox="0 0 320 512"
+                        width="1em"
+                      >
+                        <path
+                          d="M31.3 192h257.3c17.8 0 26.7 21.5 14.1 34.1L174.1 354.8c-7.8 7.8-20.5 7.8-28.3 0L17.2 226.1C4.6 213.5 13.5 192 31.3 192z"
+                        />
+                      </svg>
+                    </span>
+                  </span>
+                </button>
+                <nav
+                  aria-label="Pagination"
+                  class="pf-v6-c-pagination__nav"
+                >
+                  <div
+                    class="pf-v6-c-pagination__nav-control pf-m-first"
+                  >
+                    <button
+                      aria-disabled="false"
+                      aria-label="Go to first page"
+                      class="pf-v6-c-button pf-m-plain"
+                      data-action="first"
+                      data-ouia-component-id="OUIA-Generated-Button-plain-1"
+                      data-ouia-component-type="PF6/Button"
+                      data-ouia-safe="true"
+                      disabled=""
+                      type="button"
+                    >
+                      <svg
+                        aria-hidden="true"
+                        class="pf-v6-svg"
+                        fill="currentColor"
+                        height="1em"
+                        role="img"
+                        viewBox="0 0 448 512"
+                        width="1em"
+                      >
+                        <path
+                          d="M223.7 239l136-136c9.4-9.4 24.6-9.4 33.9 0l22.6 22.6c9.4 9.4 9.4 24.6 0 33.9L319.9 256l96.4 96.4c9.4 9.4 9.4 24.6 0 33.9L393.7 409c-9.4 9.4-24.6 9.4-33.9 0l-136-136c-9.5-9.4-9.5-24.6-.1-34zm-192 34l136 136c9.4 9.4 24.6 9.4 33.9 0l22.6-22.6c9.4-9.4 9.4-24.6 0-33.9L127.9 256l96.4-96.4c9.4-9.4 9.4-24.6 0-33.9L201.7 103c-9.4-9.4-24.6-9.4-33.9 0l-136 136c-9.5 9.4-9.5 24.6-.1 34z"
+                        />
+                      </svg>
+                    </button>
+                  </div>
+                  <div
+                    class="pf-v6-c-pagination__nav-control"
+                  >
+                    <button
+                      aria-disabled="false"
+                      aria-label="Go to previous page"
+                      class="pf-v6-c-button pf-m-plain"
+                      data-action="previous"
+                      data-ouia-component-id="OUIA-Generated-Button-plain-2"
+                      data-ouia-component-type="PF6/Button"
+                      data-ouia-safe="true"
+                      disabled=""
+                      type="button"
+                    >
+                      <svg
+                        aria-hidden="true"
+                        class="pf-v6-svg"
+                        fill="currentColor"
+                        height="1em"
+                        role="img"
+                        viewBox="0 0 256 512"
+                        width="1em"
+                      >
+                        <path
+                          d="M31.7 239l136-136c9.4-9.4 24.6-9.4 33.9 0l22.6 22.6c9.4 9.4 9.4 24.6 0 33.9L127.9 256l96.4 96.4c9.4 9.4 9.4 24.6 0 33.9L201.7 409c-9.4 9.4-24.6 9.4-33.9 0l-136-136c-9.5-9.4-9.5-24.6-.1-34z"
+                        />
+                      </svg>
+                    </button>
+                  </div>
+                  <div
+                    class="pf-v6-c-pagination__nav-page-select"
+                  >
+                    <span
+                      class="pf-v6-c-form-control"
+                    >
+                      <input
+                        aria-invalid="false"
+                        aria-label="Current page"
+                        data-ouia-component-id="OUIA-Generated-TextInputBase-1"
+                        data-ouia-component-type="PF6/TextInput"
+                        data-ouia-safe="true"
+                        max="2"
+                        min="1"
+                        type="number"
+                        value="1"
+                      />
+                    </span>
+                  </div>
+                  <div
+                    class="pf-v6-c-pagination__nav-control"
+                  >
+                    <button
+                      aria-disabled="false"
+                      aria-label="Go to next page"
+                      class="pf-v6-c-button pf-m-plain"
+                      data-action="next"
+                      data-ouia-component-id="OUIA-Generated-Button-plain-3"
+                      data-ouia-component-type="PF6/Button"
+                      data-ouia-safe="true"
+                      type="button"
+                    >
+                      <svg
+                        aria-hidden="true"
+                        class="pf-v6-svg"
+                        fill="currentColor"
+                        height="1em"
+                        role="img"
+                        viewBox="0 0 256 512"
+                        width="1em"
+                      >
+                        <path
+                          d="M224.3 273l-136 136c-9.4 9.4-24.6 9.4-33.9 0l-22.6-22.6c-9.4-9.4-9.4-24.6 0-33.9l96.4-96.4-96.4-96.4c-9.4-9.4-9.4-24.6 0-33.9L54.3 103c9.4-9.4 24.6-9.4 33.9 0l136 136c9.5 9.4 9.5 24.6.1 34z"
+                        />
+                      </svg>
+                    </button>
+                  </div>
+                  <div
+                    class="pf-v6-c-pagination__nav-control pf-m-last"
+                  >
+                    <button
+                      aria-disabled="false"
+                      aria-label="Go to last page"
+                      class="pf-v6-c-button pf-m-plain"
+                      data-action="last"
+                      data-ouia-component-id="OUIA-Generated-Button-plain-4"
+                      data-ouia-component-type="PF6/Button"
+                      data-ouia-safe="true"
+                      type="button"
+                    >
+                      <svg
+                        aria-hidden="true"
+                        class="pf-v6-svg"
+                        fill="currentColor"
+                        height="1em"
+                        role="img"
+                        viewBox="0 0 448 512"
+                        width="1em"
+                      >
+                        <path
+                          d="M224.3 273l-136 136c-9.4 9.4-24.6 9.4-33.9 0l-22.6-22.6c-9.4-9.4-9.4-24.6 0-33.9l96.4-96.4-96.4-96.4c-9.4-9.4-9.4-24.6 0-33.9L54.3 103c9.4-9.4 24.6-9.4 33.9 0l136 136c9.5 9.4 9.5 24.6.1 34zm192-34l-136-136c-9.4-9.4-24.6-9.4-33.9 0l-22.6 22.6c-9.4 9.4-9.4 24.6 0 33.9l96.4 96.4-96.4 96.4c-9.4 9.4-9.4 24.6 0 33.9l22.6 22.6c9.4 9.4 24.6 9.4 33.9 0l136-136c9.4-9.2 9.4-24.4 0-33.8z"
+                        />
+                      </svg>
+                    </button>
+                  </div>
+                </nav>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div
+          class="pf-v6-c-toolbar__content pf-m-hidden"
+          hidden=""
+        >
+          <div
+            class="pf-v6-c-toolbar__group"
+          />
+        </div>
+      </div>
+    </div>
+  </body>,
+  "container": <div>
+    <div
+      class="pf-v6-c-toolbar"
+      data-ouia-component-id="DataViewToolbar"
+      data-ouia-component-type="PF6/Toolbar"
+      data-ouia-safe="true"
+      id="pf-random-id-0"
+    >
+      <div
+        class="pf-v6-c-toolbar__content"
+      >
+        <div
+          class="pf-v6-c-toolbar__content-section"
+        >
+          <div
+            class="pf-v6-c-toolbar__item pf-m-pagination"
+            data-ouia-component-id="DataViewToolbar-pagination"
+          >
+            <div
+              class="pf-v6-c-pagination"
+              data-ouia-component-id="OUIA-Generated-Pagination-top-1"
+              data-ouia-component-type="PF6/Pagination"
+              data-ouia-safe="true"
+              id="options-menu-top-pagination"
+              style="--pf-v6-c-pagination__nav-page-select--c-form-control--width-chars: 2;"
+            >
+              <div
+                class="pf-v6-c-pagination__total-items"
+              >
+                <b>
+                  1
+                   -
+                  10
+                </b>
+                of
+                <b>
+                  0
+                </b>
+              </div>
+              <button
+                aria-expanded="false"
+                aria-haspopup="listbox"
+                class="pf-v6-c-menu-toggle pf-m-plain pf-m-text"
+                id="options-menu-top-toggle"
+                type="button"
+              >
+                <span
+                  class="pf-v6-c-menu-toggle__text"
+                >
+                  <b>
+                    1
+                     -
+                    10
+                  </b>
+                  of
+                  <b>
+                    0
+                  </b>
+                </span>
+                <span
+                  class="pf-v6-c-menu-toggle__controls"
+                >
+                  <span
+                    class="pf-v6-c-menu-toggle__toggle-icon"
+                  >
+                    <svg
+                      aria-hidden="true"
+                      class="pf-v6-svg"
+                      fill="currentColor"
+                      height="1em"
+                      role="img"
+                      viewBox="0 0 320 512"
+                      width="1em"
+                    >
+                      <path
+                        d="M31.3 192h257.3c17.8 0 26.7 21.5 14.1 34.1L174.1 354.8c-7.8 7.8-20.5 7.8-28.3 0L17.2 226.1C4.6 213.5 13.5 192 31.3 192z"
+                      />
+                    </svg>
+                  </span>
+                </span>
+              </button>
+              <nav
+                aria-label="Pagination"
+                class="pf-v6-c-pagination__nav"
+              >
+                <div
+                  class="pf-v6-c-pagination__nav-control pf-m-first"
+                >
+                  <button
+                    aria-disabled="false"
+                    aria-label="Go to first page"
+                    class="pf-v6-c-button pf-m-plain"
+                    data-action="first"
+                    data-ouia-component-id="OUIA-Generated-Button-plain-1"
+                    data-ouia-component-type="PF6/Button"
+                    data-ouia-safe="true"
+                    disabled=""
+                    type="button"
+                  >
+                    <svg
+                      aria-hidden="true"
+                      class="pf-v6-svg"
+                      fill="currentColor"
+                      height="1em"
+                      role="img"
+                      viewBox="0 0 448 512"
+                      width="1em"
+                    >
+                      <path
+                        d="M223.7 239l136-136c9.4-9.4 24.6-9.4 33.9 0l22.6 22.6c9.4 9.4 9.4 24.6 0 33.9L319.9 256l96.4 96.4c9.4 9.4 9.4 24.6 0 33.9L393.7 409c-9.4 9.4-24.6 9.4-33.9 0l-136-136c-9.5-9.4-9.5-24.6-.1-34zm-192 34l136 136c9.4 9.4 24.6 9.4 33.9 0l22.6-22.6c9.4-9.4 9.4-24.6 0-33.9L127.9 256l96.4-96.4c9.4-9.4 9.4-24.6 0-33.9L201.7 103c-9.4-9.4-24.6-9.4-33.9 0l-136 136c-9.5 9.4-9.5 24.6-.1 34z"
+                      />
+                    </svg>
+                  </button>
+                </div>
+                <div
+                  class="pf-v6-c-pagination__nav-control"
+                >
+                  <button
+                    aria-disabled="false"
+                    aria-label="Go to previous page"
+                    class="pf-v6-c-button pf-m-plain"
+                    data-action="previous"
+                    data-ouia-component-id="OUIA-Generated-Button-plain-2"
+                    data-ouia-component-type="PF6/Button"
+                    data-ouia-safe="true"
+                    disabled=""
+                    type="button"
+                  >
+                    <svg
+                      aria-hidden="true"
+                      class="pf-v6-svg"
+                      fill="currentColor"
+                      height="1em"
+                      role="img"
+                      viewBox="0 0 256 512"
+                      width="1em"
+                    >
+                      <path
+                        d="M31.7 239l136-136c9.4-9.4 24.6-9.4 33.9 0l22.6 22.6c9.4 9.4 9.4 24.6 0 33.9L127.9 256l96.4 96.4c9.4 9.4 9.4 24.6 0 33.9L201.7 409c-9.4 9.4-24.6 9.4-33.9 0l-136-136c-9.5-9.4-9.5-24.6-.1-34z"
+                      />
+                    </svg>
+                  </button>
+                </div>
+                <div
+                  class="pf-v6-c-pagination__nav-page-select"
+                >
+                  <span
+                    class="pf-v6-c-form-control"
+                  >
+                    <input
+                      aria-invalid="false"
+                      aria-label="Current page"
+                      data-ouia-component-id="OUIA-Generated-TextInputBase-1"
+                      data-ouia-component-type="PF6/TextInput"
+                      data-ouia-safe="true"
+                      max="2"
+                      min="1"
+                      type="number"
+                      value="1"
+                    />
+                  </span>
+                </div>
+                <div
+                  class="pf-v6-c-pagination__nav-control"
+                >
+                  <button
+                    aria-disabled="false"
+                    aria-label="Go to next page"
+                    class="pf-v6-c-button pf-m-plain"
+                    data-action="next"
+                    data-ouia-component-id="OUIA-Generated-Button-plain-3"
+                    data-ouia-component-type="PF6/Button"
+                    data-ouia-safe="true"
+                    type="button"
+                  >
+                    <svg
+                      aria-hidden="true"
+                      class="pf-v6-svg"
+                      fill="currentColor"
+                      height="1em"
+                      role="img"
+                      viewBox="0 0 256 512"
+                      width="1em"
+                    >
+                      <path
+                        d="M224.3 273l-136 136c-9.4 9.4-24.6 9.4-33.9 0l-22.6-22.6c-9.4-9.4-9.4-24.6 0-33.9l96.4-96.4-96.4-96.4c-9.4-9.4-9.4-24.6 0-33.9L54.3 103c9.4-9.4 24.6-9.4 33.9 0l136 136c9.5 9.4 9.5 24.6.1 34z"
+                      />
+                    </svg>
+                  </button>
+                </div>
+                <div
+                  class="pf-v6-c-pagination__nav-control pf-m-last"
+                >
+                  <button
+                    aria-disabled="false"
+                    aria-label="Go to last page"
+                    class="pf-v6-c-button pf-m-plain"
+                    data-action="last"
+                    data-ouia-component-id="OUIA-Generated-Button-plain-4"
+                    data-ouia-component-type="PF6/Button"
+                    data-ouia-safe="true"
+                    type="button"
+                  >
+                    <svg
+                      aria-hidden="true"
+                      class="pf-v6-svg"
+                      fill="currentColor"
+                      height="1em"
+                      role="img"
+                      viewBox="0 0 448 512"
+                      width="1em"
+                    >
+                      <path
+                        d="M224.3 273l-136 136c-9.4 9.4-24.6 9.4-33.9 0l-22.6-22.6c-9.4-9.4-9.4-24.6 0-33.9l96.4-96.4-96.4-96.4c-9.4-9.4-9.4-24.6 0-33.9L54.3 103c9.4-9.4 24.6-9.4 33.9 0l136 136c9.5 9.4 9.5 24.6.1 34zm192-34l-136-136c-9.4-9.4-24.6-9.4-33.9 0l-22.6 22.6c-9.4 9.4-9.4 24.6 0 33.9l96.4 96.4-96.4 96.4c-9.4 9.4-9.4 24.6 0 33.9l22.6 22.6c9.4 9.4 24.6 9.4 33.9 0l136-136c9.4-9.2 9.4-24.4 0-33.8z"
+                      />
+                    </svg>
+                  </button>
+                </div>
+              </nav>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div
+        class="pf-v6-c-toolbar__content pf-m-hidden"
+        hidden=""
+      >
+        <div
+          class="pf-v6-c-toolbar__group"
+        />
+      </div>
+    </div>
+  </div>,
+  "debug": [Function],
+  "findAllByAltText": [Function],
+  "findAllByDisplayValue": [Function],
+  "findAllByLabelText": [Function],
+  "findAllByPlaceholderText": [Function],
+  "findAllByRole": [Function],
+  "findAllByTestId": [Function],
+  "findAllByText": [Function],
+  "findAllByTitle": [Function],
+  "findByAltText": [Function],
+  "findByDisplayValue": [Function],
+  "findByLabelText": [Function],
+  "findByPlaceholderText": [Function],
+  "findByRole": [Function],
+  "findByTestId": [Function],
+  "findByText": [Function],
+  "findByTitle": [Function],
+  "getAllByAltText": [Function],
+  "getAllByDisplayValue": [Function],
+  "getAllByLabelText": [Function],
+  "getAllByPlaceholderText": [Function],
+  "getAllByRole": [Function],
+  "getAllByTestId": [Function],
+  "getAllByText": [Function],
+  "getAllByTitle": [Function],
+  "getByAltText": [Function],
+  "getByDisplayValue": [Function],
+  "getByLabelText": [Function],
+  "getByPlaceholderText": [Function],
+  "getByRole": [Function],
+  "getByTestId": [Function],
+  "getByText": [Function],
+  "getByTitle": [Function],
+  "queryAllByAltText": [Function],
+  "queryAllByDisplayValue": [Function],
+  "queryAllByLabelText": [Function],
+  "queryAllByPlaceholderText": [Function],
+  "queryAllByRole": [Function],
+  "queryAllByTestId": [Function],
+  "queryAllByText": [Function],
+  "queryAllByTitle": [Function],
+  "queryByAltText": [Function],
+  "queryByDisplayValue": [Function],
+  "queryByLabelText": [Function],
+  "queryByPlaceholderText": [Function],
+  "queryByRole": [Function],
+  "queryByTestId": [Function],
+  "queryByText": [Function],
+  "queryByTitle": [Function],
+  "rerender": [Function],
+  "unmount": [Function],
+}
+`;

package/src/Hooks/index.ts CHANGED Viewed

@@ -1 +1,2 @@
-export * from './useDataViewPagination';
+export * from './pagination';
+export * from './selection';

package/src/Hooks/pagination.test.tsx ADDED Viewed

@@ -0,0 +1,57 @@
+import '@testing-library/jest-dom';
+import { renderHook, act } from '@testing-library/react';
+import { useDataViewPagination } from './pagination';
+describe('useDataViewPagination', () => {
+  it('should get initial state correctly - no page', () => {
+    const { result } = renderHook(() => useDataViewPagination({ perPage: 7 }))
+    expect(result.current).toEqual({
+      onPerPageSelect: expect.any(Function),
+      onSetPage: expect.any(Function),
+      page: 1,
+      perPage: 7
+    })
+  });
+  it('should get initial state correctly - page set', () => {
+    const { result } = renderHook(() => useDataViewPagination({ page: 3, perPage: 5 }))
+    expect(result.current).toEqual({
+      onPerPageSelect: expect.any(Function),
+      onSetPage: expect.any(Function),
+      page: 3,
+      perPage: 5
+    })
+  });
+  it('should set page correctly', () => {
+    const { result } = renderHook(() => useDataViewPagination({ page: 3, perPage: 5 }))
+    act(() => {
+      result.current.onSetPage(undefined, 8);
+    });
+    expect(result.current).toEqual({
+      onPerPageSelect: expect.any(Function),
+      onSetPage: expect.any(Function),
+      page: 8,
+      perPage: 5
+    })
+  });
+  it('should set perPage correctly', () => {
+    const { result } = renderHook(() => useDataViewPagination({ page: 3, perPage: 5 }))
+    act(() => {
+      result.current.onPerPageSelect(undefined, 50);
+    });
+    expect(result.current).toEqual({
+      onPerPageSelect: expect.any(Function),
+      onSetPage: expect.any(Function),
+      page: 3,
+      perPage: 50
+    })
+  });
+});

package/src/Hooks/pagination.ts ADDED Viewed

@@ -0,0 +1,31 @@
+import { useState } from "react";
+export interface UseDataViewPaginationProps {
+  /** Initial page */
+  page?: number;
+  /** Items per page */
+  perPage: number;
+}
+export interface DataViewPaginationProps extends UseDataViewPaginationProps {
+  /** Current page number */
+    page: number;
+}
+export const useDataViewPagination = ({ page = 1, perPage }: UseDataViewPaginationProps) => {
+  const [ state, setState ] = useState({ page, perPage });
+  const onPerPageSelect = (_event: React.MouseEvent | React.KeyboardEvent | MouseEvent | undefined, newPerPage: number) => {
+    setState(prev => ({ ...prev, perPage: newPerPage }));
+  }
+  const onSetPage = (_event: React.MouseEvent | React.KeyboardEvent | MouseEvent | undefined, newPage: number) => {
+    setState(prev => ({ ...prev, page: newPage }));
+  }
+  return {
+    ...state,
+    onPerPageSelect,
+    onSetPage
+  }
+}

package/src/Hooks/selection.test.tsx ADDED Viewed

@@ -0,0 +1,52 @@
+import '@testing-library/jest-dom';
+import { renderHook, act } from '@testing-library/react';
+import { useDataViewSelection } from './selection';
+describe('useDataViewSelection', () => {
+  it('should get initial state correctly - no initialSelected', () => {
+    const { result } = renderHook(() => useDataViewSelection({}))
+    expect(result.current).toEqual({
+      selected: [],
+      onSelect: expect.any(Function),
+      isSelected: expect.any(Function),
+    })
+  });
+  it('should get initial state correctly - with initialSelected', () => {
+    const initialSelected = [ { id: 1, name: 'test1' } ];
+    const { result } = renderHook(() => useDataViewSelection({ initialSelected }))
+    expect(result.current).toEqual({
+      selected: initialSelected,
+      onSelect: expect.any(Function),
+      isSelected: expect.any(Function),
+    })
+  });
+  it('should select items correctly - objects', async () => {
+    const initialSelected = [ { id: 1, name: 'test1' } ];
+    const { result } = renderHook(() => useDataViewSelection({ initialSelected }))
+    await act(async () => {
+      result.current.onSelect(true, { id: 2, name: 'test2' });
+    });
+    expect(result.current.selected).toEqual([ ...initialSelected, { id: 2, name: 'test2' } ]);
+  });
+  it('should deselect items correctly - strings', async () => {
+    const initialSelected = [ 'test1', 'test2' ];
+    const { result } = renderHook(() => useDataViewSelection({ initialSelected }))
+    await act(async () => {
+      result.current.onSelect(false, 'test2');
+    });
+    expect(result.current.selected).toEqual([ 'test1' ])
+  });
+  it('should check if item is selected correctly - objects', () => {
+    const initialSelected = [ { id: 1, name: 'test1' }, { id: 2, name: 'test2' } ];
+    const { result } = renderHook(() => useDataViewSelection({ initialSelected, matchOption: (a,b) => a.id === b.id }))
+    expect(result.current.isSelected({ id: 1, name: 'test1' })).toBe(true);
+    expect(result.current.isSelected({ id: 3, name: 'test2' })).toBe(false);
+  });
+});