emoji-picker-react 4.20.0 → 4.20.2

package/src/dataUtils/suggested.ts

@@ -1,7 +1,7 @@
 import { SkinTones, SuggestionMode } from '../types/exposedTypes';
 
 import { DataEmoji } from './DataTypes';
-import { emojiUnified } from './emojiSelectors';
+import { emojiUnified } from './emojiUtils';
 
 const SUGGESTED_LS_KEY = 'epr_suggested';
 
@@ -15,11 +15,11 @@ type Suggested = SuggestedItem[];
 
 export function getSuggested(mode?: SuggestionMode): Suggested {
   try {
-    if (!window?.localStorage) {
+    if (typeof window === 'undefined' || !window.localStorage) {
       return [];
     }
     const recent = JSON.parse(
-      window?.localStorage.getItem(SUGGESTED_LS_KEY) ?? '[]',
+      window.localStorage.getItem(SUGGESTED_LS_KEY) ?? '[]',
     ) as Suggested;
 
     if (mode === SuggestionMode.FREQUENT) {
@@ -58,7 +58,10 @@ export function setSuggested(emoji: DataEmoji, skinTone: SkinTones) {
   nextList.length = Math.min(nextList.length, 14);
 
   try {
-    window?.localStorage.setItem(SUGGESTED_LS_KEY, JSON.stringify(nextList));
+    if (typeof window === 'undefined') {
+      return;
+    }
+    window.localStorage.setItem(SUGGESTED_LS_KEY, JSON.stringify(nextList));
     // Prevents the change from being seen immediately.
   } catch {
     // ignore

package/src/hooks/useDebouncedState.ts

@@ -5,7 +5,7 @@ export function useDebouncedState<T>(
   delay: number = 0,
 ): [T, (value: T) => Promise<T>] {
   const [state, setState] = useState<T>(initialValue);
-  const timer = useRef<number | null>(null);
+  const timer = useRef<ReturnType<typeof setTimeout> | null>(null);
 
   function debouncedSetState(value: T) {
     return new Promise<T>((resolve) => {
@@ -13,7 +13,7 @@ export function useDebouncedState<T>(
         clearTimeout(timer.current);
       }
 
-      timer.current = window?.setTimeout(() => {
+      timer.current = setTimeout(() => {
         setState(value);
         resolve(value);
       }, delay);

package/src/hooks/useIsomorphicLayoutEffect.ts

@@ -0,0 +1,6 @@
+import * as React from 'react';
+
+// `useLayoutEffect` warns during SSR since it never runs on the server.
+// Fall back to `useEffect` there: measurement only matters on the client.
+export const useIsomorphicLayoutEffect =
+  typeof window !== 'undefined' ? React.useLayoutEffect : React.useEffect;

package/src/hooks/useMouseDownHandlers.ts

@@ -26,7 +26,7 @@ import {
   emojiHasVariations,
   emojiNames,
   emojiUnified,
-} from '../dataUtils/emojiSelectors';
+} from '../dataUtils/emojiUtils';
 import { parseNativeEmoji } from '../dataUtils/parseNativeEmoji';
 import { setSuggested } from '../dataUtils/suggested';
 import { isCustomEmoji } from '../typeRefinements/typeRefinements';
@@ -39,7 +39,7 @@ export function useMouseDownHandlers(
   ContainerRef: React.MutableRefObject<NullableElement>,
   mouseEventSource: MOUSE_EVENT_SOURCE,
 ) {
-  const mouseDownTimerRef = useRef<undefined | number>();
+  const mouseDownTimerRef = useRef<ReturnType<typeof setTimeout>>();
   const setVariationPicker = useSetVariationPicker();
   const disallowClickRef = useDisallowClickRef();
   const [, setEmojiVariationPicker] = useEmojiVariationPickerState();
@@ -99,7 +99,7 @@ export function useMouseDownHandlers(
         return;
       }
 
-      mouseDownTimerRef.current = window?.setTimeout(() => {
+      mouseDownTimerRef.current = setTimeout(() => {
         disallowClickRef.current = true;
         mouseDownTimerRef.current = undefined;
         closeAllOpenToggles();

package/src/hooks/useOnFocus.ts

@@ -3,7 +3,7 @@ import { useEffect } from 'react';
 import { buttonFromTarget, emojiFromElement } from '../DomUtils/selectors';
 import { useBodyRef } from '../components/context/ElementRefContext';
 import { useEmojiStyleConfig, useGetEmojiUrlConfig } from '../config/useConfig';
-import { emojiHasVariations } from '../dataUtils/emojiSelectors';
+import { emojiHasVariations } from '../dataUtils/emojiUtils';
 import { EmojiStyle } from '../types/exposedTypes';
 
 import { preloadEmoji } from './preloadEmoji';