chore: More internal stsn exports (#156)

Author: pan-kot

src/internal/index.ts

@@ -31,6 +31,7 @@ export { getGlobalFlag } from './global-flags';
 export {
   SingleTabStopNavigationAPI,
   SingleTabStopNavigationProvider,
+  SingleTabStopNavigationReset,
   useSingleTabStopNavigation,
 } from './single-tab-stop';
 export { isFocusable, getAllFocusables, getFirstFocusable, getLastFocusable } from './focus-lock-utils/utils';

src/internal/single-tab-stop/__tests__/context.test.tsx

@@ -8,6 +8,7 @@ import {
   SingleTabStopNavigationAPI,
   SingleTabStopNavigationContext,
   SingleTabStopNavigationProvider,
+  SingleTabStopNavigationReset,
   useSingleTabStopNavigation,
 } from '../';
 import { renderWithSingleTabStopNavigation } from './utils';
@@ -247,4 +248,42 @@ describe('nested contexts', () => {
     expect(findGroupButton('inner', 0)).toHaveAttribute('tabindex', '0');
     expect(findGroupButton('inner', 1)).toHaveAttribute('tabindex', '-1');
   });
+
+  test('ignores parent context when reset is used', () => {
+    const { rerender } = render(
+      <Group id="outer-most" navigationActive={true}>
+        <SingleTabStopNavigationReset>
+          <Group id="outer" navigationActive={true}>
+            <Group id="inner" navigationActive={true}>
+              {null}
+            </Group>
+          </Group>
+        </SingleTabStopNavigationReset>
+      </Group>
+    );
+    expect(findGroupButton('outer-most', 0)).toHaveAttribute('tabindex', '0');
+    expect(findGroupButton('outer-most', 1)).toHaveAttribute('tabindex', '-1');
+    expect(findGroupButton('outer', 0)).toHaveAttribute('tabindex', '0');
+    expect(findGroupButton('outer', 1)).toHaveAttribute('tabindex', '-1');
+    expect(findGroupButton('inner', 0)).toHaveAttribute('tabindex', '-1');
+    expect(findGroupButton('inner', 1)).toHaveAttribute('tabindex', '-1');
+
+    rerender(
+      <Group id="outer-most" navigationActive={true}>
+        <Group id="outer" navigationActive={true}>
+          <SingleTabStopNavigationReset>
+            <Group id="inner" navigationActive={true}>
+              {null}
+            </Group>
+          </SingleTabStopNavigationReset>
+        </Group>
+      </Group>
+    );
+    expect(findGroupButton('outer-most', 0)).toHaveAttribute('tabindex', '0');
+    expect(findGroupButton('outer-most', 1)).toHaveAttribute('tabindex', '-1');
+    expect(findGroupButton('outer', 0)).toHaveAttribute('tabindex', '-1');
+    expect(findGroupButton('outer', 1)).toHaveAttribute('tabindex', '-1');
+    expect(findGroupButton('inner', 0)).toHaveAttribute('tabindex', '0');
+    expect(findGroupButton('inner', 1)).toHaveAttribute('tabindex', '-1');
+  });
 });

src/internal/single-tab-stop/__tests__/utils.tsx

@@ -37,7 +37,7 @@ const FakeSingleTabStopNavigationProvider = forwardRef(
 
     return (
       <SingleTabStopNavigationContext.Provider
-        value={{ registerFocusable, navigationActive, resetFocusTarget: () => {} }}
+        value={{ navigationActive, registerFocusable, resetFocusTarget: () => {} }}
       >
         {children}
       </SingleTabStopNavigationContext.Provider>

src/internal/single-tab-stop/index.tsx

@@ -16,7 +16,7 @@ import nodeBelongs from '../../dom/node-belongs';
 
 export type FocusableChangeHandler = (isFocusable: boolean) => void;
 
-export const defaultValue: {
+const defaultValue: {
   navigationActive: boolean;
   registerFocusable(focusable: HTMLElement, handler: FocusableChangeHandler): () => void;
   resetFocusTarget(): void;
@@ -71,6 +71,12 @@ export interface SingleTabStopNavigationAPI {
   isRegistered(element: Element): boolean;
 }
 
+export function SingleTabStopNavigationReset({ children }: { children: React.ReactNode }) {
+  return (
+    <SingleTabStopNavigationContext.Provider value={defaultValue}>{children}</SingleTabStopNavigationContext.Provider>
+  );
+}
+
 export const SingleTabStopNavigationProvider = forwardRef(
   (
     {
@@ -158,7 +164,7 @@ export const SingleTabStopNavigationProvider = forwardRef(
     const parentContext = useContext(SingleTabStopNavigationContext);
     const value = parentContext.navigationActive
       ? parentContext
-      : { navigationActive, registerFocusable, updateFocusTarget, resetFocusTarget };
+      : { navigationReset: false, navigationActive, registerFocusable, updateFocusTarget, resetFocusTarget };
 
     // When contexts switching occurs, it is essential that the now-active one updates the focus target
     // to ensure the tab indices are correctly set.

src/internal/testing.ts

@@ -5,3 +5,4 @@ export { clearOneTimeMetricsCache } from './base-component/metrics/metrics';
 export { clearMessageCache } from './logging';
 export { setGlobalFlag } from './global-flags';
 export { clearVisualRefreshState } from './visual-mode';
+export { renderWithSingleTabStopNavigation } from './single-tab-stop/__tests__/utils';