@itwin/appui-react 3.6.0-dev.8 → 3.6.0

package/lib/esm/appui-react/feedback/ElementTooltip.js

@@ -1,128 +1,128 @@
-/*---------------------------------------------------------------------------------------------
-* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
-* See LICENSE.md in the project root for license terms and full copyright notice.
-*--------------------------------------------------------------------------------------------*/
-/** @packageDocumentation
- * @module Notification
- */
-import classnames from "classnames";
-import * as React from "react";
-import { UiEvent } from "@itwin/appui-abstract";
-import { Rectangle } from "@itwin/core-react";
-import { offsetAndContainInContainer, Tooltip } from "@itwin/appui-layout-react";
-import { MessageDiv } from "../messages/MessageSpan";
-/** ElementTooltip Changed Event class.
- * @public
- */
-export class ElementTooltipChangedEvent extends UiEvent {
-}
-/** ElementTooltip React component.
- * @public
- */
-export class ElementTooltip extends React.Component {
-    constructor(props) {
-        super(props);
-        this._size = {
-            height: 0,
-            width: 0,
-        };
-        /** @internal */
-        this.state = {
-            message: "",
-            isVisible: false,
-            position: {
-                x: 0,
-                y: 0,
-            },
-        };
-        this._handleElementTooltipChangedEvent = (args) => {
-            this._element = args.el;
-            this._position = args.pt;
-            this.setState({
-                isVisible: args.isTooltipVisible,
-                message: args.message,
-            });
-            this.updatePosition();
-        };
-        // istanbul ignore next
-        this._handleSizeChanged = (size) => {
-            this._size = size;
-            this.updatePosition();
-        };
-    }
-    static get onElementTooltipChangedEvent() { return ElementTooltip._elementTooltipChangedEvent; }
-    static get isTooltipVisible() { return ElementTooltip._isTooltipVisible; }
-    static showTooltip(el, message, pt, options) {
-        // istanbul ignore if
-        if (ElementTooltip._isTooltipHalted)
-            return;
-        ElementTooltip._isTooltipVisible = true;
-        ElementTooltip.onElementTooltipChangedEvent.emit({ isTooltipVisible: true, el, message, pt, options });
-        el.ownerDocument.addEventListener("mousemove", ElementTooltip._handleMouseMove);
-    }
-    static hideTooltip() {
-        ElementTooltip._isTooltipVisible = false;
-        ElementTooltip.onElementTooltipChangedEvent.emit({ isTooltipVisible: false, message: "" });
-    }
-    // istanbul ignore next
-    static get isTooltipHalted() { return ElementTooltip._isTooltipHalted; }
-    // istanbul ignore next
-    static set isTooltipHalted(halt) {
-        ElementTooltip._isTooltipHalted = halt;
-        if (halt && ElementTooltip._isTooltipVisible)
-            ElementTooltip.hideTooltip();
-    }
-    render() {
-        if (!this.state.isVisible)
-            return null;
-        const className = classnames("uifw-element-tooltip", this.props.className);
-        const messageNode = React.createElement(MessageDiv, { message: this.state.message });
-        return (React.createElement("div", { className: "uifw-element-tooltip-container" },
-            React.createElement(Tooltip // eslint-disable-line deprecation/deprecation
-            , { className: className, style: this.props.style, position: this.state.position, onSizeChanged: this._handleSizeChanged }, messageNode)));
-    }
-    componentDidMount() {
-        ElementTooltip.onElementTooltipChangedEvent.addListener(this._handleElementTooltipChangedEvent);
-    }
-    componentWillUnmount() {
-        ElementTooltip.onElementTooltipChangedEvent.removeListener(this._handleElementTooltipChangedEvent);
-    }
-    static _handleMouseMove(event) {
-        const el = event.currentTarget;
-        /* Only monitor mouse movement when an ElementTooltip is open. */
-        if (el && ElementTooltip._isTooltipHalted || !ElementTooltip._isTooltipVisible) {
-            el.removeEventListener("mousemove", ElementTooltip._handleMouseMove);
-            return;
-        }
-        const hoveredElement = el ? el.elementFromPoint(event.clientX, event.clientY) : undefined;
-        /* If the mouse has moved to an element that is not the view canvas, close the ElementTooltip. */
-        // istanbul ignore next.
-        if (hoveredElement && hoveredElement.localName !== "canvas") {
-            ElementTooltip.onElementTooltipChangedEvent.emit({ isTooltipVisible: false, message: "" });
-            el.removeEventListener("mousemove", ElementTooltip._handleMouseMove);
-            return;
-        }
-    }
-    updatePosition() {
-        this.setState((prevState) => {
-            if (!this._element)
-                return null;
-            // istanbul ignore next
-            if (!this._position)
-                return null;
-            const containerBounds = Rectangle.create(this._element.getBoundingClientRect());
-            const relativeBounds = Rectangle.createFromSize(this._size).offset(this._position);
-            const adjustedPosition = offsetAndContainInContainer(relativeBounds, containerBounds.getSize(), { x: 8, y: 8 });
-            const position = adjustedPosition.offset(containerBounds.topLeft());
-            // istanbul ignore else
-            if (position.equals(prevState.position))
-                return null;
-            // istanbul ignore next
-            return {
-                position,
-            };
-        });
-    }
-}
-ElementTooltip._elementTooltipChangedEvent = new ElementTooltipChangedEvent();
+/*---------------------------------------------------------------------------------------------
+* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+* See LICENSE.md in the project root for license terms and full copyright notice.
+*--------------------------------------------------------------------------------------------*/
+/** @packageDocumentation
+ * @module Notification
+ */
+import classnames from "classnames";
+import * as React from "react";
+import { UiEvent } from "@itwin/appui-abstract";
+import { Rectangle } from "@itwin/core-react";
+import { offsetAndContainInContainer, Tooltip } from "@itwin/appui-layout-react";
+import { MessageDiv } from "../messages/MessageSpan";
+/** ElementTooltip Changed Event class.
+ * @public
+ */
+export class ElementTooltipChangedEvent extends UiEvent {
+}
+/** ElementTooltip React component.
+ * @public
+ */
+export class ElementTooltip extends React.Component {
+    constructor(props) {
+        super(props);
+        this._size = {
+            height: 0,
+            width: 0,
+        };
+        /** @internal */
+        this.state = {
+            message: "",
+            isVisible: false,
+            position: {
+                x: 0,
+                y: 0,
+            },
+        };
+        this._handleElementTooltipChangedEvent = (args) => {
+            this._element = args.el;
+            this._position = args.pt;
+            this.setState({
+                isVisible: args.isTooltipVisible,
+                message: args.message,
+            });
+            this.updatePosition();
+        };
+        // istanbul ignore next
+        this._handleSizeChanged = (size) => {
+            this._size = size;
+            this.updatePosition();
+        };
+    }
+    static get onElementTooltipChangedEvent() { return ElementTooltip._elementTooltipChangedEvent; }
+    static get isTooltipVisible() { return ElementTooltip._isTooltipVisible; }
+    static showTooltip(el, message, pt, options) {
+        // istanbul ignore if
+        if (ElementTooltip._isTooltipHalted)
+            return;
+        ElementTooltip._isTooltipVisible = true;
+        ElementTooltip.onElementTooltipChangedEvent.emit({ isTooltipVisible: true, el, message, pt, options });
+        el.ownerDocument.addEventListener("mousemove", ElementTooltip._handleMouseMove);
+    }
+    static hideTooltip() {
+        ElementTooltip._isTooltipVisible = false;
+        ElementTooltip.onElementTooltipChangedEvent.emit({ isTooltipVisible: false, message: "" });
+    }
+    // istanbul ignore next
+    static get isTooltipHalted() { return ElementTooltip._isTooltipHalted; }
+    // istanbul ignore next
+    static set isTooltipHalted(halt) {
+        ElementTooltip._isTooltipHalted = halt;
+        if (halt && ElementTooltip._isTooltipVisible)
+            ElementTooltip.hideTooltip();
+    }
+    render() {
+        if (!this.state.isVisible)
+            return null;
+        const className = classnames("uifw-element-tooltip", this.props.className);
+        const messageNode = React.createElement(MessageDiv, { message: this.state.message });
+        return (React.createElement("div", { className: "uifw-element-tooltip-container" },
+            React.createElement(Tooltip // eslint-disable-line deprecation/deprecation
+            , { className: className, style: this.props.style, position: this.state.position, onSizeChanged: this._handleSizeChanged }, messageNode)));
+    }
+    componentDidMount() {
+        ElementTooltip.onElementTooltipChangedEvent.addListener(this._handleElementTooltipChangedEvent);
+    }
+    componentWillUnmount() {
+        ElementTooltip.onElementTooltipChangedEvent.removeListener(this._handleElementTooltipChangedEvent);
+    }
+    static _handleMouseMove(event) {
+        const el = event.currentTarget;
+        /* Only monitor mouse movement when an ElementTooltip is open. */
+        if (el && ElementTooltip._isTooltipHalted || !ElementTooltip._isTooltipVisible) {
+            el.removeEventListener("mousemove", ElementTooltip._handleMouseMove);
+            return;
+        }
+        const hoveredElement = el ? el.elementFromPoint(event.clientX, event.clientY) : undefined;
+        /* If the mouse has moved to an element that is not the view canvas, close the ElementTooltip. */
+        // istanbul ignore next.
+        if (hoveredElement && hoveredElement.localName !== "canvas") {
+            ElementTooltip.onElementTooltipChangedEvent.emit({ isTooltipVisible: false, message: "" });
+            el.removeEventListener("mousemove", ElementTooltip._handleMouseMove);
+            return;
+        }
+    }
+    updatePosition() {
+        this.setState((prevState) => {
+            if (!this._element)
+                return null;
+            // istanbul ignore next
+            if (!this._position)
+                return null;
+            const containerBounds = Rectangle.create(this._element.getBoundingClientRect());
+            const relativeBounds = Rectangle.createFromSize(this._size).offset(this._position);
+            const adjustedPosition = offsetAndContainInContainer(relativeBounds, containerBounds.getSize(), { x: 8, y: 8 });
+            const position = adjustedPosition.offset(containerBounds.topLeft());
+            // istanbul ignore else
+            if (position.equals(prevState.position))
+                return null;
+            // istanbul ignore next
+            return {
+                position,
+            };
+        });
+    }
+}
+ElementTooltip._elementTooltipChangedEvent = new ElementTooltipChangedEvent();
 //# sourceMappingURL=ElementTooltip.js.map

