@scrabble-solver/scrabble-solver 2.8.2 → 2.8.4

package/package.json

@@ -1,9 +1,9 @@
 {
   "name": "@scrabble-solver/scrabble-solver",
-  "version": "2.8.2",
+  "version": "2.8.4",
   "description": "Scrabble Solver 2 - App",
   "engines": {
-    "node": ">=16.0.0"
+    "node": ">=16"
   },
   "repository": {
     "type": "git",
@@ -30,13 +30,13 @@
   "dependencies": {
     "@popperjs/core": "^2.11.6",
     "@reduxjs/toolkit": "^1.8.5",
-    "@scrabble-solver/configs": "^2.8.2",
-    "@scrabble-solver/constants": "^2.8.2",
-    "@scrabble-solver/dictionaries": "^2.8.2",
-    "@scrabble-solver/logger": "^2.8.2",
-    "@scrabble-solver/solver": "^2.8.2",
-    "@scrabble-solver/types": "^2.8.2",
-    "@scrabble-solver/word-definitions": "^2.8.2",
+    "@scrabble-solver/configs": "^2.8.4",
+    "@scrabble-solver/constants": "^2.8.4",
+    "@scrabble-solver/dictionaries": "^2.8.4",
+    "@scrabble-solver/logger": "^2.8.4",
+    "@scrabble-solver/solver": "^2.8.4",
+    "@scrabble-solver/types": "^2.8.4",
+    "@scrabble-solver/word-definitions": "^2.8.4",
     "classnames": "^2.3.2",
     "next": "^12.3.1",
     "normalize.css": "^8.0.1",
@@ -45,7 +45,7 @@
     "react-modal": "^3.15.1",
     "react-popper": "^2.3.0",
     "react-portal": "^4.2.2",
-    "react-redux": "^8.0.2",
+    "react-redux": "^8.0.4",
     "react-use": "^17.4.0",
     "react-window": "^1.8.7",
     "redux": "^4.2.0",
@@ -54,9 +54,9 @@
     "uuid": "^9.0.0"
   },
   "devDependencies": {
-    "@svgr/webpack": "^6.3.1",
+    "@svgr/webpack": "^6.4.0",
     "@types/classnames": "^2.3.0",
-    "@types/react": "^18.0.20",
+    "@types/react": "^18.0.21",
     "@types/react-dom": "^18.0.6",
     "@types/react-modal": "^3.13.1",
     "@types/react-portal": "^4.0.4",
@@ -66,7 +66,7 @@
     "@types/redux-saga": "^0.10.5",
     "@types/uuid": "^8.3.4",
     "env-cmd": "^10.1.0",
-    "sass": "^1.54.9"
+    "sass": "^1.55.0"
   },
-  "gitHead": "bf360562a79572dd4640ac7cd7f26199f1ba6899"
+  "gitHead": "3b0c4c9d7987e456f34f7e2918931b0024b8a393"
 }

package/src/components/Board/Board.tsx

@@ -1,4 +1,4 @@
-import React, { FunctionComponent, Ref } from 'react';
+import { FunctionComponent, Ref } from 'react';
 
 import { selectRowsWithCandidate, useTypedSelector } from 'state';
 

package/src/components/Board/BoardPure.tsx

@@ -1,6 +1,6 @@
 import { Cell } from '@scrabble-solver/types';
 import classNames from 'classnames';
-import React, { FunctionComponent, KeyboardEventHandler, memo, Ref, RefObject } from 'react';
+import { FunctionComponent, KeyboardEventHandler, memo, Ref, RefObject } from 'react';
 
 import styles from './Board.module.scss';
 import { Cell as CellComponent } from './components';

package/src/components/Board/components/Cell/Button.tsx

@@ -1,5 +1,5 @@
 import classNames from 'classnames';
-import React, { ButtonHTMLAttributes, FunctionComponent, MouseEventHandler, ReactNode } from 'react';
+import { ButtonHTMLAttributes, FunctionComponent, MouseEventHandler, ReactNode } from 'react';
 
 import { useTooltip } from '../../../Tooltip';
 

package/src/components/Board/components/Cell/Cell.tsx

@@ -1,6 +1,6 @@
 import { EMPTY_CELL } from '@scrabble-solver/constants';
 import { Cell as CellModel } from '@scrabble-solver/types';
-import React, { FunctionComponent, RefObject, useCallback, useMemo } from 'react';
+import { FunctionComponent, RefObject, useCallback, useMemo } from 'react';
 import { useDispatch } from 'react-redux';
 
 import { getTileSizes } from 'lib';

package/src/components/Board/components/Cell/CellPure.tsx

@@ -1,6 +1,6 @@
 import { Bonus, Cell, Tile as TileModel } from '@scrabble-solver/types';
 import classNames from 'classnames';
-import React, { CSSProperties, FocusEventHandler, FunctionComponent, memo, MouseEventHandler, RefObject } from 'react';
+import { CSSProperties, FocusEventHandler, FunctionComponent, memo, MouseEventHandler, RefObject } from 'react';
 
 import { ArrowDown } from 'icons';
 import { Translate } from 'types';

package/src/components/Board/hooks/useGrid.ts

@@ -214,6 +214,15 @@ const useGrid = (rows: Cell[][]): [State, Actions] => {
         dispatch(boardSlice.actions.changeCellValue({ ...position, value: character }));
         onMoveFocus('forward');
       },
+      onSpace: (event) => {
+        const position = getInputRefPosition(event.target as HTMLInputElement);
+
+        if (!position) {
+          return;
+        }
+
+        dispatch(boardSlice.actions.toggleCellIsBlank(position));
+      },
     });
   }, [changeActiveIndex, config, dispatch, lastDirectionRef, onDirectionToggle, rows]);
 

