@contember/react-utils - npm Package Compare versions

Comparing version 1.2.0-rc.16 to 1.2.0-rc.17

dist/development/hooks/useOnElementResize.js

@@ -7,3 +7,2 @@ import { useRef, useLayoutEffect } from "react";
   const { box = "border-box" } = options;
-  const element = unwrapRefValue(refOrElement);
   const callbackRef = useRef(callback);
@@ -13,30 +12,33 @@ callbackRef.current = callback;
   useLayoutEffect(() => {
-    let timeoutID = void 0;
-    function debouncedOnChange([entry]) {
-      const timeStamp = Date.now();
-      const delta = timeStamp - lastTimeStamp.current;
-      if (delta > timeout) {
-        scopedConsoleRef.current.warned("element.resize:immediate", null);
-        callbackRef.current(entry);
-        lastTimeStamp.current = timeStamp;
+    const element = unwrapRefValue(refOrElement);
+    if (element) {
+      if (element instanceof HTMLElement) {
+        let debouncedOnChange = function([entry]) {
+          const timeStamp = Date.now();
+          const delta = timeStamp - lastTimeStamp.current;
+          if (delta > timeout) {
+            scopedConsoleRef.current.warned("element.resize:immediate", null);
+            callbackRef.current(entry);
+            lastTimeStamp.current = timeStamp;
+          } else {
+            clearTimeout(timeoutID);
+            timeoutID = setTimeout(() => {
+              scopedConsoleRef.current.warned("element.resize:debounced", null);
+              callbackRef.current(entry);
+              lastTimeStamp.current = timeStamp;
+            }, timeout);
+          }
+        };
+        let timeoutID = void 0;
+        const resizeObserver = new ResizeObserver(debouncedOnChange);
+        resizeObserver.observe(element, { box });
+        return () => {
+          clearTimeout(timeoutID);
+          resizeObserver.unobserve(element);
+        };
       } else {
-        clearTimeout(timeoutID);
-        timeoutID = setTimeout(() => {
-          scopedConsoleRef.current.warned("element.resize:debounced", null);
-          callbackRef.current(entry);
-          lastTimeStamp.current = timeStamp;
-        }, timeout);
+        throw new Error("Exhaustive error: Expecting element to be instance of HTMLElement");
       }
     }
-    if (element instanceof HTMLElement) {
-      const resizeObserver = new ResizeObserver(debouncedOnChange);
-      resizeObserver.observe(element, { box });
-      return () => {
-        clearTimeout(timeoutID);
-        resizeObserver.unobserve(element);
-      };
-    } else if (element) {
-      throw new Error("Exhaustive error: Expecting element to be instance of HTMLElement");
-    }
-  }, [box, element, scopedConsoleRef, timeout]);
+  }, [box, refOrElement, scopedConsoleRef, timeout]);
 }
@@ -43,0 +45,0 @@ export {

dist/development/hooks/useOnScrollWithin.js

@@ -9,39 +9,41 @@ import { useRef, useLayoutEffect } from "react";
   const lastTimeStamp = useRef(0);
-  const element = unwrapRefValue(refOrElement);
   useLayoutEffect(() => {
+    const element = unwrapRefValue(refOrElement);
     let timeoutID = void 0;
-    function debouncedHandler(event) {
-      clearTimeout(timeoutID);
-      const delta = event.timeStamp - lastTimeStamp.current;
-      scopedConsoleRef.current.logged("event:element.scroll:delta", delta);
-      if (delta > interval) {
-        scopedConsoleRef.current.warned("event:element.scroll:immediately", event);
-        callbackRef.current(event);
-        lastTimeStamp.current = event.timeStamp;
-      } else {
-        timeoutID = setTimeout(() => {
-          scopedConsoleRef.current.warned("event:element.scroll:debounced", event);
+    if (element) {
+      let debouncedHandler = function(event) {
+        clearTimeout(timeoutID);
+        const delta = event.timeStamp - lastTimeStamp.current;
+        scopedConsoleRef.current.logged("event:element.scroll:delta", delta);
+        if (delta > interval) {
+          scopedConsoleRef.current.warned("event:element.scroll:immediately", event);
+          callbackRef.current(event);
           lastTimeStamp.current = event.timeStamp;
-          callbackRef.current(event);
-        }, interval);
+        } else {
+          timeoutID = setTimeout(() => {
+            scopedConsoleRef.current.warned("event:element.scroll:debounced", event);
+            lastTimeStamp.current = event.timeStamp;
+            callbackRef.current(event);
+          }, interval);
+        }
+      };
+      if (element instanceof HTMLElement) {
+        if (element instanceof HTMLBodyElement || element instanceof HTMLHtmlElement) {
+          window.addEventListener("scroll", debouncedHandler, { capture: true, passive: true });
+          window.addEventListener("resize", debouncedHandler);
+          return () => {
+            window.removeEventListener("scroll", debouncedHandler);
+            window.removeEventListener("resize", debouncedHandler);
+          };
+        } else {
+          element.addEventListener("scroll", debouncedHandler, { passive: true, capture: true });
+          return () => {
+            element.removeEventListener("scroll", debouncedHandler);
+          };
+        }
       }
-    }
-    if (element && element instanceof HTMLElement) {
-      if (element instanceof HTMLBodyElement || element instanceof HTMLHtmlElement) {
-        window.addEventListener("scroll", debouncedHandler, { capture: true, passive: true });
-        window.addEventListener("resize", debouncedHandler);
-        return () => {
-          window.removeEventListener("scroll", debouncedHandler);
-          window.removeEventListener("resize", debouncedHandler);
-        };
-      } else {
-        element.addEventListener("scroll", debouncedHandler, { passive: true, capture: true });
-        return () => {
-          element.removeEventListener("scroll", debouncedHandler);
-        };
-      }
-    } else if (element) {
+    } else {
       throw new Error("Exhaustive error: Expecting element to be instance of HTMLElement");
     }
-  }, [element, interval, scopedConsoleRef]);
+  }, [interval, refOrElement, scopedConsoleRef]);
 }
