remove react-use and move useIsomorphicLayoutEffect into hooks (#144)

dagda1 · Apr 14, 2022 · 22996a3 · 22996a3
1 parent 533b739
commit 22996a3
Show file tree

Hide file tree

Showing 10 changed files with 24 additions and 165 deletions.
diff --git a/.changeset/rare-news-check.md b/.changeset/rare-news-check.md
@@ -0,0 +1,7 @@
+---
+"@cutting/hooks": patch
+"@cutting/use-get-parent-size": patch
+"@cutting/use-mathjax": patch
+---
+
+remove react-use and move useIsomorphicLayoutEffect into hooks
diff --git a/packages/hooks/package.json b/packages/hooks/package.json
@@ -23,11 +23,7 @@
   },
   "dependencies": {
     "@cutting/util": "workspace:*",
-    "assert-ts": "^0.3.4",
-    "history": "^5.3.0",
-    "react-use": "^17.3.2",
-    "resize-observer-polyfill": "^1.5.1",
-    "use-debounce": "^7.0.1"
+    "assert-ts": "^0.3.4"
   },
   "devDependencies": {
     "@cutting/devtools": "workspace:*",
@@ -44,6 +40,7 @@
     "@vanilla-extract/babel-plugin": "1.1.5",
     "@vanilla-extract/css": "1.6.8",
     "eslint": "8.13.0",
+    "history": "^5.3.0",
     "react": "18.0.0",
     "react-dom": "18.0.0",
     "react-router": "6.3.0",

diff --git a/packages/hooks/src/index.ts b/packages/hooks/src/index.ts
@@ -1,3 +1,4 @@
 export { useScrollToTop } from './useScrollToTop/useScrollToTop';
 export { useIsMounted } from './useIsMounted/useIsMounted';
 export { usePrevious } from './usePrevious/usePrevious';
+export { useIsomorphicLayoutEffect } from './useIsomorphicLayoutEffect/useIsomorphicLayoutEffect';
diff --git a/packages/hooks/src/useIsomorphicLayoutEffect/useIsomorphicLayoutEffect.ts b/packages/hooks/src/useIsomorphicLayoutEffect/useIsomorphicLayoutEffect.ts
@@ -0,0 +1,3 @@
+import { useEffect, useLayoutEffect } from 'react';
+
+export const useIsomorphicLayoutEffect = typeof document !== 'undefined' ? useLayoutEffect : useEffect;
diff --git a/packages/use-get-parent-size/package.json b/packages/use-get-parent-size/package.json
@@ -26,8 +26,6 @@
     "@cutting/hooks": "workspace:*",
     "@cutting/util": "workspace:*",
     "assert-ts": "^0.3.4",
-    "history": "^5.3.0",
-    "react-use": "^17.3.2",
     "resize-observer-polyfill": "^1.5.1",
     "use-debounce": "^7.0.1"
   },

diff --git a/packages/use-get-parent-size/src/useParentSize/useParentSize.ts b/packages/use-get-parent-size/src/useParentSize/useParentSize.ts
@@ -2,9 +2,8 @@ import type { Dimensions, UseParentSizeOptions, UseParentSizeResult } from './ty
 import type { RefObject } from 'react';
 import { useCallback, useMemo, useRef, useState } from 'react';
 import ResizeObserver from 'resize-observer-polyfill';
-import { useIsomorphicLayoutEffect } from 'react-use';
 import { useDebouncedCallback } from 'use-debounce';
-import { useIsMounted } from '@cutting/hooks';
+import { useIsMounted, useIsomorphicLayoutEffect } from '@cutting/hooks';
 import { identity, isNil } from '@cutting/util';
 import assert from 'assert-ts';
 

diff --git a/packages/use-mathjax/package.json b/packages/use-mathjax/package.json
@@ -20,11 +20,11 @@
     "build": "NODE_ENV=production devtools rollup"
   },
   "dependencies": {
+    "@cutting/hooks": "workspace:*",
     "@cutting/util": "workspace:*",
     "assert-ts": "^0.3.4",
     "mathjax": "^3.2.0",
-    "mathjax3": "3.0.0-beta.4",
-    "react-use": "^17.3.2"
+    "mathjax3": "3.0.0-beta.4"
   },
   "devDependencies": {
     "@cutting/devtools": "workspace:*",

diff --git a/packages/use-mathjax/src/hooks/useMathJax/useMathJax.ts b/packages/use-mathjax/src/hooks/useMathJax/useMathJax.ts
@@ -1,6 +1,6 @@
 import { useMemo } from 'react';
 import { useMathJaxContext } from '../../provider/Provider/Provider';
-import { useIsomorphicLayoutEffect } from 'react-use';
+import { useIsomorphicLayoutEffect } from '@cutting/hooks';
 
 export interface UseMathJax {
   elements?: HTMLElement | HTMLElement[] | SVGGElement | SVGElement[];

diff --git a/packages/use-mathjax/src/provider/Provider/Provider.tsx b/packages/use-mathjax/src/provider/Provider/Provider.tsx
@@ -8,7 +8,7 @@ import { MathJax } from 'mathjax3';
 import { TeX } from 'mathjax3/mathjax3/input/tex.js';
 import { SVG } from 'mathjax3/mathjax3/output/svg.js';
 import { AllPackages } from 'mathjax3/mathjax3/input/tex/AllPackages';
-import { useIsomorphicLayoutEffect } from 'react-use';
+import { useIsomorphicLayoutEffect } from '@cutting/hooks';
 
 interface MathDoc {
   version: string;