package/src/components/Button/Button.tsx

@@ -1,5 +1,5 @@
 import classNames from 'classnames';
-import React, { ButtonHTMLAttributes, FunctionComponent, MouseEventHandler, ReactNode, SVGAttributes } from 'react';
+import { ButtonHTMLAttributes, FunctionComponent, MouseEventHandler, ReactNode, SVGAttributes } from 'react';
 
 import { useTooltip } from '../Tooltip';
 

package/src/components/Checkbox/Checkbox.tsx

@@ -1,5 +1,5 @@
 import classNames from 'classnames';
-import React, { ChangeEventHandler, FunctionComponent, ReactNode } from 'react';
+import { ChangeEventHandler, FunctionComponent, ReactNode } from 'react';
 
 import { CheckboxChecked, CheckboxEmpty } from 'icons';
 

package/src/components/Dictionary/Dictionary.tsx

@@ -1,5 +1,5 @@
 import classNames from 'classnames';
-import React, { FunctionComponent } from 'react';
+import { FunctionComponent } from 'react';
 
 import { selectDictionary, useTranslate, useTypedSelector } from 'state';
 

package/src/components/DictionaryInput/DictionaryInput.tsx

@@ -1,5 +1,5 @@
 import classNames from 'classnames';
-import React, { ChangeEvent, FormEvent, FunctionComponent } from 'react';
+import { ChangeEvent, FormEvent, FunctionComponent } from 'react';
 import { useDispatch } from 'react-redux';
 
 import { dictionarySlice, selectDictionary, useTranslate, useTypedSelector } from 'state';

package/src/components/EmptyState/EmptyState.tsx

@@ -1,5 +1,5 @@
 import classNames from 'classnames';
-import React, { FunctionComponent, ReactNode, useMemo } from 'react';
+import { FunctionComponent, ReactNode, useMemo } from 'react';
 
 import { COLOR_BLUE, COLOR_GREEN, COLOR_RED, COLOR_YELLOW } from 'parameters';
 import { useTranslate } from 'state';

package/src/components/Key/Key.tsx

@@ -1,5 +1,5 @@
 import classNames from 'classnames';
-import React, { FunctionComponent, ReactNode } from 'react';
+import { FunctionComponent, ReactNode } from 'react';
 
 import styles from './Key.module.scss';
 

package/src/components/KeyMap/KeyMap.tsx

@@ -1,4 +1,4 @@
-import React, { FunctionComponent } from 'react';
+import { FunctionComponent } from 'react';
 
 import { selectConfig, useTranslate, useTypedSelector } from 'state';
 
@@ -42,7 +42,7 @@ const KeyMap: FunctionComponent<Props> = ({ className, isOpen, onClose }) => {
       </Sidebar.Section>
 
       <Sidebar.Section title={translate('keyMap.board')}>
-        <Mapping description={translate('keyMap.board.toggle-blank')} mapping={[[CTRL, <Key key="b">B</Key>]]} />
+        <Mapping description={translate('keyMap.board.toggle-blank')} mapping={[SPACE, [CTRL, <Key key="b">B</Key>]]} />
         <Mapping description={translate('keyMap.board.toggle-direction')} mapping={[[CTRL, ARROWS]]} />
       </Sidebar.Section>
 

package/src/components/KeyMap/components/Mapping/Mapping.module.scss

@@ -24,6 +24,10 @@
   margin: 0 var(--spacing--s);
 }
 
