@via-profit/ui-kit 0.11.0 → 0.12.0

package/CHANGELOG.md

@@ -4,6 +4,17 @@
 
 ## Не выпущено
 
+## 0.12.0 — 2026-11-05
+
+### Добавлено
+
+- **Tooltip**: свойство `interactive` — указатель можно перевести на подсказку, чтобы выделить текст или нажать ссылку внутри. Без него подсказка не перехватывает указатель.
+
+### Изменено
+
+- **Tooltip**: по умолчанию подсказка не получает события указателя. Раньше указатель, попавший на подсказку, удерживал её открытой: в плотном списке подсказка нижней кнопки перекрывала кнопку выше, и навести на неё было нельзя. Если подсказку нужно выделять или нажимать в ней, передайте `interactive`;
+- **Popper**: явный `pointerEvents` в `style` больше не затирается — скрытый поппер по-прежнему не перехватывает указатель.
+
 ## 0.11.0 — 2026-11-05
 
 ### Добавлено

package/Popper/Popper.js

@@ -81,19 +81,24 @@ const Popper = (props, ref) => {
         }
     }, [actualPlacement]);
     const childrenMemo = react_1.default.useMemo(() => children, [children]);
-    const renderNode = react_1.default.useCallback(() => (react_1.default.createElement(overridesMap.Container, Object.assign({}, nativeProps, { style: Object.assign(Object.assign(Object.assign(Object.assign({}, style), nativeProps.style), { opacity: isVisible ? 1 : 0, pointerEvents: isVisible ? 'auto' : 'none' }), (positionStrategy === 'fixed' && {
-            position: 'fixed',
-        })), zIndex: zIndex, positionStrategy: positionStrategy, "data-popper-placement": actualPlacement, "data-popper-strategy": positionStrategy, ref: el => {
-            popperRef.current = el;
-            if (ref) {
-                if (typeof ref === 'function') {
-                    ref(el);
+    const renderNode = react_1.default.useCallback(() => {
+        var _a, _b;
+        return (react_1.default.createElement(overridesMap.Container, Object.assign({}, nativeProps, { style: Object.assign(Object.assign(Object.assign(Object.assign({}, style), nativeProps.style), { opacity: isVisible ? 1 : 0, 
+                // A hidden popper never intercepts the pointer; a visible one lets the caller opt out
+                pointerEvents: !isVisible ? 'none' : ((_b = (_a = nativeProps.style) === null || _a === void 0 ? void 0 : _a.pointerEvents) !== null && _b !== void 0 ? _b : 'auto') }), (positionStrategy === 'fixed' && {
+                position: 'fixed',
+            })), zIndex: zIndex, positionStrategy: positionStrategy, "data-popper-placement": actualPlacement, "data-popper-strategy": positionStrategy, ref: el => {
+                popperRef.current = el;
+                if (ref) {
+                    if (typeof ref === 'function') {
+                        ref(el);
+                    }
+                    if (typeof ref === 'object') {
+                        ref.current = el;
+                    }
                 }
-                if (typeof ref === 'object') {
-                    ref.current = el;
-                }
-            }
-        } }), childrenMemo)), [
+            } }), childrenMemo));
+    }, [
         overridesMap,
         nativeProps,
         style,

package/Tooltip/index.d.ts

@@ -49,6 +49,12 @@ export type TooltipProps = {
      * Default: false
      */
     readonly describeChild?: boolean;
+    /**
+     * Lets the pointer move onto the tooltip, e.g. to select its text or click a link inside.
+     * When `false`, the tooltip does not receive pointer events and cannot block the elements under it
+     * Default: false
+     */
+    readonly interactive?: boolean;
     /**
      * Default: 8
      */

package/Tooltip/index.js

@@ -45,7 +45,7 @@ const setRef = (ref, value) => {
 const isEmptyTitle = (title) => title === null || typeof title === 'undefined' || title === false || title === '';
 const Tooltip = props => {
     var _a;
-    const { title, children, placement = 'top', arrow = false, enterDelay = 400, leaveDelay = 100, isOpen, onOpenChange, describeChild = false, offset = 8, zIndex, id, overrides, } = props;
+    const { title, children, placement = 'top', arrow = false, enterDelay = 400, leaveDelay = 100, isOpen, onOpenChange, describeChild = false, interactive = false, offset = 8, zIndex, id, overrides, } = props;
     const theme = (0, react_2.useTheme)();
     const generatedId = `tooltip-${react_1.default.useId().replace(/:/g, '')}`;
     const tooltipId = id || generatedId;
@@ -182,12 +182,15 @@ const Tooltip = props => {
     return (react_1.default.createElement(react_1.default.Fragment, null,
         anchor,
         react_1.default.createElement(Popper_1.default, { isOpen: open, anchorElement: anchorElement, anchorPos: placement, autoFlip: true, offset: offset, viewportMargin: 8, zIndex: zIndex !== null && zIndex !== void 0 ? zIndex : theme.zIndex.modal + 1, onAnchorPosChanged: setActualPlacement, id: tooltipId, role: "tooltip", 
-            // The pointer can move from the element onto the tooltip without hiding it
-            onPointerEnter: clearTimer, onPointerLeave: event => {
-                if (isHoverPointer(event)) {
-                    hide(leaveDelay);
+            // Without `interactive` the tooltip must not intercept the pointer: otherwise it
+            // blocks the elements under it and sticks under the cursor that moves across it
+            style: interactive ? undefined : { pointerEvents: 'none' }, onPointerEnter: interactive ? clearTimer : undefined, onPointerLeave: interactive
+                ? event => {
+                    if (isHoverPointer(event)) {
+                        hide(leaveDelay);
+                    }
                 }
-            } },
+                : undefined },
             react_1.default.createElement(overridesMap.Container, null,
                 title,
                 arrow && react_1.default.createElement(overridesMap.Arrow, { placement: actualPlacement })))));

package/esm/Popper/Popper.js

@@ -61,19 +61,24 @@ const Popper = (props, ref) => {
         }
     }, [actualPlacement]);
     const childrenMemo = React.useMemo(() => children, [children]);
-    const renderNode = React.useCallback(() => (React.createElement(overridesMap.Container, Object.assign({}, nativeProps, { style: Object.assign(Object.assign(Object.assign(Object.assign({}, style), nativeProps.style), { opacity: isVisible ? 1 : 0, pointerEvents: isVisible ? 'auto' : 'none' }), (positionStrategy === 'fixed' && {
-            position: 'fixed',
-        })), zIndex: zIndex, positionStrategy: positionStrategy, "data-popper-placement": actualPlacement, "data-popper-strategy": positionStrategy, ref: el => {
-            popperRef.current = el;
-            if (ref) {
-                if (typeof ref === 'function') {
-                    ref(el);
+    const renderNode = React.useCallback(() => {
+        var _a, _b;
+        return (React.createElement(overridesMap.Container, Object.assign({}, nativeProps, { style: Object.assign(Object.assign(Object.assign(Object.assign({}, style), nativeProps.style), { opacity: isVisible ? 1 : 0, 
+                // A hidden popper never intercepts the pointer; a visible one lets the caller opt out
+                pointerEvents: !isVisible ? 'none' : ((_b = (_a = nativeProps.style) === null || _a === void 0 ? void 0 : _a.pointerEvents) !== null && _b !== void 0 ? _b : 'auto') }), (positionStrategy === 'fixed' && {
+                position: 'fixed',
+            })), zIndex: zIndex, positionStrategy: positionStrategy, "data-popper-placement": actualPlacement, "data-popper-strategy": positionStrategy, ref: el => {
+                popperRef.current = el;
+                if (ref) {
+                    if (typeof ref === 'function') {
+                        ref(el);
+                    }
+                    if (typeof ref === 'object') {
+                        ref.current = el;
+                    }
                 }
-                if (typeof ref === 'object') {
-                    ref.current = el;
-                }
-            }
-        } }), childrenMemo)), [
+            } }), childrenMemo));
+    }, [
         overridesMap,
         nativeProps,
         style,

package/esm/Tooltip/index.js

@@ -40,7 +40,7 @@ const setRef = (ref, value) => {
 const isEmptyTitle = (title) => title === null || typeof title === 'undefined' || title === false || title === '';
 const Tooltip = props => {
     var _a;
-    const { title, children, placement = 'top', arrow = false, enterDelay = 400, leaveDelay = 100, isOpen, onOpenChange, describeChild = false, offset = 8, zIndex, id, overrides, } = props;
+    const { title, children, placement = 'top', arrow = false, enterDelay = 400, leaveDelay = 100, isOpen, onOpenChange, describeChild = false, interactive = false, offset = 8, zIndex, id, overrides, } = props;
     const theme = useTheme();
     const generatedId = `tooltip-${React.useId().replace(/:/g, '')}`;
     const tooltipId = id || generatedId;
@@ -177,12 +177,15 @@ const Tooltip = props => {
     return (React.createElement(React.Fragment, null,
         anchor,
         React.createElement(Popper, { isOpen: open, anchorElement: anchorElement, anchorPos: placement, autoFlip: true, offset: offset, viewportMargin: 8, zIndex: zIndex !== null && zIndex !== void 0 ? zIndex : theme.zIndex.modal + 1, onAnchorPosChanged: setActualPlacement, id: tooltipId, role: "tooltip", 
-            // The pointer can move from the element onto the tooltip without hiding it
-            onPointerEnter: clearTimer, onPointerLeave: event => {
-                if (isHoverPointer(event)) {
-                    hide(leaveDelay);
+            // Without `interactive` the tooltip must not intercept the pointer: otherwise it
+            // blocks the elements under it and sticks under the cursor that moves across it
+            style: interactive ? undefined : { pointerEvents: 'none' }, onPointerEnter: interactive ? clearTimer : undefined, onPointerLeave: interactive
+                ? event => {
+                    if (isHoverPointer(event)) {
+                        hide(leaveDelay);
+                    }
                 }
-            } },
+                : undefined },
             React.createElement(overridesMap.Container, null,
                 title,
                 arrow && React.createElement(overridesMap.Arrow, { placement: actualPlacement })))));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@via-profit/ui-kit",
-  "version": "0.11.0",
+  "version": "0.12.0",
   "description": "UI Kit",
   "repository": {
     "type": "git",