npm - @x15ventures/x15-ui-library - Versions diffs - 3.15.1 → 3.16.1 - Mend

@x15ventures/x15-ui-library 3.15.1 → 3.16.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (33) hide show

package/dist/cjs/autoGenerated/libraryThemes.js CHANGED Viewed

@@ -17,8 +17,8 @@ const libraryThemes = exports.libraryThemes = {
       "map": "index.min.css.map"
     },
     "versioned": {
-      "css": "index.min.3.15.1.css",
-      "map": "index.min.3.15.1.css.map"
+      "css": "index.min.3.16.1.css",
+      "map": "index.min.3.16.1.css.map"
     }
   },
   "cba": {
@@ -32,8 +32,8 @@ const libraryThemes = exports.libraryThemes = {
       "map": "cba.min.css.map"
     },
     "versioned": {
-      "css": "cba.min.3.15.1.css",
-      "map": "cba.min.3.15.1.css.map"
+      "css": "cba.min.3.16.1.css",
+      "map": "cba.min.3.16.1.css.map"
     }
   },
   "creditSavvy": {
@@ -47,8 +47,8 @@ const libraryThemes = exports.libraryThemes = {
       "map": "creditSavvy.min.css.map"
     },
     "versioned": {
-      "css": "creditSavvy.min.3.15.1.css",
-      "map": "creditSavvy.min.3.15.1.css.map"
+      "css": "creditSavvy.min.3.16.1.css",
+      "map": "creditSavvy.min.3.16.1.css.map"
     }
   },
   "doshii": {
@@ -62,8 +62,8 @@ const libraryThemes = exports.libraryThemes = {
       "map": "doshii.min.css.map"
     },
     "versioned": {
-      "css": "doshii.min.3.15.1.css",
-      "map": "doshii.min.3.15.1.css.map"
+      "css": "doshii.min.3.16.1.css",
+      "map": "doshii.min.3.16.1.css.map"
     }
   },
   "homeIn": {
@@ -77,8 +77,8 @@ const libraryThemes = exports.libraryThemes = {
       "map": "homeIn.min.css.map"
     },
     "versioned": {
-      "css": "homeIn.min.3.15.1.css",
-      "map": "homeIn.min.3.15.1.css.map"
+      "css": "homeIn.min.3.16.1.css",
+      "map": "homeIn.min.3.16.1.css.map"
     }
   },
   "x15Core": {
@@ -92,8 +92,8 @@ const libraryThemes = exports.libraryThemes = {
       "map": "x15Core.min.css.map"
     },
     "versioned": {
-      "css": "x15Core.min.3.15.1.css",
-      "map": "x15Core.min.3.15.1.css.map"
+      "css": "x15Core.min.3.16.1.css",
+      "map": "x15Core.min.3.16.1.css.map"
     }
   }
 };

package/dist/cjs/autoGenerated/libraryThemes.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"libraryThemes.js","names":["libraryThemes","exports","_default","default"],"sources":["../../../src/autoGenerated/libraryThemes.ts"],"sourcesContent":["/* eslint-disable */\nexport const libraryThemes = {\n \"base\": {\n \"buildPath\": \"styles\",\n \"dev\": {\n \"css\": \"index.css\",\n \"map\": \"index.css.map\"\n },\n \"min\": {\n \"css\": \"index.min.css\",\n \"map\": \"index.min.css.map\"\n },\n \"versioned\": {\n \"css\": \"index.min.3.15.1.css\",\n \"map\": \"index.min.3.15.1.css.map\"\n }\n },\n \"cba\": {\n \"buildPath\": \"styles/themes/cba\",\n \"dev\": {\n \"css\": \"cba.css\",\n \"map\": \"cba.css.map\"\n },\n \"min\": {\n \"css\": \"cba.min.css\",\n \"map\": \"cba.min.css.map\"\n },\n \"versioned\": {\n \"css\": \"cba.min.3.15.1.css\",\n \"map\": \"cba.min.3.15.1.css.map\"\n }\n },\n \"creditSavvy\": {\n \"buildPath\": \"styles/themes/creditSavvy\",\n \"dev\": {\n \"css\": \"creditSavvy.css\",\n \"map\": \"creditSavvy.css.map\"\n },\n \"min\": {\n \"css\": \"creditSavvy.min.css\",\n \"map\": \"creditSavvy.min.css.map\"\n },\n \"versioned\": {\n \"css\": \"creditSavvy.min.3.15.1.css\",\n \"map\": \"creditSavvy.min.3.15.1.css.map\"\n }\n },\n \"doshii\": {\n \"buildPath\": \"styles/themes/doshii\",\n \"dev\": {\n \"css\": \"doshii.css\",\n \"map\": \"doshii.css.map\"\n },\n \"min\": {\n \"css\": \"doshii.min.css\",\n \"map\": \"doshii.min.css.map\"\n },\n \"versioned\": {\n \"css\": \"doshii.min.3.15.1.css\",\n \"map\": \"doshii.min.3.15.1.css.map\"\n }\n },\n \"homeIn\": {\n \"buildPath\": \"styles/themes/homeIn\",\n \"dev\": {\n \"css\": \"homeIn.css\",\n \"map\": \"homeIn.css.map\"\n },\n \"min\": {\n \"css\": \"homeIn.min.css\",\n \"map\": \"homeIn.min.css.map\"\n },\n \"versioned\": {\n \"css\": \"homeIn.min.3.15.1.css\",\n \"map\": \"homeIn.min.3.15.1.css.map\"\n }\n },\n \"x15Core\": {\n \"buildPath\": \"styles/themes/x15Core\",\n \"dev\": {\n \"css\": \"x15Core.css\",\n \"map\": \"x15Core.css.map\"\n },\n \"min\": {\n \"css\": \"x15Core.min.css\",\n \"map\": \"x15Core.min.css.map\"\n },\n \"versioned\": {\n \"css\": \"x15Core.min.3.15.1.css\",\n \"map\": \"x15Core.min.3.15.1.css.map\"\n }\n }\n}; export default libraryThemes;"],"mappings":";;;;;;AAAA;AACO,MAAMA,aAAa,GAAAC,OAAA,CAAAD,aAAA,GAAG;EAC3B,MAAM,EAAE;IACN,WAAW,EAAE,QAAQ;IACrB,KAAK,EAAE;MACL,KAAK,EAAE,WAAW;MAClB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,eAAe;MACtB,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,sBAAsB;MAC7B,KAAK,EAAE;IACT;EACF,CAAC;EACD,KAAK,EAAE;IACL,WAAW,EAAE,mBAAmB;IAChC,KAAK,EAAE;MACL,KAAK,EAAE,SAAS;MAChB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,aAAa;MACpB,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,oBAAoB;MAC3B,KAAK,EAAE;IACT;EACF,CAAC;EACD,aAAa,EAAE;IACb,WAAW,EAAE,2BAA2B;IACxC,KAAK,EAAE;MACL,KAAK,EAAE,iBAAiB;MACxB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,qBAAqB;MAC5B,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,4BAA4B;MACnC,KAAK,EAAE;IACT;EACF,CAAC;EACD,QAAQ,EAAE;IACR,WAAW,EAAE,sBAAsB;IACnC,KAAK,EAAE;MACL,KAAK,EAAE,YAAY;MACnB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,gBAAgB;MACvB,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,uBAAuB;MAC9B,KAAK,EAAE;IACT;EACF,CAAC;EACD,QAAQ,EAAE;IACR,WAAW,EAAE,sBAAsB;IACnC,KAAK,EAAE;MACL,KAAK,EAAE,YAAY;MACnB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,gBAAgB;MACvB,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,uBAAuB;MAC9B,KAAK,EAAE;IACT;EACF,CAAC;EACD,SAAS,EAAE;IACT,WAAW,EAAE,uBAAuB;IACpC,KAAK,EAAE;MACL,KAAK,EAAE,aAAa;MACpB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,iBAAiB;MACxB,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,wBAAwB;MAC/B,KAAK,EAAE;IACT;EACF;AACF,CAAC;AAAC,IAAAE,QAAA,GAAAD,OAAA,CAAAE,OAAA,GAAgBH,aAAa","ignoreList":[]}
1	+ {"version":3,"file":"libraryThemes.js","names":["libraryThemes","exports","_default","default"],"sources":["../../../src/autoGenerated/libraryThemes.ts"],"sourcesContent":["/* eslint-disable */\nexport const libraryThemes = {\n \"base\": {\n \"buildPath\": \"styles\",\n \"dev\": {\n \"css\": \"index.css\",\n \"map\": \"index.css.map\"\n },\n \"min\": {\n \"css\": \"index.min.css\",\n \"map\": \"index.min.css.map\"\n },\n \"versioned\": {\n \"css\": \"index.min.3.16.1.css\",\n \"map\": \"index.min.3.16.1.css.map\"\n }\n },\n \"cba\": {\n \"buildPath\": \"styles/themes/cba\",\n \"dev\": {\n \"css\": \"cba.css\",\n \"map\": \"cba.css.map\"\n },\n \"min\": {\n \"css\": \"cba.min.css\",\n \"map\": \"cba.min.css.map\"\n },\n \"versioned\": {\n \"css\": \"cba.min.3.16.1.css\",\n \"map\": \"cba.min.3.16.1.css.map\"\n }\n },\n \"creditSavvy\": {\n \"buildPath\": \"styles/themes/creditSavvy\",\n \"dev\": {\n \"css\": \"creditSavvy.css\",\n \"map\": \"creditSavvy.css.map\"\n },\n \"min\": {\n \"css\": \"creditSavvy.min.css\",\n \"map\": \"creditSavvy.min.css.map\"\n },\n \"versioned\": {\n \"css\": \"creditSavvy.min.3.16.1.css\",\n \"map\": \"creditSavvy.min.3.16.1.css.map\"\n }\n },\n \"doshii\": {\n \"buildPath\": \"styles/themes/doshii\",\n \"dev\": {\n \"css\": \"doshii.css\",\n \"map\": \"doshii.css.map\"\n },\n \"min\": {\n \"css\": \"doshii.min.css\",\n \"map\": \"doshii.min.css.map\"\n },\n \"versioned\": {\n \"css\": \"doshii.min.3.16.1.css\",\n \"map\": \"doshii.min.3.16.1.css.map\"\n }\n },\n \"homeIn\": {\n \"buildPath\": \"styles/themes/homeIn\",\n \"dev\": {\n \"css\": \"homeIn.css\",\n \"map\": \"homeIn.css.map\"\n },\n \"min\": {\n \"css\": \"homeIn.min.css\",\n \"map\": \"homeIn.min.css.map\"\n },\n \"versioned\": {\n \"css\": \"homeIn.min.3.16.1.css\",\n \"map\": \"homeIn.min.3.16.1.css.map\"\n }\n },\n \"x15Core\": {\n \"buildPath\": \"styles/themes/x15Core\",\n \"dev\": {\n \"css\": \"x15Core.css\",\n \"map\": \"x15Core.css.map\"\n },\n \"min\": {\n \"css\": \"x15Core.min.css\",\n \"map\": \"x15Core.min.css.map\"\n },\n \"versioned\": {\n \"css\": \"x15Core.min.3.16.1.css\",\n \"map\": \"x15Core.min.3.16.1.css.map\"\n }\n }\n}; export default libraryThemes;"],"mappings":";;;;;;AAAA;AACO,MAAMA,aAAa,GAAAC,OAAA,CAAAD,aAAA,GAAG;EAC3B,MAAM,EAAE;IACN,WAAW,EAAE,QAAQ;IACrB,KAAK,EAAE;MACL,KAAK,EAAE,WAAW;MAClB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,eAAe;MACtB,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,sBAAsB;MAC7B,KAAK,EAAE;IACT;EACF,CAAC;EACD,KAAK,EAAE;IACL,WAAW,EAAE,mBAAmB;IAChC,KAAK,EAAE;MACL,KAAK,EAAE,SAAS;MAChB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,aAAa;MACpB,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,oBAAoB;MAC3B,KAAK,EAAE;IACT;EACF,CAAC;EACD,aAAa,EAAE;IACb,WAAW,EAAE,2BAA2B;IACxC,KAAK,EAAE;MACL,KAAK,EAAE,iBAAiB;MACxB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,qBAAqB;MAC5B,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,4BAA4B;MACnC,KAAK,EAAE;IACT;EACF,CAAC;EACD,QAAQ,EAAE;IACR,WAAW,EAAE,sBAAsB;IACnC,KAAK,EAAE;MACL,KAAK,EAAE,YAAY;MACnB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,gBAAgB;MACvB,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,uBAAuB;MAC9B,KAAK,EAAE;IACT;EACF,CAAC;EACD,QAAQ,EAAE;IACR,WAAW,EAAE,sBAAsB;IACnC,KAAK,EAAE;MACL,KAAK,EAAE,YAAY;MACnB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,gBAAgB;MACvB,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,uBAAuB;MAC9B,KAAK,EAAE;IACT;EACF,CAAC;EACD,SAAS,EAAE;IACT,WAAW,EAAE,uBAAuB;IACpC,KAAK,EAAE;MACL,KAAK,EAAE,aAAa;MACpB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,iBAAiB;MACxB,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,wBAAwB;MAC/B,KAAK,EAAE;IACT;EACF;AACF,CAAC;AAAC,IAAAE,QAAA,GAAAD,OAAA,CAAAE,OAAA,GAAgBH,aAAa","ignoreList":[]}

package/dist/cjs/autoGenerated/libraryThemes.json CHANGED Viewed

@@ -10,8 +10,8 @@
       "map": "index.min.css.map"
     },
     "versioned": {
-      "css": "base.min.3.15.1.css",
-      "map": "base.min.3.15.1.css.map"
+      "css": "base.min.3.16.1.css",
+      "map": "base.min.3.16.1.css.map"
     }
   },
   "cba": {
@@ -25,8 +25,8 @@
       "map": "cba.min.css.map"
     },
     "versioned": {
-      "css": "cba.min.3.15.1.css",
-      "map": "cba.min.3.15.1.css.map"
+      "css": "cba.min.3.16.1.css",
+      "map": "cba.min.3.16.1.css.map"
     }
   },
   "creditSavvy": {
@@ -40,8 +40,8 @@
       "map": "creditSavvy.min.css.map"
     },
     "versioned": {
-      "css": "creditSavvy.min.3.15.1.css",
-      "map": "creditSavvy.min.3.15.1.css.map"
+      "css": "creditSavvy.min.3.16.1.css",
+      "map": "creditSavvy.min.3.16.1.css.map"
     }
   },
   "doshii": {
@@ -55,8 +55,8 @@
       "map": "doshii.min.css.map"
     },
     "versioned": {
-      "css": "doshii.min.3.15.1.css",
-      "map": "doshii.min.3.15.1.css.map"
+      "css": "doshii.min.3.16.1.css",
+      "map": "doshii.min.3.16.1.css.map"
     }
   },
   "homeIn": {
@@ -70,8 +70,8 @@
       "map": "homeIn.min.css.map"
     },
     "versioned": {
-      "css": "homeIn.min.3.15.1.css",
-      "map": "homeIn.min.3.15.1.css.map"
+      "css": "homeIn.min.3.16.1.css",
+      "map": "homeIn.min.3.16.1.css.map"
     }
   },
   "x15Core": {
@@ -85,8 +85,8 @@
       "map": "x15Core.min.css.map"
     },
     "versioned": {
-      "css": "x15Core.min.3.15.1.css",
-      "map": "x15Core.min.3.15.1.css.map"
+      "css": "x15Core.min.3.16.1.css",
+      "map": "x15Core.min.3.16.1.css.map"
     }
   }
 }

package/dist/cjs/components/design/skeleton/skeleton.css CHANGED Viewed

