@crystaldesign/diva-navigator 24.15.0-beta.37 → 24.15.0-beta.39

package/build/esm/index.js

@@ -126,24 +126,54 @@ function Buttons () {
     _useDivaCore$state = _useDivaCore.state,
     initializing = _useDivaCore$state.initializing,
     width = _useDivaCore$state.dimensions.width,
-    buttons = _useDivaCore$state.navigationConfiguration.buttons;
+    _useDivaCore$state$na = _useDivaCore$state.navigationConfiguration,
+    buttons = _useDivaCore$state$na.buttons,
+    customLogo = _useDivaCore$state$na.customLogo;
   var scrollerDiv = useRef();
-  var _useState = useState(false),
+  var _useState = useState(),
     _useState2 = _slicedToArray(_useState, 2),
-    showArrowLeft = _useState2[0],
-    setShowArrowLeft = _useState2[1];
+    observer = _useState2[0],
+    setObserver = _useState2[1];
   var _useState3 = useState(false),
     _useState4 = _slicedToArray(_useState3, 2),
-    showArrowRight = _useState4[0],
-    setShowArrowRight = _useState4[1];
+    showArrowLeft = _useState4[0],
+    setShowArrowLeft = _useState4[1];
+  var _useState5 = useState(false),
+    _useState6 = _slicedToArray(_useState5, 2),
+    showArrowRight = _useState6[0],
+    setShowArrowRight = _useState6[1];
   var recalcScroll = function recalcScroll(width) {
     if (!scrollerDiv.current) return;
-    if (scrollerDiv.current.scrollLeft > 0 !== showArrowLeft) setShowArrowLeft(!showArrowLeft);
-    if (scrollerDiv.current.scrollLeft + (width !== null && width !== void 0 ? width : scrollerDiv.current.clientWidth) + 1 < scrollerDiv.current.scrollWidth !== showArrowRight) setShowArrowRight(!showArrowRight);
+    setShowArrowLeft(!!(scrollerDiv.current.scrollLeft > 0));
+    setShowArrowRight(!!(scrollerDiv.current.scrollLeft + (width !== null && width !== void 0 ? width : scrollerDiv.current.clientWidth) + 1 < scrollerDiv.current.scrollWidth));
   };
+  useEffect(function () {
+    if (scrollerDiv.current) {
+      observer === null || observer === void 0 || observer.disconnect();
+      var obs = new MutationObserver(function () {
+        recalcScroll();
+      });
+      obs.observe(scrollerDiv.current, {
+        characterData: true,
+        childList: true,
+        subtree: true,
+        characterDataOldValue: true
+      });
+      setObserver(obs);
+      return function () {
+        return obs.disconnect();
+      };
+    }
+    return;
+  }, [scrollerDiv]);
   useEffect(function () {
     recalcScroll();
   }, [initializing, width]);
+  useEffect(function () {
+    setTimeout(function () {
+      return recalcScroll();
+    }, 500);
+  }, [customLogo]);
   var scrollDistance = scrollerDiv.current && scrollerDiv.current.clientWidth < 400 ? scrollerDiv.current.clientWidth : 400;
   return /*#__PURE__*/jsxs("div", {
     className: scroller,

package/build/types/navigator/src/Header/Buttons/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/Header/Buttons/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsC,MAAM,OAAO,CAAC;AAM3D,MAAM,CAAC,OAAO,gCAmDb"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../src/Header/Buttons/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsC,MAAM,OAAO,CAAC;AAM3D,MAAM,CAAC,OAAO,gCAmEb"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@crystaldesign/diva-navigator",
-  "version": "24.15.0-beta.37",
+  "version": "24.15.0-beta.39",
   "license": "MIT",
   "devDependencies": {
     "@testing-library/jest-dom": "^6.5.0",
@@ -23,5 +23,5 @@
   },
   "module": "build/esm/index.js",
   "types": "./build/types/navigator/src/index.d.ts",
-  "gitHead": "1931e900ce2fa2199f973b5a58bd9e803feb1b2d"
+  "gitHead": "45f3df474b17e57a9242b3a6ffc171036f571461"
 }