@bbl-digital/snorre 4.1.77 → 4.1.79

package/lib/v2/hooks/useOverflow.js

@@ -0,0 +1,43 @@
+import { useEffect, useState } from 'react';
+const useOverflow = ref => {
+  const [overflowLeft, setOverflowLeft] = useState(false);
+  const [overflowRight, setOverflowRight] = useState(false);
+  const [overflowY, setOverflowY] = useState(false);
+  const [overflowX, setOverflowX] = useState(false);
+  const [anyOverflow, setAnyOverflow] = useState(false);
+  const checkOverflow = () => {
+    const element = ref.current;
+    if (!element) return;
+    const {
+      scrollLeft,
+      scrollWidth,
+      clientWidth,
+      scrollHeight,
+      clientHeight
+    } = element;
+    setOverflowLeft(scrollLeft > 0);
+    setOverflowRight(scrollLeft < scrollWidth - clientWidth);
+    setOverflowX(scrollWidth > clientWidth);
+    const hasOverflowX = scrollWidth > clientWidth;
+    const hasOverflowY = scrollHeight > clientHeight;
+    setOverflowY(hasOverflowY);
+    setAnyOverflow(hasOverflowX || hasOverflowY);
+  };
+  useEffect(() => {
+    const element = ref.current;
+    if (!element) return;
+    checkOverflow();
+    element.addEventListener('scroll', checkOverflow);
+    return () => element.removeEventListener('scroll', checkOverflow);
+  }, [ref]);
+
+  // Return the overflow state
+  return {
+    overflowLeft,
+    overflowRight,
+    overflowY,
+    anyOverflow,
+    overflowX
+  };
+};
+export default useOverflow;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bbl-digital/snorre",
-  "version": "4.1.77",
+  "version": "4.1.79",
   "description": "Design library for BBL Digital",
   "license": "MIT",
   "main": "./lib/index.js",