+.slash {
+  margin: 0 var(--spacing--m);
+}
+
 .group {
   &:first-child {
     margin-left: 0;

package/src/components/KeyMap/components/Mapping/Mapping.tsx

@@ -1,5 +1,5 @@
 import classNames from 'classnames';
-import React, { FunctionComponent, ReactNode } from 'react';
+import { Fragment, FunctionComponent, ReactNode } from 'react';
 
 import styles from './Mapping.module.scss';
 
@@ -15,17 +15,21 @@ const Mapping: FunctionComponent<Props> = ({ className, description, mapping })
 
     <div className={styles.keys}>
       {mapping.map((key, index) => (
-        <div className={styles.group} key={index}>
-          {Array.isArray(key) ? (
-            <>
-              {key[0]}
-              <span className={styles.plus}>+</span>
-              {key[1]}
-            </>
-          ) : (
-            key
-          )}
-        </div>
+        <Fragment key={index}>
+          <div className={styles.group}>
+            {Array.isArray(key) ? (
+              <>
+                {key[0]}
+                <span className={styles.plus}>+</span>
+                {key[1]}
+              </>
+            ) : (
+              key
+            )}
+          </div>
+
+          {mapping.length > 1 && index < mapping.length - 1 && <span className={styles.slash}>/</span>}
+        </Fragment>
       ))}
     </div>
   </div>

package/src/components/Loading/Loading.tsx

@@ -1,5 +1,5 @@
 import classNames from 'classnames';
-import React, { FunctionComponent, useMemo } from 'react';
+import { FunctionComponent, useMemo } from 'react';
 
 import { useTranslate } from 'state';
 

package/src/components/Logo/Logo.tsx

@@ -1,4 +1,4 @@
-import React, { CSSProperties, FunctionComponent } from 'react';
+import { CSSProperties, FunctionComponent } from 'react';
 
 import PlainTiles from '../PlainTiles';
 

package/src/components/NavButtons/NavButtons.tsx

@@ -1,5 +1,5 @@
 import classNames from 'classnames';
-import React, { FunctionComponent } from 'react';
+import { FunctionComponent } from 'react';
 
 import { Cog, Eraser, Github, Keyboard, Sack } from 'icons';
 import { GITHUB_PROJECT_URL } from 'parameters';

package/src/components/NotFound/NotFound.tsx

@@ -1,5 +1,5 @@
 import Link from 'next/link';
-import React, { FunctionComponent } from 'react';
+import { FunctionComponent } from 'react';
 
 import { DashCircleFill } from 'icons';
 

package/src/components/PlainTiles/PlainTiles.tsx

@@ -1,5 +1,7 @@
 import classNames from 'classnames';
-import React, { CSSProperties, FunctionComponent, useMemo } from 'react';
+import { CSSProperties, FunctionComponent, useMemo } from 'react';
+
+import SvgFontCss from '../SvgFontCss';
 
 import { createPlainTiles, getViewbox } from './lib';
 import styles from './PlainTiles.module.scss';
@@ -28,6 +30,8 @@ const PlainTiles: FunctionComponent<Props> = ({ className, color, content, dropS
       viewBox={getViewbox(content)}
       xmlns="http://www.w3.org/2000/svg"
     >
+      <SvgFontCss />
+
       {tiles.map((tile, index) => (
         <Tile
           character={tile.character}

package/src/components/PlainTiles/Tile.tsx

@@ -1,4 +1,4 @@
-import React, { FunctionComponent } from 'react';
+import { FunctionComponent } from 'react';
 
 interface Props {
   character: string;

package/src/components/Rack/Rack.tsx

@@ -1,6 +1,6 @@
 import { BLANK } from '@scrabble-solver/constants';
 import classNames from 'classnames';
-import React, { createRef, FunctionComponent, useCallback, useMemo, useRef } from 'react';
+import { createRef, FunctionComponent, useCallback, useMemo, useRef } from 'react';
 
 import { createArray, createKeyboardNavigation, zipCharactersAndTiles } from 'lib';
 import { selectConfig, selectRack, selectResultCandidateTiles, useTypedSelector } from 'state';

package/src/components/Rack/RackTile.tsx

@@ -1,6 +1,6 @@
 import { BLANK } from '@scrabble-solver/constants';
 import { Tile as TileModel } from '@scrabble-solver/types';
-import React, {
+import {
   FunctionComponent,
   KeyboardEventHandler,
   MutableRefObject,

package/src/components/Radio/Radio.tsx

@@ -1,5 +1,5 @@
 import classNames from 'classnames';
-import React, { ChangeEventHandler, FunctionComponent, ReactNode } from 'react';
+import { ChangeEventHandler, FunctionComponent, ReactNode } from 'react';
 
 import styles from './Radio.module.scss';
 

package/src/components/RemainingTiles/Character.tsx

@@ -1,6 +1,6 @@
 import { BLANK } from '@scrabble-solver/constants';
 import classNames from 'classnames';
-import React, { FunctionComponent } from 'react';
+import { FunctionComponent } from 'react';
 
 import { REMAINING_TILES_TILE_SIZE } from 'parameters';
 import { selectCharacterPoints, useTypedSelector } from 'state';

package/src/components/RemainingTiles/RemainingTiles.tsx

@@ -1,4 +1,4 @@
-import React, { FunctionComponent } from 'react';
+import { FunctionComponent } from 'react';
 
 import { selectRemainingTilesGroups, useTranslate, useTypedSelector } from 'state';
 

package/src/components/Results/Cell.tsx

@@ -1,5 +1,5 @@
 import classNames from 'classnames';
-import React, { FunctionComponent } from 'react';
+import { FunctionComponent } from 'react';
 
 import { useTranslate } from 'state';
 import { TranslationKey } from 'types';

package/src/components/Results/HeaderButton.tsx

@@ -1,5 +1,5 @@
 import classNames from 'classnames';
-import React, { ReactElement } from 'react';
+import { ReactElement } from 'react';
 import { useDispatch } from 'react-redux';
 
 import { SortDown, SortUp } from 'icons';

package/src/components/Results/Result.tsx

@@ -1,4 +1,4 @@
-import React, { CSSProperties, ReactElement } from 'react';
+import { CSSProperties, ReactElement } from 'react';
 import { useDispatch } from 'react-redux';
 
 import { resultsSlice, selectSortedFilteredResults, useTypedSelector } from 'state';

package/src/components/Results/Results.tsx

@@ -1,5 +1,5 @@
 import classNames from 'classnames';
-import React, { FunctionComponent } from 'react';
+import { FunctionComponent } from 'react';
 import { FixedSizeList } from 'react-window';
 
 import { RESULTS_HEADER_HEIGHT, RESULTS_INPUT_HEIGHT, RESULTS_ITEM_HEIGHT } from 'parameters';

package/src/components/Results/SolveButton.tsx

@@ -1,4 +1,4 @@
-import React, { FunctionComponent } from 'react';
+import { FunctionComponent } from 'react';
 import { useDispatch } from 'react-redux';
 
 import { Play } from 'icons';

package/src/components/ResultsInput/ResultsInput.tsx

@@ -1,5 +1,5 @@
 import classNames from 'classnames';
-import React, { ChangeEvent, FunctionComponent } from 'react';
+import { ChangeEvent, FunctionComponent } from 'react';
 import { useDispatch } from 'react-redux';
 
 import { resultsSlice, selectResultsQuery, useTranslate, useTypedSelector } from 'state';

package/src/components/Screen/Screen.tsx

@@ -1,5 +1,5 @@
 import classNames from 'classnames';
-import React, { AnimationEventHandler, FunctionComponent, ReactNode } from 'react';
+import { AnimationEventHandler, FunctionComponent, ReactNode } from 'react';
 
 import styles from './Screen.module.scss';
 

package/src/components/Settings/Settings.tsx

@@ -1,4 +1,4 @@
-import React, { FunctionComponent } from 'react';
+import { FunctionComponent } from 'react';
 
 import { useTranslate } from 'state';
 

package/src/components/Settings/components/AutoGroupTilesSetting/AutoGroupTilesSetting.tsx

@@ -1,4 +1,4 @@
-import React, { ChangeEvent, FunctionComponent } from 'react';
+import { ChangeEvent, FunctionComponent } from 'react';
 import { useDispatch } from 'react-redux';
 
 import { selectAutoGroupTiles, settingsSlice, useTranslate, useTypedSelector } from 'state';

package/src/components/Settings/components/ConfigSetting/ConfigSetting.tsx

@@ -1,4 +1,4 @@
-import React, { ChangeEvent, FunctionComponent } from 'react';
+import { ChangeEvent, FunctionComponent } from 'react';
 import { useDispatch } from 'react-redux';
 
 import { selectConfigId, settingsSlice, useTypedSelector } from 'state';

package/src/components/Settings/components/LocaleSetting/LocaleSetting.tsx

@@ -1,6 +1,6 @@
 import { Locale } from '@scrabble-solver/types';
 import classNames from 'classnames';
-import React, { ChangeEvent, FunctionComponent } from 'react';
+import { ChangeEvent, FunctionComponent } from 'react';
 import { useDispatch } from 'react-redux';
 
 import { selectLocale, settingsSlice, useTypedSelector } from 'state';

package/src/components/Sidebar/Sidebar.tsx

@@ -1,5 +1,5 @@
 import classNames from 'classnames';
-import React, { FunctionComponent, ReactNode } from 'react';
+import { FunctionComponent, ReactNode } from 'react';
 import Modal from 'react-modal';
 
 import { Cross } from 'icons';

package/src/components/Sidebar/components/Section/Section.tsx

@@ -1,5 +1,5 @@
 import classNames from 'classnames';
-import React, { FunctionComponent, ReactNode } from 'react';
+import { FunctionComponent, ReactNode } from 'react';
 
 import styles from './Section.module.scss';
 

package/src/components/Splash/Splash.tsx

@@ -1,5 +1,5 @@
 import classNames from 'classnames';
-import React, { AnimationEventHandler, FunctionComponent } from 'react';
+import { AnimationEventHandler, FunctionComponent } from 'react';
 
 import Logo from '../Logo';
 import Screen from '../Screen';

package/src/components/SquareButton/Link.tsx

@@ -1,5 +1,5 @@
 import classNames from 'classnames';
-import React, { AnchorHTMLAttributes, FunctionComponent, SVGAttributes } from 'react';
+import { AnchorHTMLAttributes, FunctionComponent, SVGAttributes } from 'react';
 
 import { useTooltip } from '../Tooltip';
 

package/src/components/SquareButton/SquareButton.tsx

@@ -1,5 +1,5 @@
 import classNames from 'classnames';
-import React, { ButtonHTMLAttributes, FunctionComponent, MouseEventHandler, SVGAttributes } from 'react';
+import { ButtonHTMLAttributes, FunctionComponent, MouseEventHandler, SVGAttributes } from 'react';
 
 import { useTooltip } from '../Tooltip';
 

package/src/components/SvgFontCss/SvgFontCss.tsx

@@ -0,0 +1,12 @@
+import { FunctionComponent } from 'react';
+
+// eslint-disable-next-line max-len
+const CSS = `@import url('https://fonts.googleapis.com/css2?family=Lato:wght@300;400;700&family=Open+Sans:wght@400;700&family=Roboto+Mono&display=swap');
+
+text {
+  font-family: 'Open Sans';
+}`;
+
+const SvgFontCss: FunctionComponent = () => <style type="text/css">{CSS}</style>;
+
+export default SvgFontCss;

package/src/components/SvgFontCss/index.ts

@@ -0,0 +1 @@
+export { default } from './SvgFontCss';

package/src/components/Tile/Tile.tsx

@@ -1,5 +1,5 @@
 import { EMPTY_CELL } from '@scrabble-solver/constants';
-import React, {
+import {
   createRef,
   FocusEventHandler,
   FunctionComponent,

package/src/components/Tile/TilePure.tsx

@@ -1,5 +1,5 @@
 import classNames from 'classnames';
-import React, {
+import {
   ChangeEventHandler,
   CSSProperties,
   FocusEventHandler,
@@ -66,7 +66,7 @@ const TilePure: FunctionComponent<Props> = ({
     style={style}
   >
     <input
-      autoCapitalize="off"
+      autoCapitalize="none"
       autoComplete="off"
       autoCorrect="off"
       autoFocus={autoFocus}

package/src/components/Tooltip/useTooltip.tsx

@@ -1,5 +1,5 @@
 import classNames from 'classnames';
-import React, {
+import {
   FocusEvent,
   FocusEventHandler,
   MouseEvent,

package/src/components/Well/Well.tsx

@@ -1,5 +1,5 @@
 import classNames from 'classnames';
-import React, { forwardRef, HTMLAttributes, ReactNode } from 'react';
+import { forwardRef, HTMLAttributes, ReactNode } from 'react';
 
 import styles from './Well.module.scss';
 

package/src/components/index.ts

@@ -21,6 +21,7 @@ export { default as Settings } from './Settings';
 export { default as Sidebar } from './Sidebar';
 export { default as Splash } from './Splash';
 export { default as SquareButton } from './SquareButton';
+export { default as SvgFontCss } from './SvgFontCss';
 export { default as Tile } from './Tile';
 export { useTooltip } from './Tooltip';
 export { default as Well } from './Well';

package/src/hooks/usePortal.tsx

@@ -1,5 +1,5 @@
-import React, { ReactNode, useLayoutEffect, useMemo } from 'react';
-import { render, unmountComponentAtNode } from 'react-dom';
+import { ReactNode, useLayoutEffect, useRef } from 'react';
+import { createRoot, Root } from 'react-dom/client';
 import { Portal } from 'react-portal';
 
 import { canUseDom, noop } from 'lib';
@@ -12,26 +12,36 @@ interface Props {
 type TagName = Parameters<typeof document.createElement>[0];
 
 const usePortal = (children: ReactNode, { disabled = false, tagName = 'div' }: Props = {}): void => {
-  const element = useMemo(() => document.createElement(tagName), [tagName]);
+  const rootRef = useRef<Root | null>(null);
 
   useLayoutEffect(() => {
     if (disabled) {
       return noop;
     }
 
+    const element = document.createElement(tagName);
     document.body.appendChild(element);
+    const root = createRoot(element);
+    rootRef.current = root;
 
     return () => {
-      unmountComponentAtNode(element);
-      document.body.removeChild(element);
+      // We need setTimeout for async unmount, otherwise we get this warning:
+      // "Attempted to synchronously unmount a root while React was already
+      // rendering. React cannot finish unmounting the root until the current
+      // render has completed, which may lead to a race condition.""
+      setTimeout(() => {
+        rootRef.current = null;
+        root.unmount();
+        element.remove();
+      }, 0);
     };
-  }, [disabled, element]);
+  }, [disabled, tagName]);
 
   useLayoutEffect(() => {
-    if (!disabled) {
-      render(<Portal>{children}</Portal>, element);
+    if (rootRef.current) {
+      rootRef.current.render(<Portal>{children}</Portal>);
     }
-  }, [children, disabled, element]);
+  }, [children, disabled, rootRef]);
 };
 
 export default canUseDom ? usePortal : noop;

package/src/lib/createKeyboardNavigation.ts

@@ -11,6 +11,7 @@ interface Parameters {
   onDelete?: KeyboardEventHandler<HTMLInputElement>;
   onEnter?: KeyboardEventHandler<HTMLInputElement>;
   onKeyDown?: KeyboardEventHandler<HTMLInputElement>;
+  onSpace?: KeyboardEventHandler<HTMLInputElement>;
 }
 
 const createKeyboardNavigation = ({
@@ -22,6 +23,7 @@ const createKeyboardNavigation = ({
   onDelete = noop,
   onEnter = noop,
   onKeyDown = noop,
+  onSpace = noop,
 }: Parameters): KeyboardEventHandler<HTMLInputElement> => {
   const handlers: Record<string, KeyboardEventHandler<HTMLInputElement>> = {
     ArrowUp: onArrowUp,
@@ -31,6 +33,7 @@ const createKeyboardNavigation = ({
     Backspace: onBackspace,
     Delete: onDelete,
     Enter: onEnter,
+    ' ': onSpace,
   };
 
   const handleKeyDown: KeyboardEventHandler<HTMLInputElement> = (event) => {

package/src/lib/memoize.ts

@@ -1,5 +1,5 @@
 interface AnyFunction {
-  (...parameters: any): any; // eslint-disable-line @typescript-eslint/no-explicit-any
+  (...parameters: any[]): any; // eslint-disable-line @typescript-eslint/no-explicit-any
 }
 
 interface AnyCachedFunction<T extends AnyFunction> extends AnyFunction {

package/src/pages/_app.tsx

@@ -1,6 +1,6 @@
 import { AppProps } from 'next/app';
 import Head from 'next/head';
-import React, { FunctionComponent } from 'react';
+import { FunctionComponent } from 'react';
 import { Provider } from 'react-redux';
 
 import { createAppStore } from 'state';