package/lib/esm/appui-react/feedback/ElementTooltip.js.map

@@ -1 +1 @@
-{"version":3,"file":"ElementTooltip.js","sourceRoot":"","sources":["../../../../src/appui-react/feedback/ElementTooltip.tsx"],"names":[],"mappings":"AAAA;;;+FAG+F;AAC/F;;GAEG;AAEH,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAc,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAC5D,OAAO,EAAsB,SAAS,EAAa,MAAM,mBAAmB,CAAC;AAC7E,OAAO,EAAE,2BAA2B,EAAE,OAAO,EAAE,MAAM,2BAA2B,CAAC;AACjF,OAAO,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAwBrD;;GAEG;AACH,MAAM,OAAO,0BAA2B,SAAQ,OAAuC;CAAI;AAE3F;;GAEG;AACH,MAAM,OAAO,cAAe,SAAQ,KAAK,CAAC,SAA2C;IAgDnF,YAAY,KAAkB;QAC5B,KAAK,CAAC,KAAK,CAAC,CAAC;QAlBP,UAAK,GAAc;YACzB,MAAM,EAAE,CAAC;YACT,KAAK,EAAE,CAAC;SACT,CAAC;QAIF,gBAAgB;QACS,UAAK,GAAkC;YAC9D,OAAO,EAAE,EAAE;YACX,SAAS,EAAE,KAAK;YAChB,QAAQ,EAAE;gBACR,CAAC,EAAE,CAAC;gBACJ,CAAC,EAAE,CAAC;aACL;SACF,CAAC;QAsDM,sCAAiC,GAAG,CAAC,IAAoC,EAAE,EAAE;YACnF,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,EAAE,CAAC;YACxB,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,EAAE,CAAC;YACzB,IAAI,CAAC,QAAQ,CAAC;gBACZ,SAAS,EAAE,IAAI,CAAC,gBAAgB;gBAChC,OAAO,EAAE,IAAI,CAAC,OAAO;aACtB,CAAC,CAAC;YACH,IAAI,CAAC,cAAc,EAAE,CAAC;QACxB,CAAC,CAAC;QAEF,uBAAuB;QACf,uBAAkB,GAAG,CAAC,IAAe,EAAE,EAAE;YAC/C,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC;YAClB,IAAI,CAAC,cAAc,EAAE,CAAC;QACxB,CAAC,CAAC;IAhEF,CAAC;IA7CM,MAAM,KAAK,4BAA4B,KAAiC,OAAO,cAAc,CAAC,2BAA2B,CAAC,CAAC,CAAC;IAC5H,MAAM,KAAK,gBAAgB,KAAc,OAAO,cAAc,CAAC,iBAAiB,CAAC,CAAC,CAAC;IAEnF,MAAM,CAAC,WAAW,CAAC,EAAe,EAAE,OAA0B,EAAE,EAAU,EAAE,OAAwB;QACzG,qBAAqB;QACrB,IAAI,cAAc,CAAC,gBAAgB;YACjC,OAAO;QACT,cAAc,CAAC,iBAAiB,GAAG,IAAI,CAAC;QACxC,cAAc,CAAC,4BAA4B,CAAC,IAAI,CAAC,EAAE,gBAAgB,EAAE,IAAI,EAAE,EAAE,EAAE,OAAO,EAAE,EAAE,EAAE,OAAO,EAAE,CAAC,CAAC;QACvG,EAAE,CAAC,aAAa,CAAC,gBAAgB,CAAC,WAAW,EAAE,cAAc,CAAC,gBAAgB,CAAC,CAAC;IAClF,CAAC;IAEM,MAAM,CAAC,WAAW;QACvB,cAAc,CAAC,iBAAiB,GAAG,KAAK,CAAC;QACzC,cAAc,CAAC,4BAA4B,CAAC,IAAI,CAAC,EAAE,gBAAgB,EAAE,KAAK,EAAE,OAAO,EAAE,EAAE,EAAE,CAAC,CAAC;IAC7F,CAAC;IAED,uBAAuB;IAChB,MAAM,KAAK,eAAe,KAAc,OAAO,cAAc,CAAC,gBAAgB,CAAC,CAAC,CAAC;IACxF,uBAAuB;IAChB,MAAM,KAAK,eAAe,CAAC,IAAa;QAC7C,cAAc,CAAC,gBAAgB,GAAG,IAAI,CAAC;QACvC,IAAI,IAAI,IAAI,cAAc,CAAC,iBAAiB;YAC1C,cAAc,CAAC,WAAW,EAAE,CAAC;IACjC,CAAC;IAuBe,MAAM;QACpB,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,SAAS;YACvB,OAAO,IAAI,CAAC;QAEd,MAAM,SAAS,GAAG,UAAU,CAC1B,sBAAsB,EACtB,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC;QAExB,MAAM,WAAW,GAAG,oBAAC,UAAU,IAAC,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,OAAO,GAAI,CAAC;QAEhE,OAAO,CACL,6BAAK,SAAS,EAAC,gCAAgC;YAC7C,oBAAC,OAAO,CAAC,8CAA8C;gBACrD,SAAS,EAAE,SAAS,EACpB,KAAK,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,EACvB,QAAQ,EAAE,IAAI,CAAC,KAAK,CAAC,QAAQ,EAC7B,aAAa,EAAE,IAAI,CAAC,kBAAkB,IAErC,WAAW,CACJ,CACN,CACP,CAAC;IACJ,CAAC;IAEe,iBAAiB;QAC/B,cAAc,CAAC,4BAA4B,CAAC,WAAW,CAAC,IAAI,CAAC,iCAAiC,CAAC,CAAC;IAClG,CAAC;IAEe,oBAAoB;QAClC,cAAc,CAAC,4BAA4B,CAAC,cAAc,CAAC,IAAI,CAAC,iCAAiC,CAAC,CAAC;IACrG,CAAC;IAEO,MAAM,CAAC,gBAAgB,CAAC,KAAiB;QAC/C,MAAM,EAAE,GAAG,KAAK,CAAC,aAAyB,CAAC;QAC3C,iEAAiE;QACjE,IAAI,EAAE,IAAI,cAAc,CAAC,gBAAgB,IAAI,CAAC,cAAc,CAAC,iBAAiB,EAAE;YAC9E,EAAE,CAAC,mBAAmB,CAAC,WAAW,EAAE,cAAc,CAAC,gBAAgB,CAAC,CAAC;YACrE,OAAO;SACR;QACD,MAAM,cAAc,GAAG,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,gBAAgB,CAAC,KAAK,CAAC,OAAO,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC;QAC1F,iGAAiG;QACjG,wBAAwB;QACxB,IAAI,cAAc,IAAI,cAAc,CAAC,SAAS,KAAK,QAAQ,EAAE;YAC3D,cAAc,CAAC,4BAA4B,CAAC,IAAI,CAAC,EAAE,gBAAgB,EAAE,KAAK,EAAE,OAAO,EAAE,EAAE,EAAE,CAAC,CAAC;YAC3F,EAAE,CAAC,mBAAmB,CAAC,WAAW,EAAE,cAAc,CAAC,gBAAgB,CAAC,CAAC;YACrE,OAAO;SACR;IACH,CAAC;IAiBO,cAAc;QACpB,IAAI,CAAC,QAAQ,CAAC,CAAC,SAAS,EAAE,EAAE;YAC1B,IAAI,CAAC,IAAI,CAAC,QAAQ;gBAChB,OAAO,IAAI,CAAC;YACd,uBAAuB;YACvB,IAAI,CAAC,IAAI,CAAC,SAAS;gBACjB,OAAO,IAAI,CAAC;YAEd,MAAM,eAAe,GAAG,SAAS,CAAC,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAC,qBAAqB,EAAE,CAAC,CAAC;YAChF,MAAM,cAAc,GAAG,SAAS,CAAC,cAAc,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;YACnF,MAAM,gBAAgB,GAAU,2BAA2B,CAAC,cAAc,EAAE,eAAe,CAAC,OAAO,EAAE,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC;YACvH,MAAM,QAAQ,GAAG,gBAAgB,CAAC,MAAM,CAAC,eAAe,CAAC,OAAO,EAAE,CAAC,CAAC;YAEpE,uBAAuB;YACvB,IAAI,QAAQ,CAAC,MAAM,CAAC,SAAS,CAAC,QAAQ,CAAC;gBACrC,OAAO,IAAI,CAAC;YAEd,uBAAuB;YACvB,OAAO;gBACL,QAAQ;aACT,CAAC;QACJ,CAAC,CAAC,CAAC;IACL,CAAC;;AAzIc,0CAA2B,GAA+B,IAAI,0BAA0B,EAAE,CAAC","sourcesContent":["/*---------------------------------------------------------------------------------------------\r\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\r\n* See LICENSE.md in the project root for license terms and full copyright notice.\r\n*--------------------------------------------------------------------------------------------*/\r\n/** @packageDocumentation\r\n * @module Notification\r\n */\r\n\r\nimport classnames from \"classnames\";\r\nimport * as React from \"react\";\r\nimport { XAndY } from \"@itwin/core-geometry\";\r\nimport { ToolTipOptions } from \"@itwin/core-frontend\";\r\nimport { PointProps, UiEvent } from \"@itwin/appui-abstract\";\r\nimport { CommonProps, Point, Rectangle, SizeProps } from \"@itwin/core-react\";\r\nimport { offsetAndContainInContainer, Tooltip } from \"@itwin/appui-layout-react\";\r\nimport { MessageDiv } from \"../messages/MessageSpan\";\r\nimport { NotifyMessageType } from \"../messages/ReactNotifyMessageDetails\";\r\n\r\n/** [[ElementTooltip]] State.\r\n * @internal\r\n */\r\ninterface ElementTooltipState {\r\n  isVisible: boolean;\r\n  message: NotifyMessageType;\r\n  position: PointProps;\r\n  options?: ToolTipOptions;\r\n}\r\n\r\n/** [[ElementTooltipChangedEvent]] arguments.\r\n * @public\r\n */\r\nexport interface ElementTooltipChangedEventArgs {\r\n  isTooltipVisible: boolean;\r\n  message: NotifyMessageType;\r\n  el?: HTMLElement;\r\n  pt?: XAndY;\r\n  options?: ToolTipOptions;\r\n}\r\n\r\n/** ElementTooltip Changed Event class.\r\n * @public\r\n */\r\nexport class ElementTooltipChangedEvent extends UiEvent<ElementTooltipChangedEventArgs> { }\r\n\r\n/** ElementTooltip React component.\r\n * @public\r\n */\r\nexport class ElementTooltip extends React.Component<CommonProps, ElementTooltipState> {\r\n  private static _elementTooltipChangedEvent: ElementTooltipChangedEvent = new ElementTooltipChangedEvent();\r\n  private static _isTooltipVisible: boolean;\r\n  private static _isTooltipHalted: boolean;\r\n\r\n  public static get onElementTooltipChangedEvent(): ElementTooltipChangedEvent { return ElementTooltip._elementTooltipChangedEvent; }\r\n  public static get isTooltipVisible(): boolean { return ElementTooltip._isTooltipVisible; }\r\n\r\n  public static showTooltip(el: HTMLElement, message: NotifyMessageType, pt?: XAndY, options?: ToolTipOptions): void {\r\n    // istanbul ignore if\r\n    if (ElementTooltip._isTooltipHalted)\r\n      return;\r\n    ElementTooltip._isTooltipVisible = true;\r\n    ElementTooltip.onElementTooltipChangedEvent.emit({ isTooltipVisible: true, el, message, pt, options });\r\n    el.ownerDocument.addEventListener(\"mousemove\", ElementTooltip._handleMouseMove);\r\n  }\r\n\r\n  public static hideTooltip(): void {\r\n    ElementTooltip._isTooltipVisible = false;\r\n    ElementTooltip.onElementTooltipChangedEvent.emit({ isTooltipVisible: false, message: \"\" });\r\n  }\r\n\r\n  // istanbul ignore next\r\n  public static get isTooltipHalted(): boolean { return ElementTooltip._isTooltipHalted; }\r\n  // istanbul ignore next\r\n  public static set isTooltipHalted(halt: boolean) {\r\n    ElementTooltip._isTooltipHalted = halt;\r\n    if (halt && ElementTooltip._isTooltipVisible)\r\n      ElementTooltip.hideTooltip();\r\n  }\r\n\r\n  private _size: SizeProps = {\r\n    height: 0,\r\n    width: 0,\r\n  };\r\n  private _element?: HTMLElement;\r\n  private _position?: PointProps;\r\n\r\n  /** @internal */\r\n  public override readonly state: Readonly<ElementTooltipState> = {\r\n    message: \"\",\r\n    isVisible: false,\r\n    position: {\r\n      x: 0,\r\n      y: 0,\r\n    },\r\n  };\r\n\r\n  constructor(props: CommonProps) {\r\n    super(props);\r\n  }\r\n\r\n  public override render() {\r\n    if (!this.state.isVisible)\r\n      return null;\r\n\r\n    const className = classnames(\r\n      \"uifw-element-tooltip\",\r\n      this.props.className);\r\n\r\n    const messageNode = <MessageDiv message={this.state.message} />;\r\n\r\n    return (\r\n      <div className=\"uifw-element-tooltip-container\">\r\n        <Tooltip // eslint-disable-line deprecation/deprecation\r\n          className={className}\r\n          style={this.props.style}\r\n          position={this.state.position}\r\n          onSizeChanged={this._handleSizeChanged}\r\n        >\r\n          {messageNode}\r\n        </Tooltip>\r\n      </div>\r\n    );\r\n  }\r\n\r\n  public override componentDidMount(): void {\r\n    ElementTooltip.onElementTooltipChangedEvent.addListener(this._handleElementTooltipChangedEvent);\r\n  }\r\n\r\n  public override componentWillUnmount(): void {\r\n    ElementTooltip.onElementTooltipChangedEvent.removeListener(this._handleElementTooltipChangedEvent);\r\n  }\r\n\r\n  private static _handleMouseMove(event: MouseEvent) {\r\n    const el = event.currentTarget as Document;\r\n    /* Only monitor mouse movement when an ElementTooltip is open. */\r\n    if (el && ElementTooltip._isTooltipHalted || !ElementTooltip._isTooltipVisible) {\r\n      el.removeEventListener(\"mousemove\", ElementTooltip._handleMouseMove);\r\n      return;\r\n    }\r\n    const hoveredElement = el ? el.elementFromPoint(event.clientX, event.clientY) : undefined;\r\n    /* If the mouse has moved to an element that is not the view canvas, close the ElementTooltip. */\r\n    // istanbul ignore next.\r\n    if (hoveredElement && hoveredElement.localName !== \"canvas\") {\r\n      ElementTooltip.onElementTooltipChangedEvent.emit({ isTooltipVisible: false, message: \"\" });\r\n      el.removeEventListener(\"mousemove\", ElementTooltip._handleMouseMove);\r\n      return;\r\n    }\r\n  }\r\n  private _handleElementTooltipChangedEvent = (args: ElementTooltipChangedEventArgs) => {\r\n    this._element = args.el;\r\n    this._position = args.pt;\r\n    this.setState({\r\n      isVisible: args.isTooltipVisible,\r\n      message: args.message,\r\n    });\r\n    this.updatePosition();\r\n  };\r\n\r\n  // istanbul ignore next\r\n  private _handleSizeChanged = (size: SizeProps) => {\r\n    this._size = size;\r\n    this.updatePosition();\r\n  };\r\n\r\n  private updatePosition() {\r\n    this.setState((prevState) => {\r\n      if (!this._element)\r\n        return null;\r\n      // istanbul ignore next\r\n      if (!this._position)\r\n        return null;\r\n\r\n      const containerBounds = Rectangle.create(this._element.getBoundingClientRect());\r\n      const relativeBounds = Rectangle.createFromSize(this._size).offset(this._position);\r\n      const adjustedPosition: Point = offsetAndContainInContainer(relativeBounds, containerBounds.getSize(), { x: 8, y: 8 });\r\n      const position = adjustedPosition.offset(containerBounds.topLeft());\r\n\r\n      // istanbul ignore else\r\n      if (position.equals(prevState.position))\r\n        return null;\r\n\r\n      // istanbul ignore next\r\n      return {\r\n        position,\r\n      };\r\n    });\r\n  }\r\n}\r\n"]}
+{"version":3,"file":"ElementTooltip.js","sourceRoot":"","sources":["../../../../src/appui-react/feedback/ElementTooltip.tsx"],"names":[],"mappings":"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","sourcesContent":["/*---------------------------------------------------------------------------------------------\n* Copyright (c) Bentley Systems, Incorporated. All rights reserved.\n* See LICENSE.md in the project root for license terms and full copyright notice.\n*--------------------------------------------------------------------------------------------*/\n/** @packageDocumentation\n * @module Notification\n */\n\nimport classnames from \"classnames\";\nimport * as React from \"react\";\nimport { XAndY } from \"@itwin/core-geometry\";\nimport { ToolTipOptions } from \"@itwin/core-frontend\";\nimport { PointProps, UiEvent } from \"@itwin/appui-abstract\";\nimport { CommonProps, Point, Rectangle, SizeProps } from \"@itwin/core-react\";\nimport { offsetAndContainInContainer, Tooltip } from \"@itwin/appui-layout-react\";\nimport { MessageDiv } from \"../messages/MessageSpan\";\nimport { NotifyMessageType } from \"../messages/ReactNotifyMessageDetails\";\n\n/** [[ElementTooltip]] State.\n * @internal\n */\ninterface ElementTooltipState {\n  isVisible: boolean;\n  message: NotifyMessageType;\n  position: PointProps;\n  options?: ToolTipOptions;\n}\n\n/** [[ElementTooltipChangedEvent]] arguments.\n * @public\n */\nexport interface ElementTooltipChangedEventArgs {\n  isTooltipVisible: boolean;\n  message: NotifyMessageType;\n  el?: HTMLElement;\n  pt?: XAndY;\n  options?: ToolTipOptions;\n}\n\n/** ElementTooltip Changed Event class.\n * @public\n */\nexport class ElementTooltipChangedEvent extends UiEvent<ElementTooltipChangedEventArgs> { }\n\n/** ElementTooltip React component.\n * @public\n */\nexport class ElementTooltip extends React.Component<CommonProps, ElementTooltipState> {\n  private static _elementTooltipChangedEvent: ElementTooltipChangedEvent = new ElementTooltipChangedEvent();\n  private static _isTooltipVisible: boolean;\n  private static _isTooltipHalted: boolean;\n\n  public static get onElementTooltipChangedEvent(): ElementTooltipChangedEvent { return ElementTooltip._elementTooltipChangedEvent; }\n  public static get isTooltipVisible(): boolean { return ElementTooltip._isTooltipVisible; }\n\n  public static showTooltip(el: HTMLElement, message: NotifyMessageType, pt?: XAndY, options?: ToolTipOptions): void {\n    // istanbul ignore if\n    if (ElementTooltip._isTooltipHalted)\n      return;\n    ElementTooltip._isTooltipVisible = true;\n    ElementTooltip.onElementTooltipChangedEvent.emit({ isTooltipVisible: true, el, message, pt, options });\n    el.ownerDocument.addEventListener(\"mousemove\", ElementTooltip._handleMouseMove);\n  }\n\n  public static hideTooltip(): void {\n    ElementTooltip._isTooltipVisible = false;\n    ElementTooltip.onElementTooltipChangedEvent.emit({ isTooltipVisible: false, message: \"\" });\n  }\n\n  // istanbul ignore next\n  public static get isTooltipHalted(): boolean { return ElementTooltip._isTooltipHalted; }\n  // istanbul ignore next\n  public static set isTooltipHalted(halt: boolean) {\n    ElementTooltip._isTooltipHalted = halt;\n    if (halt && ElementTooltip._isTooltipVisible)\n      ElementTooltip.hideTooltip();\n  }\n\n  private _size: SizeProps = {\n    height: 0,\n    width: 0,\n  };\n  private _element?: HTMLElement;\n  private _position?: PointProps;\n\n  /** @internal */\n  public override readonly state: Readonly<ElementTooltipState> = {\n    message: \"\",\n    isVisible: false,\n    position: {\n      x: 0,\n      y: 0,\n    },\n  };\n\n  constructor(props: CommonProps) {\n    super(props);\n  }\n\n  public override render() {\n    if (!this.state.isVisible)\n      return null;\n\n    const className = classnames(\n      \"uifw-element-tooltip\",\n      this.props.className);\n\n    const messageNode = <MessageDiv message={this.state.message} />;\n\n    return (\n      <div className=\"uifw-element-tooltip-container\">\n        <Tooltip // eslint-disable-line deprecation/deprecation\n          className={className}\n          style={this.props.style}\n          position={this.state.position}\n          onSizeChanged={this._handleSizeChanged}\n        >\n          {messageNode}\n        </Tooltip>\n      </div>\n    );\n  }\n\n  public override componentDidMount(): void {\n    ElementTooltip.onElementTooltipChangedEvent.addListener(this._handleElementTooltipChangedEvent);\n  }\n\n  public override componentWillUnmount(): void {\n    ElementTooltip.onElementTooltipChangedEvent.removeListener(this._handleElementTooltipChangedEvent);\n  }\n\n  private static _handleMouseMove(event: MouseEvent) {\n    const el = event.currentTarget as Document;\n    /* Only monitor mouse movement when an ElementTooltip is open. */\n    if (el && ElementTooltip._isTooltipHalted || !ElementTooltip._isTooltipVisible) {\n      el.removeEventListener(\"mousemove\", ElementTooltip._handleMouseMove);\n      return;\n    }\n    const hoveredElement = el ? el.elementFromPoint(event.clientX, event.clientY) : undefined;\n    /* If the mouse has moved to an element that is not the view canvas, close the ElementTooltip. */\n    // istanbul ignore next.\n    if (hoveredElement && hoveredElement.localName !== \"canvas\") {\n      ElementTooltip.onElementTooltipChangedEvent.emit({ isTooltipVisible: false, message: \"\" });\n      el.removeEventListener(\"mousemove\", ElementTooltip._handleMouseMove);\n      return;\n    }\n  }\n  private _handleElementTooltipChangedEvent = (args: ElementTooltipChangedEventArgs) => {\n    this._element = args.el;\n    this._position = args.pt;\n    this.setState({\n      isVisible: args.isTooltipVisible,\n      message: args.message,\n    });\n    this.updatePosition();\n  };\n\n  // istanbul ignore next\n  private _handleSizeChanged = (size: SizeProps) => {\n    this._size = size;\n    this.updatePosition();\n  };\n\n  private updatePosition() {\n    this.setState((prevState) => {\n      if (!this._element)\n        return null;\n      // istanbul ignore next\n      if (!this._position)\n        return null;\n\n      const containerBounds = Rectangle.create(this._element.getBoundingClientRect());\n      const relativeBounds = Rectangle.createFromSize(this._size).offset(this._position);\n      const adjustedPosition: Point = offsetAndContainInContainer(relativeBounds, containerBounds.getSize(), { x: 8, y: 8 });\n      const position = adjustedPosition.offset(containerBounds.topLeft());\n\n      // istanbul ignore else\n      if (position.equals(prevState.position))\n        return null;\n\n      // istanbul ignore next\n      return {\n        position,\n      };\n    });\n  }\n}\n"]}