@@ -48,0 +50,0 @@ export {

dist/development/index.js

@@ -9,2 +9,3 @@ import { createNonNullableContextFactory } from "./context/createNonNullableContextFactory.js";
 import { useArrayMapMemo } from "./hooks/useArrayMapMemo.js";
+import { useAutoHeightTextArea } from "./hooks/useAutoHeightTextArea.js";
 import { useComposeRef } from "./hooks/useComposeRef.js";
@@ -25,2 +26,4 @@ import { useConstantLengthInvariant } from "./hooks/useConstantLengthInvariant.js";
 import { useObjectMemo } from "./hooks/useObjectMemo.js";
+import { useOnElementClickOutsideCallback } from "./hooks/useOnElementClickOutsideCallback.js";
+import { useOnElementMouseEnterDelayedCallback } from "./hooks/useOnElementMouseEnterDelayedCallback.js";
 import { useOnElementMutation } from "./hooks/useOnElementMutation.js";
@@ -72,2 +75,3 @@ import { useOnElementResize } from "./hooks/useOnElementResize.js";
   useArrayMapMemo,
+  useAutoHeightTextArea,
   useClassName,
@@ -91,2 +95,4 @@ useClassNameFactory,
   useObjectMemo,
+  useOnElementClickOutsideCallback,
+  useOnElementMouseEnterDelayedCallback,
   useOnElementMutation,
@@ -93,0 +99,0 @@ useOnElementResize,

dist/production/hooks/useOnElementResize.js

@@ -7,3 +7,2 @@ import { useRef, useLayoutEffect } from "react";
   const { box = "border-box" } = options;
-  const element = unwrapRefValue(refOrElement);
   const callbackRef = useRef(callback);
@@ -13,30 +12,33 @@ callbackRef.current = callback;
   useLayoutEffect(() => {
-    let timeoutID = void 0;
-    function debouncedOnChange([entry]) {
-      const timeStamp = Date.now();
-      const delta = timeStamp - lastTimeStamp.current;
-      if (delta > timeout) {
-        scopedConsoleRef.current.warned("element.resize:immediate", null);
-        callbackRef.current(entry);
-        lastTimeStamp.current = timeStamp;
+    const element = unwrapRefValue(refOrElement);
+    if (element) {
+      if (element instanceof HTMLElement) {
+        let debouncedOnChange = function([entry]) {
+          const timeStamp = Date.now();
+          const delta = timeStamp - lastTimeStamp.current;
+          if (delta > timeout) {
+            scopedConsoleRef.current.warned("element.resize:immediate", null);
+            callbackRef.current(entry);
+            lastTimeStamp.current = timeStamp;
+          } else {
+            clearTimeout(timeoutID);
+            timeoutID = setTimeout(() => {
+              scopedConsoleRef.current.warned("element.resize:debounced", null);
+              callbackRef.current(entry);
+              lastTimeStamp.current = timeStamp;
+            }, timeout);
+          }
+        };
+        let timeoutID = void 0;
+        const resizeObserver = new ResizeObserver(debouncedOnChange);
+        resizeObserver.observe(element, { box });
+        return () => {
+          clearTimeout(timeoutID);
+          resizeObserver.unobserve(element);
+        };
       } else {
-        clearTimeout(timeoutID);
-        timeoutID = setTimeout(() => {
-          scopedConsoleRef.current.warned("element.resize:debounced", null);
-          callbackRef.current(entry);
-          lastTimeStamp.current = timeStamp;
-        }, timeout);
+        throw new Error("Exhaustive error: Expecting element to be instance of HTMLElement");
       }
     }
-    if (element instanceof HTMLElement) {
-      const resizeObserver = new ResizeObserver(debouncedOnChange);
-      resizeObserver.observe(element, { box });
-      return () => {
-        clearTimeout(timeoutID);
-        resizeObserver.unobserve(element);
-      };
-    } else if (element) {
-      throw new Error("Exhaustive error: Expecting element to be instance of HTMLElement");
-    }
-  }, [box, element, scopedConsoleRef, timeout]);
+  }, [box, refOrElement, scopedConsoleRef, timeout]);
 }
