oolib 3.3.0 → 3.3.1

package/dist/v2/components/Tooltip/index.d.ts

@@ -1,3 +1,3 @@
 import React from 'react';
 import { TooltipProps } from './types';
-export default function Tooltip({ text, heading, primaryContent, secondaryContent, progressiveDelay, progressiveGap, children, placement, showPointer, showDelay, hideDelay, animation, followCursor, cursorOffset, invert, wrapperDisplay, wrapperStyle, trigger, style, }: TooltipProps): React.JSX.Element;
+export default function Tooltip({ text, heading, primaryContent, secondaryContent, progressiveDelay, progressiveGap, children, placement, showPointer, showDelay, hideDelay, animation, followCursor, cursorOffset, invert, wrapperDisplay, wrapperStyle, trigger, pinOnClick, style, }: TooltipProps): React.JSX.Element;

package/dist/v2/components/Tooltip/index.js

@@ -53,15 +53,15 @@ var utils_1 = require("./utils");
 var styled_1 = require("./styled");
 var CURSOR_HEIGHT = 20;
 function Tooltip(_a) {
-    var text = _a.text, heading = _a.heading, primaryContent = _a.primaryContent, secondaryContent = _a.secondaryContent, _b = _a.progressiveDelay, progressiveDelay = _b === void 0 ? 600 : _b, _c = _a.progressiveGap, progressiveGap = _c === void 0 ? 8 : _c, children = _a.children, _d = _a.placement, placement = _d === void 0 ? 'top' : _d, _e = _a.showPointer, showPointer = _e === void 0 ? true : _e, _f = _a.showDelay, showDelay = _f === void 0 ? 600 : _f, _g = _a.hideDelay, hideDelay = _g === void 0 ? 0 : _g, _h = _a.animation, animation = _h === void 0 ? 'fade' : _h, _j = _a.followCursor, followCursor = _j === void 0 ? false : _j, _k = _a.cursorOffset, cursorOffset = _k === void 0 ? 10 : _k, _l = _a.invert, invert = _l === void 0 ? false : _l, wrapperDisplay = _a.wrapperDisplay, wrapperStyle = _a.wrapperStyle, _m = _a.trigger, trigger = _m === void 0 ? 'hover' : _m, style = _a.style;
+    var text = _a.text, heading = _a.heading, primaryContent = _a.primaryContent, secondaryContent = _a.secondaryContent, _b = _a.progressiveDelay, progressiveDelay = _b === void 0 ? 600 : _b, _c = _a.progressiveGap, progressiveGap = _c === void 0 ? 8 : _c, children = _a.children, _d = _a.placement, placement = _d === void 0 ? 'top' : _d, _e = _a.showPointer, showPointer = _e === void 0 ? true : _e, _f = _a.showDelay, showDelay = _f === void 0 ? 600 : _f, _g = _a.hideDelay, hideDelay = _g === void 0 ? 0 : _g, _h = _a.animation, animation = _h === void 0 ? 'fade' : _h, _j = _a.followCursor, followCursor = _j === void 0 ? false : _j, _k = _a.cursorOffset, cursorOffset = _k === void 0 ? 10 : _k, _l = _a.invert, invert = _l === void 0 ? false : _l, wrapperDisplay = _a.wrapperDisplay, wrapperStyle = _a.wrapperStyle, _m = _a.trigger, trigger = _m === void 0 ? 'hover' : _m, _o = _a.pinOnClick, pinOnClick = _o === void 0 ? true : _o, style = _a.style;
     var bgColor = invert ? __1.colors2.white : __1.colors2.black;
     var textColor = invert ? __1.colors2.black : __1.colors2.white;
     var resolvedPrimaryContent = (0, utils_1.resolvePrimaryContent)(text, heading, primaryContent);
-    var _o = (0, react_1.useState)(false), isOpen = _o[0], setIsOpen = _o[1];
-    var _p = (0, react_1.useState)(false), showSecondary = _p[0], setShowSecondary = _p[1];
-    var _q = (0, react_1.useState)(false), isPinned = _q[0], setIsPinned = _q[1];
-    var _r = (0, react_1.useState)({ x: 0, y: 0 }), mousePos = _r[0], setMousePos = _r[1];
-    var _s = (0, react_1.useState)({}), cursorTooltipStyle = _s[0], setCursorTooltipStyle = _s[1];
+    var _p = (0, react_1.useState)(false), isOpen = _p[0], setIsOpen = _p[1];
+    var _q = (0, react_1.useState)(false), showSecondary = _q[0], setShowSecondary = _q[1];
+    var _r = (0, react_1.useState)(false), isPinned = _r[0], setIsPinned = _r[1];
+    var _s = (0, react_1.useState)({ x: 0, y: 0 }), mousePos = _s[0], setMousePos = _s[1];
+    var _t = (0, react_1.useState)({}), cursorTooltipStyle = _t[0], setCursorTooltipStyle = _t[1];
     var progressiveTimerRef = (0, react_1.useRef)(null);
     var containerRef = (0, react_1.useRef)(null);
     var arrowRef = (0, react_1.useRef)(null);
@@ -89,7 +89,7 @@ function Tooltip(_a) {
         close: { opacity: 0 },
     } : undefined;
     var isClickTrigger = trigger === 'click';
-    var _t = (0, useFloatingPosition_1.useFloatingPosition)({
+    var _u = (0, useFloatingPosition_1.useFloatingPosition)({
         open: isOpen,
         onOpenChange: function (open) {
             if (followCursor)
@@ -129,7 +129,7 @@ function Tooltip(_a) {
             shift: { enabled: true, config: { padding: 8 } },
             flip: { enabled: true, config: followCursor ? { fallbackPlacements: ['top-start'] } : { fallbackAxisSideDirection: 'start' } },
         },
-    }), refs = _t.refs, floatingStyles = _t.floatingStyles, context = _t.context, getReferenceProps = _t.getReferenceProps, getFloatingProps = _t.getFloatingProps, isMounted = _t.isMounted, transitionStyles = _t.transitionStyles;
+    }), refs = _u.refs, floatingStyles = _u.floatingStyles, context = _u.context, getReferenceProps = _u.getReferenceProps, getFloatingProps = _u.getFloatingProps, isMounted = _u.isMounted, transitionStyles = _u.transitionStyles;
     var handleMouseMove = (0, react_1.useCallback)(function (e) {
         if (followCursor) {
             setMousePos({ x: e.clientX, y: e.clientY });
@@ -149,6 +149,8 @@ function Tooltip(_a) {
     var handleClick = function (e) {
         if (followCursor || isClickTrigger)
             return; //useClick
+        if (!pinOnClick)
+            return; // clickable child owns the click — don't swallow or pin
         e.stopPropagation();
         if (isOpen) {
             setIsPinned(false);

package/dist/v2/components/Tooltip/types.d.ts

@@ -61,6 +61,15 @@ export interface TooltipProps {
      */
     wrapperStyle?: React.CSSProperties;
     trigger?: 'hover' | 'click';
+    /**
+     * Hover-trigger only. By default, clicking the wrapped child pins the
+     * tooltip open AND stops the click from propagating — which silently
+     * swallows clicks meant for an interactive child (or an ancestor click
+     * handler, e.g. a popover trigger wrapping this tooltip). Set false when
+     * `children` is clickable: the click passes through untouched and the
+     * tooltip never pins.
+     */
+    pinOnClick?: boolean;
     style?: React.CSSProperties;
 }
 export interface GetBorderRadiusOptions {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "oolib",
-  "version": "3.3.0",
+  "version": "3.3.1",
   "description": " OKE Component Library",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",