@scrabble-solver/scrabble-solver 2.15.23 → 2.15.24

package/.next/trace-build

@@ -1 +1 @@
-[{"name":"run-typescript","duration":1926354,"timestamp":430470878,"id":13,"parentId":1,"tags":{},"startTime":1775678234571,"traceId":"dfda121f630d27e7"},{"name":"run-webpack","duration":6504061,"timestamp":432399576,"id":15,"parentId":1,"tags":{},"startTime":1775678236500,"traceId":"dfda121f630d27e7"},{"name":"static-check","duration":195373,"timestamp":438980589,"id":2016,"parentId":1,"tags":{},"startTime":1775678243081,"traceId":"dfda121f630d27e7"},{"name":"static-generation","duration":873316,"timestamp":439183871,"id":2034,"parentId":1,"tags":{},"startTime":1775678243284,"traceId":"dfda121f630d27e7"},{"name":"collect-build-traces","duration":3881714,"timestamp":439176421,"id":2031,"parentId":1,"tags":{},"startTime":1775678243277,"traceId":"dfda121f630d27e7"},{"name":"telemetry-flush","duration":20,"timestamp":443059296,"id":2046,"parentId":1,"tags":{},"startTime":1775678247160,"traceId":"dfda121f630d27e7"},{"name":"next-build","duration":12832915,"timestamp":430226405,"id":1,"tags":{"buildMode":"default","version":"16.2.3","bundler":"webpack","has-custom-webpack-config":"true","use-build-worker":"false"},"startTime":1775678234327,"traceId":"dfda121f630d27e7"}]
+[{"name":"run-typescript","duration":1924166,"timestamp":5612708199,"id":13,"parentId":1,"tags":{},"startTime":1776200797413,"traceId":"a247f46abd30b936"},{"name":"run-webpack","duration":6261220,"timestamp":5614634557,"id":15,"parentId":1,"tags":{},"startTime":1776200799339,"traceId":"a247f46abd30b936"},{"name":"static-check","duration":185822,"timestamp":5620982865,"id":2016,"parentId":1,"tags":{},"startTime":1776200805688,"traceId":"a247f46abd30b936"},{"name":"static-generation","duration":834210,"timestamp":5621177262,"id":2034,"parentId":1,"tags":{},"startTime":1776200805882,"traceId":"a247f46abd30b936"},{"name":"collect-build-traces","duration":3625253,"timestamp":5621169330,"id":2031,"parentId":1,"tags":{},"startTime":1776200805874,"traceId":"a247f46abd30b936"},{"name":"telemetry-flush","duration":18,"timestamp":5624795666,"id":2046,"parentId":1,"tags":{},"startTime":1776200809500,"traceId":"a247f46abd30b936"},{"name":"next-build","duration":12329041,"timestamp":5612466647,"id":1,"tags":{"buildMode":"default","version":"16.2.3","bundler":"webpack","has-custom-webpack-config":"true","use-build-worker":"false"},"startTime":1776200797171,"traceId":"a247f46abd30b936"}]

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@scrabble-solver/scrabble-solver",
-  "version": "2.15.23",
+  "version": "2.15.24",
   "description": "Scrabble Solver 2 - App",
   "repository": {
     "type": "git",
@@ -28,13 +28,13 @@
     "@floating-ui/react": "^0.27.19",
     "@kamilmielnik/trie": "^4.0.0",
     "@reduxjs/toolkit": "^2.11.2",
-    "@scrabble-solver/configs": "^2.15.23",
-    "@scrabble-solver/constants": "^2.15.23",
-    "@scrabble-solver/dictionaries": "^2.15.23",
-    "@scrabble-solver/logger": "^2.15.23",
-    "@scrabble-solver/solver": "^2.15.23",
-    "@scrabble-solver/types": "^2.15.23",
-    "@scrabble-solver/word-definitions": "^2.15.23",
+    "@scrabble-solver/configs": "^2.15.24",
+    "@scrabble-solver/constants": "^2.15.24",
+    "@scrabble-solver/dictionaries": "^2.15.24",
+    "@scrabble-solver/logger": "^2.15.24",
+    "@scrabble-solver/solver": "^2.15.24",
+    "@scrabble-solver/types": "^2.15.24",
+    "@scrabble-solver/word-definitions": "^2.15.24",
     "classnames": "^2.5.1",
     "env-cmd": "^11.0.0",
     "include-media": "^2.0.0",
@@ -69,5 +69,5 @@
     "@types/redux": "^3.6.31",
     "sass": "^1.99.0"
   },