@@ -11,7 +11,7 @@
 .skeletonBar {
   inline-size: 100%;
   block-size: var(--skeletonHeight, var(--skeletonLineHeight, 1em));
-  background-color: var(--skeletonBg, #eef2f4);
+  background-color: var(--skeletonBg, #e5ebef);
   border-radius: var(--skeletonBorderRadius, 3px);
 }
@@ -53,34 +53,39 @@
   position: absolute;
   inset: 0;
   transform: translateX(-100%);
-  background-image: linear-gradient(90deg, transparent, var(--skeletonHighlight, #f6f8fa), transparent);
-  animation: skeletonWave var(--skeletonAnimationDuration, 1.6s) linear infinite;
+  background-image: linear-gradient(90deg, transparent 20%, var(--skeletonHighlight, #ffffff) 50%, transparent 80%);
+  animation: skeletonWave var(--skeletonAnimationDuration, 2s) ease-in-out infinite;
 }
 .skeleton_pulse .skeletonBar {
-  opacity: 1;
-  animation: skeletonPulse var(--skeletonAnimationDuration, 1.6s) ease-in-out infinite alternate;
+  animation: skeletonPulse var(--skeletonAnimationDuration, 2s) ease-in-out infinite;
+}
+.skeleton_pulse.skeleton_opaque .skeletonBar {
+  animation-name: skeletonPulseOpaque;
 }
 @keyframes skeletonWave {
-  to {
+  60%, 100% {
     transform: translateX(100%);
   }
 }
 @keyframes skeletonPulse {
-  from {
-    opacity: 1;
+  50% {
+    background-color: var(--skeletonPulseBg, #ffffff);
   }
-  to {
-    opacity: 0.3;
+}
+@keyframes skeletonPulseOpaque {
+  50% {
+    background-color: var(--skeletonOpaquePulseBg, #f6f8fa);
   }
 }
 @media (prefers-reduced-motion: reduce) {
   .skeleton_wave .skeletonBar::after {
     display: none;
   }
-  .skeleton_pulse .skeletonBar {
+  .skeleton_pulse .skeletonBar,
+  .skeleton_pulse.skeleton_opaque .skeletonBar {
     animation: none;
-    opacity: 1;
   }
 }

package/dist/cjs/components/design/tooltip/Tooltip.js CHANGED Viewed

@@ -24,7 +24,8 @@ const Tooltip = props => {
     containsBlockElements = false,
     children,
     label = 'Toggle tooltip open state',
-    showPointer = true
+    showPointer = true,
+    hoverDelay
     // visualIndicators will be handled below
   } = props;
@@ -34,38 +35,89 @@ const Tooltip = props => {
     colouredText: true
   } : undefined;
   const [isOpen, setIsOpen] = (0, _react.useState)(false);
+  const [isHovered, setIsHovered] = (0, _react.useState)(false);
   const tooltipElement = (0, _react.useRef)(null);
   const triggerElement = (0, _react.useRef)(null);
   const contentElement = (0, _react.useRef)(null);
+  const hoverTimer = (0, _react.useRef)(null);
   const iconIsElement = /*#__PURE__*/_react.default.isValidElement(icon);
-  (0, _ClickOutside.useOnClickOutside)(tooltipElement, () => setIsOpen(false));
+  // Hover is handled in css by default. It is only taken over by js when a delay is requested.
+  const hasHoverDelay = typeof hoverDelay === 'number' && hoverDelay > 0;
+  const isVisible = isOpen || isHovered;
+  const clearHoverTimer = (0, _react.useCallback)(() => {
+    if (hoverTimer.current) {
+      clearTimeout(hoverTimer.current);
+      hoverTimer.current = null;
+    }
+  }, []);
+  const handleMouseEnter = (0, _react.useCallback)(() => {
+    clearHoverTimer();
+    hoverTimer.current = setTimeout(() => setIsHovered(true), hoverDelay);
+  }, [clearHoverTimer, hoverDelay]);
+  const handleMouseLeave = (0, _react.useCallback)(() => {
+    clearHoverTimer();
+    setIsHovered(false);
+  }, [clearHoverTimer]);
+  // Single dismissal path, so every close route clears both the click and hover state
+  const dismiss = (0, _react.useCallback)(() => {
+    clearHoverTimer();
+    setIsHovered(false);
+    setIsOpen(false);
+  }, [clearHoverTimer]);
+  const handleTriggerClick = (0, _react.useCallback)(() => {
+    if (isVisible) {
+      dismiss();
+      return;
+    }
+    clearHoverTimer();
+    setIsOpen(true);
+  }, [isVisible, dismiss, clearHoverTimer]);
+  // Releasing the delay detaches the mouse handlers, so reset any hover state they left behind
+  (0, _react.useEffect)(() => {
+    if (!hasHoverDelay) {
+      clearHoverTimer();
+      setIsHovered(false);
+    }
+  }, [hasHoverDelay, clearHoverTimer]);
+  (0, _react.useEffect)(() => clearHoverTimer, [clearHoverTimer]);
+  const hoverHandlers = hasHoverDelay ? {
+    onMouseEnter: handleMouseEnter,
+    onMouseLeave: handleMouseLeave
+  } : {};
+  (0, _ClickOutside.useOnClickOutside)(tooltipElement, dismiss);
   (0, _EdgeProximityDetect.useOnEdgeProximityDetect)({
     triggerRef: triggerElement,
     wrapperRef: tooltipElement,
     contentRef: contentElement,
-    requiresRecalc: isOpen
+    requiresRecalc: isVisible
   });
   // Handle special key presses
   const handleSpecialKeyPresses = (0, _react.useCallback)(event => {
     if (event.key === 'Escape' || event.keyCode === 27) {
-      setIsOpen(false);
+      dismiss();
     }
-  }, [setIsOpen]);
+  }, [dismiss]);
   (0, _react.useEffect)(() => {
-    if (tooltipElement.current) {
-      tooltipElement.current.addEventListener('keydown', handleSpecialKeyPresses);
+    const wrapper = tooltipElement.current;
+    if (!wrapper) {
+      return undefined;
     }
+    wrapper.addEventListener('keydown', handleSpecialKeyPresses);
+    return () => wrapper.removeEventListener('keydown', handleSpecialKeyPresses);
   }, [handleSpecialKeyPresses]);
   if (containsBlockElements) {
-    return /*#__PURE__*/_react.default.createElement("div", {
+    return /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({
       role: "tooltip",
       ref: tooltipElement,
-      className: `tooltip tooltip_block ${isOpen ? 'isOpen' : ''} ${triggerStyle === 'text' && 'textDisplay'} ${customCssClass || ''}`
-    }, /*#__PURE__*/_react.default.createElement("button", (0, _extends2.default)({
+      className: `tooltip tooltip_block ${isVisible ? 'isOpen' : ''} ${hasHoverDelay ? 'hoverDelayed' : ''} ${triggerStyle === 'text' ? 'textDisplay' : ''} ${customCssClass || ''}`
+    }, hoverHandlers), /*#__PURE__*/_react.default.createElement("button", (0, _extends2.default)({
       ref: triggerElement,
       type: "button",
-      onClick: () => setIsOpen(!isOpen),
+      onClick: handleTriggerClick,
       className: `button ${triggerStyle === 'text' ? 'text_only' : 'icon_only'} ${triggerStyle === 'text' && !visualIndicators?.underline ? 'underline_off' : ''} ${triggerStyle === 'text' && !visualIndicators?.colouredText ? 'colouredText_off' : ''}`
     }, triggerId ? {
       'id': triggerId,
@@ -83,13 +135,13 @@ const Tooltip = props => {
       id: `${triggerId}_content`
     } : {}), children));
   }
-  return /*#__PURE__*/_react.default.createElement("span", {
+  return /*#__PURE__*/_react.default.createElement("span", (0, _extends2.default)({
     ref: tooltipElement,
-    className: `tooltip ${isOpen ? 'isOpen' : ''} ${triggerStyle === 'text' && 'textDisplay'} ${customCssClass || ''}`
-  }, /*#__PURE__*/_react.default.createElement("button", (0, _extends2.default)({
+    className: `tooltip ${isVisible ? 'isOpen' : ''} ${hasHoverDelay ? 'hoverDelayed' : ''} ${triggerStyle === 'text' ? 'textDisplay' : ''} ${customCssClass || ''}`
+  }, hoverHandlers), /*#__PURE__*/_react.default.createElement("button", (0, _extends2.default)({
     ref: triggerElement,
     type: "button",
-    onClick: () => setIsOpen(!isOpen),
+    onClick: handleTriggerClick,
     className: `button ${triggerStyle === 'text' ? 'text_only' : 'icon_only'} ${triggerStyle === 'text' && !visualIndicators?.underline ? 'underline_off' : ''} ${triggerStyle === 'text' && !visualIndicators?.colouredText ? 'colouredText_off' : ''}`
   }, triggerId ? {
     id: triggerId

package/dist/cjs/components/design/tooltip/Tooltip.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Tooltip.js","names":["_interopRequireDefault","require","Object","defineProperty","exports","value","default","Tooltip","_extends2","_react","_interopRequireWildcard","_ClickOutside","_Icon","_EdgeProximityDetect","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","has","get","set","hasOwnProperty","call","getOwnPropertyDescriptor","props","triggerId","triggerStyle","icon","customCssClass","containsBlockElements","children","label","showPointer","visualIndicators","underline","colouredText","undefined","isOpen","setIsOpen","useState","tooltipElement","useRef","triggerElement","contentElement","iconIsElement","React","isValidElement","useOnClickOutside","useOnEdgeProximityDetect","triggerRef","wrapperRef","contentRef","requiresRecalc","handleSpecialKeyPresses","useCallback","event","key","keyCode","useEffect","current","addEventListener","createElement","role","ref","className","type","onClick","Icon","toString","id","_default"],"sources":["../../../../../src/components/design/tooltip/Tooltip.tsx"],"sourcesContent":["'use client';\n\nimport React, { useState, useRef, useEffect, useCallback, ReactNode, ReactElement } from 'react';\nimport { useOnClickOutside } from '../../../hooks/ClickOutside';\nimport { Icon } from '../icons/basicIcon/Icon';\nimport { useOnEdgeProximityDetect } from '../../../hooks/EdgeProximityDetect';\nimport './tooltip.scss';\n\n// Define the props for Tooltip\nexport type TooltipProps =\n {\n triggerId?: string;\n icon?: ReactElement \| string;\n customCssClass?: string;\n children: ReactNode;\n containsBlockElements?: boolean;\n triggerStyle?: 'icon';\n label?: string \| ReactNode;\n showPointer?: boolean;\n }\n \| {\n triggerId?: string;\n icon?: ReactElement \| string;\n customCssClass?: string;\n children: ReactNode;\n containsBlockElements?: boolean;\n triggerStyle: 'text';\n label?: string \| ReactNode;\n showPointer?: boolean;\n visualIndicators?: { underline?: boolean; colouredText?: boolean };\n };\n\nexport const Tooltip: React.FC<TooltipProps> = (props) => {\n const {\n triggerId,\n triggerStyle = 'icon',\n icon = 'info',\n customCssClass,\n containsBlockElements = false,\n children,\n label = 'Toggle tooltip open state',\n showPointer = true,\n // visualIndicators will be handled below\n } = props as any;\n\n // Only use visualIndicators if triggerStyle is 'text'\n const visualIndicators =\n triggerStyle === 'text'\n ? (props as { visualIndicators?: { underline?: boolean; colouredText?: boolean } }).visualIndicators ?? { underline: true, colouredText: true }\n : undefined;\n const [isOpen, setIsOpen] = useState(false);\n const tooltipElement = useRef<HTMLDivElement \| HTMLSpanElement>(null);\n const triggerElement = useRef<HTMLButtonElement>(null);\n const contentElement = useRef<HTMLDivElement \| HTMLSpanElement>(null);\n\n const iconIsElement = React.isValidElement(icon);\n\n useOnClickOutside(tooltipElement, () => setIsOpen(false));\n\n useOnEdgeProximityDetect({\n triggerRef: triggerElement,\n wrapperRef: tooltipElement,\n contentRef: contentElement,\n requiresRecalc: isOpen,\n });\n\n // Handle special key presses\n const handleSpecialKeyPresses = useCallback(\n (event: KeyboardEvent) => {\n if (event.key === 'Escape' \|\| event.keyCode === 27) {\n setIsOpen(false);\n }\n },\n [setIsOpen],\n );\n\n useEffect(() => {\n if (tooltipElement.current) {\n tooltipElement.current.addEventListener('keydown', handleSpecialKeyPresses as EventListener);\n }\n }, [handleSpecialKeyPresses]);\n\n if (containsBlockElements) {\n return (\n <div\n role=\"tooltip\"\n ref={ tooltipElement as React.RefObject<HTMLDivElement> }\n className={ `tooltip tooltip_block ${ isOpen ? 'isOpen' : '' } ${ triggerStyle === 'text' && 'textDisplay' } ${ customCssClass \|\| '' }` }\n >\n <button\n ref={ triggerElement }\n type=\"button\"\n onClick={ () => setIsOpen(!isOpen) }\n className={ `button ${ triggerStyle === 'text' ? 'text_only' : 'icon_only' } ${ triggerStyle === 'text' && !visualIndicators?.underline ? 'underline_off' : '' } ${ triggerStyle === 'text' && !visualIndicators?.colouredText ? 'colouredText_off' : '' }` }\n { ...(triggerId ? { 'id': triggerId, 'aria-describedby': `${ triggerId }_content` } : {}) }\n { ...(triggerStyle === 'icon' ? { 'aria-label': typeof label === 'string' ? label : undefined } : {}) }\n >\n { triggerStyle === 'icon' && (iconIsElement ? icon : <Icon icon={ icon.toString() } />) }\n { triggerStyle === 'text' && <span className=\"labelText\">{ label }</span> }\n </button>\n <div\n ref={ contentElement as React.RefObject<HTMLDivElement> }\n className={ `content ${ showPointer ? 'showPointer' : '' }` }\n { ...(triggerId ? { id: `${ triggerId }_content` } : {}) }\n >\n { children }\n </div>\n </div>\n );\n }\n\n return (\n <span\n ref={ tooltipElement as React.RefObject<HTMLSpanElement> }\n className={ `tooltip ${ isOpen ? 'isOpen' : '' } ${ triggerStyle === 'text' && 'textDisplay' } ${ customCssClass \|\| '' }` }\n >\n <button\n ref={ triggerElement }\n type=\"button\"\n onClick={ () => setIsOpen(!isOpen) }\n className={ `button ${ triggerStyle === 'text' ? 'text_only' : 'icon_only' } ${ triggerStyle === 'text' && !visualIndicators?.underline ? 'underline_off' : '' } ${ triggerStyle === 'text' && !visualIndicators?.colouredText ? 'colouredText_off' : '' }` }\n { ...(triggerId ? { id: triggerId } : {}) }\n { ...(triggerStyle === 'icon' ? { 'aria-label': typeof label === 'string' ? label : undefined } : {}) }\n >\n { triggerStyle === 'icon' && (iconIsElement ? icon : <Icon icon={ icon.toString() } />) }\n { triggerStyle === 'text' && <span className=\"labelText\">{ label }</span> }\n </button>\n <span\n aria-hidden\n role=\"presentation\"\n ref={ contentElement as React.RefObject<HTMLSpanElement> }\n className={ `content ${ showPointer ? 'showPointer' : '' }` }\n { ...(triggerId ? { id: `${ triggerId }_content` } : {}) }\n >\n { children }\n </span>\n </span>\n );\n};\n\nexport default Tooltip;\n"],"mappings":"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","ignoreList":[]}
1	+ {"version":3,"file":"Tooltip.js","names":["_interopRequireDefault","require","Object","defineProperty","exports","value","default","Tooltip","_extends2","_react","_interopRequireWildcard","_ClickOutside","_Icon","_EdgeProximityDetect","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","has","get","set","hasOwnProperty","call","getOwnPropertyDescriptor","props","triggerId","triggerStyle","icon","customCssClass","containsBlockElements","children","label","showPointer","hoverDelay","visualIndicators","underline","colouredText","undefined","isOpen","setIsOpen","useState","isHovered","setIsHovered","tooltipElement","useRef","triggerElement","contentElement","hoverTimer","iconIsElement","React","isValidElement","hasHoverDelay","isVisible","clearHoverTimer","useCallback","current","clearTimeout","handleMouseEnter","setTimeout","handleMouseLeave","dismiss","handleTriggerClick","useEffect","hoverHandlers","onMouseEnter","onMouseLeave","useOnClickOutside","useOnEdgeProximityDetect","triggerRef","wrapperRef","contentRef","requiresRecalc","handleSpecialKeyPresses","event","key","keyCode","wrapper","addEventListener","removeEventListener","createElement","role","ref","className","type","onClick","Icon","toString","id","_default"],"sources":["../../../../../src/components/design/tooltip/Tooltip.tsx"],"sourcesContent":["'use client';\n\nimport React, { useState, useRef, useEffect, useCallback, ReactNode, ReactElement } from 'react';\nimport { useOnClickOutside } from '../../../hooks/ClickOutside';\nimport { Icon } from '../icons/basicIcon/Icon';\nimport { useOnEdgeProximityDetect } from '../../../hooks/EdgeProximityDetect';\nimport './tooltip.scss';\n\n// Define the props for Tooltip\nexport type TooltipProps =\n {\n triggerId?: string;\n icon?: ReactElement \| string;\n customCssClass?: string;\n children: ReactNode;\n containsBlockElements?: boolean;\n triggerStyle?: 'icon';\n label?: string \| ReactNode;\n showPointer?: boolean;\n hoverDelay?: number;\n }\n \| {\n triggerId?: string;\n icon?: ReactElement \| string;\n customCssClass?: string;\n children: ReactNode;\n containsBlockElements?: boolean;\n triggerStyle: 'text';\n label?: string \| ReactNode;\n showPointer?: boolean;\n hoverDelay?: number;\n visualIndicators?: { underline?: boolean; colouredText?: boolean };\n };\n\nexport const Tooltip: React.FC<TooltipProps> = (props) => {\n const {\n triggerId,\n triggerStyle = 'icon',\n icon = 'info',\n customCssClass,\n containsBlockElements = false,\n children,\n label = 'Toggle tooltip open state',\n showPointer = true,\n hoverDelay,\n // visualIndicators will be handled below\n } = props as any;\n\n // Only use visualIndicators if triggerStyle is 'text'\n const visualIndicators =\n triggerStyle === 'text'\n ? (props as { visualIndicators?: { underline?: boolean; colouredText?: boolean } }).visualIndicators ?? { underline: true, colouredText: true }\n : undefined;\n const [isOpen, setIsOpen] = useState(false);\n const [isHovered, setIsHovered] = useState(false);\n const tooltipElement = useRef<HTMLDivElement \| HTMLSpanElement>(null);\n const triggerElement = useRef<HTMLButtonElement>(null);\n const contentElement = useRef<HTMLDivElement \| HTMLSpanElement>(null);\n const hoverTimer = useRef<ReturnType<typeof setTimeout> \| null>(null);\n\n const iconIsElement = React.isValidElement(icon);\n\n // Hover is handled in css by default. It is only taken over by js when a delay is requested.\n const hasHoverDelay = typeof hoverDelay === 'number' && hoverDelay > 0;\n const isVisible = isOpen \|\| isHovered;\n\n const clearHoverTimer = useCallback(() => {\n if (hoverTimer.current) {\n clearTimeout(hoverTimer.current);\n hoverTimer.current = null;\n }\n }, []);\n\n const handleMouseEnter = useCallback(() => {\n clearHoverTimer();\n hoverTimer.current = setTimeout(() => setIsHovered(true), hoverDelay);\n }, [clearHoverTimer, hoverDelay]);\n\n const handleMouseLeave = useCallback(() => {\n clearHoverTimer();\n setIsHovered(false);\n }, [clearHoverTimer]);\n\n // Single dismissal path, so every close route clears both the click and hover state\n const dismiss = useCallback(() => {\n clearHoverTimer();\n setIsHovered(false);\n setIsOpen(false);\n }, [clearHoverTimer]);\n\n const handleTriggerClick = useCallback(() => {\n if (isVisible) {\n dismiss();\n return;\n }\n clearHoverTimer();\n setIsOpen(true);\n }, [isVisible, dismiss, clearHoverTimer]);\n\n // Releasing the delay detaches the mouse handlers, so reset any hover state they left behind\n useEffect(() => {\n if (!hasHoverDelay) {\n clearHoverTimer();\n setIsHovered(false);\n }\n }, [hasHoverDelay, clearHoverTimer]);\n\n useEffect(() => clearHoverTimer, [clearHoverTimer]);\n\n const hoverHandlers = hasHoverDelay\n ? { onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave }\n : {};\n\n useOnClickOutside(tooltipElement, dismiss);\n\n useOnEdgeProximityDetect({\n triggerRef: triggerElement,\n wrapperRef: tooltipElement,\n contentRef: contentElement,\n requiresRecalc: isVisible,\n });\n\n // Handle special key presses\n const handleSpecialKeyPresses = useCallback(\n (event: KeyboardEvent) => {\n if (event.key === 'Escape' \|\| event.keyCode === 27) {\n dismiss();\n }\n },\n [dismiss],\n );\n\n useEffect(() => {\n const wrapper = tooltipElement.current;\n if (!wrapper) {\n return undefined;\n }\n wrapper.addEventListener('keydown', handleSpecialKeyPresses as EventListener);\n return () => wrapper.removeEventListener('keydown', handleSpecialKeyPresses as EventListener);\n }, [handleSpecialKeyPresses]);\n\n if (containsBlockElements) {\n return (\n <div\n role=\"tooltip\"\n ref={ tooltipElement as React.RefObject<HTMLDivElement> }\n className={ `tooltip tooltip_block ${ isVisible ? 'isOpen' : '' } ${ hasHoverDelay ? 'hoverDelayed' : '' } ${ triggerStyle === 'text' ? 'textDisplay' : '' } ${ customCssClass \|\| '' }` }\n { ...hoverHandlers }\n >\n <button\n ref={ triggerElement }\n type=\"button\"\n onClick={ handleTriggerClick }\n className={ `button ${ triggerStyle === 'text' ? 'text_only' : 'icon_only' } ${ triggerStyle === 'text' && !visualIndicators?.underline ? 'underline_off' : '' } ${ triggerStyle === 'text' && !visualIndicators?.colouredText ? 'colouredText_off' : '' }` }\n { ...(triggerId ? { 'id': triggerId, 'aria-describedby': `${ triggerId }_content` } : {}) }\n { ...(triggerStyle === 'icon' ? { 'aria-label': typeof label === 'string' ? label : undefined } : {}) }\n >\n { triggerStyle === 'icon' && (iconIsElement ? icon : <Icon icon={ icon.toString() } />) }\n { triggerStyle === 'text' && <span className=\"labelText\">{ label }</span> }\n </button>\n <div\n ref={ contentElement as React.RefObject<HTMLDivElement> }\n className={ `content ${ showPointer ? 'showPointer' : '' }` }\n { ...(triggerId ? { id: `${ triggerId }_content` } : {}) }\n >\n { children }\n </div>\n </div>\n );\n }\n\n return (\n <span\n ref={ tooltipElement as React.RefObject<HTMLSpanElement> }\n className={ `tooltip ${ isVisible ? 'isOpen' : '' } ${ hasHoverDelay ? 'hoverDelayed' : '' } ${ triggerStyle === 'text' ? 'textDisplay' : '' } ${ customCssClass \|\| '' }` }\n { ...hoverHandlers }\n >\n <button\n ref={ triggerElement }\n type=\"button\"\n onClick={ handleTriggerClick }\n className={ `button ${ triggerStyle === 'text' ? 'text_only' : 'icon_only' } ${ triggerStyle === 'text' && !visualIndicators?.underline ? 'underline_off' : '' } ${ triggerStyle === 'text' && !visualIndicators?.colouredText ? 'colouredText_off' : '' }` }\n { ...(triggerId ? { id: triggerId } : {}) }\n { ...(triggerStyle === 'icon' ? { 'aria-label': typeof label === 'string' ? label : undefined } : {}) }\n >\n { triggerStyle === 'icon' && (iconIsElement ? icon : <Icon icon={ icon.toString() } />) }\n { triggerStyle === 'text' && <span className=\"labelText\">{ label }</span> }\n </button>\n <span\n aria-hidden\n role=\"presentation\"\n ref={ contentElement as React.RefObject<HTMLSpanElement> }\n className={ `content ${ showPointer ? 'showPointer' : '' }` }\n { ...(triggerId ? { id: `${ triggerId }_content` } : {}) }\n >\n { children }\n </span>\n </span>\n );\n};\n\nexport default Tooltip;\n"],"mappings":"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","ignoreList":[]}

package/dist/cjs/components/design/tooltip/tooltip.css CHANGED Viewed

@@ -93,7 +93,7 @@
 .tooltip.large .content:before {
   left: 160px;
 }
-.tooltip:hover .content, .tooltip.isOpen .content {
+.tooltip:not(.hoverDelayed):hover .content, .tooltip.isOpen .content {
   display: block;
 }
 .tooltip.measuring .content {

package/dist/cjs/hooks/EdgeProximityDetect.js CHANGED Viewed

@@ -11,6 +11,9 @@ const useOnEdgeProximityDetect = ({
   contentRef,
   requiresRecalc
 }) => {
+  // Only the shift classes this hook applied, so a consumer supplied
+  // customCssClass such as "shiftDown" is never stripped
+  const appliedShiftClasses = (0, _react.useRef)([]);
   const xAxisOverride = ({
     left,
     width,
@@ -45,6 +48,10 @@ const useOnEdgeProximityDetect = ({
   };
   (0, _react.useEffect)(() => {
     if (wrapperRef.current && contentRef.current && triggerRef.current && document && document.body) {
+      // Clear the previous run's shift, otherwise the content is measured in its
+      // already-shifted position and can accumulate opposing shift classes
+      appliedShiftClasses.current.forEach(cssClass => wrapperRef.current?.classList.remove(cssClass));
+      appliedShiftClasses.current = [];
       wrapperRef.current.classList.add('measuring');
       const {
         clientWidth,
@@ -58,22 +65,23 @@ const useOnEdgeProximityDetect = ({
       } = contentRef.current.getBoundingClientRect();
       // Check if it needs x-axis or y-axis adjustment
-      const xAxisOverrideCssClass = xAxisOverride({
+      const applyShift = cssClass => {
+        if (!cssClass || !wrapperRef.current || wrapperRef.current.classList.contains(cssClass)) {
+          return;
+        }
+        wrapperRef.current.classList.add(cssClass);
+        appliedShiftClasses.current.push(cssClass);
+      };
+      applyShift(xAxisOverride({
         left,
         width,
         clientWidth
-      });
-      if (xAxisOverrideCssClass) {
-        wrapperRef.current.classList.add(xAxisOverrideCssClass);
-      }
-      const yAxisOverrideCssClass = yAxisOverride({
+      }));
+      applyShift(yAxisOverride({
         top,
         height,
         clientHeight
-      });
-      if (yAxisOverrideCssClass) {
-        wrapperRef.current.classList.add(yAxisOverrideCssClass);
-      }
+      }));
       wrapperRef.current.classList.remove('measuring');
     }
   }, [triggerRef, wrapperRef, contentRef, requiresRecalc]);

package/dist/cjs/hooks/EdgeProximityDetect.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"EdgeProximityDetect.js","names":["_react","require","useOnEdgeProximityDetect","triggerRef","wrapperRef","contentRef","requiresRecalc","xAxisOverride","left","width","clientWidth","yAxisOverride","top","height","clientHeight","useEffect","current","document","body","classList","add","getBoundingClientRect","~~xAxisOverrideCssClass~~","~~yAxisOverrideCssClass~~","~~remove~~","exports"],"sources":["../../../src/hooks/EdgeProximityDetect.ts"],"sourcesContent":["import React, { useEffect } from 'react';\n\ninterface UseOnEdgeProximityDetectProps {\n triggerRef: React.RefObject<HTMLElement>;\n wrapperRef: React.RefObject<HTMLElement>;\n contentRef: React.RefObject<HTMLElement>;\n requiresRecalc: boolean;\n preferredPlacement?: 'right-middle' \| 'right-top' \| 'right-bottom' \| 'left-middle' \| 'left-top' \| 'left-bottom' \| 'top-middle' \| 'top-top' \| 'top-bottom' \| 'bottom-middle' \| 'bottom-top' \| 'bottom-bottom';\n}\n\nexport const useOnEdgeProximityDetect = (\n {\n triggerRef,\n wrapperRef,\n contentRef,\n requiresRecalc\n }\n :\n UseOnEdgeProximityDetectProps\n) => {\n const xAxisOverride = (\n {\n left,\n width,\n clientWidth\n }\n :\n {\n left: number;\n width: number;\n clientWidth: number\n }\n ) => {\n // Too close to left\n if (left < 0) {\n return 'shiftRight';\n }\n\n // Too close to right\n if (left + width > clientWidth) {\n return 'shiftLeft';\n }\n return '';\n };\n\n const yAxisOverride = (\n {\n top,\n height,\n clientHeight\n }\n :\n {\n top: number;\n height: number;\n clientHeight: number\n }\n ) => {\n // Too close to top\n if (top - height < 0) {\n return 'shiftDown';\n }\n\n // Too close to bottom\n if (top + height > clientHeight) {\n return 'shiftUp';\n }\n return '';\n };\n\n useEffect(() => {\n if (\n wrapperRef.current\n && contentRef.current\n && triggerRef.current\n && document\n && document.body\n ) {\n wrapperRef.current.classList.add('measuring');\n const { clientWidth, clientHeight } = document.body;\n const {\n width, height, top, left\n } = contentRef.current.getBoundingClientRect();\n\n // Check if it needs x-axis or y-axis adjustment\n const ~~xAxisOverrideCssClass~~ = ~~xAxisOverride~~({ ~~left,~~ ~~width,~~ ~~clientWidth });\~~n if (~~xAxisOverrideCssClass~~) {\n wrapperRef.current.classList.add(~~xAxisOverrideCssClass~~);\n }\n\n ~~const~~ ~~yAxisOverrideCssClass~~ = yAxisOverride({ top, height, clientHeight })~~;\n if (yAxisOverrideCssClass~~) ~~{\n wrapperRef.current.classList.add(yAxisOverrideCssClass)~~;\n }\n\n wrapperRef.current.classList.remove('measuring');\n }\n }, [triggerRef, wrapperRef, contentRef, requiresRecalc]);\n\n return {};\n};\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AAUO,MAAMC,wBAAwB,GAAGA,CACtC;EACEC,UAAU;EACVC,UAAU;EACVC,UAAU;EACVC;AAG0B,CAAC,KAC1B;EACH,MAAMC,aAAa,GAAGA,CACpB;IACEC,IAAI;IACJC,KAAK;IACLC;EAOF,CAAC,KACE;IACH;IACA,IAAIF,IAAI,GAAG,CAAC,EAAE;MACZ,OAAO,YAAY;IACrB;;IAEA;IACA,IAAIA,IAAI,GAAGC,KAAK,GAAGC,WAAW,EAAE;MAC9B,OAAO,WAAW;IACpB;IACA,OAAO,EAAE;EACX,CAAC;EAED,MAAMC,aAAa,GAAGA,CACpB;IACEC,GAAG;IACHC,MAAM;IACNC;EAOF,CAAC,KACE;IACH;IACA,IAAIF,GAAG,GAAGC,MAAM,GAAG,CAAC,EAAE;MACpB,OAAO,WAAW;IACpB;;IAEA;IACA,IAAID,GAAG,GAAGC,MAAM,GAAGC,YAAY,EAAE;MAC/B,OAAO,SAAS;IAClB;IACA,OAAO,EAAE;EACX,CAAC;EAED,IAAAC,gBAAS,EAAC,MAAM;IACd,~~IACEX~~,UAAU,~~CAACY~~,OAAO,~~IACfX~~,UAAU,~~CAACW~~,OAAO,~~IAClBb~~,UAAU,~~CAACa~~,OAAO,IAClBC,QAAQ,IACRA,QAAQ,CAACC,IAAI,EAChB;~~MACAd~~,~~UAAU~~,~~CAACY~~,OAAO,CAACG,SAAS,CAACC,GAAG,CAAC,WAAW,CAAC;MAC7C,MAAM;~~QAAEV~~,WAAW;QAAEI;MAAa,CAAC,GAAGG,QAAQ,CAACC,IAAI;MACnD,MAAM;QACJT,KAAK;QAAEI,MAAM;QAAED,GAAG;QAAEJ;MACtB,CAAC,~~GAAGH~~,UAAU,~~CAACW~~,OAAO,~~CAACK~~,qBAAqB,CAAC,CAAC;;MAE9C;MACA,MAAMC,~~qBAAqB~~,~~GAAGf~~,~~aAAa~~,~~CAAC~~;~~QAAEC~~,IAAI~~;QAAEC~~,~~KAAK;QAAEC;MAAY~~,~~CAAC~~,~~CAAC;MACzE~~,~~IAAIY~~,~~qBAAqB~~,EAAE;~~QACzBlB~~,UAAU,~~CAACY~~,OAAO,~~CAACG~~,SAAS,~~CAACC~~,GAAG,~~CAACE~~,~~qBAAqB~~,CAAC;~~MACzD~~;~~MAEA~~,~~MAAMC~~,~~qBAAqB~~,~~GAAGZ~~,aAAa,CAAC;QAAEC,~~GAAG~~;QAAEC,~~MAAM~~;QAAEC;~~MAAa~~,CAAC,CAAC~~;MAC1E~~,~~IAAIS,qBAAqB,EAAE~~;~~QACzBnB~~,UAAU,~~CAACY~~,~~OAAO~~,~~CAACG~~,~~SAAS,CAACC,~~GAAG,~~CAACG~~,~~qBAAqB~~,CAAC;~~MACzD;MAEAnB~~,UAAU,~~CAACY~~,OAAO,~~CAACG~~,SAAS,~~CAACK~~,MAAM,CAAC,WAAW,CAAC;IAClD;EACF,CAAC,EAAE,CAACrB,UAAU,EAAEC,UAAU,EAAEC,UAAU,EAAEC,cAAc,CAAC,CAAC;EAExD,OAAO,CAAC,CAAC;AACX,CAAC;~~AAACmB~~,OAAA,~~CAAAvB~~,wBAAA,GAAAA,wBAAA","ignoreList":[]}
1	+ {"version":3,"file":"EdgeProximityDetect.js","names":["_react","require","useOnEdgeProximityDetect","triggerRef","wrapperRef","contentRef","requiresRecalc","appliedShiftClasses","useRef","xAxisOverride","left","width","clientWidth","yAxisOverride","top","height","clientHeight","useEffect","current","document","body","forEach","cssClass","classList","remove","add","getBoundingClientRect","applyShift","contains","push","exports"],"sources":["../../../src/hooks/EdgeProximityDetect.ts"],"sourcesContent":["import React, { useEffect, useRef } from 'react';\n\ninterface UseOnEdgeProximityDetectProps {\n triggerRef: React.RefObject<HTMLElement>;\n wrapperRef: React.RefObject<HTMLElement>;\n contentRef: React.RefObject<HTMLElement>;\n requiresRecalc: boolean;\n preferredPlacement?: 'right-middle' \| 'right-top' \| 'right-bottom' \| 'left-middle' \| 'left-top' \| 'left-bottom' \| 'top-middle' \| 'top-top' \| 'top-bottom' \| 'bottom-middle' \| 'bottom-top' \| 'bottom-bottom';\n}\n\nexport const useOnEdgeProximityDetect = (\n {\n triggerRef,\n wrapperRef,\n contentRef,\n requiresRecalc\n }\n :\n UseOnEdgeProximityDetectProps\n) => {\n // Only the shift classes this hook applied, so a consumer supplied\n // customCssClass such as \"shiftDown\" is never stripped\n const appliedShiftClasses = useRef<string[]>([]);\n\n const xAxisOverride = (\n {\n left,\n width,\n clientWidth\n }\n :\n {\n left: number;\n width: number;\n clientWidth: number\n }\n ) => {\n // Too close to left\n if (left < 0) {\n return 'shiftRight';\n }\n\n // Too close to right\n if (left + width > clientWidth) {\n return 'shiftLeft';\n }\n return '';\n };\n\n const yAxisOverride = (\n {\n top,\n height,\n clientHeight\n }\n :\n {\n top: number;\n height: number;\n clientHeight: number\n }\n ) => {\n // Too close to top\n if (top - height < 0) {\n return 'shiftDown';\n }\n\n // Too close to bottom\n if (top + height > clientHeight) {\n return 'shiftUp';\n }\n return '';\n };\n\n useEffect(() => {\n if (\n wrapperRef.current\n && contentRef.current\n && triggerRef.current\n && document\n && document.body\n ) {\n // Clear the previous run's shift, otherwise the content is measured in its\n // already-shifted position and can accumulate opposing shift classes\n appliedShiftClasses.current.forEach((cssClass) => wrapperRef.current?.classList.remove(cssClass));\n appliedShiftClasses.current = [];\n\n wrapperRef.current.classList.add('measuring');\n const { clientWidth, clientHeight } = document.body;\n const {\n width, height, top, left\n } = contentRef.current.getBoundingClientRect();\n\n // Check if it needs x-axis or y-axis adjustment\n const applyShift = (cssClass: string) => {\n if (!cssClass \|\| !wrapperRef.current \|\| wrapperRef.current.classList.contains(cssClass)) {\n return;\n }\n wrapperRef.current.classList.add(cssClass);\n appliedShiftClasses.current.push(cssClass);\n };\n\n applyShift(xAxisOverride({ left, width, clientWidth }));\n applyShift(yAxisOverride({ top, height, clientHeight }));\n\n wrapperRef.current.classList.remove('measuring');\n }\n }, [triggerRef, wrapperRef, contentRef, requiresRecalc]);\n\n return {};\n};\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AAUO,MAAMC,wBAAwB,GAAGA,CACtC;EACEC,UAAU;EACVC,UAAU;EACVC,UAAU;EACVC;AAG0B,CAAC,KAC1B;EACH;EACA;EACA,MAAMC,mBAAmB,GAAG,IAAAC,aAAM,EAAW,EAAE,CAAC;EAEhD,MAAMC,aAAa,GAAGA,CACpB;IACEC,IAAI;IACJC,KAAK;IACLC;EAOF,CAAC,KACE;IACH;IACA,IAAIF,IAAI,GAAG,CAAC,EAAE;MACZ,OAAO,YAAY;IACrB;;IAEA;IACA,IAAIA,IAAI,GAAGC,KAAK,GAAGC,WAAW,EAAE;MAC9B,OAAO,WAAW;IACpB;IACA,OAAO,EAAE;EACX,CAAC;EAED,MAAMC,aAAa,GAAGA,CACpB;IACEC,GAAG;IACHC,MAAM;IACNC;EAOF,CAAC,KACE;IACH;IACA,IAAIF,GAAG,GAAGC,MAAM,GAAG,CAAC,EAAE;MACpB,OAAO,WAAW;IACpB;;IAEA;IACA,IAAID,GAAG,GAAGC,MAAM,GAAGC,YAAY,EAAE;MAC/B,OAAO,SAAS;IAClB;IACA,OAAO,EAAE;EACX,CAAC;EAED,IAAAC,gBAAS,EAAC,MAAM;IACd,IACEb,UAAU,CAACc,OAAO,IACfb,UAAU,CAACa,OAAO,IAClBf,UAAU,CAACe,OAAO,IAClBC,QAAQ,IACRA,QAAQ,CAACC,IAAI,EAChB;MACA;MACA;MACAb,mBAAmB,CAACW,OAAO,CAACG,OAAO,CAAEC,QAAQ,IAAKlB,UAAU,CAACc,OAAO,EAAEK,SAAS,CAACC,MAAM,CAACF,QAAQ,CAAC,CAAC;MACjGf,mBAAmB,CAACW,OAAO,GAAG,EAAE;MAEhCd,UAAU,CAACc,OAAO,CAACK,SAAS,CAACE,GAAG,CAAC,WAAW,CAAC;MAC7C,MAAM;QAAEb,WAAW;QAAEI;MAAa,CAAC,GAAGG,QAAQ,CAACC,IAAI;MACnD,MAAM;QACJT,KAAK;QAAEI,MAAM;QAAED,GAAG;QAAEJ;MACtB,CAAC,GAAGL,UAAU,CAACa,OAAO,CAACQ,qBAAqB,CAAC,CAAC;;MAE9C;MACA,MAAMC,UAAU,GAAIL,QAAgB,IAAK;QACvC,IAAI,CAACA,QAAQ,IAAI,CAAClB,UAAU,CAACc,OAAO,IAAId,UAAU,CAACc,OAAO,CAACK,SAAS,CAACK,QAAQ,CAACN,QAAQ,CAAC,EAAE;UACvF;QACF;QACAlB,UAAU,CAACc,OAAO,CAACK,SAAS,CAACE,GAAG,CAACH,QAAQ,CAAC;QAC1Cf,mBAAmB,CAACW,OAAO,CAACW,IAAI,CAACP,QAAQ,CAAC;MAC5C,CAAC;MAEDK,UAAU,CAAClB,aAAa,CAAC;QAAEC,IAAI;QAAEC,KAAK;QAAEC;MAAY,CAAC,CAAC,CAAC;MACvDe,UAAU,CAACd,aAAa,CAAC;QAAEC,GAAG;QAAEC,MAAM;QAAEC;MAAa,CAAC,CAAC,CAAC;MAExDZ,UAAU,CAACc,OAAO,CAACK,SAAS,CAACC,MAAM,CAAC,WAAW,CAAC;IAClD;EACF,CAAC,EAAE,CAACrB,UAAU,EAAEC,UAAU,EAAEC,UAAU,EAAEC,cAAc,CAAC,CAAC;EAExD,OAAO,CAAC,CAAC;AACX,CAAC;AAACwB,OAAA,CAAA5B,wBAAA,GAAAA,wBAAA","ignoreList":[]}

package/dist/cjs/package.json CHANGED Viewed

@@ -137,7 +137,7 @@
   "files": [
     "dist"
   ],
-  "version": "3.15.0",
+  "version": "3.16.0",
   "devEngines": {
     "runtime": {
       "name": "node",

package/dist/cjs/styles/index.css CHANGED Viewed

@@ -254,9 +254,11 @@
   --notificationIconFg: #fff;
   --notificationIconBorder: 4px solid #c00;
   --notificationIconBoxShadow: none;
-  --skeletonBg: #eef2f4;
+  --skeletonBg: #e5ebef;
   --skeletonOpaqueBg: #d3dee4;
-  --skeletonHighlight: #f6f8fa;
+  --skeletonHighlight: #ffffff;
+  --skeletonPulseBg: #ffffff;
+  --skeletonOpaquePulseBg: #f6f8fa;
   --skeletonBorderRadius: 3px;
   --skeletonRoundedBorderRadius: 8px;
   --skeletonLineHeight: 1em;
@@ -264,7 +266,7 @@
   --skeletonBlockHeight: 120px;
   --skeletonCircleSize: 40px;
   --skeletonLastLineWidth: 60%;
-  --skeletonAnimationDuration: 1.6s;
+  --skeletonAnimationDuration: 2s;
 }
 :root {
@@ -611,6 +613,8 @@
   --skeletonBg: #1a1410;
   --skeletonHighlight: #3d2f26;
   --skeletonOpaqueBg: #2c211b;
+  --skeletonOpaquePulseBg: #4d3b30;
+  --skeletonPulseBg: #3d2f26;
   --statusAlertColor: #000;
   --statusDefCon3Bg: radial-gradient(circle at 60% 40%, #003, #000, #333); /* gradient stops inverted */
   --statusDefCon3Color: #003;

package/dist/cjs/styles/variables/cssVars/_darkModeVariables.css CHANGED Viewed

@@ -236,6 +236,8 @@
   --skeletonBg: #1a1410;
   --skeletonHighlight: #3d2f26;
   --skeletonOpaqueBg: #2c211b;
+  --skeletonOpaquePulseBg: #4d3b30;
+  --skeletonPulseBg: #3d2f26;
   --statusAlertColor: #000;
   --statusDefCon3Bg: radial-gradient(circle at 60% 40%, #003, #000, #333); /* gradient stops inverted */
   --statusDefCon3Color: #003;

package/dist/cjs/styles/variables/cssVars/_designVariables.css CHANGED Viewed

@@ -216,9 +216,11 @@
   --notificationIconFg: #fff;
   --notificationIconBorder: 4px solid #c00;
   --notificationIconBoxShadow: none;
-  --skeletonBg: #eef2f4;
+  --skeletonBg: #e5ebef;
   --skeletonOpaqueBg: #d3dee4;
-  --skeletonHighlight: #f6f8fa;
+  --skeletonHighlight: #ffffff;
+  --skeletonPulseBg: #ffffff;
+  --skeletonOpaquePulseBg: #f6f8fa;
   --skeletonBorderRadius: 3px;
   --skeletonRoundedBorderRadius: 8px;
   --skeletonLineHeight: 1em;
@@ -226,5 +228,5 @@
   --skeletonBlockHeight: 120px;
   --skeletonCircleSize: 40px;
   --skeletonLastLineWidth: 60%;
-  --skeletonAnimationDuration: 1.6s;
+  --skeletonAnimationDuration: 2s;
 }

package/dist/components/design/tooltip/Tooltip.d.ts CHANGED Viewed

@@ -9,6 +9,7 @@ export type TooltipProps = {
     triggerStyle?: 'icon';
     label?: string | ReactNode;
     showPointer?: boolean;
+    hoverDelay?: number;
 } | {
     triggerId?: string;
     icon?: ReactElement | string;
@@ -18,6 +19,7 @@ export type TooltipProps = {
     triggerStyle: 'text';
     label?: string | ReactNode;
     showPointer?: boolean;
+    hoverDelay?: number;
     visualIndicators?: {
         underline?: boolean;
         colouredText?: boolean;

package/dist/components/design/tooltip/Tooltip.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Tooltip.d.ts","sourceRoot":"","sources":["../../../../src/components/design/tooltip/Tooltip.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,EAA4C,SAAS,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAIjG,OAAO,gBAAgB,CAAC;AAGxB,MAAM,MAAM,YAAY,GACrB;IACG,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,YAAY,GAAG,MAAM,CAAC;IAC7B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,QAAQ,EAAE,SAAS,CAAC;IACpB,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,KAAK,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC3B,WAAW,CAAC,EAAE,OAAO,CAAC;~~CACvB~~,GACD;IACE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,YAAY,GAAG,MAAM,CAAC;IAC7B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,QAAQ,EAAE,SAAS,CAAC;IACpB,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,YAAY,EAAE,MAAM,CAAC;IACrB,KAAK,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC3B,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,gBAAgB,CAAC,EAAE;QAAE,SAAS,CAAC,EAAE,OAAO,CAAC;QAAC,YAAY,CAAC,EAAE,OAAO,CAAA;KAAE,CAAC;CACpE,CAAC;AAEN,eAAO,MAAM,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC,YAAY,~~CA0G1C~~,CAAC;AAEF,eAAe,OAAO,CAAC"}
1	+ {"version":3,"file":"Tooltip.d.ts","sourceRoot":"","sources":["../../../../src/components/design/tooltip/Tooltip.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,EAA4C,SAAS,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAIjG,OAAO,gBAAgB,CAAC;AAGxB,MAAM,MAAM,YAAY,GACrB;IACG,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,YAAY,GAAG,MAAM,CAAC;IAC7B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,QAAQ,EAAE,SAAS,CAAC;IACpB,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,KAAK,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC3B,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB,GACD;IACE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,YAAY,GAAG,MAAM,CAAC;IAC7B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,QAAQ,EAAE,SAAS,CAAC;IACpB,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,YAAY,EAAE,MAAM,CAAC;IACrB,KAAK,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC3B,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,gBAAgB,CAAC,EAAE;QAAE,SAAS,CAAC,EAAE,OAAO,CAAC;QAAC,YAAY,CAAC,EAAE,OAAO,CAAA;KAAE,CAAC;CACpE,CAAC;AAEN,eAAO,MAAM,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC,YAAY,CAqK1C,CAAC;AAEF,eAAe,OAAO,CAAC"}

package/dist/components/design/tooltip/Tooltip.test.d.ts ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ export {};
2	+ //# sourceMappingURL=Tooltip.test.d.ts.map

package/dist/components/design/tooltip/Tooltip.test.d.ts.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"Tooltip.test.d.ts","sourceRoot":"","sources":["../../../../src/components/design/tooltip/Tooltip.test.tsx"],"names":[],"mappings":""}

package/dist/esm/autoGenerated/libraryThemes.js CHANGED Viewed

@@ -11,8 +11,8 @@ export const libraryThemes = {
       "map": "index.min.css.map"
     },
     "versioned": {
-      "css": "index.min.3.15.1.css",
-      "map": "index.min.3.15.1.css.map"
+      "css": "index.min.3.16.1.css",
+      "map": "index.min.3.16.1.css.map"
     }
   },
   "cba": {
@@ -26,8 +26,8 @@ export const libraryThemes = {
       "map": "cba.min.css.map"
     },
     "versioned": {
-      "css": "cba.min.3.15.1.css",
-      "map": "cba.min.3.15.1.css.map"
+      "css": "cba.min.3.16.1.css",
+      "map": "cba.min.3.16.1.css.map"
     }
   },
   "creditSavvy": {
@@ -41,8 +41,8 @@ export const libraryThemes = {
       "map": "creditSavvy.min.css.map"
     },
     "versioned": {
-      "css": "creditSavvy.min.3.15.1.css",
-      "map": "creditSavvy.min.3.15.1.css.map"
+      "css": "creditSavvy.min.3.16.1.css",
+      "map": "creditSavvy.min.3.16.1.css.map"
     }
   },
   "doshii": {
@@ -56,8 +56,8 @@ export const libraryThemes = {
       "map": "doshii.min.css.map"
     },
     "versioned": {
-      "css": "doshii.min.3.15.1.css",
-      "map": "doshii.min.3.15.1.css.map"
+      "css": "doshii.min.3.16.1.css",
+      "map": "doshii.min.3.16.1.css.map"
     }
   },
   "homeIn": {
@@ -71,8 +71,8 @@ export const libraryThemes = {
       "map": "homeIn.min.css.map"
     },
     "versioned": {
-      "css": "homeIn.min.3.15.1.css",
-      "map": "homeIn.min.3.15.1.css.map"
+      "css": "homeIn.min.3.16.1.css",
+      "map": "homeIn.min.3.16.1.css.map"
     }
   },
   "x15Core": {
@@ -86,8 +86,8 @@ export const libraryThemes = {
       "map": "x15Core.min.css.map"
     },
     "versioned": {
-      "css": "x15Core.min.3.15.1.css",
-      "map": "x15Core.min.3.15.1.css.map"
+      "css": "x15Core.min.3.16.1.css",
+      "map": "x15Core.min.3.16.1.css.map"
     }
   }
 };

package/dist/esm/autoGenerated/libraryThemes.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"libraryThemes.js","names":["libraryThemes"],"sources":["../../../src/autoGenerated/libraryThemes.ts"],"sourcesContent":["/* eslint-disable */\nexport const libraryThemes = {\n \"base\": {\n \"buildPath\": \"styles\",\n \"dev\": {\n \"css\": \"index.css\",\n \"map\": \"index.css.map\"\n },\n \"min\": {\n \"css\": \"index.min.css\",\n \"map\": \"index.min.css.map\"\n },\n \"versioned\": {\n \"css\": \"index.min.3.15.1.css\",\n \"map\": \"index.min.3.15.1.css.map\"\n }\n },\n \"cba\": {\n \"buildPath\": \"styles/themes/cba\",\n \"dev\": {\n \"css\": \"cba.css\",\n \"map\": \"cba.css.map\"\n },\n \"min\": {\n \"css\": \"cba.min.css\",\n \"map\": \"cba.min.css.map\"\n },\n \"versioned\": {\n \"css\": \"cba.min.3.15.1.css\",\n \"map\": \"cba.min.3.15.1.css.map\"\n }\n },\n \"creditSavvy\": {\n \"buildPath\": \"styles/themes/creditSavvy\",\n \"dev\": {\n \"css\": \"creditSavvy.css\",\n \"map\": \"creditSavvy.css.map\"\n },\n \"min\": {\n \"css\": \"creditSavvy.min.css\",\n \"map\": \"creditSavvy.min.css.map\"\n },\n \"versioned\": {\n \"css\": \"creditSavvy.min.3.15.1.css\",\n \"map\": \"creditSavvy.min.3.15.1.css.map\"\n }\n },\n \"doshii\": {\n \"buildPath\": \"styles/themes/doshii\",\n \"dev\": {\n \"css\": \"doshii.css\",\n \"map\": \"doshii.css.map\"\n },\n \"min\": {\n \"css\": \"doshii.min.css\",\n \"map\": \"doshii.min.css.map\"\n },\n \"versioned\": {\n \"css\": \"doshii.min.3.15.1.css\",\n \"map\": \"doshii.min.3.15.1.css.map\"\n }\n },\n \"homeIn\": {\n \"buildPath\": \"styles/themes/homeIn\",\n \"dev\": {\n \"css\": \"homeIn.css\",\n \"map\": \"homeIn.css.map\"\n },\n \"min\": {\n \"css\": \"homeIn.min.css\",\n \"map\": \"homeIn.min.css.map\"\n },\n \"versioned\": {\n \"css\": \"homeIn.min.3.15.1.css\",\n \"map\": \"homeIn.min.3.15.1.css.map\"\n }\n },\n \"x15Core\": {\n \"buildPath\": \"styles/themes/x15Core\",\n \"dev\": {\n \"css\": \"x15Core.css\",\n \"map\": \"x15Core.css.map\"\n },\n \"min\": {\n \"css\": \"x15Core.min.css\",\n \"map\": \"x15Core.min.css.map\"\n },\n \"versioned\": {\n \"css\": \"x15Core.min.3.15.1.css\",\n \"map\": \"x15Core.min.3.15.1.css.map\"\n }\n }\n}; export default libraryThemes;"],"mappings":"AAAA;AACA,OAAO,MAAMA,aAAa,GAAG;EAC3B,MAAM,EAAE;IACN,WAAW,EAAE,QAAQ;IACrB,KAAK,EAAE;MACL,KAAK,EAAE,WAAW;MAClB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,eAAe;MACtB,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,sBAAsB;MAC7B,KAAK,EAAE;IACT;EACF,CAAC;EACD,KAAK,EAAE;IACL,WAAW,EAAE,mBAAmB;IAChC,KAAK,EAAE;MACL,KAAK,EAAE,SAAS;MAChB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,aAAa;MACpB,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,oBAAoB;MAC3B,KAAK,EAAE;IACT;EACF,CAAC;EACD,aAAa,EAAE;IACb,WAAW,EAAE,2BAA2B;IACxC,KAAK,EAAE;MACL,KAAK,EAAE,iBAAiB;MACxB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,qBAAqB;MAC5B,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,4BAA4B;MACnC,KAAK,EAAE;IACT;EACF,CAAC;EACD,QAAQ,EAAE;IACR,WAAW,EAAE,sBAAsB;IACnC,KAAK,EAAE;MACL,KAAK,EAAE,YAAY;MACnB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,gBAAgB;MACvB,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,uBAAuB;MAC9B,KAAK,EAAE;IACT;EACF,CAAC;EACD,QAAQ,EAAE;IACR,WAAW,EAAE,sBAAsB;IACnC,KAAK,EAAE;MACL,KAAK,EAAE,YAAY;MACnB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,gBAAgB;MACvB,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,uBAAuB;MAC9B,KAAK,EAAE;IACT;EACF,CAAC;EACD,SAAS,EAAE;IACT,WAAW,EAAE,uBAAuB;IACpC,KAAK,EAAE;MACL,KAAK,EAAE,aAAa;MACpB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,iBAAiB;MACxB,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,wBAAwB;MAC/B,KAAK,EAAE;IACT;EACF;AACF,CAAC;AAAE,eAAeA,aAAa","ignoreList":[]}
1	+ {"version":3,"file":"libraryThemes.js","names":["libraryThemes"],"sources":["../../../src/autoGenerated/libraryThemes.ts"],"sourcesContent":["/* eslint-disable */\nexport const libraryThemes = {\n \"base\": {\n \"buildPath\": \"styles\",\n \"dev\": {\n \"css\": \"index.css\",\n \"map\": \"index.css.map\"\n },\n \"min\": {\n \"css\": \"index.min.css\",\n \"map\": \"index.min.css.map\"\n },\n \"versioned\": {\n \"css\": \"index.min.3.16.1.css\",\n \"map\": \"index.min.3.16.1.css.map\"\n }\n },\n \"cba\": {\n \"buildPath\": \"styles/themes/cba\",\n \"dev\": {\n \"css\": \"cba.css\",\n \"map\": \"cba.css.map\"\n },\n \"min\": {\n \"css\": \"cba.min.css\",\n \"map\": \"cba.min.css.map\"\n },\n \"versioned\": {\n \"css\": \"cba.min.3.16.1.css\",\n \"map\": \"cba.min.3.16.1.css.map\"\n }\n },\n \"creditSavvy\": {\n \"buildPath\": \"styles/themes/creditSavvy\",\n \"dev\": {\n \"css\": \"creditSavvy.css\",\n \"map\": \"creditSavvy.css.map\"\n },\n \"min\": {\n \"css\": \"creditSavvy.min.css\",\n \"map\": \"creditSavvy.min.css.map\"\n },\n \"versioned\": {\n \"css\": \"creditSavvy.min.3.16.1.css\",\n \"map\": \"creditSavvy.min.3.16.1.css.map\"\n }\n },\n \"doshii\": {\n \"buildPath\": \"styles/themes/doshii\",\n \"dev\": {\n \"css\": \"doshii.css\",\n \"map\": \"doshii.css.map\"\n },\n \"min\": {\n \"css\": \"doshii.min.css\",\n \"map\": \"doshii.min.css.map\"\n },\n \"versioned\": {\n \"css\": \"doshii.min.3.16.1.css\",\n \"map\": \"doshii.min.3.16.1.css.map\"\n }\n },\n \"homeIn\": {\n \"buildPath\": \"styles/themes/homeIn\",\n \"dev\": {\n \"css\": \"homeIn.css\",\n \"map\": \"homeIn.css.map\"\n },\n \"min\": {\n \"css\": \"homeIn.min.css\",\n \"map\": \"homeIn.min.css.map\"\n },\n \"versioned\": {\n \"css\": \"homeIn.min.3.16.1.css\",\n \"map\": \"homeIn.min.3.16.1.css.map\"\n }\n },\n \"x15Core\": {\n \"buildPath\": \"styles/themes/x15Core\",\n \"dev\": {\n \"css\": \"x15Core.css\",\n \"map\": \"x15Core.css.map\"\n },\n \"min\": {\n \"css\": \"x15Core.min.css\",\n \"map\": \"x15Core.min.css.map\"\n },\n \"versioned\": {\n \"css\": \"x15Core.min.3.16.1.css\",\n \"map\": \"x15Core.min.3.16.1.css.map\"\n }\n }\n}; export default libraryThemes;"],"mappings":"AAAA;AACA,OAAO,MAAMA,aAAa,GAAG;EAC3B,MAAM,EAAE;IACN,WAAW,EAAE,QAAQ;IACrB,KAAK,EAAE;MACL,KAAK,EAAE,WAAW;MAClB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,eAAe;MACtB,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,sBAAsB;MAC7B,KAAK,EAAE;IACT;EACF,CAAC;EACD,KAAK,EAAE;IACL,WAAW,EAAE,mBAAmB;IAChC,KAAK,EAAE;MACL,KAAK,EAAE,SAAS;MAChB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,aAAa;MACpB,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,oBAAoB;MAC3B,KAAK,EAAE;IACT;EACF,CAAC;EACD,aAAa,EAAE;IACb,WAAW,EAAE,2BAA2B;IACxC,KAAK,EAAE;MACL,KAAK,EAAE,iBAAiB;MACxB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,qBAAqB;MAC5B,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,4BAA4B;MACnC,KAAK,EAAE;IACT;EACF,CAAC;EACD,QAAQ,EAAE;IACR,WAAW,EAAE,sBAAsB;IACnC,KAAK,EAAE;MACL,KAAK,EAAE,YAAY;MACnB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,gBAAgB;MACvB,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,uBAAuB;MAC9B,KAAK,EAAE;IACT;EACF,CAAC;EACD,QAAQ,EAAE;IACR,WAAW,EAAE,sBAAsB;IACnC,KAAK,EAAE;MACL,KAAK,EAAE,YAAY;MACnB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,gBAAgB;MACvB,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,uBAAuB;MAC9B,KAAK,EAAE;IACT;EACF,CAAC;EACD,SAAS,EAAE;IACT,WAAW,EAAE,uBAAuB;IACpC,KAAK,EAAE;MACL,KAAK,EAAE,aAAa;MACpB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,iBAAiB;MACxB,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,wBAAwB;MAC/B,KAAK,EAAE;IACT;EACF;AACF,CAAC;AAAE,eAAeA,aAAa","ignoreList":[]}

package/dist/esm/autoGenerated/libraryThemes.json CHANGED Viewed

@@ -10,8 +10,8 @@
       "map": "index.min.css.map"
     },
     "versioned": {
-      "css": "base.min.3.15.1.css",
-      "map": "base.min.3.15.1.css.map"
+      "css": "base.min.3.16.1.css",
+      "map": "base.min.3.16.1.css.map"
     }
   },
   "cba": {
@@ -25,8 +25,8 @@
       "map": "cba.min.css.map"
     },
     "versioned": {
-      "css": "cba.min.3.15.1.css",
-      "map": "cba.min.3.15.1.css.map"
+      "css": "cba.min.3.16.1.css",
+      "map": "cba.min.3.16.1.css.map"
     }
   },
   "creditSavvy": {
@@ -40,8 +40,8 @@
       "map": "creditSavvy.min.css.map"
     },
     "versioned": {
-      "css": "creditSavvy.min.3.15.1.css",
-      "map": "creditSavvy.min.3.15.1.css.map"
+      "css": "creditSavvy.min.3.16.1.css",
+      "map": "creditSavvy.min.3.16.1.css.map"
     }
   },
   "doshii": {
@@ -55,8 +55,8 @@
       "map": "doshii.min.css.map"
     },
     "versioned": {
-      "css": "doshii.min.3.15.1.css",
-      "map": "doshii.min.3.15.1.css.map"
+      "css": "doshii.min.3.16.1.css",
+      "map": "doshii.min.3.16.1.css.map"
     }
   },
   "homeIn": {
@@ -70,8 +70,8 @@
       "map": "homeIn.min.css.map"
     },
     "versioned": {
-      "css": "homeIn.min.3.15.1.css",
-      "map": "homeIn.min.3.15.1.css.map"
+      "css": "homeIn.min.3.16.1.css",
+      "map": "homeIn.min.3.16.1.css.map"
     }
   },
   "x15Core": {
@@ -85,8 +85,8 @@
       "map": "x15Core.min.css.map"
     },
     "versioned": {
-      "css": "x15Core.min.3.15.1.css",
-      "map": "x15Core.min.3.15.1.css.map"
+      "css": "x15Core.min.3.16.1.css",
+      "map": "x15Core.min.3.16.1.css.map"
     }
   }
 }

package/dist/esm/components/design/skeleton/skeleton.css CHANGED Viewed

@@ -11,7 +11,7 @@
 .skeletonBar {
   inline-size: 100%;
   block-size: var(--skeletonHeight, var(--skeletonLineHeight, 1em));
-  background-color: var(--skeletonBg, #eef2f4);
+  background-color: var(--skeletonBg, #e5ebef);
   border-radius: var(--skeletonBorderRadius, 3px);
 }
@@ -53,34 +53,39 @@
   position: absolute;
   inset: 0;
   transform: translateX(-100%);
-  background-image: linear-gradient(90deg, transparent, var(--skeletonHighlight, #f6f8fa), transparent);
-  animation: skeletonWave var(--skeletonAnimationDuration, 1.6s) linear infinite;
+  background-image: linear-gradient(90deg, transparent 20%, var(--skeletonHighlight, #ffffff) 50%, transparent 80%);
+  animation: skeletonWave var(--skeletonAnimationDuration, 2s) ease-in-out infinite;
 }
 .skeleton_pulse .skeletonBar {
-  opacity: 1;
-  animation: skeletonPulse var(--skeletonAnimationDuration, 1.6s) ease-in-out infinite alternate;
+  animation: skeletonPulse var(--skeletonAnimationDuration, 2s) ease-in-out infinite;
+}
+.skeleton_pulse.skeleton_opaque .skeletonBar {
+  animation-name: skeletonPulseOpaque;
 }
 @keyframes skeletonWave {
-  to {
+  60%, 100% {
     transform: translateX(100%);
   }
 }
 @keyframes skeletonPulse {
-  from {
-    opacity: 1;
+  50% {
+    background-color: var(--skeletonPulseBg, #ffffff);
   }
-  to {
-    opacity: 0.3;
+}
+@keyframes skeletonPulseOpaque {
+  50% {
+    background-color: var(--skeletonOpaquePulseBg, #f6f8fa);
   }
 }
 @media (prefers-reduced-motion: reduce) {
   .skeleton_wave .skeletonBar::after {
     display: none;
   }
-  .skeleton_pulse .skeletonBar {
+  .skeleton_pulse .skeletonBar,
+  .skeleton_pulse.skeleton_opaque .skeletonBar {
     animation: none;
-    opacity: 1;
   }
 }

package/dist/esm/components/design/tooltip/Tooltip.js CHANGED Viewed

@@ -18,7 +18,8 @@ export const Tooltip = props => {
     containsBlockElements = false,
     children,
     label = 'Toggle tooltip open state',
-    showPointer = true
+    showPointer = true,
+    hoverDelay
     // visualIndicators will be handled below
   } = props;
@@ -28,38 +29,89 @@ export const Tooltip = props => {
     colouredText: true
   } : undefined;
   const [isOpen, setIsOpen] = useState(false);
+  const [isHovered, setIsHovered] = useState(false);
   const tooltipElement = useRef(null);
   const triggerElement = useRef(null);
   const contentElement = useRef(null);
+  const hoverTimer = useRef(null);
   const iconIsElement = /*#__PURE__*/React.isValidElement(icon);
-  useOnClickOutside(tooltipElement, () => setIsOpen(false));
+  // Hover is handled in css by default. It is only taken over by js when a delay is requested.
+  const hasHoverDelay = typeof hoverDelay === 'number' && hoverDelay > 0;
+  const isVisible = isOpen || isHovered;
+  const clearHoverTimer = useCallback(() => {
+    if (hoverTimer.current) {
+      clearTimeout(hoverTimer.current);
+      hoverTimer.current = null;
+    }
+  }, []);
+  const handleMouseEnter = useCallback(() => {
+    clearHoverTimer();
+    hoverTimer.current = setTimeout(() => setIsHovered(true), hoverDelay);
+  }, [clearHoverTimer, hoverDelay]);
+  const handleMouseLeave = useCallback(() => {
+    clearHoverTimer();
+    setIsHovered(false);
+  }, [clearHoverTimer]);
+  // Single dismissal path, so every close route clears both the click and hover state
+  const dismiss = useCallback(() => {
+    clearHoverTimer();
+    setIsHovered(false);
+    setIsOpen(false);
+  }, [clearHoverTimer]);
+  const handleTriggerClick = useCallback(() => {
+    if (isVisible) {
+      dismiss();
+      return;
+    }
+    clearHoverTimer();
+    setIsOpen(true);
+  }, [isVisible, dismiss, clearHoverTimer]);
+  // Releasing the delay detaches the mouse handlers, so reset any hover state they left behind
+  useEffect(() => {
+    if (!hasHoverDelay) {
+      clearHoverTimer();
+      setIsHovered(false);
+    }
+  }, [hasHoverDelay, clearHoverTimer]);
+  useEffect(() => clearHoverTimer, [clearHoverTimer]);
+  const hoverHandlers = hasHoverDelay ? {
+    onMouseEnter: handleMouseEnter,
+    onMouseLeave: handleMouseLeave
+  } : {};
+  useOnClickOutside(tooltipElement, dismiss);
   useOnEdgeProximityDetect({
     triggerRef: triggerElement,
     wrapperRef: tooltipElement,
     contentRef: contentElement,
-    requiresRecalc: isOpen
+    requiresRecalc: isVisible
   });
   // Handle special key presses
   const handleSpecialKeyPresses = useCallback(event => {
     if (event.key === 'Escape' || event.keyCode === 27) {
-      setIsOpen(false);
+      dismiss();
     }
-  }, [setIsOpen]);
+  }, [dismiss]);
   useEffect(() => {
-    if (tooltipElement.current) {
-      tooltipElement.current.addEventListener('keydown', handleSpecialKeyPresses);
+    const wrapper = tooltipElement.current;
+    if (!wrapper) {
+      return undefined;
     }
+    wrapper.addEventListener('keydown', handleSpecialKeyPresses);
+    return () => wrapper.removeEventListener('keydown', handleSpecialKeyPresses);
   }, [handleSpecialKeyPresses]);
   if (containsBlockElements) {
-    return /*#__PURE__*/React.createElement("div", {
+    return /*#__PURE__*/React.createElement("div", _extends({
       role: "tooltip",
       ref: tooltipElement,
-      className: `tooltip tooltip_block ${isOpen ? 'isOpen' : ''} ${triggerStyle === 'text' && 'textDisplay'} ${customCssClass || ''}`
-    }, /*#__PURE__*/React.createElement("button", _extends({
+      className: `tooltip tooltip_block ${isVisible ? 'isOpen' : ''} ${hasHoverDelay ? 'hoverDelayed' : ''} ${triggerStyle === 'text' ? 'textDisplay' : ''} ${customCssClass || ''}`
+    }, hoverHandlers), /*#__PURE__*/React.createElement("button", _extends({
       ref: triggerElement,
       type: "button",
-      onClick: () => setIsOpen(!isOpen),
+      onClick: handleTriggerClick,
       className: `button ${triggerStyle === 'text' ? 'text_only' : 'icon_only'} ${triggerStyle === 'text' && !visualIndicators?.underline ? 'underline_off' : ''} ${triggerStyle === 'text' && !visualIndicators?.colouredText ? 'colouredText_off' : ''}`
     }, triggerId ? {
       'id': triggerId,
@@ -77,13 +129,13 @@ export const Tooltip = props => {
       id: `${triggerId}_content`
     } : {}), children));
   }
-  return /*#__PURE__*/React.createElement("span", {
+  return /*#__PURE__*/React.createElement("span", _extends({
     ref: tooltipElement,
-    className: `tooltip ${isOpen ? 'isOpen' : ''} ${triggerStyle === 'text' && 'textDisplay'} ${customCssClass || ''}`
-  }, /*#__PURE__*/React.createElement("button", _extends({
+    className: `tooltip ${isVisible ? 'isOpen' : ''} ${hasHoverDelay ? 'hoverDelayed' : ''} ${triggerStyle === 'text' ? 'textDisplay' : ''} ${customCssClass || ''}`
+  }, hoverHandlers), /*#__PURE__*/React.createElement("button", _extends({
     ref: triggerElement,
     type: "button",
-    onClick: () => setIsOpen(!isOpen),
+    onClick: handleTriggerClick,
     className: `button ${triggerStyle === 'text' ? 'text_only' : 'icon_only'} ${triggerStyle === 'text' && !visualIndicators?.underline ? 'underline_off' : ''} ${triggerStyle === 'text' && !visualIndicators?.colouredText ? 'colouredText_off' : ''}`
   }, triggerId ? {
     id: triggerId

package/dist/esm/components/design/tooltip/Tooltip.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Tooltip.js","names":["_extends","React","useState","useRef","useEffect","useCallback","useOnClickOutside","Icon","useOnEdgeProximityDetect","Tooltip","props","triggerId","triggerStyle","icon","customCssClass","containsBlockElements","children","label","showPointer","visualIndicators","underline","colouredText","undefined","isOpen","setIsOpen","tooltipElement","triggerElement","contentElement","iconIsElement","isValidElement","triggerRef","wrapperRef","contentRef","requiresRecalc","handleSpecialKeyPresses","event","key","keyCode","current","addEventListener","createElement","role","ref","className","type","onClick","toString","id"],"sources":["../../../../../src/components/design/tooltip/Tooltip.tsx"],"sourcesContent":["'use client';\n\nimport React, { useState, useRef, useEffect, useCallback, ReactNode, ReactElement } from 'react';\nimport { useOnClickOutside } from '../../../hooks/ClickOutside';\nimport { Icon } from '../icons/basicIcon/Icon';\nimport { useOnEdgeProximityDetect } from '../../../hooks/EdgeProximityDetect';\nimport './tooltip.scss';\n\n// Define the props for Tooltip\nexport type TooltipProps =\n {\n triggerId?: string;\n icon?: ReactElement \| string;\n customCssClass?: string;\n children: ReactNode;\n containsBlockElements?: boolean;\n triggerStyle?: 'icon';\n label?: string \| ReactNode;\n showPointer?: boolean;\n }\n \| {\n triggerId?: string;\n icon?: ReactElement \| string;\n customCssClass?: string;\n children: ReactNode;\n containsBlockElements?: boolean;\n triggerStyle: 'text';\n label?: string \| ReactNode;\n showPointer?: boolean;\n visualIndicators?: { underline?: boolean; colouredText?: boolean };\n };\n\nexport const Tooltip: React.FC<TooltipProps> = (props) => {\n const {\n triggerId,\n triggerStyle = 'icon',\n icon = 'info',\n customCssClass,\n containsBlockElements = false,\n children,\n label = 'Toggle tooltip open state',\n showPointer = true,\n // visualIndicators will be handled below\n } = props as any;\n\n // Only use visualIndicators if triggerStyle is 'text'\n const visualIndicators =\n triggerStyle === 'text'\n ? (props as { visualIndicators?: { underline?: boolean; colouredText?: boolean } }).visualIndicators ?? { underline: true, colouredText: true }\n : undefined;\n const [isOpen, setIsOpen] = useState(false);\n const tooltipElement = useRef<HTMLDivElement \| HTMLSpanElement>(null);\n const triggerElement = useRef<HTMLButtonElement>(null);\n const contentElement = useRef<HTMLDivElement \| HTMLSpanElement>(null);\n\n const iconIsElement = React.isValidElement(icon);\n\n useOnClickOutside(tooltipElement, () => setIsOpen(false));\n\n useOnEdgeProximityDetect({\n triggerRef: triggerElement,\n wrapperRef: tooltipElement,\n contentRef: contentElement,\n requiresRecalc: isOpen,\n });\n\n // Handle special key presses\n const handleSpecialKeyPresses = useCallback(\n (event: KeyboardEvent) => {\n if (event.key === 'Escape' \|\| event.keyCode === 27) {\n setIsOpen(false);\n }\n },\n [setIsOpen],\n );\n\n useEffect(() => {\n if (tooltipElement.current) {\n tooltipElement.current.addEventListener('keydown', handleSpecialKeyPresses as EventListener);\n }\n }, [handleSpecialKeyPresses]);\n\n if (containsBlockElements) {\n return (\n <div\n role=\"tooltip\"\n ref={ tooltipElement as React.RefObject<HTMLDivElement> }\n className={ `tooltip tooltip_block ${ isOpen ? 'isOpen' : '' } ${ triggerStyle === 'text' && 'textDisplay' } ${ customCssClass \|\| '' }` }\n >\n <button\n ref={ triggerElement }\n type=\"button\"\n onClick={ () => setIsOpen(!isOpen) }\n className={ `button ${ triggerStyle === 'text' ? 'text_only' : 'icon_only' } ${ triggerStyle === 'text' && !visualIndicators?.underline ? 'underline_off' : '' } ${ triggerStyle === 'text' && !visualIndicators?.colouredText ? 'colouredText_off' : '' }` }\n { ...(triggerId ? { 'id': triggerId, 'aria-describedby': `${ triggerId }_content` } : {}) }\n { ...(triggerStyle === 'icon' ? { 'aria-label': typeof label === 'string' ? label : undefined } : {}) }\n >\n { triggerStyle === 'icon' && (iconIsElement ? icon : <Icon icon={ icon.toString() } />) }\n { triggerStyle === 'text' && <span className=\"labelText\">{ label }</span> }\n </button>\n <div\n ref={ contentElement as React.RefObject<HTMLDivElement> }\n className={ `content ${ showPointer ? 'showPointer' : '' }` }\n { ...(triggerId ? { id: `${ triggerId }_content` } : {}) }\n >\n { children }\n </div>\n </div>\n );\n }\n\n return (\n <span\n ref={ tooltipElement as React.RefObject<HTMLSpanElement> }\n className={ `tooltip ${ isOpen ? 'isOpen' : '' } ${ triggerStyle === 'text' && 'textDisplay' } ${ customCssClass \|\| '' }` }\n >\n <button\n ref={ triggerElement }\n type=\"button\"\n onClick={ () => setIsOpen(!isOpen) }\n className={ `button ${ triggerStyle === 'text' ? 'text_only' : 'icon_only' } ${ triggerStyle === 'text' && !visualIndicators?.underline ? 'underline_off' : '' } ${ triggerStyle === 'text' && !visualIndicators?.colouredText ? 'colouredText_off' : '' }` }\n { ...(triggerId ? { id: triggerId } : {}) }\n { ...(triggerStyle === 'icon' ? { 'aria-label': typeof label === 'string' ? label : undefined } : {}) }\n >\n { triggerStyle === 'icon' && (iconIsElement ? icon : <Icon icon={ icon.toString() } />) }\n { triggerStyle === 'text' && <span className=\"labelText\">{ label }</span> }\n </button>\n <span\n aria-hidden\n role=\"presentation\"\n ref={ contentElement as React.RefObject<HTMLSpanElement> }\n className={ `content ${ showPointer ? 'showPointer' : '' }` }\n { ...(triggerId ? { id: `${ triggerId }_content` } : {}) }\n >\n { children }\n </span>\n </span>\n );\n};\n\nexport default Tooltip;\n"],"mappings":"AAAA,YAAY;;AAAC,OAAAA,QAAA;AAEb,OAAOC,KAAK,IAAIC,QAAQ,EAAEC,MAAM,EAAEC,SAAS,EAAEC,WAAW,QAAiC,OAAO;AAChG,SAASC,iBAAiB,QAAQ,6BAA6B;AAC/D,SAASC,IAAI,QAAQ,yBAAyB;AAC9C,SAASC,wBAAwB,QAAQ,oCAAoC;AAC7E,OAAO,gBAAgB;;AAEvB;;AAwBA,OAAO,MAAMC,OAA+B,GAAIC,KAAK,IAAK;EACxD,MAAM;IACJC,SAAS;IACTC,YAAY,GAAG,MAAM;IACrBC,IAAI,GAAG,MAAM;IACbC,cAAc;IACdC,qBAAqB,GAAG,KAAK;IAC7BC,QAAQ;IACRC,KAAK,GAAG,2BAA2B;IACnCC,WAAW,GAAG;IACd;EACF,CAAC,GAAGR,KAAY;;EAEhB;EACA,MAAMS,gBAAgB,GACpBP,YAAY,KAAK,MAAM,GAClBF,KAAK,CAA4ES,gBAAgB,IAAI;IAAEC,SAAS,EAAE,IAAI;IAAEC,YAAY,EAAE;EAAK,CAAC,GAC7IC,SAAS;EACf,MAAM,CAACC,MAAM,EAAEC,SAAS,CAAC,GAAGtB,QAAQ,CAAC,KAAK,CAAC;EAC3C,MAAMuB,cAAc,GAAGtB,MAAM,CAAmC,IAAI,CAAC;EACrE,MAAMuB,cAAc,GAAGvB,MAAM,CAAoB,IAAI,CAAC;EACtD,MAAMwB,cAAc,GAAGxB,MAAM,CAAmC,IAAI,CAAC;EAErE,MAAMyB,aAAa,gBAAG3B,KAAK,CAAC4B,cAAc,CAAChB,IAAI,CAAC;EAEhDP,iBAAiB,CAACmB,cAAc,EAAE,MAAMD,SAAS,CAAC,KAAK,CAAC,CAAC;EAEzDhB,wBAAwB,CAAC;IACvBsB,UAAU,EAAEJ,cAAc;IAC1BK,UAAU,EAAEN,cAAc;IAC1BO,UAAU,EAAEL,cAAc;IAC1BM,cAAc,EAAEV;EAClB,CAAC,CAAC;;EAEF;EACA,MAAMW,uBAAuB,GAAG7B,WAAW,CACxC8B,KAAoB,IAAK;IACxB,IAAIA,KAAK,CAACC,GAAG,KAAK,QAAQ,IAAID,KAAK,CAACE,OAAO,KAAK,EAAE,EAAE;MAClDb,SAAS,CAAC,KAAK,CAAC;IAClB;EACF,CAAC,EACD,CAACA,SAAS,CACZ,CAAC;EAEDpB,SAAS,CAAC,MAAM;IACd,IAAIqB,cAAc,CAACa,OAAO,EAAE;MAC1Bb,cAAc,CAACa,OAAO,CAACC,gBAAgB,CAAC,SAAS,EAAEL,uBAAwC,CAAC;IAC9F;EACF,CAAC,EAAE,CAACA,uBAAuB,CAAC,CAAC;EAE7B,IAAInB,qBAAqB,EAAE;IACzB,oBACEd,KAAA,CAAAuC,aAAA;MACEC,IAAI,EAAC,SAAS;MACdC,GAAG,EAAGjB,cAAmD;MACzDkB,SAAS,EAAG,yBAA0BpB,MAAM,GAAG,QAAQ,GAAG,EAAE,IAAMX,YAAY,KAAK,MAAM,IAAI,aAAa,IAAME,cAAc,IAAI,EAAE;IAAK,gBAEzIb,KAAA,CAAAuC,aAAA,WAAAxC,QAAA;MACE0C,GAAG,EAAGhB,cAAgB;MACtBkB,IAAI,EAAC,QAAQ;MACbC,OAAO,EAAGA,CAAA,KAAMrB,SAAS,CAAC,CAACD,MAAM,CAAG;MACpCoB,SAAS,EAAG,UAAW/B,YAAY,KAAK,MAAM,GAAG,WAAW,GAAG,WAAW,IAAMA,YAAY,KAAK,MAAM,IAAI,CAACO,gBAAgB,EAAEC,SAAS,GAAG,eAAe,GAAG,EAAE,IAAMR,YAAY,KAAK,MAAM,IAAI,CAACO,gBAAgB,EAAEE,YAAY,GAAG,kBAAkB,GAAG,EAAE;IAAK,GACvPV,SAAS,GAAG;MAAE,IAAI,EAAEA,SAAS;MAAE,kBAAkB,EAAE,GAAIA,SAAS;IAAY,CAAC,GAAG,CAAC,CAAC,EAClFC,YAAY,KAAK,MAAM,GAAG;MAAE,YAAY,EAAE,OAAOK,KAAK,KAAK,QAAQ,GAAGA,KAAK,GAAGK;IAAU,CAAC,GAAG,CAAC,CAAC,GAElGV,YAAY,KAAK,MAAM,KAAKgB,aAAa,GAAGf,IAAI,gBAAGZ,KAAA,CAAAuC,aAAA,CAACjC,IAAI;MAACM,IAAI,EAAGA,IAAI,CAACiC,QAAQ,CAAC;IAAG,CAAE,CAAC,CAAC,EACrFlC,YAAY,KAAK,MAAM,iBAAIX,KAAA,CAAAuC,aAAA;MAAMG,SAAS,EAAC;IAAW,GAAG1B,KAAa,CAClE,CAAC,eACThB,KAAA,CAAAuC,aAAA,QAAAxC,QAAA;MACE0C,GAAG,EAAGf,cAAmD;MACzDgB,SAAS,EAAG,WAAYzB,WAAW,GAAG,aAAa,GAAG,EAAE;IAAK,GACvDP,SAAS,GAAG;MAAEoC,EAAE,EAAE,GAAIpC,SAAS;IAAY,CAAC,GAAG,CAAC,CAAC,GAErDK,QACC,CACF,CAAC;EAEV;EAEA,oBACEf,KAAA,CAAAuC,aAAA;IACEE,GAAG,EAAGjB,cAAoD;IAC1DkB,SAAS,EAAG,WAAYpB,MAAM,GAAG,QAAQ,GAAG,EAAE,IAAMX,YAAY,KAAK,MAAM,IAAI,aAAa,IAAME,cAAc,IAAI,EAAE;EAAK,gBAE3Hb,KAAA,CAAAuC,aAAA,WAAAxC,QAAA;IACE0C,GAAG,EAAGhB,cAAgB;IACtBkB,IAAI,EAAC,QAAQ;IACbC,OAAO,EAAGA,CAAA,KAAMrB,SAAS,CAAC,CAACD,MAAM,CAAG;IACpCoB,SAAS,EAAG,UAAW/B,YAAY,KAAK,MAAM,GAAG,WAAW,GAAG,WAAW,IAAMA,YAAY,KAAK,MAAM,IAAI,CAACO,gBAAgB,EAAEC,SAAS,GAAG,eAAe,GAAG,EAAE,IAAMR,YAAY,KAAK,MAAM,IAAI,CAACO,gBAAgB,EAAEE,YAAY,GAAG,kBAAkB,GAAG,EAAE;EAAK,GACvPV,SAAS,GAAG;IAAEoC,EAAE,EAAEpC;EAAU,CAAC,GAAG,CAAC,CAAC,EAClCC,YAAY,KAAK,MAAM,GAAG;IAAE,YAAY,EAAE,OAAOK,KAAK,KAAK,QAAQ,GAAGA,KAAK,GAAGK;EAAU,CAAC,GAAG,CAAC,CAAC,GAElGV,YAAY,KAAK,MAAM,KAAKgB,aAAa,GAAGf,IAAI,gBAAGZ,KAAA,CAAAuC,aAAA,CAACjC,IAAI;IAACM,IAAI,EAAGA,IAAI,CAACiC,QAAQ,CAAC;EAAG,CAAE,CAAC,CAAC,EACrFlC,YAAY,KAAK,MAAM,iBAAIX,KAAA,CAAAuC,aAAA;IAAMG,SAAS,EAAC;EAAW,GAAG1B,KAAa,CAClE,CAAC,eACThB,KAAA,CAAAuC,aAAA,SAAAxC,QAAA;IACE,mBAAW;IACXyC,IAAI,EAAC,cAAc;IACnBC,GAAG,EAAGf,cAAoD;IAC1DgB,SAAS,EAAG,WAAYzB,WAAW,GAAG,aAAa,GAAG,EAAE;EAAK,GACvDP,SAAS,GAAG;IAAEoC,EAAE,EAAE,GAAIpC,SAAS;EAAY,CAAC,GAAG,CAAC,CAAC,GAErDK,QACE,CACF,CAAC;AAEX,CAAC;AAED,eAAeP,OAAO","ignoreList":[]}
1	+ {"version":3,"file":"Tooltip.js","names":["_extends","React","useState","useRef","useEffect","useCallback","useOnClickOutside","Icon","useOnEdgeProximityDetect","Tooltip","props","triggerId","triggerStyle","icon","customCssClass","containsBlockElements","children","label","showPointer","hoverDelay","visualIndicators","underline","colouredText","undefined","isOpen","setIsOpen","isHovered","setIsHovered","tooltipElement","triggerElement","contentElement","hoverTimer","iconIsElement","isValidElement","hasHoverDelay","isVisible","clearHoverTimer","current","clearTimeout","handleMouseEnter","setTimeout","handleMouseLeave","dismiss","handleTriggerClick","hoverHandlers","onMouseEnter","onMouseLeave","triggerRef","wrapperRef","contentRef","requiresRecalc","handleSpecialKeyPresses","event","key","keyCode","wrapper","addEventListener","removeEventListener","createElement","role","ref","className","type","onClick","toString","id"],"sources":["../../../../../src/components/design/tooltip/Tooltip.tsx"],"sourcesContent":["'use client';\n\nimport React, { useState, useRef, useEffect, useCallback, ReactNode, ReactElement } from 'react';\nimport { useOnClickOutside } from '../../../hooks/ClickOutside';\nimport { Icon } from '../icons/basicIcon/Icon';\nimport { useOnEdgeProximityDetect } from '../../../hooks/EdgeProximityDetect';\nimport './tooltip.scss';\n\n// Define the props for Tooltip\nexport type TooltipProps =\n {\n triggerId?: string;\n icon?: ReactElement \| string;\n customCssClass?: string;\n children: ReactNode;\n containsBlockElements?: boolean;\n triggerStyle?: 'icon';\n label?: string \| ReactNode;\n showPointer?: boolean;\n hoverDelay?: number;\n }\n \| {\n triggerId?: string;\n icon?: ReactElement \| string;\n customCssClass?: string;\n children: ReactNode;\n containsBlockElements?: boolean;\n triggerStyle: 'text';\n label?: string \| ReactNode;\n showPointer?: boolean;\n hoverDelay?: number;\n visualIndicators?: { underline?: boolean; colouredText?: boolean };\n };\n\nexport const Tooltip: React.FC<TooltipProps> = (props) => {\n const {\n triggerId,\n triggerStyle = 'icon',\n icon = 'info',\n customCssClass,\n containsBlockElements = false,\n children,\n label = 'Toggle tooltip open state',\n showPointer = true,\n hoverDelay,\n // visualIndicators will be handled below\n } = props as any;\n\n // Only use visualIndicators if triggerStyle is 'text'\n const visualIndicators =\n triggerStyle === 'text'\n ? (props as { visualIndicators?: { underline?: boolean; colouredText?: boolean } }).visualIndicators ?? { underline: true, colouredText: true }\n : undefined;\n const [isOpen, setIsOpen] = useState(false);\n const [isHovered, setIsHovered] = useState(false);\n const tooltipElement = useRef<HTMLDivElement \| HTMLSpanElement>(null);\n const triggerElement = useRef<HTMLButtonElement>(null);\n const contentElement = useRef<HTMLDivElement \| HTMLSpanElement>(null);\n const hoverTimer = useRef<ReturnType<typeof setTimeout> \| null>(null);\n\n const iconIsElement = React.isValidElement(icon);\n\n // Hover is handled in css by default. It is only taken over by js when a delay is requested.\n const hasHoverDelay = typeof hoverDelay === 'number' && hoverDelay > 0;\n const isVisible = isOpen \|\| isHovered;\n\n const clearHoverTimer = useCallback(() => {\n if (hoverTimer.current) {\n clearTimeout(hoverTimer.current);\n hoverTimer.current = null;\n }\n }, []);\n\n const handleMouseEnter = useCallback(() => {\n clearHoverTimer();\n hoverTimer.current = setTimeout(() => setIsHovered(true), hoverDelay);\n }, [clearHoverTimer, hoverDelay]);\n\n const handleMouseLeave = useCallback(() => {\n clearHoverTimer();\n setIsHovered(false);\n }, [clearHoverTimer]);\n\n // Single dismissal path, so every close route clears both the click and hover state\n const dismiss = useCallback(() => {\n clearHoverTimer();\n setIsHovered(false);\n setIsOpen(false);\n }, [clearHoverTimer]);\n\n const handleTriggerClick = useCallback(() => {\n if (isVisible) {\n dismiss();\n return;\n }\n clearHoverTimer();\n setIsOpen(true);\n }, [isVisible, dismiss, clearHoverTimer]);\n\n // Releasing the delay detaches the mouse handlers, so reset any hover state they left behind\n useEffect(() => {\n if (!hasHoverDelay) {\n clearHoverTimer();\n setIsHovered(false);\n }\n }, [hasHoverDelay, clearHoverTimer]);\n\n useEffect(() => clearHoverTimer, [clearHoverTimer]);\n\n const hoverHandlers = hasHoverDelay\n ? { onMouseEnter: handleMouseEnter, onMouseLeave: handleMouseLeave }\n : {};\n\n useOnClickOutside(tooltipElement, dismiss);\n\n useOnEdgeProximityDetect({\n triggerRef: triggerElement,\n wrapperRef: tooltipElement,\n contentRef: contentElement,\n requiresRecalc: isVisible,\n });\n\n // Handle special key presses\n const handleSpecialKeyPresses = useCallback(\n (event: KeyboardEvent) => {\n if (event.key === 'Escape' \|\| event.keyCode === 27) {\n dismiss();\n }\n },\n [dismiss],\n );\n\n useEffect(() => {\n const wrapper = tooltipElement.current;\n if (!wrapper) {\n return undefined;\n }\n wrapper.addEventListener('keydown', handleSpecialKeyPresses as EventListener);\n return () => wrapper.removeEventListener('keydown', handleSpecialKeyPresses as EventListener);\n }, [handleSpecialKeyPresses]);\n\n if (containsBlockElements) {\n return (\n <div\n role=\"tooltip\"\n ref={ tooltipElement as React.RefObject<HTMLDivElement> }\n className={ `tooltip tooltip_block ${ isVisible ? 'isOpen' : '' } ${ hasHoverDelay ? 'hoverDelayed' : '' } ${ triggerStyle === 'text' ? 'textDisplay' : '' } ${ customCssClass \|\| '' }` }\n { ...hoverHandlers }\n >\n <button\n ref={ triggerElement }\n type=\"button\"\n onClick={ handleTriggerClick }\n className={ `button ${ triggerStyle === 'text' ? 'text_only' : 'icon_only' } ${ triggerStyle === 'text' && !visualIndicators?.underline ? 'underline_off' : '' } ${ triggerStyle === 'text' && !visualIndicators?.colouredText ? 'colouredText_off' : '' }` }\n { ...(triggerId ? { 'id': triggerId, 'aria-describedby': `${ triggerId }_content` } : {}) }\n { ...(triggerStyle === 'icon' ? { 'aria-label': typeof label === 'string' ? label : undefined } : {}) }\n >\n { triggerStyle === 'icon' && (iconIsElement ? icon : <Icon icon={ icon.toString() } />) }\n { triggerStyle === 'text' && <span className=\"labelText\">{ label }</span> }\n </button>\n <div\n ref={ contentElement as React.RefObject<HTMLDivElement> }\n className={ `content ${ showPointer ? 'showPointer' : '' }` }\n { ...(triggerId ? { id: `${ triggerId }_content` } : {}) }\n >\n { children }\n </div>\n </div>\n );\n }\n\n return (\n <span\n ref={ tooltipElement as React.RefObject<HTMLSpanElement> }\n className={ `tooltip ${ isVisible ? 'isOpen' : '' } ${ hasHoverDelay ? 'hoverDelayed' : '' } ${ triggerStyle === 'text' ? 'textDisplay' : '' } ${ customCssClass \|\| '' }` }\n { ...hoverHandlers }\n >\n <button\n ref={ triggerElement }\n type=\"button\"\n onClick={ handleTriggerClick }\n className={ `button ${ triggerStyle === 'text' ? 'text_only' : 'icon_only' } ${ triggerStyle === 'text' && !visualIndicators?.underline ? 'underline_off' : '' } ${ triggerStyle === 'text' && !visualIndicators?.colouredText ? 'colouredText_off' : '' }` }\n { ...(triggerId ? { id: triggerId } : {}) }\n { ...(triggerStyle === 'icon' ? { 'aria-label': typeof label === 'string' ? label : undefined } : {}) }\n >\n { triggerStyle === 'icon' && (iconIsElement ? icon : <Icon icon={ icon.toString() } />) }\n { triggerStyle === 'text' && <span className=\"labelText\">{ label }</span> }\n </button>\n <span\n aria-hidden\n role=\"presentation\"\n ref={ contentElement as React.RefObject<HTMLSpanElement> }\n className={ `content ${ showPointer ? 'showPointer' : '' }` }\n { ...(triggerId ? { id: `${ triggerId }_content` } : {}) }\n >\n { children }\n </span>\n </span>\n );\n};\n\nexport default Tooltip;\n"],"mappings":"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","ignoreList":[]}

package/dist/esm/components/design/tooltip/tooltip.css CHANGED Viewed

@@ -93,7 +93,7 @@
 .tooltip.large .content:before {
   left: 160px;
 }
-.tooltip:hover .content, .tooltip.isOpen .content {
+.tooltip:not(.hoverDelayed):hover .content, .tooltip.isOpen .content {
   display: block;
 }
 .tooltip.measuring .content {

package/dist/esm/hooks/EdgeProximityDetect.js CHANGED Viewed

@@ -1,10 +1,13 @@
-import { useEffect } from 'react';
+import { useEffect, useRef } from 'react';
 export const useOnEdgeProximityDetect = ({
   triggerRef,
   wrapperRef,
   contentRef,
   requiresRecalc
 }) => {
+  // Only the shift classes this hook applied, so a consumer supplied
+  // customCssClass such as "shiftDown" is never stripped
+  const appliedShiftClasses = useRef([]);
   const xAxisOverride = ({
     left,
     width,
@@ -39,6 +42,10 @@ export const useOnEdgeProximityDetect = ({
   };
   useEffect(() => {
     if (wrapperRef.current && contentRef.current && triggerRef.current && document && document.body) {
+      // Clear the previous run's shift, otherwise the content is measured in its
+      // already-shifted position and can accumulate opposing shift classes
+      appliedShiftClasses.current.forEach(cssClass => wrapperRef.current?.classList.remove(cssClass));
+      appliedShiftClasses.current = [];
       wrapperRef.current.classList.add('measuring');
       const {
         clientWidth,
@@ -52,22 +59,23 @@ export const useOnEdgeProximityDetect = ({
       } = contentRef.current.getBoundingClientRect();
       // Check if it needs x-axis or y-axis adjustment
-      const xAxisOverrideCssClass = xAxisOverride({
+      const applyShift = cssClass => {
+        if (!cssClass || !wrapperRef.current || wrapperRef.current.classList.contains(cssClass)) {
+          return;
+        }
+        wrapperRef.current.classList.add(cssClass);
+        appliedShiftClasses.current.push(cssClass);
+      };
+      applyShift(xAxisOverride({
         left,
         width,
         clientWidth
-      });
-      if (xAxisOverrideCssClass) {
-        wrapperRef.current.classList.add(xAxisOverrideCssClass);
-      }
-      const yAxisOverrideCssClass = yAxisOverride({
+      }));
+      applyShift(yAxisOverride({
         top,
         height,
         clientHeight
-      });
-      if (yAxisOverrideCssClass) {
-        wrapperRef.current.classList.add(yAxisOverrideCssClass);
-      }
+      }));
       wrapperRef.current.classList.remove('measuring');
     }
   }, [triggerRef, wrapperRef, contentRef, requiresRecalc]);

package/dist/esm/hooks/EdgeProximityDetect.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"EdgeProximityDetect.js","names":["useEffect","useOnEdgeProximityDetect","triggerRef","wrapperRef","contentRef","requiresRecalc","xAxisOverride","left","width","clientWidth","yAxisOverride","top","height","clientHeight","current","document","body","classList","add","getBoundingClientRect","~~xAxisOverrideCssClass~~","~~yAxisOverrideCssClass~~","~~remove~~"],"sources":["../../../src/hooks/EdgeProximityDetect.ts"],"sourcesContent":["import React, { useEffect } from 'react';\n\ninterface UseOnEdgeProximityDetectProps {\n triggerRef: React.RefObject<HTMLElement>;\n wrapperRef: React.RefObject<HTMLElement>;\n contentRef: React.RefObject<HTMLElement>;\n requiresRecalc: boolean;\n preferredPlacement?: 'right-middle' \| 'right-top' \| 'right-bottom' \| 'left-middle' \| 'left-top' \| 'left-bottom' \| 'top-middle' \| 'top-top' \| 'top-bottom' \| 'bottom-middle' \| 'bottom-top' \| 'bottom-bottom';\n}\n\nexport const useOnEdgeProximityDetect = (\n {\n triggerRef,\n wrapperRef,\n contentRef,\n requiresRecalc\n }\n :\n UseOnEdgeProximityDetectProps\n) => {\n const xAxisOverride = (\n {\n left,\n width,\n clientWidth\n }\n :\n {\n left: number;\n width: number;\n clientWidth: number\n }\n ) => {\n // Too close to left\n if (left < 0) {\n return 'shiftRight';\n }\n\n // Too close to right\n if (left + width > clientWidth) {\n return 'shiftLeft';\n }\n return '';\n };\n\n const yAxisOverride = (\n {\n top,\n height,\n clientHeight\n }\n :\n {\n top: number;\n height: number;\n clientHeight: number\n }\n ) => {\n // Too close to top\n if (top - height < 0) {\n return 'shiftDown';\n }\n\n // Too close to bottom\n if (top + height > clientHeight) {\n return 'shiftUp';\n }\n return '';\n };\n\n useEffect(() => {\n if (\n wrapperRef.current\n && contentRef.current\n && triggerRef.current\n && document\n && document.body\n ) {\n wrapperRef.current.classList.add('measuring');\n const { clientWidth, clientHeight } = document.body;\n const {\n width, height, top, left\n } = contentRef.current.getBoundingClientRect();\n\n // Check if it needs x-axis or y-axis adjustment\n const ~~xAxisOverrideCssClass~~ = ~~xAxisOverride~~({ ~~left,~~ ~~width,~~ ~~clientWidth });\~~n if (~~xAxisOverrideCssClass~~) {\n wrapperRef.current.classList.add(~~xAxisOverrideCssClass~~);\n }\n\n ~~const~~ ~~yAxisOverrideCssClass~~ = yAxisOverride({ top, height, clientHeight })~~;\n if (yAxisOverrideCssClass~~) ~~{\n wrapperRef.current.classList.add(yAxisOverrideCssClass)~~;\n }\n\n wrapperRef.current.classList.remove('measuring');\n }\n }, [triggerRef, wrapperRef, contentRef, requiresRecalc]);\n\n return {};\n};\n"],"mappings":"AAAA,SAAgBA,SAAS,QAAQ,OAAO;~~AAUxC~~,OAAO,MAAMC,wBAAwB,GAAGA,CACtC;EACEC,UAAU;EACVC,UAAU;EACVC,UAAU;EACVC;AAG0B,CAAC,KAC1B;EACH,MAAMC,aAAa,GAAGA,CACpB;IACEC,IAAI;IACJC,KAAK;IACLC;EAOF,CAAC,KACE;IACH;IACA,IAAIF,IAAI,GAAG,CAAC,EAAE;MACZ,OAAO,YAAY;IACrB;;IAEA;IACA,IAAIA,IAAI,GAAGC,KAAK,GAAGC,WAAW,EAAE;MAC9B,OAAO,WAAW;IACpB;IACA,OAAO,EAAE;EACX,CAAC;EAED,MAAMC,aAAa,GAAGA,CACpB;IACEC,GAAG;IACHC,MAAM;IACNC;EAOF,CAAC,KACE;IACH;IACA,IAAIF,GAAG,GAAGC,MAAM,GAAG,CAAC,EAAE;MACpB,OAAO,WAAW;IACpB;;IAEA;IACA,IAAID,GAAG,GAAGC,MAAM,GAAGC,YAAY,EAAE;MAC/B,OAAO,SAAS;IAClB;IACA,OAAO,EAAE;EACX,CAAC;~~EAEDb~~,SAAS,CAAC,MAAM;IACd,~~IACEG~~,UAAU,~~CAACW~~,OAAO,~~IACfV~~,UAAU,~~CAACU~~,OAAO,~~IAClBZ~~,UAAU,~~CAACY~~,OAAO,IAClBC,QAAQ,IACRA,QAAQ,CAACC,IAAI,EAChB;~~MACAb~~,~~UAAU~~,~~CAACW~~,OAAO,CAACG,SAAS,CAACC,GAAG,CAAC,WAAW,CAAC;MAC7C,MAAM;~~QAAET~~,WAAW;QAAEI;MAAa,CAAC,GAAGE,QAAQ,CAACC,IAAI;MACnD,MAAM;QACJR,KAAK;QAAEI,MAAM;QAAED,GAAG;QAAEJ;MACtB,CAAC,~~GAAGH~~,UAAU,~~CAACU~~,OAAO,~~CAACK~~,qBAAqB,CAAC,CAAC;;MAE9C;MACA,MAAMC,~~qBAAqB~~,~~GAAGd~~,~~aAAa~~,~~CAAC~~;~~QAAEC~~,IAAI~~;QAAEC~~,~~KAAK;QAAEC;MAAY~~,~~CAAC~~,~~CAAC;MACzE~~,~~IAAIW~~,~~qBAAqB~~,EAAE;~~QACzBjB~~,UAAU,~~CAACW~~,OAAO,~~CAACG~~,SAAS,~~CAACC~~,GAAG,~~CAACE~~,~~qBAAqB~~,CAAC;~~MACzD~~;~~MAEA~~,~~MAAMC~~,~~qBAAqB~~,~~GAAGX~~,aAAa,CAAC;QAAEC,~~GAAG~~;QAAEC,~~MAAM~~;QAAEC;~~MAAa~~,CAAC,CAAC~~;MAC1E~~,~~IAAIQ,qBAAqB,EAAE~~;~~QACzBlB~~,UAAU,~~CAACW~~,~~OAAO~~,~~CAACG~~,~~SAAS,CAACC,~~GAAG,~~CAACG~~,~~qBAAqB~~,CAAC;~~MACzD;MAEAlB~~,UAAU,~~CAACW~~,OAAO,~~CAACG~~,SAAS,~~CAACK~~,MAAM,CAAC,WAAW,CAAC;IAClD;EACF,CAAC,EAAE,~~CAACpB~~,UAAU,EAAEC,UAAU,EAAEC,UAAU,EAAEC,cAAc,CAAC,CAAC;EAExD,OAAO,CAAC,CAAC;AACX,CAAC","ignoreList":[]}
1	+ {"version":3,"file":"EdgeProximityDetect.js","names":["useEffect","useRef","useOnEdgeProximityDetect","triggerRef","wrapperRef","contentRef","requiresRecalc","appliedShiftClasses","xAxisOverride","left","width","clientWidth","yAxisOverride","top","height","clientHeight","current","document","body","forEach","cssClass","classList","remove","add","getBoundingClientRect","applyShift","contains","push"],"sources":["../../../src/hooks/EdgeProximityDetect.ts"],"sourcesContent":["import React, { useEffect, useRef } from 'react';\n\ninterface UseOnEdgeProximityDetectProps {\n triggerRef: React.RefObject<HTMLElement>;\n wrapperRef: React.RefObject<HTMLElement>;\n contentRef: React.RefObject<HTMLElement>;\n requiresRecalc: boolean;\n preferredPlacement?: 'right-middle' \| 'right-top' \| 'right-bottom' \| 'left-middle' \| 'left-top' \| 'left-bottom' \| 'top-middle' \| 'top-top' \| 'top-bottom' \| 'bottom-middle' \| 'bottom-top' \| 'bottom-bottom';\n}\n\nexport const useOnEdgeProximityDetect = (\n {\n triggerRef,\n wrapperRef,\n contentRef,\n requiresRecalc\n }\n :\n UseOnEdgeProximityDetectProps\n) => {\n // Only the shift classes this hook applied, so a consumer supplied\n // customCssClass such as \"shiftDown\" is never stripped\n const appliedShiftClasses = useRef<string[]>([]);\n\n const xAxisOverride = (\n {\n left,\n width,\n clientWidth\n }\n :\n {\n left: number;\n width: number;\n clientWidth: number\n }\n ) => {\n // Too close to left\n if (left < 0) {\n return 'shiftRight';\n }\n\n // Too close to right\n if (left + width > clientWidth) {\n return 'shiftLeft';\n }\n return '';\n };\n\n const yAxisOverride = (\n {\n top,\n height,\n clientHeight\n }\n :\n {\n top: number;\n height: number;\n clientHeight: number\n }\n ) => {\n // Too close to top\n if (top - height < 0) {\n return 'shiftDown';\n }\n\n // Too close to bottom\n if (top + height > clientHeight) {\n return 'shiftUp';\n }\n return '';\n };\n\n useEffect(() => {\n if (\n wrapperRef.current\n && contentRef.current\n && triggerRef.current\n && document\n && document.body\n ) {\n // Clear the previous run's shift, otherwise the content is measured in its\n // already-shifted position and can accumulate opposing shift classes\n appliedShiftClasses.current.forEach((cssClass) => wrapperRef.current?.classList.remove(cssClass));\n appliedShiftClasses.current = [];\n\n wrapperRef.current.classList.add('measuring');\n const { clientWidth, clientHeight } = document.body;\n const {\n width, height, top, left\n } = contentRef.current.getBoundingClientRect();\n\n // Check if it needs x-axis or y-axis adjustment\n const applyShift = (cssClass: string) => {\n if (!cssClass \|\| !wrapperRef.current \|\| wrapperRef.current.classList.contains(cssClass)) {\n return;\n }\n wrapperRef.current.classList.add(cssClass);\n appliedShiftClasses.current.push(cssClass);\n };\n\n applyShift(xAxisOverride({ left, width, clientWidth }));\n applyShift(yAxisOverride({ top, height, clientHeight }));\n\n wrapperRef.current.classList.remove('measuring');\n }\n }, [triggerRef, wrapperRef, contentRef, requiresRecalc]);\n\n return {};\n};\n"],"mappings":"AAAA,SAAgBA,SAAS,EAAEC,MAAM,QAAQ,OAAO;AAUhD,OAAO,MAAMC,wBAAwB,GAAGA,CACtC;EACEC,UAAU;EACVC,UAAU;EACVC,UAAU;EACVC;AAG0B,CAAC,KAC1B;EACH;EACA;EACA,MAAMC,mBAAmB,GAAGN,MAAM,CAAW,EAAE,CAAC;EAEhD,MAAMO,aAAa,GAAGA,CACpB;IACEC,IAAI;IACJC,KAAK;IACLC;EAOF,CAAC,KACE;IACH;IACA,IAAIF,IAAI,GAAG,CAAC,EAAE;MACZ,OAAO,YAAY;IACrB;;IAEA;IACA,IAAIA,IAAI,GAAGC,KAAK,GAAGC,WAAW,EAAE;MAC9B,OAAO,WAAW;IACpB;IACA,OAAO,EAAE;EACX,CAAC;EAED,MAAMC,aAAa,GAAGA,CACpB;IACEC,GAAG;IACHC,MAAM;IACNC;EAOF,CAAC,KACE;IACH;IACA,IAAIF,GAAG,GAAGC,MAAM,GAAG,CAAC,EAAE;MACpB,OAAO,WAAW;IACpB;;IAEA;IACA,IAAID,GAAG,GAAGC,MAAM,GAAGC,YAAY,EAAE;MAC/B,OAAO,SAAS;IAClB;IACA,OAAO,EAAE;EACX,CAAC;EAEDf,SAAS,CAAC,MAAM;IACd,IACEI,UAAU,CAACY,OAAO,IACfX,UAAU,CAACW,OAAO,IAClBb,UAAU,CAACa,OAAO,IAClBC,QAAQ,IACRA,QAAQ,CAACC,IAAI,EAChB;MACA;MACA;MACAX,mBAAmB,CAACS,OAAO,CAACG,OAAO,CAAEC,QAAQ,IAAKhB,UAAU,CAACY,OAAO,EAAEK,SAAS,CAACC,MAAM,CAACF,QAAQ,CAAC,CAAC;MACjGb,mBAAmB,CAACS,OAAO,GAAG,EAAE;MAEhCZ,UAAU,CAACY,OAAO,CAACK,SAAS,CAACE,GAAG,CAAC,WAAW,CAAC;MAC7C,MAAM;QAAEZ,WAAW;QAAEI;MAAa,CAAC,GAAGE,QAAQ,CAACC,IAAI;MACnD,MAAM;QACJR,KAAK;QAAEI,MAAM;QAAED,GAAG;QAAEJ;MACtB,CAAC,GAAGJ,UAAU,CAACW,OAAO,CAACQ,qBAAqB,CAAC,CAAC;;MAE9C;MACA,MAAMC,UAAU,GAAIL,QAAgB,IAAK;QACvC,IAAI,CAACA,QAAQ,IAAI,CAAChB,UAAU,CAACY,OAAO,IAAIZ,UAAU,CAACY,OAAO,CAACK,SAAS,CAACK,QAAQ,CAACN,QAAQ,CAAC,EAAE;UACvF;QACF;QACAhB,UAAU,CAACY,OAAO,CAACK,SAAS,CAACE,GAAG,CAACH,QAAQ,CAAC;QAC1Cb,mBAAmB,CAACS,OAAO,CAACW,IAAI,CAACP,QAAQ,CAAC;MAC5C,CAAC;MAEDK,UAAU,CAACjB,aAAa,CAAC;QAAEC,IAAI;QAAEC,KAAK;QAAEC;MAAY,CAAC,CAAC,CAAC;MACvDc,UAAU,CAACb,aAAa,CAAC;QAAEC,GAAG;QAAEC,MAAM;QAAEC;MAAa,CAAC,CAAC,CAAC;MAExDX,UAAU,CAACY,OAAO,CAACK,SAAS,CAACC,MAAM,CAAC,WAAW,CAAC;IAClD;EACF,CAAC,EAAE,CAACnB,UAAU,EAAEC,UAAU,EAAEC,UAAU,EAAEC,cAAc,CAAC,CAAC;EAExD,OAAO,CAAC,CAAC;AACX,CAAC","ignoreList":[]}

package/dist/esm/package.json CHANGED Viewed

@@ -137,7 +137,7 @@
   "files": [
     "dist"
   ],
-  "version": "3.15.0",
+  "version": "3.16.0",
   "devEngines": {
     "runtime": {
       "name": "node",

package/dist/esm/styles/index.css CHANGED Viewed

@@ -254,9 +254,11 @@
   --notificationIconFg: #fff;
   --notificationIconBorder: 4px solid #c00;
   --notificationIconBoxShadow: none;
-  --skeletonBg: #eef2f4;
+  --skeletonBg: #e5ebef;
   --skeletonOpaqueBg: #d3dee4;
-  --skeletonHighlight: #f6f8fa;
+  --skeletonHighlight: #ffffff;
+  --skeletonPulseBg: #ffffff;
+  --skeletonOpaquePulseBg: #f6f8fa;
   --skeletonBorderRadius: 3px;
   --skeletonRoundedBorderRadius: 8px;
   --skeletonLineHeight: 1em;
@@ -264,7 +266,7 @@
   --skeletonBlockHeight: 120px;
   --skeletonCircleSize: 40px;
   --skeletonLastLineWidth: 60%;
-  --skeletonAnimationDuration: 1.6s;
+  --skeletonAnimationDuration: 2s;
 }
 :root {
@@ -611,6 +613,8 @@
   --skeletonBg: #1a1410;
   --skeletonHighlight: #3d2f26;
   --skeletonOpaqueBg: #2c211b;
+  --skeletonOpaquePulseBg: #4d3b30;
+  --skeletonPulseBg: #3d2f26;
   --statusAlertColor: #000;
   --statusDefCon3Bg: radial-gradient(circle at 60% 40%, #003, #000, #333); /* gradient stops inverted */
   --statusDefCon3Color: #003;

package/dist/esm/styles/variables/cssVars/_darkModeVariables.css CHANGED Viewed

@@ -236,6 +236,8 @@
   --skeletonBg: #1a1410;
   --skeletonHighlight: #3d2f26;
   --skeletonOpaqueBg: #2c211b;
+  --skeletonOpaquePulseBg: #4d3b30;
+  --skeletonPulseBg: #3d2f26;
   --statusAlertColor: #000;
   --statusDefCon3Bg: radial-gradient(circle at 60% 40%, #003, #000, #333); /* gradient stops inverted */
   --statusDefCon3Color: #003;

package/dist/esm/styles/variables/cssVars/_designVariables.css CHANGED Viewed

@@ -216,9 +216,11 @@
   --notificationIconFg: #fff;
   --notificationIconBorder: 4px solid #c00;
   --notificationIconBoxShadow: none;
-  --skeletonBg: #eef2f4;
+  --skeletonBg: #e5ebef;
   --skeletonOpaqueBg: #d3dee4;
-  --skeletonHighlight: #f6f8fa;
+  --skeletonHighlight: #ffffff;
+  --skeletonPulseBg: #ffffff;
+  --skeletonOpaquePulseBg: #f6f8fa;
   --skeletonBorderRadius: 3px;
   --skeletonRoundedBorderRadius: 8px;
   --skeletonLineHeight: 1em;
@@ -226,5 +228,5 @@
   --skeletonBlockHeight: 120px;
   --skeletonCircleSize: 40px;
   --skeletonLastLineWidth: 60%;
-  --skeletonAnimationDuration: 1.6s;
+  --skeletonAnimationDuration: 2s;
 }

package/dist/hooks/EdgeProximityDetect.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"EdgeProximityDetect.d.ts","sourceRoot":"","sources":["../../src/hooks/EdgeProximityDetect.ts"],"names":[],"mappings":"AAAA,OAAO,~~KAAoB~~,MAAM,OAAO,CAAC;~~AAEzC~~,UAAU,6BAA6B;IACrC,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IACzC,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IACzC,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IACzC,cAAc,EAAE,OAAO,CAAC;IACxB,kBAAkB,CAAC,EAAE,cAAc,GAAG,WAAW,GAAG,cAAc,GAAG,aAAa,GAAG,UAAU,GAAG,aAAa,GAAG,YAAY,GAAG,SAAS,GAAG,YAAY,GAAG,eAAe,GAAG,YAAY,GAAG,eAAe,CAAC;CAC9M;AAED,eAAO,MAAM,wBAAwB,2DAQnC,6BAA6B,~~OAkF9B~~,CAAC"}
1	+ {"version":3,"file":"EdgeProximityDetect.d.ts","sourceRoot":"","sources":["../../src/hooks/EdgeProximityDetect.ts"],"names":[],"mappings":"AAAA,OAAO,KAA4B,MAAM,OAAO,CAAC;AAEjD,UAAU,6BAA6B;IACrC,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IACzC,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IACzC,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IACzC,cAAc,EAAE,OAAO,CAAC;IACxB,kBAAkB,CAAC,EAAE,cAAc,GAAG,WAAW,GAAG,cAAc,GAAG,aAAa,GAAG,UAAU,GAAG,aAAa,GAAG,YAAY,GAAG,SAAS,GAAG,YAAY,GAAG,eAAe,GAAG,YAAY,GAAG,eAAe,CAAC;CAC9M;AAED,eAAO,MAAM,wBAAwB,2DAQnC,6BAA6B,OA4F9B,CAAC"}

package/dist/package.json CHANGED Viewed

@@ -137,7 +137,7 @@
   "files": [
     "dist"
   ],
-  "version": "3.15.0",
+  "version": "3.16.0",
   "devEngines": {
     "runtime": {
       "name": "node",

package/package.json CHANGED Viewed

@@ -137,7 +137,7 @@
   "files": [
     "dist"
   ],
-  "version": "3.15.1",
+  "version": "3.16.1",
   "devEngines": {
     "runtime": {
       "name": "node",