@@ -43,0 +45,0 @@ export {

dist/production/hooks/useOnScrollWithin.js

@@ -9,39 +9,41 @@ import { useRef, useLayoutEffect } from "react";
   const lastTimeStamp = useRef(0);
-  const element = unwrapRefValue(refOrElement);
   useLayoutEffect(() => {
+    const element = unwrapRefValue(refOrElement);
     let timeoutID = void 0;
-    function debouncedHandler(event) {
-      clearTimeout(timeoutID);
-      const delta = event.timeStamp - lastTimeStamp.current;
-      scopedConsoleRef.current.logged("event:element.scroll:delta", delta);
-      if (delta > interval) {
-        scopedConsoleRef.current.warned("event:element.scroll:immediately", event);
-        callbackRef.current(event);
-        lastTimeStamp.current = event.timeStamp;
-      } else {
-        timeoutID = setTimeout(() => {
-          scopedConsoleRef.current.warned("event:element.scroll:debounced", event);
+    if (element) {
+      let debouncedHandler = function(event) {
+        clearTimeout(timeoutID);
+        const delta = event.timeStamp - lastTimeStamp.current;
+        scopedConsoleRef.current.logged("event:element.scroll:delta", delta);
+        if (delta > interval) {
+          scopedConsoleRef.current.warned("event:element.scroll:immediately", event);
+          callbackRef.current(event);
           lastTimeStamp.current = event.timeStamp;
-          callbackRef.current(event);
-        }, interval);
+        } else {
+          timeoutID = setTimeout(() => {
+            scopedConsoleRef.current.warned("event:element.scroll:debounced", event);
+            lastTimeStamp.current = event.timeStamp;
+            callbackRef.current(event);
+          }, interval);
+        }
+      };
+      if (element instanceof HTMLElement) {
+        if (element instanceof HTMLBodyElement || element instanceof HTMLHtmlElement) {
+          window.addEventListener("scroll", debouncedHandler, { capture: true, passive: true });
+          window.addEventListener("resize", debouncedHandler);
+          return () => {
+            window.removeEventListener("scroll", debouncedHandler);
+            window.removeEventListener("resize", debouncedHandler);
+          };
+        } else {
+          element.addEventListener("scroll", debouncedHandler, { passive: true, capture: true });
+          return () => {
+            element.removeEventListener("scroll", debouncedHandler);
+          };
+        }
       }
-    }
-    if (element && element instanceof HTMLElement) {
-      if (element instanceof HTMLBodyElement || element instanceof HTMLHtmlElement) {
-        window.addEventListener("scroll", debouncedHandler, { capture: true, passive: true });
-        window.addEventListener("resize", debouncedHandler);
-        return () => {
-          window.removeEventListener("scroll", debouncedHandler);
-          window.removeEventListener("resize", debouncedHandler);
-        };
-      } else {
-        element.addEventListener("scroll", debouncedHandler, { passive: true, capture: true });
-        return () => {
-          element.removeEventListener("scroll", debouncedHandler);
-        };
-      }
-    } else if (element) {
+    } else {
       throw new Error("Exhaustive error: Expecting element to be instance of HTMLElement");
     }
-  }, [element, interval, scopedConsoleRef]);
+  }, [interval, refOrElement, scopedConsoleRef]);
 }