-  "gitHead": "1414493526a57ebb4fd93fdb006badcc9d6afb6a"
+  "gitHead": "28330eeb094266d16a0e2c80f3333f534c70dea1"
 }

package/src/app-layout/useAppLayoutValue.ts

@@ -1,6 +1,6 @@
 /* eslint-disable max-statements */
 
-import { useColumns, useIsTouchDevice, useMediaQueries, useViewportSize } from 'hooks';
+import { useColumns, useIsTouchDevice, useMediaQueries, useViewportSize } from '@/hooks';
 import {
   BOARD_TILE_SIZE_MAX,
   BORDER_WIDTH,
@@ -19,9 +19,9 @@ import {
   RESULTS_COLUMN_WIDTH,
   SOLVER_COLUMN_WIDTH,
   TEXT_INPUT_HEIGHT,
-} from 'parameters';
-import { selectConfig, selectShowCoordinates, useTypedSelector } from 'state';
-import { type ResultColumnId } from 'types';
+} from '@/parameters';
+import { selectConfig, selectShowCoordinates, useTypedSelector } from '@/state';
+import { type ResultColumnId } from '@/types';
 
 export const useAppLayoutValue = () => {
   const { viewportHeight, viewportWidth } = useViewportSize();

package/src/components/Alert/Alert.tsx

@@ -1,7 +1,7 @@
 import classNames from 'classnames';
 import { type FunctionComponent, type HTMLProps, type ReactNode, type SVGAttributes } from 'react';
 
-import { Check, CrossCircleFill, ExclamationTriangleFill, InfoCircleFill } from 'icons';
+import { Check, CrossCircleFill, ExclamationTriangleFill, InfoCircleFill } from '@/icons';
 
 import styles from './Alert.module.scss';
 

package/src/components/Board/Board.tsx

@@ -7,9 +7,9 @@ import { type CSSProperties, type FocusEventHandler, type FunctionComponent, use
 import useOnclickOutside from 'react-cool-onclickoutside';
 import { useDispatch } from 'react-redux';
 
-import { useAppLayout } from 'app-layout';
-import { LOCALE_FEATURES } from 'i18n';
-import { TRANSITION } from 'parameters';
+import { useAppLayout } from '@/app-layout';
+import { LOCALE_FEATURES } from '@/i18n';
+import { TRANSITION } from '@/parameters';
 import {
   boardSlice,
   cellFiltersSlice,
@@ -19,7 +19,7 @@ import {
   selectShowCoordinates,
   solveSlice,
   useTypedSelector,
-} from 'state';
+} from '@/state';
 
 import styles from './Board.module.scss';
 import { BoardPure } from './BoardPure';

package/src/components/Board/BoardPure.tsx

@@ -12,10 +12,10 @@ import {
   memo,
 } from 'react';
 
-import { Ban, FlagFill } from 'icons';
-import { getCoordinate } from 'lib';
-import { BORDER_WIDTH } from 'parameters';
-import { type CellFilter } from 'types';
+import { Ban, FlagFill } from '@/icons';
+import { getCoordinate } from '@/lib';
+import { BORDER_WIDTH } from '@/parameters';
+import { type CellFilter } from '@/types';
 
 import styles from './Board.module.scss';
 import { Cell } from './components';

package/src/components/Board/components/Actions/Actions.tsx

@@ -3,11 +3,11 @@ import { type Cell } from '@scrabble-solver/types';
 import classNames from 'classnames';
 import { forwardRef, type HTMLProps, type MouseEventHandler } from 'react';
 
-import { useIsTouchDevice } from 'hooks';
-import { Keyboard, Square, SquareFill } from 'icons';
-import { findCell, isMac } from 'lib';
-import { selectCellFilter, selectInputMode, selectResultCandidateCells, useTranslate, useTypedSelector } from 'state';
-import { type Direction } from 'types';
+import { useIsTouchDevice } from '@/hooks';
+import { Keyboard, Square, SquareFill } from '@/icons';
+import { findCell, isMac } from '@/lib';
+import { selectCellFilter, selectInputMode, selectResultCandidateCells, useTranslate, useTypedSelector } from '@/state';
+import { type Direction } from '@/types';
 
 import { Button } from '../../../Button';
 import { ToggleDirectionButton } from '../ToggleDirectionButton';

package/src/components/Board/components/Actions/lib.ts

@@ -1,7 +1,7 @@
 import { type FunctionComponent, type SVGAttributes } from 'react';
 
-import { Ban, Eraser, FlagFill } from 'icons';
-import { type CellFilter, type TranslationKey } from 'types';
+import { Ban, Eraser, FlagFill } from '@/icons';
+import { type CellFilter, type TranslationKey } from '@/types';
 
 export const getNextCellFilter = (
   filter: CellFilter | undefined,

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

@@ -19,7 +19,7 @@ import {
   selectTilePoints,
   useTranslate,
   useTypedSelector,
-} from 'state';
+} from '@/state';
 
 import { Tile } from '../../../Tile';
 

package/src/components/Board/components/InputPrompt/InputPrompt.tsx

@@ -8,9 +8,9 @@ import {
   useState,
 } from 'react';
 
-import { Check } from 'icons';
-import { useTranslate } from 'state';
-import { type Direction } from 'types';
+import { Check } from '@/icons';
+import { useTranslate } from '@/state';
+import { type Direction } from '@/types';
 
 import { Button } from '../../../Button';
 import { ToggleDirectionButton } from '../ToggleDirectionButton';

package/src/components/Board/components/ToggleDirectionButton/ToggleDirectionButton.tsx

@@ -1,10 +1,10 @@
 import classNames from 'classnames';
 import { type ButtonHTMLAttributes, type FunctionComponent } from 'react';
 
-import { useIsTouchDevice } from 'hooks';
-import { ArrowDown } from 'icons';
-import { useTranslate } from 'state';
-import { type Direction } from 'types';
+import { useIsTouchDevice } from '@/hooks';
+import { ArrowDown } from '@/icons';
+import { useTranslate } from '@/state';
+import { type Direction } from '@/types';
 
 import { Button } from '../../../Button';
 

package/src/components/Board/hooks/useBackgroundImage.tsx

@@ -5,14 +5,14 @@ import { useCallback, useMemo } from 'react';
 import { renderToString } from 'react-dom/server';
 import { Provider } from 'react-redux';
 
-import { useAppLayout } from 'app-layout';
-import { useMediaQueries } from 'hooks';
-import { LOCALE_FEATURES } from 'i18n';
-import { Star } from 'icons';
-import { getTileSizes } from 'lib';
-import { BORDER_COLOR_LIGHT, BORDER_RADIUS, BORDER_WIDTH, COLOR_BACKGROUND, COLOR_BONUS_START } from 'parameters';
-import { selectConfig, selectLocale, selectShowCoordinates, store, useTypedSelector } from 'state';
-import { type Point } from 'types';
+import { useAppLayout } from '@/app-layout';
+import { useMediaQueries } from '@/hooks';
+import { LOCALE_FEATURES } from '@/i18n';
+import { Star } from '@/icons';
+import { getTileSizes } from '@/lib';
+import { BORDER_COLOR_LIGHT, BORDER_RADIUS, BORDER_WIDTH, COLOR_BACKGROUND, COLOR_BONUS_START } from '@/parameters';
+import { selectConfig, selectLocale, selectShowCoordinates, store, useTypedSelector } from '@/state';
+import { type Point } from '@/types';
 
 import { getBonusColor } from '../lib';
 
@@ -109,7 +109,7 @@ export const useBackgroundImage = () => {
                   x={fontOffset}
                   y={fontOffset}
                 >
-                  x2
+                  ×2
                 </text>
               </symbol>
 
@@ -126,7 +126,7 @@ export const useBackgroundImage = () => {
                   x={fontOffset}
                   y={fontOffset}
                 >
-                  x3
+                  ×3
                 </text>
               </symbol>
 
@@ -143,7 +143,7 @@ export const useBackgroundImage = () => {
                   x={fontOffset}
                   y={fontOffset}
                 >
-                  x4
+                  ×4
                 </text>
               </symbol>
             </defs>
@@ -273,6 +273,7 @@ export const useBackgroundImage = () => {
     ],
   );
 
-  const dataUrl = useMemo(() => `data:image/svg+xml;base64,${globalThis.btoa(backgroundSvg)}`, [backgroundSvg]);
+  const dataUrl = useMemo(() => `data:image/svg+xml,${encodeURIComponent(backgroundSvg)}`, [backgroundSvg]);
+
   return dataUrl;
 };

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

@@ -1,9 +1,9 @@
 import { type CSSProperties, useMemo } from 'react';
 
-import { useAppLayout } from 'app-layout';
-import { getTileSizes } from 'lib';
-import { BORDER_WIDTH } from 'parameters';
-import { selectConfig, selectShowCoordinates, useTypedSelector } from 'state';
+import { useAppLayout } from '@/app-layout';
+import { getTileSizes } from '@/lib';
+import { BORDER_WIDTH } from '@/parameters';
+import { selectConfig, selectShowCoordinates, useTypedSelector } from '@/state';
 
 import { useBackgroundImage } from './useBackgroundImage';
 

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

@@ -1,7 +1,7 @@
 import { autoUpdate, offset, shift, useFloating } from '@floating-ui/react';
 
-import { useAppLayout } from 'app-layout';
-import { BOARD_CELL_ACTIONS_OFFSET } from 'parameters';
+import { useAppLayout } from '@/app-layout';
+import { BOARD_CELL_ACTIONS_OFFSET } from '@/parameters';
 
 export const useFloatingActions = () => {
   const { actionsWidth } = useAppLayout();

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

@@ -1,6 +1,6 @@
 import { autoUpdate, offset, shift, useFloating } from '@floating-ui/react';
 
-import { BOARD_CELL_ACTIONS_OFFSET } from 'parameters';
+import { BOARD_CELL_ACTIONS_OFFSET } from '@/parameters';
 
 export const useFloatingInputPrompt = () => {
   return useFloating({

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

@@ -15,11 +15,11 @@ import {
 } from 'react';
 import { useDispatch } from 'react-redux';
 
-import { useLatest } from 'hooks';
-import { LOCALE_FEATURES } from 'i18n';
-import { createKeyboardNavigation, extractCharacters, extractInputValue, isCtrl } from 'lib';
-import { boardSlice, cellFiltersSlice, selectConfig, selectLocale, useTypedSelector } from 'state';
-import { type Direction, type Point } from 'types';
+import { useLatest } from '@/hooks';
+import { LOCALE_FEATURES } from '@/i18n';
+import { createKeyboardNavigation, extractCharacters, extractInputValue, isCtrl } from '@/lib';
+import { boardSlice, cellFiltersSlice, selectConfig, selectLocale, useTypedSelector } from '@/state';
+import { type Direction, type Point } from '@/types';
 
 import { createGrid, getPositionInGrid } from '../lib';
 

package/src/components/Board/lib.ts

@@ -1,8 +1,8 @@
 import { BONUS_WORD } from '@scrabble-solver/constants';
 import { type Bonus } from '@scrabble-solver/types';
 
-import { COLOR_BONUS_CHARACTER, COLOR_BONUS_CHARACTER_MULTIPLIER, COLOR_BONUS_WORD } from 'parameters';
-import { type Point } from 'types';
+import { COLOR_BONUS_CHARACTER, COLOR_BONUS_CHARACTER_MULTIPLIER, COLOR_BONUS_WORD } from '@/parameters';
+import { type Point } from '@/types';
 
 export const createGrid = <T>(width: number, height: number, getInitialValue: (x: number, y: number) => T): T[][] => {
   return Array.from({ length: height }).map((_row, y) => {

package/src/components/Board/selectors.ts

@@ -1,7 +1,7 @@
 import { createSelector } from '@reduxjs/toolkit';
 
-import { findCell } from 'lib';
-import { selectBoard, selectResultCandidateCells } from 'state';
+import { findCell } from '@/lib';
+import { selectBoard, selectResultCandidateCells } from '@/state';
 
 export const selectRowsWithCandidate = createSelector([selectBoard, selectResultCandidateCells], (board, cells) => {
   return board.rows.map((row, y) => row.map((cell, x) => findCell(cells, x, y) || cell));

package/src/components/Dictionary/Dictionary.tsx

@@ -1,14 +1,14 @@
 import classNames from 'classnames';
 import { type FunctionComponent } from 'react';
 
-import { useAppLayout } from 'app-layout';
+import { useAppLayout } from '@/app-layout';
 import {
   selectDictionaryError,
   selectDictionaryIsLoading,
   selectDictionaryResults,
   useTranslate,
   useTypedSelector,
-} from 'state';
+} from '@/state';
 
 import { EmptyState } from '../EmptyState';
 import { Loading } from '../Loading';

package/src/components/DictionaryInput/DictionaryInput.tsx

@@ -2,8 +2,8 @@ import classNames from 'classnames';
 import { type ChangeEvent, type FunctionComponent, type SubmitEvent } from 'react';
 import { useDispatch } from 'react-redux';
 
-import { LOCALE_FEATURES } from 'i18n';
-import { dictionarySlice, selectDictionary, selectLocale, useTranslate, useTypedSelector } from 'state';
+import { LOCALE_FEATURES } from '@/i18n';
+import { dictionarySlice, selectDictionary, selectLocale, useTranslate, useTypedSelector } from '@/state';
 
 import styles from './DictionaryInput.module.scss';
 

package/src/components/EmptyState/EmptyState.tsx

@@ -1,10 +1,10 @@
 import classNames from 'classnames';
 import { type FunctionComponent, type ReactNode, useMemo } from 'react';
 
-import { LOCALE_FEATURES } from 'i18n';
-import { COLOR_BLUE, COLOR_GREEN, COLOR_RED, COLOR_YELLOW } from 'parameters';
-import { selectLocale, useTranslate, useTypedSelector } from 'state';
-import { type Translations } from 'types';
+import { LOCALE_FEATURES } from '@/i18n';
+import { COLOR_BLUE, COLOR_GREEN, COLOR_RED, COLOR_YELLOW } from '@/parameters';
+import { selectLocale, useTranslate, useTypedSelector } from '@/state';
+import { type Translations } from '@/types';
 
 import { PlainTiles } from '../PlainTiles';
 
@@ -30,12 +30,20 @@ const COLORS_PER_TYPE: Record<Props['variant'], string> = {
   warning: COLOR_YELLOW,
 };
 
+const graphemeSegmenter = new Intl.Segmenter(undefined, { granularity: 'grapheme' });
+
+const reverseGraphemes = (value: string): string => {
+  return Array.from(graphemeSegmenter.segment(value), (segment) => segment.segment)
+    .reverse()
+    .join('');
+};
+
 export const EmptyState: FunctionComponent<Props> = ({ children, className, variant }) => {
   const translate = useTranslate();
   const locale = useTypedSelector(selectLocale);
   const { direction } = LOCALE_FEATURES[locale];
   const title = translate(TITLE_KEY_PER_TYPE[variant]);
-  const message = direction === 'ltr' ? title : title.split('').reverse().join('');
+  const message = direction === 'ltr' ? title : reverseGraphemes(title);
   const content = useMemo(() => [message.toUpperCase().split(' ')], [message]);
 
   return (

package/src/components/Keys/Arrows/Arrows.tsx

@@ -1,7 +1,7 @@
 import classNames from 'classnames';
 import { type FunctionComponent } from 'react';
 
-import { ArrowDown, ArrowLeft, ArrowRight, ArrowUp } from 'icons';
+import { ArrowDown, ArrowLeft, ArrowRight, ArrowUp } from '@/icons';
 
 import { Key } from '../../Key';
 

package/src/components/Keys/index.tsx

@@ -1,7 +1,7 @@
 import { type FunctionComponent } from 'react';
 
-import { isMac } from 'lib';
-import { useTranslate } from 'state';
+import { isMac } from '@/lib';
+import { useTranslate } from '@/state';
 
 import { Key } from '../Key';
 

package/src/components/Loading/Loading.tsx

@@ -1,8 +1,8 @@
 import classNames from 'classnames';
 import { type FunctionComponent, useMemo } from 'react';
 
-import { LOCALE_FEATURES } from 'i18n';
-import { selectLocale, useTranslate, useTypedSelector } from 'state';
+import { LOCALE_FEATURES } from '@/i18n';
+import { selectLocale, useTranslate, useTypedSelector } from '@/state';
 
 import { PlainTiles } from '../PlainTiles';
 

package/src/components/Logo/Logo.tsx

@@ -1,8 +1,8 @@
 import Image from 'next/image';
 import { forwardRef } from 'react';
 
-import { useAppLayout } from 'app-layout';
-import { LOGO_SRC } from 'parameters';
+import { useAppLayout } from '@/app-layout';
+import { LOGO_SRC } from '@/parameters';
 
 interface Props {
   className?: string;

package/src/components/Modal/Modal.tsx

@@ -2,9 +2,9 @@ import classNames from 'classnames';
 import { type FunctionComponent, type ReactNode, useCallback, useEffect, useState } from 'react';
 import ReactModal from 'react-modal';
 
-import { CrossSquareFill } from 'icons';
-import { TRANSITION_DURATION_LONG } from 'parameters';
-import { useTranslate } from 'state';
+import { CrossSquareFill } from '@/icons';
+import { TRANSITION_DURATION_LONG } from '@/parameters';
+import { useTranslate } from '@/state';
 
 import { IconButton } from '../IconButton';
 

package/src/components/NavButtons/NavButtons.tsx

@@ -1,10 +1,10 @@
 import classNames from 'classnames';
 import { type FunctionComponent, memo } from 'react';
 
-import { useAppLayout } from 'app-layout';
-import { CardChecklist, Cog, Eraser, Github, KeyboardFill, List, Sack } from 'icons';
-import { GITHUB_PROJECT_URL } from 'parameters';
-import { selectConfig, useTranslate, useTypedSelector } from 'state';
+import { useAppLayout } from '@/app-layout';
+import { CardChecklist, Cog, Eraser, Github, KeyboardFill, List, Sack } from '@/icons';
+import { GITHUB_PROJECT_URL } from '@/parameters';
+import { selectConfig, useTranslate, useTypedSelector } from '@/state';
 
 import { IconButton } from '../IconButton';
 

package/src/components/NavButtons/selectors.ts

@@ -1,6 +1,6 @@
 import { createSelector } from '@reduxjs/toolkit';
 
-import { selectInvalidWords, selectRemainingTiles } from 'state';
+import { selectInvalidWords, selectRemainingTiles } from '@/state';
 
 export const selectHasInvalidWords = createSelector([selectInvalidWords], (invalidWords) => {
   return invalidWords.length > 0;

package/src/components/NotFound/NotFound.tsx

@@ -1,6 +1,6 @@
 import { type FunctionComponent } from 'react';
 
-import { DashCircleFill } from 'icons';
+import { DashCircleFill } from '@/icons';
 
 import { PlainTiles } from '../PlainTiles';
 

package/src/components/PlainTiles/lib.ts

@@ -10,7 +10,7 @@ import {
   PLAIN_TILES_TILE_MAX_ROTATE,
   PLAIN_TILES_TILE_MAX_SCATTER,
   PLAIN_TILES_TILE_SIZE,
-} from 'parameters';
+} from '@/parameters';
 
 import type { CreatePlainTileOptions, CreatePlainTilesOptions, PlainTile } from './types';
 

package/src/components/Progress/Progress.tsx

@@ -1,8 +1,8 @@
 import classNames from 'classnames';
 import { type FunctionComponent, type HTMLProps } from 'react';
 
-import { PROGRESS_COLOR_BACKGROUND, PROGRESS_COLOR_VALUE } from 'parameters';
-import { selectLocale, useTypedSelector } from 'state';
+import { PROGRESS_COLOR_BACKGROUND, PROGRESS_COLOR_VALUE } from '@/parameters';
+import { selectLocale, useTypedSelector } from '@/state';
 
 import styles from './Progress.module.scss';
 

package/src/components/Rack/Rack.tsx

@@ -16,10 +16,10 @@ import {
 import useOnclickOutside from 'react-cool-onclickoutside';
 import { useDispatch } from 'react-redux';
 
-import { useAppLayout } from 'app-layout';
-import { LOCALE_FEATURES } from 'i18n';
-import { createKeyboardNavigation, extractCharacters, extractInputValue, getTileSizes, isCtrl } from 'lib';
-import { rackSlice, selectConfig, selectInputMode, selectLocale, selectRack, useTypedSelector } from 'state';
+import { useAppLayout } from '@/app-layout';
+import { LOCALE_FEATURES } from '@/i18n';
+import { createKeyboardNavigation, extractCharacters, extractInputValue, getTileSizes, isCtrl } from '@/lib';
+import { rackSlice, selectConfig, selectInputMode, selectLocale, selectRack, useTypedSelector } from '@/state';
 
 import { InputPrompt, RackTile } from './components';
 import styles from './Rack.module.scss';

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

@@ -10,8 +10,8 @@ import {
 } from 'react';
 import { useDispatch } from 'react-redux';
 
-import { useAppLayout } from 'app-layout';
-import { rackSlice, selectConfig, useTranslate, useTypedSelector } from 'state';
+import { useAppLayout } from '@/app-layout';
+import { rackSlice, selectConfig, useTranslate, useTypedSelector } from '@/state';
 
 import styles from './InputPrompt.module.scss';
 import { extractRack } from './lib';

package/src/components/Rack/components/InputPrompt/lib.ts

@@ -1,8 +1,6 @@
 import { type Config } from '@scrabble-solver/types';
 
-// eslint-disable-next-line no-warning-comments
-// TODO: https://github.com/kamilmielnik/scrabble-solver/issues/393
-import { extractCharacters } from '../../../../lib/extractCharacters';
+import { extractCharacters } from '@/lib';
 
 export const extractRack = (config: Config, value: string): (string | null)[] => {
   const charactersByCase = extractCharacters(config, value, {

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

@@ -15,7 +15,7 @@ import {
 } from 'react';
 import { useDispatch } from 'react-redux';
 
-import { createKeyboardNavigation, extractCharacters, extractInputValue, isCtrl } from 'lib';
+import { createKeyboardNavigation, extractCharacters, extractInputValue, isCtrl } from '@/lib';
 import {
   rackSlice,
   selectCharacterIsValid,
@@ -25,7 +25,7 @@ import {
   selectLocale,
   useTranslate,
   useTypedSelector,
-} from 'state';
+} from '@/state';
 
 import { Tile } from '../../../Tile';
 

package/src/components/Rack/selectors.ts

@@ -1,7 +1,7 @@
 import { createSelector } from '@reduxjs/toolkit';
 
-import { zipCharactersAndTiles } from 'lib';
-import { selectRack, selectResultCandidateTiles } from 'state';
+import { zipCharactersAndTiles } from '@/lib';
+import { selectRack, selectResultCandidateTiles } from '@/state';
 
 export const selectRemainingTilesGroups = createSelector(
   [selectRack, selectResultCandidateTiles],

package/src/components/Results/Cell.tsx

@@ -1,8 +1,8 @@
 import classNames from 'classnames';
 import { type CSSProperties, type FunctionComponent, type ReactNode } from 'react';
 
-import { selectLocale, useTranslate, useTypedSelector } from 'state';
-import { type TranslationKey } from 'types';
+import { selectLocale, useTranslate, useTypedSelector } from '@/state';
+import { type TranslationKey } from '@/types';
 
 import { Tooltip } from '../Tooltip';
 

package/src/components/Results/Header.tsx

@@ -1,10 +1,10 @@
 import { type FunctionComponent } from 'react';
 
-import { useAppLayout } from 'app-layout';
-import { useColumns } from 'hooks';
-import { GeoAlt, OneTwoThree, Square, SquareA, SquareB, Squares, Words } from 'icons';
-import { RESULTS_COLUMN_WIDTH } from 'parameters';
-import { ResultColumnId } from 'types';
+import { useAppLayout } from '@/app-layout';
+import { useColumns } from '@/hooks';
+import { GeoAlt, OneTwoThree, Square, SquareA, SquareB, Squares, Words } from '@/icons';
+import { RESULTS_COLUMN_WIDTH } from '@/parameters';
+import { ResultColumnId } from '@/types';
 
 import { HeaderButton } from './HeaderButton';
 import styles from './Results.module.scss';

package/src/components/Results/HeaderButton.tsx

@@ -2,9 +2,9 @@ import classNames from 'classnames';
 import { type CSSProperties, type FunctionComponent, type ReactElement, type SVGAttributes, useCallback } from 'react';
 import { useDispatch } from 'react-redux';
 
-import { SortDown, SortUp } from 'icons';
-import { resultsSlice, selectResultsSort, useTranslate, useTypedSelector } from 'state';
-import { type ResultColumnId, SortDirection, type TranslationKey } from 'types';
+import { SortDown, SortUp } from '@/icons';
+import { resultsSlice, selectResultsSort, useTranslate, useTypedSelector } from '@/state';
+import { type ResultColumnId, SortDirection, type TranslationKey } from '@/types';
 
 import { Tooltip } from '../Tooltip';