scrabble-solver 2.10.4 → 2.10.6

package/packages/scrabble-solver/package-lock.json

@@ -1,17 +1,17 @@
 {
   "name": "@scrabble-solver/scrabble-solver",
-  "version": "2.10.4",
+  "version": "2.10.6",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
     "": {
       "name": "@scrabble-solver/scrabble-solver",
-      "version": "2.10.4",
+      "version": "2.10.6",
       "license": "CC BY-NC-ND 4.0",
       "dependencies": {
         "@kamilmielnik/trie": "^2.0.1",
         "@popperjs/core": "^2.11.6",
-        "@reduxjs/toolkit": "^1.9.2",
+        "@reduxjs/toolkit": "^1.9.3",
         "classnames": "^2.3.2",
         "include-media": "^2.0.0",
         "include-media-query-builder": "^1.1.0",
@@ -37,17 +37,17 @@
       "devDependencies": {
         "@svgr/webpack": "^6.5.1",
         "@types/classnames": "^2.3.0",
-        "@types/react": "^18.0.27",
-        "@types/react-dom": "^18.0.10",
+        "@types/react": "^18.0.28",
+        "@types/react-dom": "^18.0.11",
         "@types/react-modal": "^3.13.1",
         "@types/react-portal": "^4.0.4",
         "@types/react-redux": "^7.1.25",
         "@types/react-window": "^1.8.5",
         "@types/redux": "^3.6.31",
         "@types/redux-saga": "^0.10.5",
-        "@types/uuid": "^9.0.0",
+        "@types/uuid": "^9.0.1",
         "env-cmd": "^10.1.0",
-        "sass": "^1.57.1",
+        "sass": "^1.58.3",
         "workbox-webpack-plugin": "^6.5.4"
       },
       "engines": {
@@ -2157,9 +2157,9 @@
       "integrity": "sha512-1dgmkh+3so0+LlBWRhGA33ua4MYr7tUOj+a9Si28vUi0IUFNbff1T3sgpeDJI/LaC75bBYnQ0A3wXjn0OrRNBA=="
     },
     "node_modules/@reduxjs/toolkit": {
-      "version": "1.9.2",
-      "resolved": "https://registry.npmjs.org/@reduxjs/toolkit/-/toolkit-1.9.2.tgz",
-      "integrity": "sha512-5ZAZ7hwAKWSii5T6NTPmgIBUqyVdlDs+6JjThz6J6dmHLDm6zCzv2OjHIFAi3Vvs1qjmXU0bm6eBojukYXjVMQ==",
+      "version": "1.9.3",
+      "resolved": "https://registry.npmjs.org/@reduxjs/toolkit/-/toolkit-1.9.3.tgz",
+      "integrity": "sha512-GU2TNBQVofL09VGmuSioNPQIu6Ml0YLf4EJhgj0AvBadRlCGzUWet8372LjvO4fqKZF2vH1xU0htAa7BrK9pZg==",
       "dependencies": {
         "immer": "^9.0.16",
         "redux": "^4.2.0",
@@ -2622,9 +2622,9 @@
       "integrity": "sha512-JCB8C6SnDoQf0cNycqd/35A7MjcnK+ZTqE7judS6o7utxUCg6imJg3QK2qzHKszlTjcj2cn+NwMB2i96ubpj7w=="
     },
     "node_modules/@types/react": {
-      "version": "18.0.27",
-      "resolved": "https://registry.npmjs.org/@types/react/-/react-18.0.27.tgz",
-      "integrity": "sha512-3vtRKHgVxu3Jp9t718R9BuzoD4NcQ8YJ5XRzsSKxNDiDonD2MXIT1TmSkenxuCycZJoQT5d2vE8LwWJxBC1gmA==",
+      "version": "18.0.28",
+      "resolved": "https://registry.npmjs.org/@types/react/-/react-18.0.28.tgz",
+      "integrity": "sha512-RD0ivG1kEztNBdoAK7lekI9M+azSnitIn85h4iOiaLjaTrMjzslhaqCGaI4IyCJ1RljWiLCEu4jyrLLgqxBTew==",
       "dependencies": {
         "@types/prop-types": "*",
         "@types/scheduler": "*",
@@ -2632,9 +2632,9 @@
       }
     },
     "node_modules/@types/react-dom": {
-      "version": "18.0.10",
-      "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-18.0.10.tgz",
-      "integrity": "sha512-E42GW/JA4Qv15wQdqJq8DL4JhNpB3prJgjgapN3qJT9K2zO5IIAQh4VXvCEDupoqAwnz0cY4RlXeC/ajX5SFHg==",
+      "version": "18.0.11",
+      "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-18.0.11.tgz",
+      "integrity": "sha512-O38bPbI2CWtgw/OoQoY+BRelw7uysmXbWvw3nLWO21H1HSh+GOlqPuXshJfjmpNlKiiSDG9cc1JZAaMmVdcTlw==",
       "devOptional": true,
       "dependencies": {
         "@types/react": "*"
@@ -2720,9 +2720,9 @@
       "integrity": "sha512-EwmlvuaxPNej9+T4v5AuBPJa2x2UOJVdjCtDHgcDqitUeOtjnJKJ+apYjVcAoBEMjKW1VVFGZLUb5+qqa09XFA=="
     },
     "node_modules/@types/uuid": {
-      "version": "9.0.0",
-      "resolved": "https://registry.npmjs.org/@types/uuid/-/uuid-9.0.0.tgz",
-      "integrity": "sha512-kr90f+ERiQtKWMz5rP32ltJ/BtULDI5RVO0uavn1HQUOwjx0R1h0rnDYNL0CepF1zL5bSY6FISAfd9tOdDhU5Q==",
+      "version": "9.0.1",
+      "resolved": "https://registry.npmjs.org/@types/uuid/-/uuid-9.0.1.tgz",
+      "integrity": "sha512-rFT3ak0/2trgvp4yYZo5iKFEPsET7vKydKF+VRCxlQ9bpheehyAJH89dAkaLEq/j/RZXJIqcgsmPJKUP1Z28HA==",
       "dev": true
     },
     "node_modules/@webassemblyjs/ast": {
@@ -5635,9 +5635,9 @@
       }
     },
     "node_modules/sass": {
-      "version": "1.57.1",
-      "resolved": "https://registry.npmjs.org/sass/-/sass-1.57.1.tgz",
-      "integrity": "sha512-O2+LwLS79op7GI0xZ8fqzF7X2m/m8WFfI02dHOdsK5R2ECeS5F62zrwg/relM1rjSLy7Vd/DiMNIvPrQGsA0jw==",
+      "version": "1.58.3",
+      "resolved": "https://registry.npmjs.org/sass/-/sass-1.58.3.tgz",
+      "integrity": "sha512-Q7RaEtYf6BflYrQ+buPudKR26/lH+10EmO9bBqbmPh/KeLqv8bjpTNqxe71ocONqXq+jYiCbpPUmQMS+JJPk4A==",
       "devOptional": true,
       "dependencies": {
         "chokidar": ">=3.0.0 <4.0.0",
@@ -8184,9 +8184,9 @@
       "integrity": "sha512-1dgmkh+3so0+LlBWRhGA33ua4MYr7tUOj+a9Si28vUi0IUFNbff1T3sgpeDJI/LaC75bBYnQ0A3wXjn0OrRNBA=="
     },
     "@reduxjs/toolkit": {
-      "version": "1.9.2",
-      "resolved": "https://registry.npmjs.org/@reduxjs/toolkit/-/toolkit-1.9.2.tgz",
-      "integrity": "sha512-5ZAZ7hwAKWSii5T6NTPmgIBUqyVdlDs+6JjThz6J6dmHLDm6zCzv2OjHIFAi3Vvs1qjmXU0bm6eBojukYXjVMQ==",
+      "version": "1.9.3",
+      "resolved": "https://registry.npmjs.org/@reduxjs/toolkit/-/toolkit-1.9.3.tgz",
+      "integrity": "sha512-GU2TNBQVofL09VGmuSioNPQIu6Ml0YLf4EJhgj0AvBadRlCGzUWet8372LjvO4fqKZF2vH1xU0htAa7BrK9pZg==",
       "requires": {
         "immer": "^9.0.16",
         "redux": "^4.2.0",
@@ -8484,9 +8484,9 @@
       "integrity": "sha512-JCB8C6SnDoQf0cNycqd/35A7MjcnK+ZTqE7judS6o7utxUCg6imJg3QK2qzHKszlTjcj2cn+NwMB2i96ubpj7w=="
     },
     "@types/react": {
-      "version": "18.0.27",
-      "resolved": "https://registry.npmjs.org/@types/react/-/react-18.0.27.tgz",
-      "integrity": "sha512-3vtRKHgVxu3Jp9t718R9BuzoD4NcQ8YJ5XRzsSKxNDiDonD2MXIT1TmSkenxuCycZJoQT5d2vE8LwWJxBC1gmA==",
+      "version": "18.0.28",
+      "resolved": "https://registry.npmjs.org/@types/react/-/react-18.0.28.tgz",
+      "integrity": "sha512-RD0ivG1kEztNBdoAK7lekI9M+azSnitIn85h4iOiaLjaTrMjzslhaqCGaI4IyCJ1RljWiLCEu4jyrLLgqxBTew==",
       "requires": {
         "@types/prop-types": "*",
         "@types/scheduler": "*",
@@ -8494,9 +8494,9 @@
       }
     },
     "@types/react-dom": {
-      "version": "18.0.10",
-      "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-18.0.10.tgz",
-      "integrity": "sha512-E42GW/JA4Qv15wQdqJq8DL4JhNpB3prJgjgapN3qJT9K2zO5IIAQh4VXvCEDupoqAwnz0cY4RlXeC/ajX5SFHg==",
+      "version": "18.0.11",
+      "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-18.0.11.tgz",
+      "integrity": "sha512-O38bPbI2CWtgw/OoQoY+BRelw7uysmXbWvw3nLWO21H1HSh+GOlqPuXshJfjmpNlKiiSDG9cc1JZAaMmVdcTlw==",
       "devOptional": true,
       "requires": {
         "@types/react": "*"
@@ -8581,9 +8581,9 @@
       "integrity": "sha512-EwmlvuaxPNej9+T4v5AuBPJa2x2UOJVdjCtDHgcDqitUeOtjnJKJ+apYjVcAoBEMjKW1VVFGZLUb5+qqa09XFA=="
     },
     "@types/uuid": {
-      "version": "9.0.0",
-      "resolved": "https://registry.npmjs.org/@types/uuid/-/uuid-9.0.0.tgz",
-      "integrity": "sha512-kr90f+ERiQtKWMz5rP32ltJ/BtULDI5RVO0uavn1HQUOwjx0R1h0rnDYNL0CepF1zL5bSY6FISAfd9tOdDhU5Q==",
+      "version": "9.0.1",
+      "resolved": "https://registry.npmjs.org/@types/uuid/-/uuid-9.0.1.tgz",
+      "integrity": "sha512-rFT3ak0/2trgvp4yYZo5iKFEPsET7vKydKF+VRCxlQ9bpheehyAJH89dAkaLEq/j/RZXJIqcgsmPJKUP1Z28HA==",
       "dev": true
     },
     "@webassemblyjs/ast": {
@@ -10769,9 +10769,9 @@
       }
     },
     "sass": {
-      "version": "1.57.1",
-      "resolved": "https://registry.npmjs.org/sass/-/sass-1.57.1.tgz",
-      "integrity": "sha512-O2+LwLS79op7GI0xZ8fqzF7X2m/m8WFfI02dHOdsK5R2ECeS5F62zrwg/relM1rjSLy7Vd/DiMNIvPrQGsA0jw==",
+      "version": "1.58.3",
+      "resolved": "https://registry.npmjs.org/sass/-/sass-1.58.3.tgz",
+      "integrity": "sha512-Q7RaEtYf6BflYrQ+buPudKR26/lH+10EmO9bBqbmPh/KeLqv8bjpTNqxe71ocONqXq+jYiCbpPUmQMS+JJPk4A==",
       "devOptional": true,
       "requires": {
         "chokidar": ">=3.0.0 <4.0.0",

package/packages/scrabble-solver/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@scrabble-solver/scrabble-solver",
-  "version": "2.10.4",
+  "version": "2.10.6",
   "description": "Scrabble Solver 2 - App",
   "engines": {
     "node": ">=16"
@@ -30,14 +30,14 @@
   "dependencies": {
     "@kamilmielnik/trie": "^2.0.1",
     "@popperjs/core": "^2.11.6",
-    "@reduxjs/toolkit": "^1.9.2",
-    "@scrabble-solver/configs": "^2.10.4",
-    "@scrabble-solver/constants": "^2.10.4",
-    "@scrabble-solver/dictionaries": "^2.10.4",
-    "@scrabble-solver/logger": "^2.10.4",
-    "@scrabble-solver/solver": "^2.10.4",
-    "@scrabble-solver/types": "^2.10.4",
-    "@scrabble-solver/word-definitions": "^2.10.4",
+    "@reduxjs/toolkit": "^1.9.3",
+    "@scrabble-solver/configs": "^2.10.6",
+    "@scrabble-solver/constants": "^2.10.6",
+    "@scrabble-solver/dictionaries": "^2.10.6",
+    "@scrabble-solver/logger": "^2.10.6",
+    "@scrabble-solver/solver": "^2.10.6",
+    "@scrabble-solver/types": "^2.10.6",
+    "@scrabble-solver/word-definitions": "^2.10.6",
     "classnames": "^2.3.2",
     "include-media": "^2.0.0",
     "include-media-query-builder": "^1.1.0",
@@ -63,17 +63,17 @@
   "devDependencies": {
     "@svgr/webpack": "^6.5.1",
     "@types/classnames": "^2.3.0",
-    "@types/react": "^18.0.27",
-    "@types/react-dom": "^18.0.10",
+    "@types/react": "^18.0.28",
+    "@types/react-dom": "^18.0.11",
     "@types/react-modal": "^3.13.1",
     "@types/react-portal": "^4.0.4",
     "@types/react-redux": "^7.1.25",
     "@types/react-window": "^1.8.5",
     "@types/redux": "^3.6.31",
     "@types/redux-saga": "^0.10.5",
-    "@types/uuid": "^9.0.0",
+    "@types/uuid": "^9.0.1",
     "env-cmd": "^10.1.0",
-    "sass": "^1.57.1",
+    "sass": "^1.58.3",
     "workbox-webpack-plugin": "^6.5.4"
   },
   "gitHead": "1e2d1ad49a288d4a44196d8e3336740da132c637"

package/packages/scrabble-solver/src/components/Board/components/Cell/Cell.module.scss

@@ -35,69 +35,69 @@ $icon-size: 16px;
   }
 
   &.bonusStart {
-    &:before {
+    &::before {
       background-color: var(--color--violet--light);
     }
   }
 
   &.bonusCharacter1 {
-    &:before {
+    &::before {
       background-color: var(--color--yellow--light);
     }
   }
 
   &.bonusCharacter2 {
-    &:before {
+    &::before {
       background-color: var(--color--green--light);
     }
   }
 
   &.bonusCharacter3 {
-    &:before {
+    &::before {
       background-color: var(--color--blue--light);
     }
   }
 
   &.bonusCharacter5 {
-    &:before {
+    &::before {
       background-color: var(--color--red--light);
     }
   }
 
   &.bonusCharacterMultiplier2 {
-    &:before {
+    &::before {
       background-color: var(--color--light-blue--light);
     }
   }
 
   &.bonusCharacterMultiplier3 {
-    &:before {
+    &::before {
       background-color: var(--color--dark-blue--light);
     }
   }
 
   &.bonusWord2 {
-    &:before {
+    &::before {
       content: 'x2';
       background-color: var(--color--orange);
     }
   }
 
   &.bonusWord3 {
-    &:before {
+    &::before {
       content: 'x3';
       background-color: var(--color--pink);
     }
   }
 
   &.candidate {
-    &:before {
+    &::before {
       content: ' ';
       background-color: var(--color--primary);
     }
   }
 
-  &:before {
+  &::before {
     $size: 80%;
 
     display: flex;

package/packages/scrabble-solver/src/components/Button/Button.module.scss

@@ -8,8 +8,7 @@
   padding: var(--spacing--m) var(--spacing--l);
   border: var(--border);
   border-radius: var(--border--radius);
-  box-shadow: none;
-  color: var(--color--inactive);
+  text-transform: uppercase;
   transition: var(--transition);
   cursor: pointer;
 
@@ -17,10 +16,31 @@
   &:active,
   &:focus,
   &:hover {
-    text-decoration: none;
-    background-color: var(--color--primary);
     box-shadow: var(--box-shadow);
-    color: white;
+    text-decoration: none;
+
+    &.primary {
+      background-color: var(--color--primary);
+      color: white;
+    }
+
+    &.default {
+      background-color: var(--color--background--overlay);
+      color: var(--color--foreground);
+
+      .icon {
+        color: var(--color--inactive);
+      }
+    }
+  }
+
+  &:focus,
+  &:hover {
+    &.default:not(:disabled) {
+      .icon {
+        color: var(--color--foreground--secondary);
+      }
+    }
   }
 
   &:active {
@@ -33,24 +53,23 @@
   }
 
   &[disabled] {
-    opacity: var(--opacity--disabled);
-    box-shadow: none;
-    cursor: not-allowed;
+    @include disabled;
   }
 }
 
 .content {
   display: flex;
   align-items: center;
-  gap: var(--spacing--m);
+  gap: 20px;
 }
 
 .icon {
   width: var(--button--icon--size);
   height: var(--button--icon--size);
+  transition: var(--transition);
 }
 
 .label {
   font-size: var(--font--size--h3);
-  text-transform: uppercase;
+  transition: var(--transition);
 }

package/packages/scrabble-solver/src/components/Button/Button.tsx

@@ -1,22 +1,39 @@
 import classNames from 'classnames';
-import { ButtonHTMLAttributes, FunctionComponent, MouseEventHandler, ReactNode, SVGAttributes } from 'react';
+import { ButtonHTMLAttributes, FunctionComponent, ReactNode, SVGAttributes } from 'react';
 
 import { useTooltip } from '../Tooltip';
 
 import styles from './Button.module.scss';
+import Link from './Link';
 
 interface Props extends ButtonHTMLAttributes<HTMLButtonElement> {
   Icon?: FunctionComponent<SVGAttributes<SVGElement>>;
   iconClassName?: string;
   tooltip?: ReactNode;
-  onClick: MouseEventHandler<HTMLButtonElement>;
+  variant?: 'default' | 'primary';
 }
 
-const Button: FunctionComponent<Props> = ({ children, className, Icon, iconClassName, tooltip, ...props }) => {
+const Button: FunctionComponent<Props> = ({
+  children,
+  className,
+  Icon,
+  iconClassName,
+  tooltip,
+  variant = 'default',
+  ...props
+}) => {
   const triggerProps = useTooltip(tooltip, props);
 
   return (
-    <button className={classNames(styles.button, className)} type="button" {...props} {...triggerProps}>
+    <button
+      className={classNames(styles.button, className, {
+        [styles.default]: variant === 'default',
+        [styles.primary]: variant === 'primary',
+      })}
+      type="button"
+      {...props}
+      {...triggerProps}
+    >
       <span className={styles.content}>
         {Icon && <Icon className={classNames(styles.icon, iconClassName)} />}
         {children && <span className={styles.label}>{children}</span>}
@@ -25,4 +42,6 @@ const Button: FunctionComponent<Props> = ({ children, className, Icon, iconClass
   );
 };
 
-export default Button;
+export default Object.assign(Button, {
+  Link,
+});

package/packages/scrabble-solver/src/components/Button/Link.tsx

@@ -0,0 +1,44 @@
+import classNames from 'classnames';
+import { AnchorHTMLAttributes, FunctionComponent, ReactNode, SVGAttributes } from 'react';
+
+import { useTooltip } from '../Tooltip';
+
+import styles from './Button.module.scss';
+
+interface Props extends AnchorHTMLAttributes<HTMLAnchorElement> {
+  href: string;
+  Icon: FunctionComponent<SVGAttributes<SVGElement>>;
+  iconClassName?: string;
+  tooltip?: ReactNode;
+  variant?: 'default' | 'primary';
+}
+
+const Link: FunctionComponent<Props> = ({
+  children,
+  className,
+  Icon,
+  iconClassName,
+  tooltip,
+  variant = 'default',
+  ...props
+}) => {
+  const triggerProps = useTooltip(tooltip, props);
+
+  return (
+    <a
+      className={classNames(styles.button, className, {
+        [styles.default]: variant === 'default',
+        [styles.primary]: variant === 'primary',
+      })}
+      {...props}
+      {...triggerProps}
+    >
+      <span className={styles.content}>
+        {Icon && <Icon className={classNames(styles.icon, iconClassName)} />}
+        {children && <span className={styles.label}>{children}</span>}
+      </span>
+    </a>
+  );
+};
+
+export default Link;

package/packages/scrabble-solver/src/components/Radio/Radio.module.scss

@@ -24,7 +24,7 @@ $radio-box-size: $radio-size + 2 * $radio-inner-border;
 
   &.checked {
     .icon {
-      &:after {
+      &::after {
         background-color: var(--color--primary);
       }
     }
@@ -51,7 +51,7 @@ $radio-box-size: $radio-size + 2 * $radio-inner-border;
   box-shadow: var(--box-shadow--null);
   pointer-events: none;
 
-  &:after {
+  &::after {
     content: ' ';
     position: absolute;
     top: $radio-inner-border;

package/packages/scrabble-solver/src/components/Results/SolveButton.tsx

@@ -35,6 +35,7 @@ const SolveButton: FunctionComponent<Props> = ({ className }) => {
       disabled={isLoading || !isOutdated || !hasTiles}
       Icon={Search}
       type="submit"
+      variant="primary"
       onClick={handleClick}
     >
       {translate('results.solve')}

package/packages/scrabble-solver/src/components/Solver/Solver.module.scss

@@ -47,6 +47,10 @@
   margin: 0 auto;
 }
 
+.submitInput {
+  display: none;
+}
+
 .column {
   display: flex;
   flex-direction: column;
@@ -58,6 +62,11 @@
   }
 }
 
+.resultsContainer {
+  flex: 1;
+  position: relative;
+}
+
 .dictionary {
   display: flex;
   flex-direction: column;
@@ -72,11 +81,6 @@
   flex: 0 0 auto;
 }
 
-.resultsContainer {
-  flex: 1;
-  position: relative;
-}
-
 .bottomContainer {
   flex: 0 0 auto;
   display: flex;
@@ -101,24 +105,8 @@
   border: var(--border);
 }
 
-.submitInput {
-  display: none;
-}
-
 .controls {
   width: 100%;
-  display: flex;
-  align-items: flex-start;
-  justify-content: center;
-  gap: var(--spacing--l);
-}
-
-.resultCandidatePicker {
-  flex: 1;
-}
-
-.apply {
-  flex: 0 0 auto;
 }
 
 .solve {