@scrabble-solver/scrabble-solver 2.11.2 → 2.11.3

package/src/modals/ResultsModal/ResultsModal.tsx

@@ -3,7 +3,7 @@ import { FunctionComponent, useMemo } from 'react';
 import { useDispatch } from 'react-redux';
 
 import { Button, Dictionary, Modal, Results } from 'components';
-import { Check } from 'icons';
+import { Check, EyeFill } from 'icons';
 import { resultsSlice, selectResultCandidate, selectResults, useTranslate, useTypedSelector } from 'state';
 
 import styles from './ResultsModal.module.scss';
@@ -37,20 +37,44 @@ const ResultsModal: FunctionComponent<Props> = ({ className, isOpen, onClose })
     [dispatch, onClose, resultCandidate],
   );
 
+  const handleInsert = () => {
+    if (resultCandidate) {
+      dispatch(resultsSlice.actions.applyResult(resultCandidate));
+    }
+
+    onClose();
+  };
+
+  const handlePreview = () => {
+    onClose();
+  };
+
   return (
     <Modal
       className={className}
       footer={
-        <Button
-          aria-label={translate('results.insert')}
-          disabled={!resultCandidate}
-          Icon={Check}
-          tooltip={translate('results.insert')}
-          variant="primary"
-          onClick={onClose}
-        >
-          {translate('results.insert')}
-        </Button>
+        <>
+          <Button
+            aria-label={translate('results.insert')}
+            disabled={!resultCandidate}
+            Icon={Check}
+            tooltip={translate('results.insert')}
+            variant="primary"
+            onClick={handleInsert}
+          >
+            {translate('results.insert')}
+          </Button>
+
+          <Button
+            aria-label={translate('results.preview')}
+            disabled={!resultCandidate}
+            Icon={EyeFill}
+            tooltip={translate('results.preview')}
+            onClick={handlePreview}
+          >
+            {translate('results.preview')}
+          </Button>
+        </>
       }
       isOpen={isOpen}
       title={translate('results')}

package/src/modals/SettingsModal/components/LocaleSetting/LocaleSetting.module.scss

@@ -18,52 +18,11 @@
 }
 
 .flag {
-  $height: 32px;
+  --height: 32px;
 
-  height: $height;
+  width: calc(var(--height) * var(--aspect--ratio));
+  height: var(--height);
   border-radius: var(--border--radius);
   box-shadow: var(--box-shadow);
   transition: var(--transition);
-
-  &.de {
-    $aspect-ratio: 1.6;
-
-    width: $height * $aspect-ratio;
-  }
-
-  &.es {
-    $aspect-ratio: 1.5;
-
-    width: $height * $aspect-ratio;
-  }
-
-  &.fa {
-    $aspect-ratio: 1.75;
-
-    width: $height * $aspect-ratio;
-  }
-
-  &.fr {
-    $aspect-ratio: 1.6;
-
-    width: $height * $aspect-ratio;
-  }
-
-  &.gb {
-    $aspect-ratio: 2;
-
-    width: $height * $aspect-ratio;
-  }
-
-  &.pl {
-    $aspect-ratio: 1.6;
-
-    width: $height * $aspect-ratio;
-  }
-
-  &.us {
-    $aspect-ratio: 1.9;
-
-    width: $height * $aspect-ratio;
-  }
 }

package/src/modals/SettingsModal/components/LocaleSetting/LocaleSetting.tsx

@@ -4,16 +4,18 @@ import { ChangeEvent, FunctionComponent } from 'react';
 import { useDispatch } from 'react-redux';
 
 import { Radio } from 'components';
+import { LOCALE_FLAGS } from 'i18n';
 import { selectLocale, settingsSlice, useTypedSelector } from 'state';
 
 import styles from './LocaleSetting.module.scss';
-import options from './options';
 
 interface Props {
   className?: string;
   disabled: boolean;
 }
 