@@ -48,0 +50,0 @@ export {

dist/production/index.js

@@ -9,2 +9,3 @@ import { createNonNullableContextFactory } from "./context/createNonNullableContextFactory.js";
 import { useArrayMapMemo } from "./hooks/useArrayMapMemo.js";
+import { useAutoHeightTextArea } from "./hooks/useAutoHeightTextArea.js";
 import { useComposeRef } from "./hooks/useComposeRef.js";
@@ -25,2 +26,4 @@ import { useConstantLengthInvariant } from "./hooks/useConstantLengthInvariant.js";
 import { useObjectMemo } from "./hooks/useObjectMemo.js";
+import { useOnElementClickOutsideCallback } from "./hooks/useOnElementClickOutsideCallback.js";
+import { useOnElementMouseEnterDelayedCallback } from "./hooks/useOnElementMouseEnterDelayedCallback.js";
 import { useOnElementMutation } from "./hooks/useOnElementMutation.js";
@@ -72,2 +75,3 @@ import { useOnElementResize } from "./hooks/useOnElementResize.js";
   useArrayMapMemo,
+  useAutoHeightTextArea,
   useClassName,
@@ -91,2 +95,4 @@ useClassNameFactory,
   useObjectMemo,
+  useOnElementClickOutsideCallback,
+  useOnElementMouseEnterDelayedCallback,
   useOnElementMutation,
@@ -93,0 +99,0 @@ useOnElementResize,

dist/types/hooks/index.d.ts

@@ -5,2 +5,3 @@ export * from './unwrapRefValue';
 export * from './useArrayMapMemo';
+export * from './useAutoHeightTextArea';
 export * from './useComposeRef';
@@ -21,2 +22,4 @@ export * from './useConstantLengthInvariant';
 export * from './useObjectMemo';
+export * from './useOnElementClickOutsideCallback';
+export * from './useOnElementMouseEnterDelayedCallback';
 export * from './useOnElementMutation';
@@ -23,0 +26,0 @@ export * from './useOnElementResize';

package.json

 {
   "name": "@contember/react-utils",
   "license": "Apache-2.0",
-  "version": "1.2.0-rc.16",
+  "version": "1.2.0-rc.17",
   "type": "module",
@@ -33,3 +33,3 @@ "sideEffects": false,
   "dependencies": {
-    "@contember/utilities": "1.2.0-rc.16",
+    "@contember/utilities": "1.2.0-rc.17",
     "deep-equal": "^2.2.0"
@@ -36,0 +36,0 @@ },

src/hooks/index.ts

@@ -5,2 +5,3 @@ export * from './unwrapRefValue'
 export * from './useArrayMapMemo'
+export * from './useAutoHeightTextArea'
 export * from './useComposeRef'
@@ -21,2 +22,4 @@ export * from './useConstantLengthInvariant'
 export * from './useObjectMemo'
+export * from './useOnElementClickOutsideCallback'
+export * from './useOnElementMouseEnterDelayedCallback'
 export * from './useOnElementMutation'
@@ -23,0 +26,0 @@ export * from './useOnElementResize'

src/hooks/useOnElementResize.ts

@@ -14,3 +14,2 @@ import { useLayoutEffect, useRef } from 'react'
 	const { box = 'border-box' } = options
-	const element = unwrapRefValue(refOrElement)
 	const callbackRef = useRef(callback); callbackRef.current = callback
@@ -20,35 +19,39 @@ const lastTimeStamp = useRef<number>(0)
 	useLayoutEffect(() => {
-		let timeoutID: number | undefined = undefined
+		const element = unwrapRefValue(refOrElement)
 
-		function debouncedOnChange([entry]: ResizeObserverEntry[]) {
-			const timeStamp = Date.now()
-			const delta = timeStamp - lastTimeStamp.current
+		if (element) {
+			if (element instanceof HTMLElement) {
+				let timeoutID: number | undefined = undefined
 
-			if (delta > timeout) {
-				scopedConsoleRef.current.warned('element.resize:immediate', null)
-				callbackRef.current(entry)
-				lastTimeStamp.current = timeStamp
-			} else {
-				clearTimeout(timeoutID)
-				timeoutID = setTimeout(() => {
-					scopedConsoleRef.current.warned('element.resize:debounced', null)
-					callbackRef.current(entry)
-					lastTimeStamp.current = timeStamp
-				}, timeout)
-			}
-		}
+				function debouncedOnChange([entry]: ResizeObserverEntry[]) {
+					const timeStamp = Date.now()
+					const delta = timeStamp - lastTimeStamp.current
 
-		if (element instanceof HTMLElement) {
-			const resizeObserver = new ResizeObserver(debouncedOnChange)
+					if (delta > timeout) {
+						scopedConsoleRef.current.warned('element.resize:immediate', null)
+						callbackRef.current(entry)
+						lastTimeStamp.current = timeStamp
+					} else {
+						clearTimeout(timeoutID)
+						timeoutID = setTimeout(() => {
+							scopedConsoleRef.current.warned('element.resize:debounced', null)
+							callbackRef.current(entry)
+							lastTimeStamp.current = timeStamp
+						}, timeout)
+					}
+				}
 
-			resizeObserver.observe(element, { box })
+				const resizeObserver = new ResizeObserver(debouncedOnChange)
 
-			return () => {
-				clearTimeout(timeoutID)
-				resizeObserver.unobserve(element)
+				resizeObserver.observe(element, { box })
+
+				return () => {
+					clearTimeout(timeoutID)
+					resizeObserver.unobserve(element)
+				}
+			} else {
+				throw new Error('Exhaustive error: Expecting element to be instance of HTMLElement')
 			}
-		} else if (element) {
-			throw new Error('Exhaustive error: Expecting element to be instance of HTMLElement')
 		}
-	}, [box, element, scopedConsoleRef, timeout])
+	}, [box, refOrElement, scopedConsoleRef, timeout])
 }

src/hooks/useOnScrollWithin.ts

@@ -22,47 +22,48 @@ import { useLayoutEffect, useRef } from 'react'
 
-	const element = unwrapRefValue(refOrElement)
+	useLayoutEffect(() => {
+		const element = unwrapRefValue(refOrElement)
 
-	useLayoutEffect(() => {
 		let timeoutID: number | undefined = undefined
 
-		function debouncedHandler(event: Event) {
-			clearTimeout(timeoutID)
+		if (element) {
+			function debouncedHandler(event: Event) {
+				clearTimeout(timeoutID)
 
-			const delta = event.timeStamp - lastTimeStamp.current
-			scopedConsoleRef.current.logged('event:element.scroll:delta', delta)
+				const delta = event.timeStamp - lastTimeStamp.current
+				scopedConsoleRef.current.logged('event:element.scroll:delta', delta)
 
-			if (delta > interval) {
-				scopedConsoleRef.current.warned('event:element.scroll:immediately', event)
-				callbackRef.current(event)
-				lastTimeStamp.current = event.timeStamp
-			} else {
-				timeoutID = setTimeout(() => {
-					scopedConsoleRef.current.warned('event:element.scroll:debounced', event)
+				if (delta > interval) {
+					scopedConsoleRef.current.warned('event:element.scroll:immediately', event)
+					callbackRef.current(event)
 					lastTimeStamp.current = event.timeStamp
-					callbackRef.current(event)
-				}, interval)
+				} else {
+					timeoutID = setTimeout(() => {
+						scopedConsoleRef.current.warned('event:element.scroll:debounced', event)
+						lastTimeStamp.current = event.timeStamp
+						callbackRef.current(event)
+					}, interval)
+				}
 			}
-		}
 
-		if (element && element instanceof HTMLElement) {
-			if (element instanceof HTMLBodyElement || element instanceof HTMLHtmlElement) {
-				window.addEventListener('scroll', debouncedHandler, { capture: true, passive: true })
-				window.addEventListener('resize', debouncedHandler)
+			if (element instanceof HTMLElement) {
+				if (element instanceof HTMLBodyElement || element instanceof HTMLHtmlElement) {
+					window.addEventListener('scroll', debouncedHandler, { capture: true, passive: true })
+					window.addEventListener('resize', debouncedHandler)
 
-				return () => {
-					window.removeEventListener('scroll', debouncedHandler)
-					window.removeEventListener('resize', debouncedHandler)
-				}
-			} else {
-				element.addEventListener('scroll', debouncedHandler, { passive: true, capture: true })
+					return () => {
+						window.removeEventListener('scroll', debouncedHandler)
+						window.removeEventListener('resize', debouncedHandler)
+					}
+				} else {
+					element.addEventListener('scroll', debouncedHandler, { passive: true, capture: true })
 
-				return () => {
-					element.removeEventListener('scroll', debouncedHandler)
+					return () => {
+						element.removeEventListener('scroll', debouncedHandler)
+					}
 				}
 			}
-		} else if (element) {
+		} else {
 			throw new Error('Exhaustive error: Expecting element to be instance of HTMLElement')
 		}
-
-	}, [element, interval, scopedConsoleRef])
+	}, [interval, refOrElement, scopedConsoleRef])
 }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

359575

increased by8.68%

Number of package files

380

increased by5.85%

Lines of code

3948

increased by9.48%

Dependency changes

• + Added@contember/utilities@1.2.0-rc.17(transitive)

• - Removed@contember/utilities@1.2.0-rc.16(transitive)

• Updated@contember/utilities@1.2.0-rc.17