@scrabble-solver/scrabble-solver 2.15.8 → 2.15.9

package/LICENSE

@@ -1,4 +1,4 @@
-Copyright (c) 2024 Kamil Mielnik <kamil@kamilmielnik.com>
+Copyright (c) 2025 Kamil Mielnik <kamil@kamilmielnik.com>
 
 Attribution-NonCommercial-NoDerivatives 4.0 International
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@scrabble-solver/scrabble-solver",
-  "version": "2.15.8",
+  "version": "2.15.9",
   "description": "Scrabble Solver 2 - App",
   "repository": {
     "type": "git",
@@ -27,13 +27,13 @@
     "@floating-ui/react": "^0.27.5",
     "@kamilmielnik/trie": "^4.0.0",
     "@reduxjs/toolkit": "^2.6.1",
-    "@scrabble-solver/configs": "^2.15.8",
-    "@scrabble-solver/constants": "^2.15.8",
-    "@scrabble-solver/dictionaries": "^2.15.8",
-    "@scrabble-solver/logger": "^2.15.8",
-    "@scrabble-solver/solver": "^2.15.8",
-    "@scrabble-solver/types": "^2.15.8",
-    "@scrabble-solver/word-definitions": "^2.15.8",
+    "@scrabble-solver/configs": "^2.15.9",
+    "@scrabble-solver/constants": "^2.15.9",
+    "@scrabble-solver/dictionaries": "^2.15.9",
+    "@scrabble-solver/logger": "^2.15.9",
+    "@scrabble-solver/solver": "^2.15.9",
+    "@scrabble-solver/types": "^2.15.9",
+    "@scrabble-solver/word-definitions": "^2.15.9",
     "classnames": "^2.5.1",
     "env-cmd": "^10.1.0",
     "include-media": "^2.0.0",
@@ -49,6 +49,7 @@
     "react-window": "^1.8.11",
     "redux-saga": "^1.3.0",
     "store2": "^2.14.4",
+    "transliteration": "^2.3.5",
     "use-debounce": "^10.0.4",
     "workbox-expiration": "^7.3.0",
     "workbox-precaching": "^7.3.0",
@@ -70,5 +71,5 @@
     "@types/redux-saga": "^0.10.5",
     "sass": "^1.86.0"
   },
-  "gitHead": "da3ecd2d83f48bcc6aa7d43a6dc937d103e1312d"
+  "gitHead": "d0654f37094c58a9982d7984e3fc8722f1fa24f0"
 }

package/src/components/Board/Board.tsx

@@ -116,7 +116,7 @@ const Board: FunctionComponent<Props> = ({ className }) => {
       dispatch(solveSlice.actions.submit());
       setHasFocus(false);
     },
-    [activeIndex, dispatch, locale],
+    [activeIndex, dispatch, insertValue, locale],
   );
 
   const handleToggleBlank = useCallback(() => {

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

@@ -27,7 +27,7 @@ const useBoardStyle = () => {
           ? `repeat(${config.boardSize}, 1fr)`
           : `${coordinatesSize}px repeat(${config.boardSize}, 1fr)`,
     }),
-    [backgroundImage, config.boardSize, tileFontSize],
+    [backgroundImage, config.boardSize, coordinatesSize, showCoordinates, tileFontSize],
   );
 
   return boardStyle;

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

@@ -69,7 +69,7 @@ const useGrid = (rows: Cell[][]): [State, Actions] => {
       setActiveIndex({ x, y });
       inputRefs[y][x].current?.focus();
     },
-    [safeActiveIndex, inputRefs],
+    [safeActiveIndex, height, inputRefs, width],
   );
 
   const getInputRefPosition = useCallback(
@@ -188,7 +188,7 @@ const useGrid = (rows: Cell[][]): [State, Actions] => {
       moveFocus(Math.abs(position.x - x) + Math.abs(position.y - y));
       actions.forEach(dispatch);
     },
-    [config, directionRef, dispatch, moveFocus, rows],
+    [config, directionRef, dispatch, height, moveFocus, rows, width],
   );
 
   const onChange = useCallback(
@@ -219,7 +219,7 @@ const useGrid = (rows: Cell[][]): [State, Actions] => {
 
       insertValue(position, value);
     },
-    [dispatch, insertValue, moveFocus, rows],
+    [dispatch, insertValue, moveFocus, rows, getInputRefPosition],
   );
 
   const onDirectionToggle = useCallback(() => setLastDirection(toggleDirection), []);