package/lib/esm/appui-react/feedback/ValidationTextbox.d.ts

@@ -1,72 +1,72 @@
-/** @packageDocumentation
- * @module Notification
- */
-import "./ValidationTextbox.scss";
-import * as React from "react";
-import { CommonProps } from "@itwin/core-react";
-/** Enum for Input Status used in [[ValidationTextbox]]
- * @alpha
- */
-export declare enum InputStatus {
-    Valid = 0,
-    Invalid = 1
-}
-/** Property interface for ValidationTextbox
- * @alpha
- */
-interface ValidationTextboxProps extends CommonProps {
-    /** value to set ValidationTextbox to initially */
-    initialValue?: string;
-    /** placeholder value to show in gray before anything is entered in */
-    placeholder?: string;
-    /** triggered when the content of ValidationTextbox is changed. Return true if valid */
-    onValueChanged?: (value: string) => InputStatus;
-    /** listens for <Enter> key presses */
-    onEnterPressed?: () => void;
-    /** listens for <Esc> key presses */
-    onEscPressed?: () => void;
-    /** width of ValidationTextbox, measured in em */
-    size?: number;
-    /** Error message to display */
-    errorText?: string;
-    /** Detailed error message to display */
-    detailedErrorText?: string;
-}
-interface ValidationTextboxState {
-    isValid: boolean;
-}
-/**
- * Input box that validates text based on provided criteria. Defaults to checking
- * for empty if no method for onValueChanged is provided.
- * @alpha
- */
-export declare class ValidationTextbox extends React.PureComponent<ValidationTextboxProps, ValidationTextboxState> {
-    constructor(props: ValidationTextboxProps);
-    /** @internal */
-    render(): React.ReactNode;
-    private processValidateText;
-    /**
-     * Determines if value is valid and resolves any defined functions.
-     * Also will show or hide error message if defined.
-     * @param event   Button press event that triggers validation
-     */
-    private _validateText;
-    /**
-     * Determines if value provided is valid by calling user defined
-     * function. If no function is provided, the default criteria for
-     * validity is if the value has been defined.
-     * @param value   The value provided in textbox
-     */
-    private _calculateIsValid;
-    /** Hides error message */
-    private _hideErrorMessage;
-    /** Displays error message. */
-    private _showErrorMessage;
-    /**
-     * Manages special key codes by calling user defined functions
-     * @param event   Keyup event
-     */
-    private _handleKeyUp;
-}
-export {};
+/** @packageDocumentation
+ * @module Notification
+ */
+import "./ValidationTextbox.scss";
+import * as React from "react";
+import { CommonProps } from "@itwin/core-react";
+/** Enum for Input Status used in [[ValidationTextbox]]
+ * @alpha
+ */
+export declare enum InputStatus {
+    Valid = 0,
+    Invalid = 1
+}
+/** Property interface for ValidationTextbox
+ * @alpha
+ */
+interface ValidationTextboxProps extends CommonProps {
+    /** value to set ValidationTextbox to initially */
+    initialValue?: string;
+    /** placeholder value to show in gray before anything is entered in */
+    placeholder?: string;
+    /** triggered when the content of ValidationTextbox is changed. Return true if valid */
+    onValueChanged?: (value: string) => InputStatus;
+    /** listens for <Enter> key presses */
+    onEnterPressed?: () => void;
+    /** listens for <Esc> key presses */
+    onEscPressed?: () => void;
+    /** width of ValidationTextbox, measured in em */
+    size?: number;
+    /** Error message to display */
+    errorText?: string;
+    /** Detailed error message to display */
+    detailedErrorText?: string;
+}
+interface ValidationTextboxState {
+    isValid: boolean;
+}
+/**
+ * Input box that validates text based on provided criteria. Defaults to checking
+ * for empty if no method for onValueChanged is provided.
+ * @alpha
+ */
+export declare class ValidationTextbox extends React.PureComponent<ValidationTextboxProps, ValidationTextboxState> {
+    constructor(props: ValidationTextboxProps);
+    /** @internal */
+    render(): React.ReactNode;
+    private processValidateText;
+    /**
+     * Determines if value is valid and resolves any defined functions.
+     * Also will show or hide error message if defined.
+     * @param event   Button press event that triggers validation
+     */
+    private _validateText;
+    /**
+     * Determines if value provided is valid by calling user defined
+     * function. If no function is provided, the default criteria for
+     * validity is if the value has been defined.
+     * @param value   The value provided in textbox
+     */
+    private _calculateIsValid;
+    /** Hides error message */
+    private _hideErrorMessage;
+    /** Displays error message. */
+    private _showErrorMessage;
+    /**
+     * Manages special key codes by calling user defined functions
+     * @param event   Keyup event
+     */
+    private _handleKeyUp;
+}
+export {};
 //# sourceMappingURL=ValidationTextbox.d.ts.map