@sberbusiness/triplex-next 1.34.0 → 1.35.0

package/components/Tooltip/TootlipContext.js

@@ -1,5 +1,5 @@
-import e from "react";
-const l = e.createContext({
+import React__default from "react";
+const TooltipContext = React__default.createContext({
   elements: {
     body: null,
     link: null,
@@ -9,10 +9,10 @@ const l = e.createContext({
   },
   setTooltipOpen: () => {
   },
-  targetHoveredRef: { current: !1 },
-  tooltipOpen: !1
+  targetHoveredRef: { current: false },
+  tooltipOpen: false
 });
 export {
-  l as TooltipContext
+  TooltipContext
 };
 //# sourceMappingURL=TootlipContext.js.map

package/components/Tooltip/TootlipContext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TootlipContext.js","sources":["../../../src/components/Tooltip/TootlipContext.ts"],"sourcesContent":["import React from \"react\";\nimport { TTooltipToggleType, ITooltipElements } from \"@sberbusiness/triplex-next/components/Tooltip/types\";\n\n/** Свойства контекста Tooltip. */\nexport interface ITooltipContext {\n    toggleType?: TTooltipToggleType;\n    elements: ITooltipElements;\n    tooltipOpen: boolean;\n    targetHoveredRef: React.MutableRefObject<boolean>;\n    setTooltipOpen: (open: boolean) => void;\n}\n\n/** Контекст компонента Tooltip. */\nexport const TooltipContext = React.createContext<ITooltipContext>({\n    elements: {\n        body: null,\n        link: null,\n        closeButton: null,\n        mobileHeader: null,\n        target: null,\n    },\n    setTooltipOpen: () => {},\n    targetHoveredRef: { current: false },\n    tooltipOpen: false,\n});\n"],"names":["React"],"mappings":";AAaO,MAAM,iBAAiBA,eAAM,cAA+B;AAAA,EAC/D,UAAU;AAAA,IACN,MAAM;AAAA,IACN,MAAM;AAAA,IACN,aAAa;AAAA,IACb,cAAc;AAAA,IACd,QAAQ;AAAA,EAAA;AAAA,EAEZ,gBAAgB,MAAM;AAAA,EAAC;AAAA,EACvB,kBAAkB,EAAE,SAAS,MAAA;AAAA,EAC7B,aAAa;AACjB,CAAC;"}

package/components/Tooltip/components/common/TooltipBody.js

@@ -1,16 +1,16 @@
-import { jsx as o } from "react/jsx-runtime";
-import r from "react";
-import { c as s } from "../../../../chunks/vendor-D5cfSbgz.js";
-import { MobileView as a } from "../../../MobileView/MobileView.js";
-import { Text as l } from "../../../Typography/Text.js";
-import { ELineType as p, ETextSize as c } from "../../../Typography/enums.js";
-import { s as f } from "../../../../chunks/TooltipDesktop.module-Bfmd95Xq.js";
-const d = r.forwardRef(({ className: m, ...i }, t) => {
-  const e = s(f.tooltipBody, m);
-  return /* @__PURE__ */ o(a, { fallback: /* @__PURE__ */ o("div", { className: e, ...i, ref: t }), children: /* @__PURE__ */ o(l, { className: e, size: c.B3, line: p.NORMAL, tag: "div", ...i, ref: t }) });
+import { jsx } from "react/jsx-runtime";
+import React__default from "react";
+import { c as clsx } from "../../../../chunks/vendor-Bco_z_Yi.js";
+import { MobileView } from "../../../MobileView/MobileView.js";
+import { Text } from "../../../Typography/Text.js";
+import { ELineType, ETextSize } from "../../../Typography/enums.js";
+import { s as styles } from "../../../../chunks/TooltipDesktop.module-BO54anEf.js";
+const TooltipBody = React__default.forwardRef(({ className, ...rest }, ref) => {
+  const classNames = clsx(styles.tooltipBody, className);
+  return /* @__PURE__ */ jsx(MobileView, { fallback: /* @__PURE__ */ jsx("div", { className: classNames, ...rest, ref }), children: /* @__PURE__ */ jsx(Text, { className: classNames, size: ETextSize.B3, line: ELineType.NORMAL, tag: "div", ...rest, ref }) });
 });
-d.displayName = "TooltipBody";
+TooltipBody.displayName = "TooltipBody";
 export {
-  d as TooltipBody
+  TooltipBody
 };
 //# sourceMappingURL=TooltipBody.js.map

package/components/Tooltip/components/common/TooltipBody.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TooltipBody.js","sources":["../../../../../src/components/Tooltip/components/common/TooltipBody.tsx"],"sourcesContent":["import React from \"react\";\nimport clsx from \"clsx\";\nimport { MobileView } from \"@sberbusiness/triplex-next/components/MobileView/MobileView\";\nimport { Text } from \"@sberbusiness/triplex-next/components/Typography/Text\";\nimport { ETextSize, ELineType } from \"@sberbusiness/triplex-next/components/Typography/enums\";\nimport { ITooltipBodyProps } from \"@sberbusiness/triplex-next/components/Tooltip/types\";\nimport styles from \"@sberbusiness/triplex-next/components/Tooltip/styles/TooltipDesktop.module.less\";\n\n/** Тело компонента Tooltip. */\nexport const TooltipBody = React.forwardRef<HTMLDivElement, ITooltipBodyProps>(({ className, ...rest }, ref) => {\n    const classNames = clsx(styles.tooltipBody, className);\n\n    return (\n        <MobileView fallback={<div className={classNames} {...rest} ref={ref} />}>\n            <Text className={classNames} size={ETextSize.B3} line={ELineType.NORMAL} tag=\"div\" {...rest} ref={ref} />\n        </MobileView>\n    );\n});\n\nTooltipBody.displayName = \"TooltipBody\";\n"],"names":["React"],"mappings":";;;;;;;AASO,MAAM,cAAcA,eAAM,WAA8C,CAAC,EAAE,WAAW,GAAG,KAAA,GAAQ,QAAQ;AAC5G,QAAM,aAAa,KAAK,OAAO,aAAa,SAAS;AAErD,SACI,oBAAC,YAAA,EAAW,UAAU,oBAAC,OAAA,EAAI,WAAW,YAAa,GAAG,MAAM,IAAA,CAAU,GAClE,UAAA,oBAAC,MAAA,EAAK,WAAW,YAAY,MAAM,UAAU,IAAI,MAAM,UAAU,QAAQ,KAAI,OAAO,GAAG,MAAM,IAAA,CAAU,EAAA,CAC3G;AAER,CAAC;AAED,YAAY,cAAc;"}

package/components/Tooltip/components/common/TooltipLink.js

@@ -1,34 +1,41 @@
-import { jsx as t } from "react/jsx-runtime";
-import n from "react";
-import { c as s } from "../../../../chunks/vendor-D5cfSbgz.js";
-import { MobileView as a } from "../../../MobileView/MobileView.js";
-const k = "tooltipLink__c371af42", d = "desktop__f2d9323d", r = "mobile__d006d0e2", o = {
-  tooltipLink: k,
-  desktop: d,
-  mobile: r
-}, m = n.forwardRef(
-  ({ children: i, className: e, ...l }, p) => /* @__PURE__ */ t(a, { fallback: /* @__PURE__ */ t(
-    "a",
-    {
-      className: s(o.tooltipLink, o.desktop, e),
-      ...l,
-      "data-tx": "1.34.0",
-      ref: p,
-      children: i
-    }
-  ), children: /* @__PURE__ */ t(
-    "a",
-    {
-      className: s(o.tooltipLink, o.mobile, e),
-      ...l,
-      "data-tx": "1.34.0",
-      ref: p,
-      children: i
-    }
-  ) })
+import { jsx } from "react/jsx-runtime";
+import React__default from "react";
+import { c as clsx } from "../../../../chunks/vendor-Bco_z_Yi.js";
+import { MobileView } from "../../../MobileView/MobileView.js";
+const tooltipLink = "tooltipLink__92155199";
+const desktop = "desktop__226181ca";
+const mobile = "mobile__ccd17af9";
+const styles = {
+  tooltipLink,
+  desktop,
+  mobile
+};
+const TooltipLink = React__default.forwardRef(
+  ({ children, className, ...rest }, ref) => {
+    const renderDesktopLink = () => /* @__PURE__ */ jsx(
+      "a",
+      {
+        className: clsx(styles.tooltipLink, styles.desktop, className),
+        ...rest,
+        "data-tx": "1.35.0",
+        ref,
+        children
+      }
+    );
+    return /* @__PURE__ */ jsx(MobileView, { fallback: renderDesktopLink(), children: /* @__PURE__ */ jsx(
+      "a",
+      {
+        className: clsx(styles.tooltipLink, styles.mobile, className),
+        ...rest,
+        "data-tx": "1.35.0",
+        ref,
+        children
+      }
+    ) });
+  }
 );
-m.displayName = "TooltipLink";
+TooltipLink.displayName = "TooltipLink";
 export {
-  m as TooltipLink
+  TooltipLink
 };
 //# sourceMappingURL=TooltipLink.js.map

package/components/Tooltip/components/common/TooltipLink.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TooltipLink.js","sources":["../../../../../src/components/Tooltip/components/common/TooltipLink.tsx"],"sourcesContent":["import React from \"react\";\nimport clsx from \"clsx\";\nimport { MobileView } from \"@sberbusiness/triplex-next/components/MobileView/MobileView\";\nimport styles from \"@sberbusiness/triplex-next/components/Tooltip/styles/TooltipLink.module.less\";\nimport { ITooltipLinkProps } from \"@sberbusiness/triplex-next/components/Tooltip/types\";\n\n/** Гиперссылка в Tooltip. */\nexport const TooltipLink = React.forwardRef<HTMLAnchorElement, ITooltipLinkProps>(\n    ({ children, className, ...rest }, ref) => {\n        /** Рендер десктоп версии. */\n        const renderDesktopLink = () => (\n            <a\n                className={clsx(styles.tooltipLink, styles.desktop, className)}\n                {...rest}\n                data-tx={process.env.npm_package_version}\n                ref={ref}\n            >\n                {children}\n            </a>\n        );\n\n        return (\n            <MobileView fallback={renderDesktopLink()}>\n                <a\n                    className={clsx(styles.tooltipLink, styles.mobile, className)}\n                    {...rest}\n                    data-tx={process.env.npm_package_version}\n                    ref={ref}\n                >\n                    {children}\n                </a>\n            </MobileView>\n        );\n    },\n);\n\nTooltipLink.displayName = \"TooltipLink\";\n"],"names":["React"],"mappings":";;;;;;;;;;;;AAOO,MAAM,cAAcA,eAAM;AAAA,EAC7B,CAAC,EAAE,UAAU,WAAW,GAAG,KAAA,GAAQ,QAAQ;AAEvC,UAAM,oBAAoB,MACtB;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,WAAW,KAAK,OAAO,aAAa,OAAO,SAAS,SAAS;AAAA,QAC5D,GAAG;AAAA,QACJ,WAAS;AAAA,QACT;AAAA,QAEC;AAAA,MAAA;AAAA,IAAA;AAIT,+BACK,YAAA,EAAW,UAAU,kBAAA,GAClB,UAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,WAAW,KAAK,OAAO,aAAa,OAAO,QAAQ,SAAS;AAAA,QAC3D,GAAG;AAAA,QACJ,WAAS;AAAA,QACT;AAAA,QAEC;AAAA,MAAA;AAAA,IAAA,GAET;AAAA,EAER;AACJ;AAEA,YAAY,cAAc;"}

package/components/Tooltip/components/common/TooltipTarget.js

@@ -1,19 +1,33 @@
-import r, { useContext as d } from "react";
-import { TooltipContext as m } from "../../TootlipContext.js";
-import { isKey as T } from "../../../../utils/keyboard.js";
-const y = ({ children: c }) => {
-  const { toggleType: i, tooltipOpen: l, targetHoveredRef: n, setTooltipOpen: p } = d(m), o = r.Children.only(c), s = (t) => (e) => {
-    const f = e.code || e.keyCode;
-    T(f, "TAB") && l && p(!1), t == null || t(e);
-  }, a = (t) => (e) => {
-    (i === "click" || i === "hover" && !n.current && e.currentTarget.contains(e.target)) && p(!l), t == null || t(e);
+import React__default, { useContext } from "react";
+import { TooltipContext } from "../../TootlipContext.js";
+import { isKey } from "../../../../utils/keyboard.js";
+const TooltipTarget = ({ children }) => {
+  const { toggleType, tooltipOpen, targetHoveredRef, setTooltipOpen } = useContext(TooltipContext);
+  const child = React__default.Children.only(children);
+  const handleKeyDown = (onKeyDown) => (event) => {
+    const key = event.code || event.keyCode;
+    if (isKey(key, "TAB")) {
+      if (tooltipOpen) {
+        setTooltipOpen(false);
+      }
+    }
+    onKeyDown == null ? void 0 : onKeyDown(event);
   };
-  return r.isValidElement(o) ? r.cloneElement(o, {
-    onClick: a(o.props.onClick),
-    onKeyDown: s(o.props.onKeyDown)
-  }) : o;
+  const handleClick = (onClick) => (event) => {
+    if (toggleType === "click" || toggleType === "hover" && !targetHoveredRef.current && event.currentTarget.contains(event.target)) {
+      setTooltipOpen(!tooltipOpen);
+    }
+    onClick == null ? void 0 : onClick(event);
+  };
+  if (React__default.isValidElement(child)) {
+    return React__default.cloneElement(child, {
+      onClick: handleClick(child.props.onClick),
+      onKeyDown: handleKeyDown(child.props.onKeyDown)
+    });
+  }
+  return child;
 };
 export {
-  y as TooltipTarget
+  TooltipTarget
 };
 //# sourceMappingURL=TooltipTarget.js.map

package/components/Tooltip/components/common/TooltipTarget.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TooltipTarget.js","sources":["../../../../../src/components/Tooltip/components/common/TooltipTarget.tsx"],"sourcesContent":["import React, { useContext } from \"react\";\nimport { TooltipContext } from \"@sberbusiness/triplex-next/components/Tooltip/TootlipContext\";\nimport { isKey } from \"@sberbusiness/triplex-next/utils/keyboard\";\nimport { ITooltipTargetProps } from \"@sberbusiness/triplex-next/components/Tooltip/types\";\n\n/** Целевой элемент компонента Tooltip. */\nexport const TooltipTarget: React.FC<ITooltipTargetProps> = ({ children }) => {\n    const { toggleType, tooltipOpen, targetHoveredRef, setTooltipOpen } = useContext(TooltipContext);\n    const child = React.Children.only(children);\n\n    /** Обработчик нажатия клавиши. */\n    const handleKeyDown = (onKeyDown?: React.KeyboardEventHandler) => (event: React.KeyboardEvent) => {\n        const key = event.code || event.keyCode;\n\n        if (isKey(key, \"TAB\")) {\n            if (tooltipOpen) {\n                setTooltipOpen(false);\n            }\n        }\n        onKeyDown?.(event);\n    };\n\n    /** Обработчик клика. */\n    const handleClick = (onClick?: React.MouseEventHandler) => (event: React.MouseEvent) => {\n        if (\n            toggleType === \"click\" ||\n            (toggleType === \"hover\" && !targetHoveredRef.current && event.currentTarget.contains(event.target as Node))\n        ) {\n            setTooltipOpen(!tooltipOpen);\n        }\n        onClick?.(event);\n    };\n\n    if (React.isValidElement<React.HTMLAttributes<Element>>(child)) {\n        return React.cloneElement(child, {\n            onClick: handleClick(child.props.onClick),\n            onKeyDown: handleKeyDown(child.props.onKeyDown),\n        });\n    }\n\n    return child;\n};\n"],"names":["React"],"mappings":";;;AAMO,MAAM,gBAA+C,CAAC,EAAE,eAAe;AAC1E,QAAM,EAAE,YAAY,aAAa,kBAAkB,eAAA,IAAmB,WAAW,cAAc;AAC/F,QAAM,QAAQA,eAAM,SAAS,KAAK,QAAQ;AAG1C,QAAM,gBAAgB,CAAC,cAA2C,CAAC,UAA+B;AAC9F,UAAM,MAAM,MAAM,QAAQ,MAAM;AAEhC,QAAI,MAAM,KAAK,KAAK,GAAG;AACnB,UAAI,aAAa;AACb,uBAAe,KAAK;AAAA,MACxB;AAAA,IACJ;AACA,2CAAY;AAAA,EAChB;AAGA,QAAM,cAAc,CAAC,YAAsC,CAAC,UAA4B;AACpF,QACI,eAAe,WACd,eAAe,WAAW,CAAC,iBAAiB,WAAW,MAAM,cAAc,SAAS,MAAM,MAAc,GAC3G;AACE,qBAAe,CAAC,WAAW;AAAA,IAC/B;AACA,uCAAU;AAAA,EACd;AAEA,MAAIA,eAAM,eAA8C,KAAK,GAAG;AAC5D,WAAOA,eAAM,aAAa,OAAO;AAAA,MAC7B,SAAS,YAAY,MAAM,MAAM,OAAO;AAAA,MACxC,WAAW,cAAc,MAAM,MAAM,SAAS;AAAA,IAAA,CACjD;AAAA,EACL;AAEA,SAAO;AACX;"}

package/components/Tooltip/components/common/TooltipXButton.js

@@ -1,16 +1,19 @@
-import { jsx as r } from "react/jsx-runtime";
-import { useContext as m } from "react";
-import { CrossStrokeSrvIcon16 as n } from "@sberbusiness/icons-next";
-import { TooltipContext as i } from "../../TootlipContext.js";
-import { ButtonIcon as a } from "../../../Button/ButtonIcon.js";
-import { s as l } from "../../../../chunks/TooltipDesktop.module-Bfmd95Xq.js";
-const I = ({ onClick: o, ...s }) => {
-  const { setTooltipOpen: p } = m(i), e = (t) => {
-    t.stopPropagation(), p(!1), o == null || o(t);
+import { jsx } from "react/jsx-runtime";
+import { useContext } from "react";
+import { CrossStrokeSrvIcon16 } from "@sberbusiness/icons-next";
+import { TooltipContext } from "../../TootlipContext.js";
+import { ButtonIcon } from "../../../Button/ButtonIcon.js";
+import { s as styles } from "../../../../chunks/TooltipDesktop.module-BO54anEf.js";
+const TooltipXButton = ({ onClick, ...rest }) => {
+  const { setTooltipOpen } = useContext(TooltipContext);
+  const handleClick = (event) => {
+    event.stopPropagation();
+    setTooltipOpen(false);
+    onClick == null ? void 0 : onClick(event);
   };
-  return /* @__PURE__ */ r(a, { className: l.tooltipXButton, onClick: e, ...s, children: /* @__PURE__ */ r(n, { paletteIndex: 6 }) });
+  return /* @__PURE__ */ jsx(ButtonIcon, { className: styles.tooltipXButton, onClick: handleClick, ...rest, children: /* @__PURE__ */ jsx(CrossStrokeSrvIcon16, { paletteIndex: 6 }) });
 };
 export {
-  I as TooltipXButton
+  TooltipXButton
 };
 //# sourceMappingURL=TooltipXButton.js.map

package/components/Tooltip/components/common/TooltipXButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TooltipXButton.js","sources":["../../../../../src/components/Tooltip/components/common/TooltipXButton.tsx"],"sourcesContent":["import React, { useContext } from \"react\";\nimport { CrossStrokeSrvIcon16 } from \"@sberbusiness/icons-next\";\nimport { TooltipContext } from \"@sberbusiness/triplex-next/components/Tooltip/TootlipContext\";\nimport { ButtonIcon } from \"@sberbusiness/triplex-next/components/Button/ButtonIcon\";\nimport { ITooltipXButtonProps } from \"@sberbusiness/triplex-next/components/Tooltip/types\";\nimport styles from \"@sberbusiness/triplex-next/components/Tooltip/styles/TooltipDesktop.module.less\";\n\n/** Кнопка закрытия Tooltip. */\nexport const TooltipXButton: React.FC<ITooltipXButtonProps> = ({ onClick, ...rest }) => {\n    const { setTooltipOpen } = useContext(TooltipContext);\n\n    /** Обработчик клика. */\n    const handleClick = (event: React.MouseEvent<HTMLButtonElement>) => {\n        event.stopPropagation();\n        setTooltipOpen(false);\n        onClick?.(event);\n    };\n\n    return (\n        <ButtonIcon className={styles.tooltipXButton} onClick={handleClick} {...rest}>\n            <CrossStrokeSrvIcon16 paletteIndex={6} />\n        </ButtonIcon>\n    );\n};\n"],"names":[],"mappings":";;;;;;AAQO,MAAM,iBAAiD,CAAC,EAAE,SAAS,GAAG,WAAW;AACpF,QAAM,EAAE,eAAA,IAAmB,WAAW,cAAc;AAGpD,QAAM,cAAc,CAAC,UAA+C;AAChE,UAAM,gBAAA;AACN,mBAAe,KAAK;AACpB,uCAAU;AAAA,EACd;AAEA,SACI,oBAAC,YAAA,EAAW,WAAW,OAAO,gBAAgB,SAAS,aAAc,GAAG,MACpE,UAAA,oBAAC,sBAAA,EAAqB,cAAc,GAAG,GAC3C;AAER;"}

package/components/Tooltip/components/desktop/TooltipDesktop.js

@@ -1,69 +1,115 @@
-var l = Object.defineProperty;
-var h = (n, s, e) => s in n ? l(n, s, { enumerable: !0, configurable: !0, writable: !0, value: e }) : n[s] = e;
-var o = (n, s, e) => h(n, typeof s != "symbol" ? s + "" : s, e);
-import { jsx as d } from "react/jsx-runtime";
-import u from "react";
-import { TooltipDesktopBase as a } from "./components/TooltipDesktopBase.js";
-import { TooltipContext as m } from "../../TootlipContext.js";
-import { isKey as f } from "../../../../utils/keyboard.js";
-class p extends u.Component {
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+import { jsx } from "react/jsx-runtime";
+import React__default from "react";
+import { TooltipDesktopBase } from "./components/TooltipDesktopBase.js";
+import { TooltipContext } from "../../TootlipContext.js";
+import { isKey } from "../../../../utils/keyboard.js";
+class TooltipDesktop extends React__default.Component {
   constructor() {
     super(...arguments);
-    o(this, "tooltip", null);
-    o(this, "timeout");
-    o(this, "setTooltipRef", (e) => {
-      const { toggleType: t } = this.props;
-      e && t === "hover" && this.addHoverListeners(e), this.tooltip = e;
+    __publicField(this, "tooltip", null);
+    __publicField(this, "timeout");
+    __publicField(this, "setTooltipRef", (node) => {
+      const { toggleType } = this.props;
+      if (node && toggleType === "hover") {
+        this.addHoverListeners(node);
+      }
+      this.tooltip = node;
     });
     // Закрываем Tooltip при клике за его пределами.
-    o(this, "closeIfOuterAction", (e) => {
-      const { targetRef: t } = this.props, { setTooltipOpen: i } = this.context;
-      if (t.current && this.tooltip) {
-        const r = !t.current.contains(e.target), c = !this.tooltip.contains(e.target);
-        r && c && i(!1);
+    __publicField(this, "closeIfOuterAction", (event) => {
+      const { targetRef } = this.props;
+      const { setTooltipOpen } = this.context;
+      if (targetRef.current && this.tooltip) {
+        const outOfTarget = !targetRef.current.contains(event.target);
+        const outOfTooltip = !this.tooltip.contains(event.target);
+        if (outOfTarget && outOfTooltip) {
+          setTooltipOpen(false);
+        }
       }
     });
     // Закрываем Tooltip по нажатию Esc
-    o(this, "closeIfEscapeKey", (e) => {
-      const t = e.code || e.keyCode;
-      f(t, "ESCAPE") && this.context.setTooltipOpen(!1);
+    __publicField(this, "closeIfEscapeKey", (event) => {
+      const key = event.code || event.keyCode;
+      if (isKey(key, "ESCAPE")) {
+        this.context.setTooltipOpen(false);
+      }
     });
-    o(this, "addHoverListeners", (e) => {
-      e.addEventListener("mouseenter", this.handleMouseEnter), e.addEventListener("mouseleave", this.handleMouseLeave);
+    __publicField(this, "addHoverListeners", (element) => {
+      element.addEventListener("mouseenter", this.handleMouseEnter);
+      element.addEventListener("mouseleave", this.handleMouseLeave);
     });
-    o(this, "removeHoverListeners", (e) => {
-      e.removeEventListener("mouseenter", this.handleMouseEnter), e.removeEventListener("mouseleave", this.handleMouseLeave);
+    __publicField(this, "removeHoverListeners", (element) => {
+      element.removeEventListener("mouseenter", this.handleMouseEnter);
+      element.removeEventListener("mouseleave", this.handleMouseLeave);
     });
-    o(this, "handleMouseEnter", () => {
-      const { tooltipOpen: e, targetHoveredRef: t, setTooltipOpen: i } = this.context;
-      e || (i(!0), t.current = !0), clearTimeout(this.timeout);
+    __publicField(this, "handleMouseEnter", () => {
+      const { tooltipOpen, targetHoveredRef, setTooltipOpen } = this.context;
+      if (!tooltipOpen) {
+        setTooltipOpen(true);
+        targetHoveredRef.current = true;
+      }
+      clearTimeout(this.timeout);
     });
-    o(this, "handleMouseLeave", () => {
-      const { setTooltipOpen: e } = this.context;
+    __publicField(this, "handleMouseLeave", () => {
+      const { setTooltipOpen } = this.context;
       this.timeout = window.setTimeout(() => {
-        e(!1);
+        setTooltipOpen(false);
       }, 500);
     });
   }
   render() {
-    const { children: e, toggleType: t, ...i } = this.props;
-    return /* @__PURE__ */ d(a, { ...i, setTooltipRef: this.setTooltipRef });
+    const { children, toggleType, ...rest } = this.props;
+    return /* @__PURE__ */ jsx(TooltipDesktopBase, { ...rest, setTooltipRef: this.setTooltipRef });
   }
   componentDidMount() {
-    const { toggleType: e, targetRef: t } = this.props;
-    this.props.isOpen && (document.addEventListener("click", this.closeIfOuterAction), document.addEventListener("keydown", this.closeIfEscapeKey)), t.current && e === "hover" && this.addHoverListeners(t.current);
+    const { toggleType, targetRef } = this.props;
+    if (this.props.isOpen) {
+      document.addEventListener("click", this.closeIfOuterAction);
+      document.addEventListener("keydown", this.closeIfEscapeKey);
+    }
+    if (targetRef.current && toggleType === "hover") {
+      this.addHoverListeners(targetRef.current);
+    }
   }
-  componentDidUpdate(e) {
-    const { targetRef: t } = this.props, i = !e.isOpen && this.props.isOpen, r = e.isOpen && !this.props.isOpen;
-    i && (document.addEventListener("mousedown", this.closeIfOuterAction), document.addEventListener("keydown", this.closeIfEscapeKey)), r && (document.removeEventListener("mousedown", this.closeIfOuterAction), document.removeEventListener("keydown", this.closeIfEscapeKey), this.props.toggleType === "hover" && this.removeHoverListeners(this.tooltip)), t.current && e.toggleType != this.props.toggleType && (this.props.toggleType === "hover" ? this.addHoverListeners(t.current) : e.toggleType === "hover" && this.removeHoverListeners(t.current));
+  componentDidUpdate(prevProps) {
+    const { targetRef } = this.props;
+    const isOpen = !prevProps.isOpen && this.props.isOpen;
+    const isClosed = prevProps.isOpen && !this.props.isOpen;
+    if (isOpen) {
+      document.addEventListener("mousedown", this.closeIfOuterAction);
+      document.addEventListener("keydown", this.closeIfEscapeKey);
+    }
+    if (isClosed) {
+      document.removeEventListener("mousedown", this.closeIfOuterAction);
+      document.removeEventListener("keydown", this.closeIfEscapeKey);
+      if (this.props.toggleType === "hover") {
+        this.removeHoverListeners(this.tooltip);
+      }
+    }
+    if (targetRef.current && prevProps.toggleType != this.props.toggleType) {
+      if (this.props.toggleType === "hover") {
+        this.addHoverListeners(targetRef.current);
+      } else if (prevProps.toggleType === "hover") {
+        this.removeHoverListeners(targetRef.current);
+      }
+    }
   }
   componentWillUnmount() {
-    const { toggleType: e, targetRef: t } = this.props;
-    document.removeEventListener("mousedown", this.closeIfOuterAction), document.removeEventListener("keydown", this.closeIfEscapeKey), t.current && e === "hover" && this.removeHoverListeners(t.current), clearTimeout(this.timeout);
+    const { toggleType, targetRef } = this.props;
+    document.removeEventListener("mousedown", this.closeIfOuterAction);
+    document.removeEventListener("keydown", this.closeIfEscapeKey);
+    if (targetRef.current && toggleType === "hover") {
+      this.removeHoverListeners(targetRef.current);
+    }
+    clearTimeout(this.timeout);
   }
 }
-o(p, "displayName", "TooltipDesktop"), o(p, "contextType", m);
+__publicField(TooltipDesktop, "displayName", "TooltipDesktop");
+__publicField(TooltipDesktop, "contextType", TooltipContext);
 export {
-  p as TooltipDesktop
+  TooltipDesktop
 };
 //# sourceMappingURL=TooltipDesktop.js.map

package/components/Tooltip/components/desktop/TooltipDesktop.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TooltipDesktop.js","sources":["../../../../../src/components/Tooltip/components/desktop/TooltipDesktop.tsx"],"sourcesContent":["import React from \"react\";\nimport { TooltipDesktopBase } from \"@sberbusiness/triplex-next/components/Tooltip/components/desktop/components/TooltipDesktopBase\";\nimport { TooltipContext } from \"@sberbusiness/triplex-next/components/Tooltip/TootlipContext\";\nimport { isKey } from \"@sberbusiness/triplex-next/utils/keyboard\";\nimport { ITooltipDesktopProps } from \"@sberbusiness/triplex-next/components/Tooltip/types\";\n\n/** Десктоп версия компонента Tooltip. */\nexport class TooltipDesktop extends React.Component<ITooltipDesktopProps> {\n    public static displayName = \"TooltipDesktop\";\n    public static contextType = TooltipContext;\n\n    declare context: React.ContextType<typeof TooltipContext>;\n\n    private tooltip: Element | null = null;\n    private timeout?: number;\n\n    public render(): JSX.Element {\n        const { children, toggleType, ...rest } = this.props;\n\n        return <TooltipDesktopBase {...rest} setTooltipRef={this.setTooltipRef} />;\n    }\n\n    public componentDidMount(): void {\n        const { toggleType, targetRef } = this.props;\n\n        // Если Tooltip открывается по клику, то должен уметь закрываться по клику вне и по Esc.\n        if (this.props.isOpen) {\n            document.addEventListener(\"click\", this.closeIfOuterAction);\n            document.addEventListener(\"keydown\", this.closeIfEscapeKey);\n        }\n\n        if (targetRef.current && toggleType === \"hover\") {\n            this.addHoverListeners(targetRef.current);\n        }\n    }\n\n    public componentDidUpdate(prevProps: Readonly<ITooltipDesktopProps>): void {\n        const { targetRef } = this.props;\n        const isOpen = !prevProps.isOpen && this.props.isOpen;\n        const isClosed = prevProps.isOpen && !this.props.isOpen;\n\n        // Tooltip открылся.\n        if (isOpen) {\n            document.addEventListener(\"mousedown\", this.closeIfOuterAction);\n            document.addEventListener(\"keydown\", this.closeIfEscapeKey);\n        }\n\n        // Tooltip закрылся.\n        if (isClosed) {\n            document.removeEventListener(\"mousedown\", this.closeIfOuterAction);\n            document.removeEventListener(\"keydown\", this.closeIfEscapeKey);\n\n            if (this.props.toggleType === \"hover\") {\n                this.removeHoverListeners(this.tooltip!);\n            }\n        }\n\n        if (targetRef.current && prevProps.toggleType != this.props.toggleType) {\n            if (this.props.toggleType === \"hover\") {\n                this.addHoverListeners(targetRef.current);\n            } else if (prevProps.toggleType === \"hover\") {\n                this.removeHoverListeners(targetRef.current);\n            }\n        }\n    }\n\n    public componentWillUnmount(): void {\n        const { toggleType, targetRef } = this.props;\n\n        document.removeEventListener(\"mousedown\", this.closeIfOuterAction);\n        document.removeEventListener(\"keydown\", this.closeIfEscapeKey);\n\n        if (targetRef.current && toggleType === \"hover\") {\n            this.removeHoverListeners(targetRef.current);\n        }\n\n        clearTimeout(this.timeout);\n    }\n\n    private setTooltipRef = (node: HTMLDivElement | null) => {\n        const { toggleType } = this.props;\n\n        if (node && toggleType === \"hover\") {\n            this.addHoverListeners(node);\n        }\n\n        this.tooltip = node;\n    };\n\n    // Закрываем Tooltip при клике за его пределами.\n    private closeIfOuterAction = (event: Event) => {\n        const { targetRef } = this.props;\n        const { setTooltipOpen } = this.context;\n\n        if (targetRef.current && this.tooltip) {\n            const outOfTarget = !targetRef.current.contains(event.target as Node);\n            const outOfTooltip = !this.tooltip.contains(event.target as Node);\n\n            if (outOfTarget && outOfTooltip) {\n                setTooltipOpen(false);\n            }\n        }\n    };\n\n    // Закрываем Tooltip по нажатию Esc\n    private closeIfEscapeKey = (event: KeyboardEvent) => {\n        const key = event.code || event.keyCode;\n\n        if (isKey(key, \"ESCAPE\")) {\n            this.context.setTooltipOpen(false);\n        }\n    };\n\n    private addHoverListeners = (element: Element) => {\n        element.addEventListener(\"mouseenter\", this.handleMouseEnter);\n        element.addEventListener(\"mouseleave\", this.handleMouseLeave);\n    };\n\n    private removeHoverListeners = (element: Element) => {\n        element.removeEventListener(\"mouseenter\", this.handleMouseEnter);\n        element.removeEventListener(\"mouseleave\", this.handleMouseLeave);\n    };\n\n    private handleMouseEnter = () => {\n        const { tooltipOpen, targetHoveredRef, setTooltipOpen } = this.context;\n\n        if (!tooltipOpen) {\n            setTooltipOpen(true);\n            targetHoveredRef.current = true;\n        }\n        clearTimeout(this.timeout);\n    };\n\n    private handleMouseLeave = () => {\n        const { setTooltipOpen } = this.context;\n\n        this.timeout = window.setTimeout(() => {\n            setTooltipOpen(false);\n        }, 500);\n    };\n}\n"],"names":["React"],"mappings":"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"}