fix: Fix CompositeItem with tabindex=0 on the first render (#817)

ariakit · Jan 3, 2021 · 3d81514 · 3d81514
1 parent 9ae71ce
commit 3d81514
Show file tree

Hide file tree

Showing 8 changed files with 9 additions and 9 deletions.
diff --git a/packages/reakit/src/Composite/CompositeItem.ts b/packages/reakit/src/Composite/CompositeItem.ts
@@ -151,7 +151,7 @@ export const useCompositeItem = createHook<
         isCurrentItem) ||
       // We don't want to set tabIndex="-1" when using CompositeItem as a
       // standalone component, without state props.
-      !options.items?.length;
+      !options.items;
 
     React.useEffect(() => {
       if (!id) return undefined;

diff --git a/packages/reakit/src/Grid/__tests__/GridCell-test.tsx b/packages/reakit/src/Grid/__tests__/GridCell-test.tsx
@@ -26,7 +26,7 @@ test("render", () => {
       <span
         id="gridcell"
         role="gridcell"
-        tabindex="0"
+        tabindex="-1"
       />
     </div>
   `);

diff --git a/packages/reakit/src/Menu/__tests__/MenuItem-test.tsx b/packages/reakit/src/Menu/__tests__/MenuItem-test.tsx
@@ -26,7 +26,7 @@ test("render", () => {
         <button
           id="item"
           role="menuitem"
-          tabindex="0"
+          tabindex="-1"
         >
           item
         </button>

diff --git a/packages/reakit/src/Menu/__tests__/MenuItemCheckbox-test.tsx b/packages/reakit/src/Menu/__tests__/MenuItemCheckbox-test.tsx
@@ -31,7 +31,7 @@ test("render", () => {
           id="item"
           name="checkbox"
           role="menuitemcheckbox"
-          tabindex="0"
+          tabindex="-1"
         />
       </div>
     </body>

diff --git a/packages/reakit/src/Menu/__tests__/MenuItemRadio-test.tsx b/packages/reakit/src/Menu/__tests__/MenuItemRadio-test.tsx
@@ -31,7 +31,7 @@ test("render", () => {
           aria-checked="false"
           id="item"
           role="menuitemradio"
-          tabindex="0"
+          tabindex="-1"
         />
       </div>
     </body>

diff --git a/packages/reakit/src/Radio/__tests__/Radio-test.tsx b/packages/reakit/src/Radio/__tests__/Radio-test.tsx
@@ -26,7 +26,7 @@ test("render", () => {
         <input
           aria-checked="false"
           id="radio"
-          tabindex="0"
+          tabindex="-1"
           type="radio"
           value="radio"
         />

diff --git a/packages/reakit/src/Tab/__tests__/Tab-test.tsx b/packages/reakit/src/Tab/__tests__/Tab-test.tsx
@@ -30,7 +30,7 @@ test("render", () => {
           aria-selected="false"
           id="tab"
           role="tab"
-          tabindex="0"
+          tabindex="-1"
         >
           tab
         </button>
@@ -93,7 +93,7 @@ test("render selected", () => {
           aria-selected="true"
           id="tab"
           role="tab"
-          tabindex="0"
+          tabindex="-1"
         >
           tab
         </button>

diff --git a/packages/reakit/src/Toolbar/__tests__/ToolbarItem-test.tsx b/packages/reakit/src/Toolbar/__tests__/ToolbarItem-test.tsx
@@ -24,7 +24,7 @@ test("render", () => {
       <div>
         <button
           id="item"
-          tabindex="0"
+          tabindex="-1"
         >
           button
         </button>