@@ -347,7 +347,7 @@ const useGrid = (rows: Cell[][]): [State, Actions] => {
         dispatch(boardSlice.actions.toggleCellIsBlank(position));
       },
     });
-  }, [changeActiveIndex, config, direction, dispatch, locale, moveFocus, onDirectionToggle, rows]);
+  }, [changeActiveIndex, config, direction, dispatch, getInputRefPosition, locale, moveFocus, onDirectionToggle, rows]);
 
   const onPaste = useCallback<ClipboardEventHandler>(
     (event) => {
@@ -366,7 +366,7 @@ const useGrid = (rows: Cell[][]): [State, Actions] => {
       const value = event.clipboardData.getData('text/plain').toLocaleLowerCase();
       insertValue(position, value);
     },
-    [insertValue],
+    [getInputRefPosition, insertValue],
   );
 
   return [

package/src/components/EmptyState/EmptyState.tsx

@@ -34,9 +34,9 @@ const EmptyState: FunctionComponent<Props> = ({ children, className, variant })
   const translate = useTranslate();
   const locale = useTypedSelector(selectLocale);
   const { direction } = LOCALE_FEATURES[locale];
-  const title = useMemo(() => translate(TITLE_KEY_PER_TYPE[variant]), [translate]);
+  const title = useMemo(() => translate(TITLE_KEY_PER_TYPE[variant]), [translate, variant]);
   const message = direction === 'ltr' ? title : title.split('').reverse().join('');
-  const content = useMemo(() => [message.toUpperCase().split(' ')], [title]);
+  const content = useMemo(() => [message.toUpperCase().split(' ')], [message]);
 
   return (
     <div className={classNames(styles.emptyState, className)}>

package/src/components/Rack/Rack.tsx

@@ -67,6 +67,11 @@ const Rack: FunctionComponent<Props> = ({ className, tileSize }) => {
   const showInputPrompt = inputMode === 'touchscreen' && hasFocus;
   const ref = useRef<HTMLDivElement>(null);
 
+  const floatingInputPrompt = useFloating({
+    placement: 'bottom-start',
+    whileElementsMounted: autoUpdate,
+  });
+
   useOnclickOutside(() => setHasFocus(false), {
     ignoreClass: [InputPrompt.styles.form, InputPrompt.styles.input],
     refs: ref.current ? [ref as RefObject<HTMLDivElement>] : [],
@@ -120,7 +125,7 @@ const Rack: FunctionComponent<Props> = ({ className, tileSize }) => {
       return character.length > 1 ? character.toLocaleUpperCase(locale) : character;
     });
     setInput(uppercasedDigraphs.join(''));
-  }, [rack, ref]);
+  }, [floatingInputPrompt.refs, locale, rack, ref]);
 
   const handleKeyDown = useMemo(() => {
     return createKeyboardNavigation({
@@ -159,12 +164,7 @@ const Rack: FunctionComponent<Props> = ({ className, tileSize }) => {
         }
       },
     });
-  }, [changeActiveIndex, config, direction]);
-
-  const floatingInputPrompt = useFloating({
-    placement: 'bottom-start',
-    whileElementsMounted: autoUpdate,
-  });
+  }, [changeActiveIndex, config, direction, dispatch]);
 
   return (
     <>

package/src/components/Rack/components/InputPrompt/InputPrompt.tsx

@@ -1,5 +1,3 @@
-/* eslint-disable max-lines, max-statements */
-
 import classNames from 'classnames';
 import {
   CSSProperties,
@@ -45,7 +43,7 @@ const InputPrompt = forwardRef<HTMLFormElement, Props>(
         dispatch(rackSlice.actions.changeCharacters({ characters, index: 0 }));
         onSubmit(event);
       },
-      [config, value, onSubmit],
+      [config, dispatch, value, onSubmit],
     );
 
     useEffect(() => {

package/src/components/Rack/components/RackTile/RackTile.tsx

@@ -87,7 +87,7 @@ const RackTile: FunctionComponent<Props> = ({
       dispatch(rackSlice.actions.changeCharacters({ characters, index }));
       onChange(event);
     },
-    [config, index, onChange],
+    [config, dispatch, index, onChange],
   );
 
   const handleKeyDown = useMemo(() => {
@@ -101,14 +101,16 @@ const RackTile: FunctionComponent<Props> = ({
           event.preventDefault();
           event.stopPropagation();
           const twoTilesCharacter = config.getTwoCharacterTileByPrefix(event.key);
-          // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-          dispatch(rackSlice.actions.changeCharacter({ character: twoTilesCharacter!, index }));
+
+          if (twoTilesCharacter) {
+            dispatch(rackSlice.actions.changeCharacter({ character: twoTilesCharacter!, index }));
+          }
         }
 
         onKeyDown(event);
       },
     });
-  }, [index, onKeyDown]);
+  }, [config, dispatch, index, onKeyDown]);
 
   const handleMouseDown: MouseEventHandler<HTMLInputElement> = useCallback(
     (event) => {

package/src/hooks/useEffectOnce.ts

@@ -1,5 +1,13 @@
 import { EffectCallback, useEffect } from 'react';
 
-const useEffectOnce = (effect: EffectCallback) => useEffect(effect, []);
+import useLatest from './useLatest';
+
+const useEffectOnce = (effect: EffectCallback) => {
+  const effectRef = useLatest(effect);
+
+  return useEffect(() => {
+    effectRef.current();
+  }, [effectRef]);
+};
 
 export default useEffectOnce;

package/src/lib/extractCharacters.test.ts

@@ -6,7 +6,8 @@ import extractCharacters from './extractCharacters';
 
 const tests = [
   { input: 'ab ', expected: ['a', 'b', BLANK] },
-  { input: 'śćźa', expected: ['a'] },
+  { input: 'śćźa', expected: ['s', 'c', 'z', 'a'] },
+  { input: 'bañó', expected: ['b', 'a', 'ñ', 'o'] },
   { input: 'bueno', expected: ['b', 'u', 'e', 'n', 'o'] },
   { input: 'bellas', expected: ['b', 'e', 'll', 'a', 's'] },
   { input: 'BELLAS', expected: ['b', 'e', 'll', 'a', 's'] },

package/src/lib/extractCharacters.ts

@@ -1,10 +1,24 @@
 import { BLANK } from '@scrabble-solver/constants';
-import { Config } from '@scrabble-solver/types';
+import { Config, Locale } from '@scrabble-solver/types';
+import { transliterate } from 'transliteration';
+
+const transliteratePerLocale: Record<Locale, (word: string) => string> = {
+  [Locale.DE_DE]: (word) => word,
+  [Locale.EN_GB]: (word) => word,
+  [Locale.EN_US]: (word) => word,
+  [Locale.ES_ES]: (word) => transliterate(word, { ignore: ['ñ'] }),
+  [Locale.FA_IR]: (word) => word,
+  [Locale.FR_FR]: (word) => transliterate(word),
+  [Locale.PL_PL]: (word) => word,
+  [Locale.RO_RO]: (word) => transliterate(word),
+  [Locale.TR_TR]: (word) => word,
+};
 
 const extractCharacters = (config: Config, value: string): string[] => {
   let index = 0;
   const characters: string[] = [];
-  const valueLowercase = value.toLocaleLowerCase(config.locale);
+  const localeTransliterate = transliteratePerLocale[config.locale];
+  const valueLowercase = localeTransliterate(value.toLocaleLowerCase(config.locale));
 
   while (index < valueLowercase.length) {
     const character = valueLowercase[index];

package/src/state/sagas.ts

@@ -1,4 +1,4 @@
-/* eslint-disable max-lines */
+/* eslint-disable max-lines, no-implicit-globals */
 
 import { PayloadAction } from '@reduxjs/toolkit';
 import { hasConfig, languages } from '@scrabble-solver/configs';