+const OPTIONS = Object.values(LOCALE_FLAGS).sort((a, b) => a.name.localeCompare(b.name));
+
 const LocaleSetting: FunctionComponent<Props> = ({ className, disabled }) => {
   const dispatch = useDispatch();
   const locale = useTypedSelector(selectLocale);
@@ -25,7 +27,7 @@ const LocaleSetting: FunctionComponent<Props> = ({ className, disabled }) => {
 
   return (
     <div className={className}>
-      {options.map(({ Icon, ...option }) => (
+      {OPTIONS.map(({ Icon, ...option }) => (
         <Radio
           checked={locale === option.value}
           className={classNames(styles.option, className, {

package/src/pages/api/solve.ts

@@ -6,7 +6,7 @@ import { solve as solveScrabble } from '@scrabble-solver/solver';
 import { Board, Config, isBoardJson, isLocale, Locale, Tile } from '@scrabble-solver/types';
 import { NextApiRequest, NextApiResponse } from 'next';
 
-import { getServerLoggingData, isBoardValid } from 'api';
+import { getServerLoggingData, isBoardValid, isCharacterValid } from 'api';
 import { isStringArray } from 'lib';
 
 interface RequestData {
@@ -63,10 +63,11 @@ const parseRequest = (request: NextApiRequest): RequestData => {
   const config = getLocaleConfig(configId, locale);
 
   for (const character of characters) {
-    if (!config.hasCharacter(character) && character !== BLANK) {
+    if (!isCharacterValid(character)) {
       throw new Error('Invalid "characters" parameter');
     }
   }
+
   const blanksCount = characters.filter((character) => character === BLANK).length;
 
   if (blanksCount > config.blanksCount) {

package/src/styles/mixins.scss

@@ -119,7 +119,9 @@ $media-expressions: (
   input {
     position: absolute;
     top: -100%;
+    right: -100%;
     left: -100%;
+    bottom: -100%;
     width: 300%;
     height: 300%;
     clip-path: inset((100% / 3));

package/src/styles/variables.scss

@@ -12,9 +12,13 @@ $easeOutSine: cubic-bezier(0.61, 1, 0.88, 1);
   --box-shadow: 0 0 var(--box-shadow--blur) var(--box-shadow--spread) var(--box-shadow--color);
   --box-shadow--blur: 8px;
   --box-shadow--color: rgba(0, 0, 0, 0.15);
+  --box-shadow--color--inverse: rgba(255, 255, 255, 0.85);
+  --box-shadow--color--raised: rgba(34, 34, 34, 0.8);
   --box-shadow--spread: 1px;
   --box-shadow--null: 0 0 var(--box-shadow--blur) var(--box-shadow--spread) transparent;
   --box-shadow--error: 0 0 var(--box-shadow--blur) var(--box-shadow--spread) var(--color--error);
+  --box-shadow--raised: inset -2px -2px 2px -1px var(--box-shadow--color--raised);
+  --box-shadow--raised--subtle: inset -1px -1px 1px 0 var(--box-shadow--color--raised);
 
   --color--white: #ffffff;
   --color--blue: #c7d8f9;
@@ -94,6 +98,14 @@ $easeOutSine: cubic-bezier(0.61, 1, 0.88, 1);
   --z-index--close-button: 101;
   --z-index--tooltip: 102;
 
+  --flag--de--aspect-ratio: 20 / 12;
+  --flag--es--aspect-ratio: 750 / 500;
+  --flag--fa--aspect-ratio: 630 / 360;
+  --flag--fr--aspect-ratio: 24 / 15;
+  --flag--gb--aspect-ratio: 60 / 30;
+  --flag--pl--aspect-ratio: 16 / 10;
+  --flag--us--aspect-ratio: 7410 / 3900;
+
   --button--icon--size: 24px;
   --dictionary--height: 260px;
   --modal--width: 370px;

package/src/types/index.ts

@@ -92,6 +92,7 @@ export type TranslationKey =
   | 'results.empty-state.uninitialized'
   | 'results.input.placeholder'
   | 'results.insert'
+  | 'results.preview'
   | 'results.solve'
   | 'settings'
   | 'settings.autoGroupTiles'

package/.next/server/chunks/417.js

@@ -1,221 +0,0 @@
-"use strict";
-exports.id = 417;
-exports.ids = [417];
-exports.modules = {
-
-/***/ 38436:
-/***/ ((__unused_webpack_module, exports) => {
-
-
-Object.defineProperty(exports, "__esModule", ({ value: true }));
-exports.VOWELS = exports.CONSONANTS = exports.NO_BONUS = exports.EMPTY_CELL = exports.BONUS_WORD = exports.BONUS_CHARACTER = exports.BLANK = exports.COMMA_LATIN = exports.COMMA_ARABIC = void 0;
-exports.COMMA_ARABIC = '،';
-exports.COMMA_LATIN = ',';
-exports.BLANK = ' ';
-exports.BONUS_CHARACTER = 'BONUS_CHARACTER';
-exports.BONUS_WORD = 'BONUS_WORD';
-exports.EMPTY_CELL = ' ';
-exports.NO_BONUS = { characterMultiplier: 1, wordMultiplier: 1 };
-exports.CONSONANTS = [
-    'b',
-    'c',
-    'ć',
-    'd',
-    'f',
-    'g',
-    'h',
-    'j',
-    'k',
-    'l',
-    'ł',
-    'm',
-    'n',
-    'ń',
-    'ñ',
-    'p',
-    'q',
-    'r',
-    's',
-    'ś',
-    't',
-    'v',
-    'w',
-    'x',
-    'z',
-    'ź',
-    'ż',
-];
-exports.VOWELS = ['a', 'ą', 'ä', 'e', 'ę', 'i', 'o', 'ó', 'ö', 'u', 'ü', 'y'];
-
-
-/***/ }),
-
-/***/ 98793:
-/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
-
-
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", ({ value: true }));
-exports.OUTPUT_DIRECTORY = void 0;
-const os_1 = __importDefault(__webpack_require__(22037));
-const path_1 = __importDefault(__webpack_require__(71017));
-exports.OUTPUT_DIRECTORY = path_1.default.resolve(os_1.default.homedir(), '.scrabble-solver', 'logs');
-
-
-/***/ }),
-
-/***/ 52954:
-/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
-
-
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", ({ value: true }));
-exports["default"] = void 0;
-var logger_1 = __webpack_require__(6730);
-Object.defineProperty(exports, "default", ({ enumerable: true, get: function () { return __importDefault(logger_1).default; } }));
-
-
-/***/ }),
-
-/***/ 6730:
-/***/ (function(__unused_webpack_module, exports, __webpack_require__) {
-
-
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", ({ value: true }));
-const path_1 = __importDefault(__webpack_require__(71017));
-const winston_1 = __webpack_require__(46050);
-const constants_1 = __webpack_require__(98793);
-const logger = (0, winston_1.createLogger)({
-    level: 'info',
-    format: winston_1.format.combine(winston_1.format.timestamp({
-        format: 'YYYY-MM-DD HH:mm:ss',
-    }), winston_1.format.errors({ stack: true }), winston_1.format.splat(), winston_1.format.json(), winston_1.format.prettyPrint()),
-    transports: [
-        new winston_1.transports.File({
-            filename: path_1.default.resolve(constants_1.OUTPUT_DIRECTORY, 'error.log'),
-            level: 'error',
-        }),
-        new winston_1.transports.File({
-            filename: path_1.default.resolve(constants_1.OUTPUT_DIRECTORY, 'all.log'),
-        }),
-        new winston_1.transports.Console({
-            format: winston_1.format.combine(winston_1.format.colorize(), winston_1.format.simple()),
-            level: 'error',
-        }),
-    ],
-});
-exports["default"] = logger;
-
-
-/***/ }),
-
-/***/ 78570:
-/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
-
-
-// EXPORTS
-__webpack_require__.d(__webpack_exports__, {
-  "X8": () => (/* reexport */ api_getServerLoggingData),
-  "p2": () => (/* reexport */ api_isBoardValid)
-});
-
-// UNUSED EXPORTS: isCellValid, isRowValid
-
-;// CONCATENATED MODULE: ./src/api/getServerLoggingData.ts
-const getServerLoggingData = (request)=>({
-        origin: request.headers.origin,
-        referer: request.headers.referer,
-        userAgent: request.headers["user-agent"],
-        xForwardedFor: request.headers["x-forwarded-for"],
-        xRealIp: request.headers["x-real-ip"]
-    });
-/* harmony default export */ const api_getServerLoggingData = (getServerLoggingData);
-
-// EXTERNAL MODULE: ../constants/build/index.js
-var build = __webpack_require__(38436);
-;// CONCATENATED MODULE: ./src/api/isCellValid.ts
-
-const isCellValid = (cell, config)=>{
-    const { isEmpty , tile , x , y  } = cell;
-    if (x < 0 || x >= config.boardWidth) {
-        return false;
-    }
-    if (y < 0 || y >= config.boardHeight) {
-        return false;
-    }
-    if (isEmpty && tile !== null) {
-        return false;
-    }
-    if (tile !== null && !config.hasCharacter(tile.character) && tile.character !== build.BLANK) {
-        return false;
-    }
-    return true;
-};
-/* harmony default export */ const api_isCellValid = (isCellValid);
-
-;// CONCATENATED MODULE: ./src/api/isRowValid.ts
-
-const isRowValid = (row, config)=>{
-    if (row.length !== config.boardWidth) {
-        return false;
-    }
-    for (const cell of row){
-        if (!api_isCellValid(cell, config)) {
-            return false;
-        }
-    }
-    return true;
-};
-/* harmony default export */ const api_isRowValid = (isRowValid);
-
-;// CONCATENATED MODULE: ./src/api/isBoardValid.ts
-
-const isBoardValid = (board, config)=>{
-    if (board.length !== config.boardHeight) {
-        return false;
-    }
-    for (const row of board){
-        if (!api_isRowValid(row, config)) {
-            return false;
-        }
-    }
-    return areTwoCharacterTilesValid(board, config);
-};
-const areTwoCharacterTilesValid = (board, config)=>{
-    const cells = board.flat().filter((cell)=>cell && cell.tile && config.isTwoCharacterTilePrefix(cell.tile.character));
-    for (const cell of cells){
-        for (const characters of config.twoCharacterTiles){
-            const canCheckDown = cell.y + 1 < board.length;
-            const canCheckRight = cell.x + 1 < board[0].length;
-            const cellDown = board[cell.y + 1][cell.x];
-            const cellRight = board[cell.y][cell.x + 1];
-            const collidesDown = canCheckDown && cellDown.tile && cellDown.tile.character === characters[1];
-            const collidesRight = canCheckRight && cellRight.tile && cellRight.tile.character === characters[1];
-            const collides = collidesDown || collidesRight;
-            if (cell.tile && characters.startsWith(cell.tile.character) && collides) {
-                return false;
-            }
-        }
-    }
-    return true;
-};
-/* harmony default export */ const api_isBoardValid = (isBoardValid);
-
-;// CONCATENATED MODULE: ./src/api/index.ts
-
-
-
-
-
-
-/***/ })
-
-};
-;