@@ -101,7 +98,7 @@ describe('useIsPointerDown', () => {
};
const { getByTestSubject } = render(
);
- expect(isPointerDown!).toBe(false);
+ expect(isPointerDownRef.current).toBe(false);
act(() => {
const outside = getByTestSubject('outside');
@@ -109,61 +106,51 @@ describe('useIsPointerDown', () => {
new PointerEvent('pointerdown', { bubbles: true })
);
});
- expect(isPointerDown!).toBe(false);
+ expect(isPointerDownRef.current).toBe(false);
});
});
describe('pointercancel and visibilitychange events', () => {
it('resets to false on pointercancel', () => {
- let isPointerDown: boolean;
-
- const TestComponent = () => {
- isPointerDown = useIsPointerDown();
- return null;
- };
+ const {
+ result: { current: ref },
+ } = renderHook(useIsPointerDown);
- render(
);
-
- act(() => {
+ renderHookAct(() => {
document.dispatchEvent(
new PointerEvent('pointerdown', { bubbles: true })
);
});
- expect(isPointerDown!).toBe(true);
+ expect(ref.current).toBe(true);
- act(() => {
+ renderHookAct(() => {
document.dispatchEvent(
new PointerEvent('pointercancel', { bubbles: true })
);
});
- expect(isPointerDown!).toBe(false);
+ expect(ref.current).toBe(false);
});
it('resets to false when document becomes hidden', () => {
- let isPointerDown: boolean;
+ const {
+ result: { current: ref },
+ } = renderHook(useIsPointerDown);
- const TestComponent = () => {
- isPointerDown = useIsPointerDown();
- return null;
- };
-
- render(
);
-
- act(() => {
+ renderHookAct(() => {
document.dispatchEvent(
new PointerEvent('pointerdown', { bubbles: true })
);
});
- expect(isPointerDown!).toBe(true);
+ expect(ref.current).toBe(true);
- act(() => {
+ renderHookAct(() => {
Object.defineProperty(document, 'visibilityState', {
value: 'hidden',
configurable: true,
});
document.dispatchEvent(new Event('visibilitychange'));
});
- expect(isPointerDown!).toBe(false);
+ expect(ref.current).toBe(false);
// reset
Object.defineProperty(document, 'visibilityState', {
diff --git a/packages/eui/src/services/hooks/useIsPointerDown.ts b/packages/eui/src/services/hooks/useIsPointerDown.ts
index fb0586ea6f64..7792e6fc35eb 100644
--- a/packages/eui/src/services/hooks/useIsPointerDown.ts
+++ b/packages/eui/src/services/hooks/useIsPointerDown.ts
@@ -6,7 +6,7 @@
* Side Public License, v 1.
*/
-import { useState, useEffect, MutableRefObject } from 'react';
+import { useRef, useEffect, type MutableRefObject } from 'react';
/**
* A hook that tracks whether the pointer is currently down/pressed.
@@ -15,7 +15,7 @@ import { useState, useEffect, MutableRefObject } from 'react';
export function useIsPointerDown(
container?: MutableRefObject
) {
- const [isPointerDown, setIsPointerDown] = useState(false);
+ const isPointerDownRef = useRef(false);
useEffect(() => {
const handlePointerDown = (event: PointerEvent) => {
@@ -25,16 +25,16 @@ export function useIsPointerDown(
) {
return;
}
- setIsPointerDown(true);
+ isPointerDownRef.current = true;
};
const handlePointerUpOrCancel = () => {
- setIsPointerDown(false);
+ isPointerDownRef.current = false;
};
const handleVisibilityChange = () => {
if (document.visibilityState === 'hidden') {
- setIsPointerDown(false);
+ isPointerDownRef.current = false;
}
};
@@ -57,5 +57,5 @@ export function useIsPointerDown(
};
}, [container]);
- return isPointerDown;
+ return isPointerDownRef;
}
diff --git a/packages/eui/src/services/index.ts b/packages/eui/src/services/index.ts
index 5eaeefd288fc..23a836eeb99d 100644
--- a/packages/eui/src/services/index.ts
+++ b/packages/eui/src/services/index.ts
@@ -85,7 +85,19 @@ export {
formatNumber,
formatText,
} from './format';
-export * from './hooks';
+export {
+ useDependentState,
+ useCombinedRefs,
+ setMultipleRefs,
+ useForceRender,
+ useLatest,
+ useDeepEqual,
+ isMouseEvent,
+ useMouseMove,
+ useUpdateEffect,
+ useEuiDisabledElement,
+ type EuiDisabledProps,
+} from './hooks';
export { isEvenlyDivisibleBy, isWithinRange } from './number';
export { Pager } from './paging';
export { calculatePopoverPosition, findPopoverPosition } from './popover';