@scrabble-solver/scrabble-solver 2.15.9 → 2.15.10

package/src/components/Radio/Radio.tsx

@@ -13,7 +13,7 @@ interface Props {
   onChange: ChangeEventHandler<HTMLInputElement>;
 }
 
-const Radio: FunctionComponent<Props> = ({ checked, children, className, disabled, name, value, onChange }) => (
+export const Radio: FunctionComponent<Props> = ({ checked, children, className, disabled, name, value, onChange }) => (
   <label
     className={classNames(styles.radio, className, {
       [styles.checked]: checked,
@@ -37,5 +37,3 @@ const Radio: FunctionComponent<Props> = ({ checked, children, className, disable
     <div className={styles.content}>{children}</div>
   </label>
 );
-
-export default Radio;

package/src/components/Radio/index.ts

@@ -1 +1 @@
-export { default } from './Radio';
+export { Radio } from './Radio';

package/src/components/Results/Cell.tsx

@@ -18,7 +18,15 @@ interface Props {
   value: string | number;
 }
 
-const Cell: FunctionComponent<Props> = ({ children, className, dataTestId, style, translationKey, tooltip, value }) => {
+export const Cell: FunctionComponent<Props> = ({
+  children,
+  className,
+  dataTestId,
+  style,
+  translationKey,
+  tooltip,
+  value,
+}) => {
   const translate = useTranslate();
   const locale = useTypedSelector(selectLocale);
   const formattedValue = value.toLocaleString(locale);
@@ -31,5 +39,3 @@ const Cell: FunctionComponent<Props> = ({ children, className, dataTestId, style
     </Tooltip>
   );
 };
-
-export default Cell;

package/src/components/Results/Header.tsx

@@ -5,10 +5,10 @@ import { GeoAlt, OneTwoThree, Square, SquareA, SquareB, Squares, Words } from 'i
 import { RESULTS_COLUMN_WIDTH } from 'parameters';
 import { ResultColumnId } from 'types';
 
-import HeaderButton from './HeaderButton';
+import { HeaderButton } from './HeaderButton';
 import styles from './Results.module.scss';
 
-const Results: FunctionComponent = () => {
+export const Header: FunctionComponent = () => {
   const { resultWordWidth } = useAppLayout();
   const columns = useColumns();
 
@@ -95,5 +95,3 @@ const Results: FunctionComponent = () => {
     </div>
   );
 };
-
-export default Results;

package/src/components/Results/HeaderButton.tsx

@@ -18,7 +18,7 @@ interface Props {
   style?: CSSProperties;
 }
 
-const HeaderButton = ({ className, Icon, id, translationKey, style }: Props): ReactElement => {
+export const HeaderButton = ({ className, Icon, id, translationKey, style }: Props): ReactElement => {
   const dispatch = useDispatch();
   const translate = useTranslate();
   const sort = useTypedSelector(selectResultsSort);
@@ -52,5 +52,3 @@ const HeaderButton = ({ className, Icon, id, translationKey, style }: Props): Re
     </Tooltip>
   );
 };
-
-export default HeaderButton;

package/src/components/Results/Result.tsx

@@ -14,7 +14,7 @@ import {
 } from 'state';
 import { ResultColumnId } from 'types';
 
-import Cell from './Cell';
+import { Cell } from './Cell';
 import styles from './Results.module.scss';
 import { ResultData } from './types';
 
@@ -24,7 +24,7 @@ interface Props {
   style?: CSSProperties;
 }
 
-const Result = ({ data, index, style }: Props): ReactElement => {
+export const Result = ({ data, index, style }: Props): ReactElement => {
   const {
     highlightedIndex,
     results = [],
@@ -118,5 +118,3 @@ const Result = ({ data, index, style }: Props): ReactElement => {
     </button>
   );
 };
-
-export default Result;

package/src/components/Results/Results.tsx

@@ -16,14 +16,14 @@ import {
   useTypedSelector,
 } from 'state';
 
-import EmptyState from '../EmptyState';
-import Loading from '../Loading';
-import ResultsInput from '../ResultsInput';
+import { EmptyState } from '../EmptyState';
+import { Loading } from '../Loading';
+import { ResultsInput } from '../ResultsInput';
 
-import Header from './Header';
-import Result from './Result';
+import { Header } from './Header';
+import { Result } from './Result';
 import styles from './Results.module.scss';
-import SolveButton from './SolveButton';
+import { SolveButton } from './SolveButton';
 import { ResultCallbacks, ResultData } from './types';
 
 interface Props {
@@ -34,7 +34,7 @@ interface Props {
 
 const IS_LOADING_DEBOUNCE = 100;
 
-const Results: FunctionComponent<Props> = ({ callbacks, className, highlightedIndex }) => {
+export const Results: FunctionComponent<Props> = ({ callbacks, className, highlightedIndex }) => {
   const translate = useTranslate();
   const { resultsHeight, resultsWidth } = useAppLayout();
   const locale = useTypedSelector(selectLocale);
@@ -130,5 +130,3 @@ const Results: FunctionComponent<Props> = ({ callbacks, className, highlightedIn
     </div>
   );
 };
-
-export default Results;

package/src/components/Results/SolveButton.tsx

@@ -11,13 +11,13 @@ import {
   useTypedSelector,
 } from 'state';
 
-import Button from '../Button';
+import { Button } from '../Button';
 
 interface Props {
   className?: string;
 }
 
-const SolveButton: FunctionComponent<Props> = ({ className }) => {
+export const SolveButton: FunctionComponent<Props> = ({ className }) => {
   const dispatch = useDispatch();
   const translate = useTranslate();
   const isLoading = useTypedSelector(selectIsLoading);
@@ -43,5 +43,3 @@ const SolveButton: FunctionComponent<Props> = ({ className }) => {
     </Button>
   );
 };
-
-export default SolveButton;

package/src/components/Results/index.ts

@@ -1 +1 @@
-export { default } from './Results';
+export { Results } from './Results';

package/src/components/ResultsInput/ResultsInput.tsx

@@ -11,7 +11,7 @@ interface Props {
   className?: string;
 }
 
-const ResultsInput: FunctionComponent<Props> = ({ className }) => {
+export const ResultsInput: FunctionComponent<Props> = ({ className }) => {
   const dispatch = useDispatch();
   const translate = useTranslate();
   const value = useTypedSelector(selectResultsQuery);
@@ -43,5 +43,3 @@ const ResultsInput: FunctionComponent<Props> = ({ className }) => {
     </form>
   );
 };
-
-export default ResultsInput;

package/src/components/ResultsInput/index.ts

@@ -1 +1 @@
-export { default } from './ResultsInput';
+export { ResultsInput } from './ResultsInput';

package/src/components/SeoMessage/SeoMessage.tsx

@@ -8,12 +8,10 @@ const INVISIBLE_STYLE: CSSProperties = {
   transform: 'translateY(-9999px)',
 };
 
-const SeoMessage: FunctionComponent = () => (
+export const SeoMessage: FunctionComponent = () => (
   <p style={INVISIBLE_STYLE}>
-    Scrabble Solver 2 is a free and open-source analysis tool for Scrabble, Super Scrabble &amp; Literaki. Quickly find
-    top scoring words using given letters and board state. Available in English, French, German, Polish & Spanish.
-    Source code is available on GitHub - contributions are welcome!
+    Scrabble Solver 2 is a free and open-source analysis tool for Scrabble, Scrabble Duel, Super Scrabble, Literaki, and
+    Kelimelik. Quickly find top scoring words using given letters and board state. Available in English, French, German,
+    Persian, Polish, Romanian, Spanish, and Turkish. Source code is available on GitHub - contributions are welcome!
   </p>
 );
-
-export default SeoMessage;

package/src/components/SeoMessage/index.ts

@@ -1 +1 @@
-export { default } from './SeoMessage';
+export { SeoMessage } from './SeoMessage';

package/src/components/Solver/Solver.tsx

@@ -15,12 +15,12 @@ import {
   useTypedSelector,
 } from 'state';
 
-import Alert from '../Alert';
-import Board from '../Board';
-import Dictionary from '../Dictionary';
-import DictionaryInput from '../DictionaryInput';
-import Rack from '../Rack';
-import Results from '../Results';
+import { Alert } from '../Alert';
+import { Board } from '../Board';
+import { Dictionary } from '../Dictionary';
+import { DictionaryInput } from '../DictionaryInput';
+import { Rack } from '../Rack';
+import { Results } from '../Results';
 
 import { ResultCandidatePicker } from './components';
 import styles from './Solver.module.scss';
@@ -30,7 +30,7 @@ interface Props {
   onShowResults: () => void;
 }
 
-const Solver: FunctionComponent<Props> = ({ className, onShowResults }) => {
+const SolverBase: FunctionComponent<Props> = ({ className, onShowResults }) => {
   const dispatch = useDispatch();
   const translate = useTranslate();
   const isTouchDevice = useIsTouchDevice();
@@ -138,4 +138,4 @@ const Solver: FunctionComponent<Props> = ({ className, onShowResults }) => {
   );
 };
 
-export default memo(Solver);
+export const Solver = memo(SolverBase);

package/src/components/Solver/components/InsertButton/InsertButton.tsx

@@ -5,7 +5,7 @@ import { useDispatch } from 'react-redux';
 import { Check } from 'icons';
 import { resultsSlice, selectAreResultsOutdated, selectResultCandidate, useTranslate, useTypedSelector } from 'state';
 
-import Button from '../../../Button';
+import { Button } from '../../../Button';
 
 import styles from './InsertButton.module.scss';
 
@@ -13,7 +13,7 @@ interface Props {
   className?: string;
 }
 
-const InsertButton: FunctionComponent<Props> = ({ className }) => {
+export const InsertButton: FunctionComponent<Props> = ({ className }) => {
   const dispatch = useDispatch();
   const translate = useTranslate();
   const resultCandidate = useTypedSelector(selectResultCandidate);
@@ -38,5 +38,3 @@ const InsertButton: FunctionComponent<Props> = ({ className }) => {
     />
   );
 };
-
-export default InsertButton;

package/src/components/Solver/components/InsertButton/index.ts

@@ -1 +1 @@
-export { default } from './InsertButton';
+export { InsertButton } from './InsertButton';

package/src/components/Solver/components/ResultCandidatePicker/ResultCandidatePicker.tsx

@@ -14,9 +14,9 @@ import {
   useTypedSelector,
 } from 'state';
 
-import Button from '../../../Button';
-import Spinner from '../../../Spinner';
-import InsertButton from '../InsertButton';
+import { Button } from '../../../Button';
+import { Spinner } from '../../../Spinner';
+import { InsertButton } from '../InsertButton';
 
 import styles from './ResultCandidatePicker.module.scss';
 
@@ -24,7 +24,7 @@ interface Props extends HTMLProps<HTMLDivElement> {
   onResultClick: MouseEventHandler<HTMLButtonElement>;
 }
 
-const ResultCandidatePicker: FunctionComponent<Props> = ({ className, onResultClick, ...props }) => {
+export const ResultCandidatePicker: FunctionComponent<Props> = ({ className, onResultClick, ...props }) => {
   const dispatch = useDispatch();
   const translate = useTranslate();
   const locale = useTypedSelector(selectLocale);
@@ -98,5 +98,3 @@ const ResultCandidatePicker: FunctionComponent<Props> = ({ className, onResultCl
     </div>
   );
 };
-
-export default ResultCandidatePicker;

package/src/components/Solver/components/ResultCandidatePicker/index.ts

@@ -1 +1 @@
-export { default } from './ResultCandidatePicker';
+export { ResultCandidatePicker } from './ResultCandidatePicker';

package/src/components/Solver/components/index.ts

@@ -1,2 +1,2 @@
-export { default as InsertButton } from './InsertButton';
-export { default as ResultCandidatePicker } from './ResultCandidatePicker';
+export { InsertButton } from './InsertButton';
+export { ResultCandidatePicker } from './ResultCandidatePicker';

package/src/components/Solver/index.ts

@@ -1 +1 @@
-export { default } from './Solver';
+export { Solver } from './Solver';

package/src/components/Spinner/Spinner.tsx

@@ -9,11 +9,9 @@ interface Props {
   className?: string;
 }
 
-const Spinner: FunctionComponent<Props> = ({ className }) => {
+export const Spinner: FunctionComponent<Props> = ({ className }) => {
   const translate = useTranslate();
   const translation = translate('common.loading');
 
   return <div aria-label={translation} className={classNames(styles.spinner, className)} role="status" />;
 };
-
-export default Spinner;

package/src/components/Spinner/index.ts

@@ -1 +1 @@
-export { default } from './Spinner';
+export { Spinner } from './Spinner';

package/src/components/Tile/Tile.tsx

@@ -17,7 +17,7 @@ import { useAppLayout } from 'hooks';
 import { getTileSizes, noop } from 'lib';
 import { selectLocale, useTypedSelector } from 'state';
 
-import TilePure from './TilePure';
+import { TilePure } from './TilePure';
 
 interface Props {
   'aria-label': string;
@@ -41,7 +41,7 @@ interface Props {
   onTouchStart?: TouchEventHandler<HTMLInputElement>;
 }
 
-const Tile: FunctionComponent<Props> = ({
+export const Tile: FunctionComponent<Props> = ({
   'aria-label': ariaLabel,
   autoFocus,
   className,
@@ -108,5 +108,3 @@ const Tile: FunctionComponent<Props> = ({
     />
   );
 };
-
-export default Tile;

package/src/components/Tile/TilePure.tsx

@@ -40,7 +40,7 @@ interface Props {
   onTouchStart?: TouchEventHandler<HTMLInputElement>;
 }
 
-const TilePure: FunctionComponent<Props> = ({
+const TilePureBase: FunctionComponent<Props> = ({
   'aria-label': ariaLabel,
   autoFocus,
   canShowPoints,
@@ -111,4 +111,4 @@ const TilePure: FunctionComponent<Props> = ({
   </div>
 );
 
-export default memo(TilePure);
+export const TilePure = memo(TilePureBase);

package/src/components/Tile/index.ts

@@ -1 +1 @@
-export { default } from './Tile';
+export { Tile } from './Tile';

package/src/components/Tooltip/TooltipTrigger.tsx

@@ -1,6 +1,6 @@
 import { useMergeRefs } from '@floating-ui/react';
 import { isObject } from '@scrabble-solver/types';
-import { HTMLProps, cloneElement, forwardRef, isValidElement } from 'react';
+import { HTMLProps, ReactElement, RefObject, cloneElement, forwardRef, isValidElement } from 'react';
 
 import { useTooltipContext } from './context';
 
@@ -8,8 +8,10 @@ type Props = HTMLProps<HTMLElement>;
 
 export const TooltipTrigger = forwardRef<HTMLElement, Props>(({ children, ...props }, ref) => {
   const state = useTooltipContext();
-  const childrenElement = children as any; // eslint-disable-line @typescript-eslint/no-explicit-any
-  const finalRef = useMergeRefs([state.refs.setReference, ref, childrenElement.ref]);
+  const childrenElement = children as ReactElement<{
+    ref: RefObject<HTMLElement>;
+  }>;
+  const finalRef = useMergeRefs([state.refs.setReference, ref, childrenElement.props.ref]);
 
   if (!isValidElement(children)) {
     throw new Error("TooltipTrigger's children are not a valid element");

package/src/components/index.ts

@@ -1,27 +1,26 @@
-export { default as Alert } from './Alert';
-export { default as Badge } from './Badge';
-export { default as Board } from './Board';
-export { default as Button } from './Button';
-export { default as Dictionary } from './Dictionary';
-export { default as DictionaryInput } from './DictionaryInput';
-export { default as EmptyState } from './EmptyState';
-export { default as IconButton } from './IconButton';
-export { default as Key } from './Key';
-export { default as Loading } from './Loading';
-export { default as Logo } from './Logo';
-export { default as Modal } from './Modal';
-export { default as NavButtons } from './NavButtons';
-export { default as NotFound } from './NotFound';
-export { default as PlainTiles } from './PlainTiles';
-export { default as Progress } from './Progress';
-export { default as Rack } from './Rack';
-export { default as Radio } from './Radio';
-export { default as Results } from './Results';
-export { default as ResultsInput } from './ResultsInput';
-export { default as SeoMessage } from './SeoMessage';
-export { default as Solver } from './Solver';
-export { default as Spinner } from './Spinner';
-export { default as Tile } from './Tile';
-export * from './keys';
+export { Alert } from './Alert';
+export { Badge } from './Badge';
+export { Board } from './Board';
+export { Button } from './Button';
+export { Dictionary } from './Dictionary';
+export { DictionaryInput } from './DictionaryInput';
+export { EmptyState } from './EmptyState';
+export { IconButton } from './IconButton';
+export { Key } from './Key';
+export { Loading } from './Loading';
+export { Logo } from './Logo';
+export { Modal } from './Modal';
+export { NavButtons } from './NavButtons';
+export { NotFound } from './NotFound';
+export { PlainTiles } from './PlainTiles';
+export { Progress } from './Progress';
+export { Rack } from './Rack';
+export { Radio } from './Radio';
+export { Results } from './Results';
+export { ResultsInput } from './ResultsInput';
+export { SeoMessage } from './SeoMessage';
+export { Solver } from './Solver';
+export { Spinner } from './Spinner';
+export { Tile } from './Tile';
 export * from './Keys';
 export * from './Tooltip';

package/src/hooks/index.ts

@@ -1,13 +1,13 @@
-export { default as useAppLayout } from './useAppLayout';
-export { default as useColumns } from './useColumns';
-export { default as useDirection } from './useDirection';
-export { default as useEffectOnce } from './useEffectOnce';
-export { default as useIsTouchDevice } from './useIsTouchDevice';
-export { default as useLanguage } from './useLanguage';
-export { default as useLatest } from './useLatest';
-export { default as useLocalStorage } from './useLocalStorage';
-export { default as useMedia } from './useMedia';
-export { default as useMediaQueries } from './useMediaQueries';
-export { default as useMediaQuery } from './useMediaQuery';
-export { default as useOnWindowResize } from './useOnWindowResize';
-export { default as useViewportSize } from './useViewportSize';
+export { useAppLayout } from './useAppLayout';
+export { useColumns } from './useColumns';
+export { useDirection } from './useDirection';
+export { useEffectOnce } from './useEffectOnce';
+export { useIsTouchDevice } from './useIsTouchDevice';
+export { useLanguage } from './useLanguage';
+export { useLatest } from './useLatest';
+export { useLocalStorage } from './useLocalStorage';
+export { useMedia } from './useMedia';
+export { useMediaQueries } from './useMediaQueries';
+export { useMediaQuery } from './useMediaQuery';
+export { useOnWindowResize } from './useOnWindowResize';
+export { useViewportSize } from './useViewportSize';

package/src/hooks/useAppLayout.ts

@@ -22,12 +22,12 @@ import {
 import { selectConfig, selectShowCoordinates, useTypedSelector } from 'state';
 import { ResultColumnId } from 'types';
 
-import useColumns from './useColumns';
-import useIsTouchDevice from './useIsTouchDevice';
-import useMediaQueries from './useMediaQueries';
-import useViewportSize from './useViewportSize';
+import { useColumns } from './useColumns';
+import { useIsTouchDevice } from './useIsTouchDevice';
+import { useMediaQueries } from './useMediaQueries';
+import { useViewportSize } from './useViewportSize';
 
-const useAppLayout = () => {
+export const useAppLayout = () => {
   const { viewportHeight, viewportWidth } = useViewportSize();
   const config = useTypedSelector(selectConfig);
   const showCoordinates = useTypedSelector(selectShowCoordinates);
@@ -54,17 +54,22 @@ const useAppLayout = () => {
   const coordinatesSizeRatio = showCoordinates === 'hidden' ? 0 : 0.5;
   const coordinatesBorderWidth = showCoordinates === 'hidden' ? 0 : 1;
   const cellWidth =
-    (maxBoardWidth - (config.boardSize + 1 + coordinatesBorderWidth) * BORDER_WIDTH) /
-    (config.boardSize + coordinatesSizeRatio);
+    (maxBoardWidth - (config.boardWidth + 1 + coordinatesBorderWidth) * BORDER_WIDTH) /
+    (config.boardWidth + coordinatesSizeRatio);
   const cellHeight =
-    (maxBoardHeight - (config.boardSize + 1 + coordinatesBorderWidth) * BORDER_WIDTH) /
-    (config.boardSize + coordinatesSizeRatio);
+    (maxBoardHeight - (config.boardHeight + 1 + coordinatesBorderWidth) * BORDER_WIDTH) /
+    (config.boardHeight + coordinatesSizeRatio);
   const cellSize = Math.min(Math.min(cellWidth, cellHeight), BOARD_TILE_SIZE_MAX);
   const coordinatesSize = coordinatesSizeRatio * cellSize;
-  const boardSize =
-    (cellSize + BORDER_WIDTH) * config.boardSize +
+  const boardWidth =
+    (cellSize + BORDER_WIDTH) * config.boardWidth +
     BORDER_WIDTH +
     (showCoordinates === 'hidden' ? 0 : coordinatesSize + BORDER_WIDTH);
+  const boardHeight =
+    (cellSize + BORDER_WIDTH) * config.boardHeight +
+    BORDER_WIDTH +
+    (showCoordinates === 'hidden' ? 0 : coordinatesSize + BORDER_WIDTH);
+
   const maxControlsWidth = tileSize * config.rackSize + 2 * BORDER_WIDTH;
   const showResultsInModal = isLessThanL;
   const dictionaryHeight = showResultsInModal ? DICTIONARY_HEIGHT_MOBILE : DICTIONARY_HEIGHT;
@@ -72,7 +77,7 @@ const useAppLayout = () => {
   const modalWidth = isLessThanS ? viewportWidth : MODAL_WIDTH;
   const resultsHeight = isLessThanL
     ? viewportHeight - dictionaryHeight - BUTTON_HEIGHT - MODAL_HEADER_HEIGHT - 5 * componentsSpacing
-    : boardSize - componentsSpacing - dictionaryHeight;
+    : boardHeight - componentsSpacing - dictionaryHeight;
   const rackWidth = tileSize * config.rackSize;
   const resultsWidth = isLessThanL ? modalWidth - 2 * componentsSpacing : SOLVER_COLUMN_WIDTH;
   const columnsWidth = Object.keys(columns).reduce(
@@ -83,7 +88,8 @@ const useAppLayout = () => {
 
   return {
     actionsWidth: 2 * BUTTON_HEIGHT - BORDER_WIDTH,
-    boardSize,
+    boardHeight,
+    boardWidth,
     cellSize,
     coordinatesFontSize: coordinatesSize * 0.6,
     coordinatesSize,
@@ -106,5 +112,3 @@ const useAppLayout = () => {
     tileSize,
   };
 };
-
-export default useAppLayout;

package/src/hooks/useColumns.ts

@@ -3,7 +3,7 @@ import { useMemo } from 'react';
 import { selectColumns, useTypedSelector } from 'state';
 import { ResultColumnId } from 'types';
 
-import useMediaQueries from './useMediaQueries';
+import { useMediaQueries } from './useMediaQueries';
 
 const COLUMNS_XS = [ResultColumnId.Coordinates, ResultColumnId.Word, ResultColumnId.Points];
 
@@ -13,7 +13,7 @@ const COLUMNS_M = [...COLUMNS_XS];
 
 const COLUMNS_L = [...COLUMNS_XS];
 
-const useColumns = (): Partial<Record<ResultColumnId, boolean>> => {
+export const useColumns = (): Partial<Record<ResultColumnId, boolean>> => {
   const columns = useTypedSelector(selectColumns);
   const { isLessThanXs, isLessThanS, isLessThanM, isLessThanL } = useMediaQueries();
 
@@ -43,5 +43,3 @@ const useColumns = (): Partial<Record<ResultColumnId, boolean>> => {
 
   return columnsMap;
 };
-
-export default useColumns;

package/src/hooks/useDirection.ts

@@ -2,7 +2,7 @@ import { useEffect } from 'react';
 
 import { noop } from 'lib';
 
-const useDirection = (direction: 'ltr' | 'rtl') => {
+export const useDirection = (direction: 'ltr' | 'rtl') => {
   useEffect(() => {
     const html = document.body.parentElement;
 
@@ -18,5 +18,3 @@ const useDirection = (direction: 'ltr' | 'rtl') => {
     };
   }, [direction]);
 };
-
-export default useDirection;

package/src/hooks/useEffectOnce.ts

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

package/src/hooks/useIsTouchDevice.ts

@@ -1,7 +1,5 @@
-import useMedia from './useMedia';
+import { useMedia } from './useMedia';
 
-const useIsTouchDevice = () => {
+export const useIsTouchDevice = () => {
   return useMedia('(hover: none)', false);
 };
-
-export default useIsTouchDevice;

package/src/hooks/useLanguage.ts

@@ -2,7 +2,7 @@ import { useEffect } from 'react';
 
 import { noop } from 'lib';
 
-const useLanguage = (language: string) => {
+export const useLanguage = (language: string) => {
   useEffect(() => {
     const html = document.body.parentElement;
 
@@ -18,5 +18,3 @@ const useLanguage = (language: string) => {
     };
   }, [language]);
 };
-
-export default useLanguage;

package/src/hooks/useLatest.ts

@@ -4,10 +4,8 @@ interface Latest<T> {
   readonly current: T;
 }
 
-const useLatest = <T>(value: T): Latest<T> => {
+export const useLatest = <T>(value: T): Latest<T> => {
   const ref = useRef(value);
   ref.current = value;
   return ref;
 };
-
-export default useLatest;