@itwin/core-react 5.18.0 → 5.20.0

package/lib/core-react/messagebox/MessageBox.js.map

@@ -1 +1 @@
-{"version":3,"file":"MessageBox.js","sourceRoot":"","sources":["../../../src/core-react/messagebox/MessageBox.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 Dialog\n */\n\nimport \"./MessageBox.scss\";\nimport classnames from \"classnames\";\nimport * as React from \"react\";\nimport type { DialogButtonDef } from \"@itwin/appui-abstract\";\nimport { MessageSeverity } from \"@itwin/appui-abstract\";\nimport type { CommonProps } from \"../utils/Props.js\";\nimport {\n  SvgHelpCircular,\n  SvgHelpCircularHollow,\n  SvgInfoCircular,\n  SvgInfoCircularHollow,\n  SvgStatusError,\n  SvgStatusErrorHollow,\n  SvgStatusRejected,\n  SvgStatusRejectedHollow,\n  SvgStatusSuccess,\n  SvgStatusSuccessHollow,\n  SvgStatusWarning,\n} from \"@itwin/itwinui-icons-react\";\nimport { Icon } from \"@itwin/itwinui-react\";\nimport type { IconSpec } from \"../icons/IconComponent.js\";\nimport { Dialog } from \"../dialog/Dialog.js\";\n\n/* eslint-disable @typescript-eslint/no-deprecated */\n\n/** Properties for the [[MessageBox]] component\n * @public\n * @deprecated in 4.15.0. Props of deprecated {@link MessageBox} component.\n */\nexport interface MessageBoxProps extends CommonProps {\n  /** Severity of MessageBox */\n  severity: MessageSeverity;\n  /** whether to show dialog or not */\n  opened: boolean;\n  /** List of [[DialogButtonDef]] objects specifying buttons and associated onClick events */\n  buttonCluster: DialogButtonDef[];\n  /** Title to show in title bar of dialog  */\n  title?: string | React.ReactElement;\n  /** onClick event for X button for dialog */\n  onClose?: () => void;\n  /** 'keyup' event for <Esc> key */\n  onEscape?: () => void;\n  /** minimum width that the dialog may be resized to. Default: 400 */\n  minWidth?: number;\n  /** minimum height that the dialog may be resized to. Default: 400 */\n  minHeight?: number;\n  /** initial width of dialog.\n   * Displayed in px if value is a number, otherwise displayed in specified CSS unit.\n   * Default: \"50%\"\n   */\n  width?: string | number;\n  /** initial height of dialog.\n   * Displayed in px if value is a number, otherwise displayed in specified CSS unit.\n   * Default: \"\"\n   */\n  height?: string | number;\n  /** Whether to show background overlay. Default: true */\n  modal?: boolean;\n  /** Custom CSS class name for the content */\n  contentClassName?: string;\n  /** Custom CSS Style for the content */\n  contentStyle?: React.CSSProperties;\n  /** Message content */\n  children?: React.ReactNode;\n}\n\n/** Message Box React component.\n * @public\n * @deprecated in 4.15.0. Use {@link https://itwinui.bentley.com/docs/dialog iTwinUI Dialog} instead.\n */\nexport class MessageBox extends React.PureComponent<MessageBoxProps> {\n  public static defaultProps: Partial<MessageBoxProps> = {\n    minWidth: 400,\n    minHeight: 400,\n    width: \"512px\",\n    modal: true,\n  };\n\n  public override render(): React.ReactElement {\n    return (\n      <Dialog\n        title={this.props.title}\n        buttonCluster={this.props.buttonCluster}\n        opened={this.props.opened}\n        onClose={this.props.onClose}\n        onEscape={this.props.onEscape}\n        modal={this.props.modal}\n        className={this.props.className}\n        style={this.props.style}\n        width={this.props.width}\n      >\n        <MessageContainer\n          severity={this.props.severity}\n          className={this.props.contentClassName}\n          style={this.props.contentStyle}\n        >\n          {this.props.children}\n        </MessageContainer>\n      </Dialog>\n    );\n  }\n}\n\n/** Properties for the [[MessageContainer]] component\n * @public\n * @deprecated in 4.15.0. Props of deprecated {@link MessageContainer} component.\n */\nexport interface MessageContainerProps extends CommonProps {\n  severity: MessageSeverity;\n  /** Message Content */\n  children?: React.ReactNode;\n}\n\n/** Message Container React component.\n * @public\n * @deprecated in 4.15.0. Use {@link https://itwinui.bentley.com/docs/dialog iTwinUI Dialog} instead.\n */\nexport class MessageContainer extends React.PureComponent<MessageContainerProps> {\n  /** Returns the class name corresponding to the MessageSeverity.\n   * @param severity MessageSeverity\n   */\n  public static getIconClassName(severity: MessageSeverity): string;\n  /** Returns the class name associated with the WebFont icon corresponding to the MessageSeverity.\n   * @param severity MessageSeverity\n   * @param hollow Should the icon be hollow\n   * @deprecated in 4.0.0. Hollow parameter ignored, WebFont is not returned, only the color.\n   */\n  public static getIconClassName(\n    severity: MessageSeverity,\n    // eslint-disable-next-line @typescript-eslint/unified-signatures\n    hollow?: boolean\n  ): string;\n\n  public static getIconClassName(\n    severity: MessageSeverity,\n    _hollow?: boolean\n  ): string {\n    let iconClassName = \"\";\n\n    switch (severity) {\n      case MessageSeverity.None:\n        iconClassName = \"\";\n        break;\n      case MessageSeverity.Success:\n        iconClassName = \"core-message-box-success\";\n        break;\n      case MessageSeverity.Information:\n        iconClassName = \"core-message-box-information\";\n        break;\n      case MessageSeverity.Question:\n        iconClassName = \"core-message-box-question\";\n        break;\n      case MessageSeverity.Warning:\n        iconClassName = \"core-message-box-warning\";\n        break;\n      case MessageSeverity.Error:\n        iconClassName = \"core-message-box-error\";\n        break;\n      case MessageSeverity.Fatal:\n        iconClassName = \"core-message-box-fatal\";\n        break;\n    }\n\n    return iconClassName;\n  }\n\n  /** Returns the React icon corresponding to the MessageSeverity.\n   * @param severity MessageSeverity\n   * @param hollow set to true to return the hollow form of the icon.\n   * @returns IconSpec\n   */\n  /* ignore for unit tests and replace with visual testing */\n\n  public static getIcon(severity: MessageSeverity, hollow?: boolean): IconSpec {\n    const icon = getIcon(severity, hollow);\n    return icon ?? \"\";\n  }\n\n  public override render(): React.ReactElement {\n    const iconClassName = classnames(\n      \"icon\",\n      \"core-message-box-icon\",\n      MessageContainer.getIconClassName(this.props.severity)\n    );\n\n    const icon = getIcon(this.props.severity);\n    return (\n      <div className=\"core-message-box-container\">\n        {icon ? (\n          <Icon\n            className={iconClassName}\n            size=\"large\"\n            fill={toFill(this.props.severity)}\n          >\n            {icon}\n          </Icon>\n        ) : undefined}\n        <div\n          className={classnames(\n            \"core-message-box-content\",\n            this.props.className\n          )}\n          style={this.props.style}\n        >\n          {this.props.children}\n        </div>\n      </div>\n    );\n  }\n}\n\nfunction getIcon(\n  severity: MessageSeverity,\n  hollow?: boolean\n): React.ReactElement | undefined {\n  switch (severity) {\n    case MessageSeverity.None:\n      return undefined;\n    case MessageSeverity.Success:\n      return hollow ? <SvgStatusSuccessHollow /> : <SvgStatusSuccess />;\n    case MessageSeverity.Information:\n      return hollow ? <SvgInfoCircularHollow /> : <SvgInfoCircular />;\n    case MessageSeverity.Question:\n      return hollow ? <SvgHelpCircularHollow /> : <SvgHelpCircular />;\n    case MessageSeverity.Warning:\n      return <SvgStatusWarning />; // TODO - need icon-status-warning-hollow icon\n    case MessageSeverity.Error:\n      return hollow ? <SvgStatusErrorHollow /> : <SvgStatusError />;\n      break;\n    case MessageSeverity.Fatal:\n      return hollow ? <SvgStatusRejectedHollow /> : <SvgStatusRejected />;\n  }\n}\n\ntype IconProps = React.ComponentProps<typeof Icon>;\n\nfunction toFill(severity: MessageSeverity): IconProps[\"fill\"] {\n  switch (severity) {\n    case MessageSeverity.None:\n      return undefined;\n    case MessageSeverity.Success:\n      return \"positive\";\n    case MessageSeverity.Information:\n    case MessageSeverity.Question:\n      return \"informational\";\n    case MessageSeverity.Warning:\n      return \"warning\";\n    case MessageSeverity.Error:\n    case MessageSeverity.Fatal:\n      return \"negative\";\n  }\n  return undefined;\n}\n"]}
+{"version":3,"file":"MessageBox.js","sourceRoot":"","sources":["../../../src/core-react/messagebox/MessageBox.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 Dialog\n */\n\nimport \"./MessageBox.scss\";\nimport classnames from \"classnames\";\nimport * as React from \"react\";\nimport type { DialogButtonDef } from \"@itwin/appui-abstract\";\nimport { MessageSeverity } from \"@itwin/appui-abstract\";\nimport type { CommonProps } from \"../utils/Props.js\";\nimport {\n  SvgHelpCircular,\n  SvgHelpCircularHollow,\n  SvgInfoCircular,\n  SvgInfoCircularHollow,\n  SvgStatusError,\n  SvgStatusErrorHollow,\n  SvgStatusRejected,\n  SvgStatusRejectedHollow,\n  SvgStatusSuccess,\n  SvgStatusSuccessHollow,\n  SvgStatusWarning,\n} from \"@itwin/itwinui-icons-react\";\nimport { Icon } from \"@itwin/itwinui-react\";\nimport type { IconSpec } from \"../icons/IconComponent.js\";\nimport { Dialog } from \"../dialog/Dialog.js\";\n\n/* eslint-disable @typescript-eslint/no-deprecated */\n\n/** Properties for the [[MessageBox]] component\n * @public\n * @deprecated in 4.15.0. Props of deprecated {@link MessageBox} component.\n */\nexport interface MessageBoxProps extends CommonProps {\n  /** Severity of MessageBox */\n  severity: MessageSeverity;\n  /** whether to show dialog or not */\n  opened: boolean;\n  /** List of [[DialogButtonDef]] objects specifying buttons and associated onClick events */\n  buttonCluster: DialogButtonDef[];\n  /** Title to show in title bar of dialog  */\n  title?: string | React.ReactElement;\n  /** onClick event for X button for dialog */\n  onClose?: () => void;\n  /** 'keyup' event for <Esc> key */\n  onEscape?: () => void;\n  /** minimum width that the dialog may be resized to. Default: 400 */\n  minWidth?: number;\n  /** minimum height that the dialog may be resized to. Default: 400 */\n  minHeight?: number;\n  /** initial width of dialog.\n   * Displayed in px if value is a number, otherwise displayed in specified CSS unit.\n   * Default: \"50%\"\n   */\n  width?: string | number;\n  /** initial height of dialog.\n   * Displayed in px if value is a number, otherwise displayed in specified CSS unit.\n   * Default: \"\"\n   */\n  height?: string | number;\n  /** Whether to show background overlay. Default: true */\n  modal?: boolean;\n  /** Custom CSS class name for the content */\n  contentClassName?: string;\n  /** Custom CSS Style for the content */\n  contentStyle?: React.CSSProperties;\n  /** Message content */\n  children?: React.ReactNode;\n}\n\n/** Message Box React component.\n * @public\n * @deprecated in 4.15.0. Use {@link https://itwinui.bentley.com/docs/dialog iTwinUI Dialog} instead.\n */\nexport class MessageBox extends React.PureComponent<MessageBoxProps> {\n  public static defaultProps: Partial<MessageBoxProps> = {\n    minWidth: 400,\n    minHeight: 400,\n    width: \"512px\",\n    modal: true,\n  };\n\n  public override render(): React.ReactElement {\n    return (\n      <Dialog\n        title={this.props.title}\n        buttonCluster={this.props.buttonCluster}\n        opened={this.props.opened}\n        onClose={this.props.onClose}\n        onEscape={this.props.onEscape}\n        modal={this.props.modal}\n        className={this.props.className}\n        style={this.props.style}\n        width={this.props.width}\n      >\n        <MessageContainer\n          severity={this.props.severity}\n          className={this.props.contentClassName}\n          style={this.props.contentStyle}\n        >\n          {this.props.children}\n        </MessageContainer>\n      </Dialog>\n    );\n  }\n}\n\n/** Properties for the [[MessageContainer]] component\n * @public\n * @deprecated in 4.15.0. Props of deprecated {@link MessageContainer} component.\n */\nexport interface MessageContainerProps extends CommonProps {\n  severity: MessageSeverity;\n  /** Message Content */\n  children?: React.ReactNode;\n}\n\n/** Message Container React component.\n * @public\n * @deprecated in 4.15.0. Use {@link https://itwinui.bentley.com/docs/dialog iTwinUI Dialog} instead.\n */\nexport class MessageContainer extends React.PureComponent<MessageContainerProps> {\n  /** Returns the class name corresponding to the MessageSeverity.\n   * @param severity MessageSeverity\n   */\n  public static getIconClassName(severity: MessageSeverity): string;\n  /** Returns the class name associated with the WebFont icon corresponding to the MessageSeverity.\n   * @param severity MessageSeverity\n   * @param hollow Should the icon be hollow\n   * @deprecated in 4.0.0. Hollow parameter ignored, WebFont is not returned, only the color.\n   */\n  public static getIconClassName(\n    severity: MessageSeverity,\n    // eslint-disable-next-line @typescript-eslint/unified-signatures\n    hollow?: boolean\n  ): string;\n\n  public static getIconClassName(\n    severity: MessageSeverity,\n    _hollow?: boolean\n  ): string {\n    let iconClassName = \"\";\n\n    switch (severity) {\n      case MessageSeverity.None:\n        iconClassName = \"\";\n        break;\n      case MessageSeverity.Success:\n        iconClassName = \"core-message-box-success\";\n        break;\n      case MessageSeverity.Information:\n        iconClassName = \"core-message-box-information\";\n        break;\n      case MessageSeverity.Question:\n        iconClassName = \"core-message-box-question\";\n        break;\n      case MessageSeverity.Warning:\n        iconClassName = \"core-message-box-warning\";\n        break;\n      case MessageSeverity.Error:\n        iconClassName = \"core-message-box-error\";\n        break;\n      case MessageSeverity.Fatal:\n        iconClassName = \"core-message-box-fatal\";\n        break;\n    }\n\n    return iconClassName;\n  }\n\n  /** Returns the React icon corresponding to the MessageSeverity.\n   * @param severity MessageSeverity\n   * @param hollow set to true to return the hollow form of the icon.\n   * @returns IconSpec\n   */\n  /* ignore for unit tests and replace with visual testing */\n\n  public static getIcon(severity: MessageSeverity, hollow?: boolean): IconSpec {\n    const icon = getIcon(severity, hollow);\n    return icon ?? \"\";\n  }\n\n  public override render(): React.ReactElement {\n    const iconClassName = classnames(\n      \"icon\",\n      \"core-message-box-icon\",\n      MessageContainer.getIconClassName(this.props.severity)\n    );\n\n    const icon = getIcon(this.props.severity);\n    return (\n      <div className=\"core-message-box-container\">\n        {icon ? (\n          <Icon\n            className={iconClassName}\n            size=\"large\"\n            fill={toFill(this.props.severity)}\n          >\n            {icon}\n          </Icon>\n        ) : undefined}\n        <div\n          className={classnames(\n            \"core-message-box-content\",\n            this.props.className\n          )}\n          style={this.props.style}\n        >\n          {this.props.children}\n        </div>\n      </div>\n    );\n  }\n}\n\nfunction getIcon(\n  severity: MessageSeverity,\n  hollow?: boolean\n): React.ReactElement | undefined {\n  switch (severity) {\n    case MessageSeverity.None:\n      return undefined;\n    case MessageSeverity.Success:\n      return hollow ? <SvgStatusSuccessHollow /> : <SvgStatusSuccess />;\n    case MessageSeverity.Information:\n      return hollow ? <SvgInfoCircularHollow /> : <SvgInfoCircular />;\n    case MessageSeverity.Question:\n      return hollow ? <SvgHelpCircularHollow /> : <SvgHelpCircular />;\n    case MessageSeverity.Warning:\n      return <SvgStatusWarning />; // TODO - need icon-status-warning-hollow icon\n    case MessageSeverity.Error:\n      return hollow ? <SvgStatusErrorHollow /> : <SvgStatusError />;\n      break;\n    case MessageSeverity.Fatal:\n      return hollow ? <SvgStatusRejectedHollow /> : <SvgStatusRejected />;\n  }\n}\n\ntype IconProps = React.ComponentProps<typeof Icon>;\n\nfunction toFill(severity: MessageSeverity): IconProps[\"fill\"] {\n  switch (severity) {\n    case MessageSeverity.None:\n      return undefined;\n    case MessageSeverity.Success:\n      return \"positive\";\n    case MessageSeverity.Information:\n    case MessageSeverity.Question:\n      return \"informational\";\n    case MessageSeverity.Warning:\n      return \"warning\";\n    case MessageSeverity.Error:\n    case MessageSeverity.Fatal:\n      return \"negative\";\n  }\n  return undefined;\n}\n"]}

package/lib/core-react/popup/Popup.js

@@ -23,206 +23,12 @@ export const PopupContext = React.createContext(undefined);
  */
 // eslint-disable-next-line @typescript-eslint/no-deprecated
 export class Popup extends React.Component {
+    _popup = null;
+    /** @internal */
+    static contextType = PopupContext;
     // eslint-disable-next-line @typescript-eslint/no-deprecated
     constructor(props) {
         super(props);
-        this._popup = null;
-        this._bindWindowEvents = () => {
-            const activeWindow = this.getParentWindow();
-            activeWindow.addEventListener("pointerdown", this._handleOutsideClick);
-            activeWindow.addEventListener("resize", this._resize);
-            activeWindow.addEventListener("contextmenu", this._handleContextMenu);
-            activeWindow.addEventListener("scroll", this._hide);
-            activeWindow.addEventListener("wheel", this._handleWheel);
-            activeWindow.addEventListener("keydown", this._handleKeyboard);
-        };
-        this._unBindWindowEvents = () => {
-            const activeWindow = this.getParentWindow();
-            activeWindow.removeEventListener("pointerdown", this._handleOutsideClick);
-            activeWindow.removeEventListener("resize", this._resize);
-            activeWindow.removeEventListener("contextmenu", this._handleContextMenu);
-            activeWindow.removeEventListener("scroll", this._hide);
-            activeWindow.removeEventListener("wheel", this._handleWheel);
-            activeWindow.removeEventListener("keydown", this._handleKeyboard);
-        };
-        this._handleWheel = (event) => {
-            if (this._popup && this._popup.contains(event.target))
-                return;
-            if (this.props.onWheel)
-                return this.props.onWheel(event);
-            const closeOnWheel = this.props.closeOnWheel !== undefined ? this.props.closeOnWheel : true;
-            if (closeOnWheel)
-                this._hide();
-        };
-        this._handleOutsideClick = (event) => {
-            if (this._popup && this._popup.contains(event.target))
-                return;
-            if (this.props.isPinned)
-                return;
-            if (!this.props.closeOnNestedPopupOutsideClick &&
-                this.isInCorePopup(event.target))
-                return;
-            if (this.props.onOutsideClick)
-                return this.props.onOutsideClick(event);
-            if (this.props.target && this.props.target.contains(event.target))
-                return;
-            this._onClose();
-        };
-        this._handleContextMenu = (event) => {
-            if (this._popup && this._popup.contains(event.target))
-                return;
-            if (this.props.onContextMenu)
-                return this.props.onContextMenu(event);
-            const closeOnContextMenu = this.props.closeOnContextMenu !== undefined
-                ? this.props.closeOnContextMenu
-                : true;
-            if (closeOnContextMenu)
-                this._hide();
-        };
-        this._handleKeyboard = (event) => {
-            if (this.props.isPinned)
-                return;
-            if (event.key === Key.Escape.valueOf() ||
-                event.key === Key.Enter.valueOf()) {
-                const closeOnEnter = this.props.closeOnEnter !== undefined ? this.props.closeOnEnter : true;
-                if (event.key === Key.Enter.valueOf()) {
-                    if (closeOnEnter)
-                        this._onClose(true);
-                    else
-                        this.props.onEnter && this.props.onEnter();
-                }
-                else {
-                    this._onClose(false);
-                }
-            }
-        };
-        this._resize = () => {
-            if (this.props.repositionOnResize) {
-                const position = this._toggleRelativePosition();
-                const point = this._fitPopup(this._getPosition(position));
-                this.setState({ left: point.x, top: point.y, position });
-            }
-            else {
-                this._hide(); // legacy behavior
-            }
-        };
-        this._hide = () => {
-            if (this.props.isPinned)
-                return;
-            this._onClose();
-        };
-        this._getPosition = (position) => {
-            const activeWindow = this.getParentWindow();
-            const { target, offset, top, left } = this.props;
-            const offsetArrow = this.props.showArrow ? 6 : 0;
-            // absolute position
-            if (this._isPositionAbsolute())
-                return { x: left, y: top };
-            // sanity check
-            const point = { x: 0, y: 0 };
-            if (!this._popup || !target)
-                return point;
-            // relative position
-            const scrollY = activeWindow.scrollY;
-            const scrollX = activeWindow.scrollX;
-            const container = this.getContainer();
-            const containerBounds = container.getBoundingClientRect();
-            const targetRect = Rectangle.create(target.getBoundingClientRect()).offset({
-                x: -containerBounds.left,
-                y: -containerBounds.top,
-            });
-            const { popupWidth, popupHeight } = this._getPopupDimensions();
-            switch (position) {
-                case RelativePosition.Top:
-                    point.y = scrollY + targetRect.top - popupHeight - offset - offsetArrow;
-                    point.x =
-                        scrollX +
-                            targetRect.left +
-                            targetRect.getWidth() / 2 -
-                            popupWidth / 2;
-                    break;
-                case RelativePosition.TopLeft:
-                    point.y = scrollY + targetRect.top - popupHeight - offset - offsetArrow;
-                    point.x = scrollX + targetRect.left;
-                    break;
-                case RelativePosition.TopRight:
-                    point.y = scrollY + targetRect.top - popupHeight - offset - offsetArrow;
-                    point.x = scrollX + targetRect.right - popupWidth;
-                    break;
-                case RelativePosition.Bottom:
-                    point.y = scrollY + targetRect.bottom + offset + offsetArrow;
-                    point.x =
-                        scrollX +
-                            targetRect.left +
-                            targetRect.getWidth() / 2 -
-                            popupWidth / 2;
-                    break;
-                case RelativePosition.BottomLeft:
-                    point.y = scrollY + targetRect.bottom + offset + offsetArrow;
-                    point.x = scrollX + targetRect.left;
-                    break;
-                case RelativePosition.BottomRight:
-                    point.y = scrollY + targetRect.bottom + offset + offsetArrow;
-                    point.x = scrollX + targetRect.right - popupWidth;
-                    break;
-                case RelativePosition.Left:
-                    point.y =
-                        scrollY +
-                            targetRect.top +
-                            targetRect.getHeight() / 2 -
-                            popupHeight / 2;
-                    point.x = scrollX + targetRect.left - popupWidth - offset - offsetArrow;
-                    break;
-                case RelativePosition.LeftTop:
-                    point.y = scrollY + targetRect.top;
-                    point.x = scrollX + targetRect.left - popupWidth - offset - offsetArrow;
-                    break;
-                case RelativePosition.Right:
-                    point.y =
-                        scrollY +
-                            targetRect.top +
-                            targetRect.getHeight() / 2 -
-                            popupHeight / 2;
-                    point.x = scrollX + targetRect.right + offset + offsetArrow;
-                    break;
-                case RelativePosition.RightTop:
-                    point.y = scrollY + targetRect.top;
-                    point.x = scrollX + targetRect.right + offset + offsetArrow;
-                    break;
-            }
-            return point;
-        };
-        // fit the popup within the extents of the view port
-        this._fitPopup = (point) => {
-            const fittedPoint = point;
-            if (!this._popup) {
-                return fittedPoint;
-            }
-            const { popupWidth, popupHeight } = this._getPopupDimensions();
-            const container = this.getContainer();
-            const containerBounds = container.getBoundingClientRect();
-            if (fittedPoint.y + popupHeight > containerBounds.height) {
-                fittedPoint.y = containerBounds.height - popupHeight;
-            }
-            if (fittedPoint.x + popupWidth > containerBounds.width) {
-                fittedPoint.x = containerBounds.width - popupWidth;
-            }
-            if (fittedPoint.y < 0) {
-                fittedPoint.y = 0;
-            }
-            if (fittedPoint.x < 0) {
-                fittedPoint.x = 0;
-            }
-            return fittedPoint;
-        };
-        this._handleAnimationEnd = (event) => {
-            if (event.target === this._popup) {
-                this.setState({ animationEnded: true });
-            }
-        };
-        this._handleThemeProviderRef = (el) => {
-            this.setState({ portalContainer: el ?? undefined });
-        };
         const parentDocument = this.props.target?.ownerDocument ?? document;
         this.state = {
             animationEnded: false,
@@ -233,6 +39,16 @@ export class Popup extends React.Component {
             parentDocument,
         };
     }
+    // eslint-disable-next-line @typescript-eslint/no-deprecated
+    static defaultProps = {
+        position: RelativePosition.Bottom,
+        showShadow: true,
+        showArrow: false,
+        isOpen: false,
+        offset: 4,
+        top: -1,
+        left: -1,
+    };
     componentDidMount() {
         if (this.props.isOpen) {
             this._onShow();
@@ -282,6 +98,33 @@ export class Popup extends React.Component {
     componentWillUnmount() {
         this._unBindWindowEvents();
     }
+    _bindWindowEvents = () => {
+        const activeWindow = this.getParentWindow();
+        activeWindow.addEventListener("pointerdown", this._handleOutsideClick);
+        activeWindow.addEventListener("resize", this._resize);
+        activeWindow.addEventListener("contextmenu", this._handleContextMenu);
+        activeWindow.addEventListener("scroll", this._hide);
+        activeWindow.addEventListener("wheel", this._handleWheel);
+        activeWindow.addEventListener("keydown", this._handleKeyboard);
+    };
+    _unBindWindowEvents = () => {
+        const activeWindow = this.getParentWindow();
+        activeWindow.removeEventListener("pointerdown", this._handleOutsideClick);
+        activeWindow.removeEventListener("resize", this._resize);
+        activeWindow.removeEventListener("contextmenu", this._handleContextMenu);
+        activeWindow.removeEventListener("scroll", this._hide);
+        activeWindow.removeEventListener("wheel", this._handleWheel);
+        activeWindow.removeEventListener("keydown", this._handleKeyboard);
+    };
+    _handleWheel = (event) => {
+        if (this._popup && this._popup.contains(event.target))
+            return;
+        if (this.props.onWheel)
+            return this.props.onWheel(event);
+        const closeOnWheel = this.props.closeOnWheel !== undefined ? this.props.closeOnWheel : true;
+        if (closeOnWheel)
+            this._hide();
+    };
     isInCorePopup(element) {
         if (element.nodeName === "DIV") {
             if (element.classList && element.classList.contains("core-popup"))
@@ -295,6 +138,63 @@ export class Popup extends React.Component {
         }
         return false;
     }
+    _handleOutsideClick = (event) => {
+        if (this._popup && this._popup.contains(event.target))
+            return;
+        if (this.props.isPinned)
+            return;
+        if (!this.props.closeOnNestedPopupOutsideClick &&
+            this.isInCorePopup(event.target))
+            return;
+        if (this.props.onOutsideClick)
+            return this.props.onOutsideClick(event);
+        if (this.props.target && this.props.target.contains(event.target))
+            return;
+        this._onClose();
+    };
+    _handleContextMenu = (event) => {
+        if (this._popup && this._popup.contains(event.target))
+            return;
+        if (this.props.onContextMenu)
+            return this.props.onContextMenu(event);
+        const closeOnContextMenu = this.props.closeOnContextMenu !== undefined
+            ? this.props.closeOnContextMenu
+            : true;
+        if (closeOnContextMenu)
+            this._hide();
+    };
+    _handleKeyboard = (event) => {
+        if (this.props.isPinned)
+            return;
+        if (event.key === Key.Escape.valueOf() ||
+            event.key === Key.Enter.valueOf()) {
+            const closeOnEnter = this.props.closeOnEnter !== undefined ? this.props.closeOnEnter : true;
+            if (event.key === Key.Enter.valueOf()) {
+                if (closeOnEnter)
+                    this._onClose(true);
+                else
+                    this.props.onEnter && this.props.onEnter();
+            }
+            else {
+                this._onClose(false);
+            }
+        }
+    };
+    _resize = () => {
+        if (this.props.repositionOnResize) {
+            const position = this._toggleRelativePosition();
+            const point = this._fitPopup(this._getPosition(position));
+            this.setState({ left: point.x, top: point.y, position });
+        }
+        else {
+            this._hide(); // legacy behavior
+        }
+    };
+    _hide = () => {
+        if (this.props.isPinned)
+            return;
+        this._onClose();
+    };
     _onShow() {
         this._bindWindowEvents();
         const position = this._toggleRelativePosition();
@@ -361,6 +261,87 @@ export class Popup extends React.Component {
         }
         return { popupWidth, popupHeight };
     }
+    _getPosition = (position) => {
+        const activeWindow = this.getParentWindow();
+        const { target, offset, top, left } = this.props;
+        const offsetArrow = this.props.showArrow ? 6 : 0;
+        // absolute position
+        if (this._isPositionAbsolute())
+            return { x: left, y: top };
+        // sanity check
+        const point = { x: 0, y: 0 };
+        if (!this._popup || !target)
+            return point;
+        // relative position
+        const scrollY = activeWindow.scrollY;
+        const scrollX = activeWindow.scrollX;
+        const container = this.getContainer();
+        const containerBounds = container.getBoundingClientRect();
+        const targetRect = Rectangle.create(target.getBoundingClientRect()).offset({
+            x: -containerBounds.left,
+            y: -containerBounds.top,
+        });
+        const { popupWidth, popupHeight } = this._getPopupDimensions();
+        switch (position) {
+            case RelativePosition.Top:
+                point.y = scrollY + targetRect.top - popupHeight - offset - offsetArrow;
+                point.x =
+                    scrollX +
+                        targetRect.left +
+                        targetRect.getWidth() / 2 -
+                        popupWidth / 2;
+                break;
+            case RelativePosition.TopLeft:
+                point.y = scrollY + targetRect.top - popupHeight - offset - offsetArrow;
+                point.x = scrollX + targetRect.left;
+                break;
+            case RelativePosition.TopRight:
+                point.y = scrollY + targetRect.top - popupHeight - offset - offsetArrow;
+                point.x = scrollX + targetRect.right - popupWidth;
+                break;
+            case RelativePosition.Bottom:
+                point.y = scrollY + targetRect.bottom + offset + offsetArrow;
+                point.x =
+                    scrollX +
+                        targetRect.left +
+                        targetRect.getWidth() / 2 -
+                        popupWidth / 2;
+                break;
+            case RelativePosition.BottomLeft:
+                point.y = scrollY + targetRect.bottom + offset + offsetArrow;
+                point.x = scrollX + targetRect.left;
+                break;
+            case RelativePosition.BottomRight:
+                point.y = scrollY + targetRect.bottom + offset + offsetArrow;
+                point.x = scrollX + targetRect.right - popupWidth;
+                break;
+            case RelativePosition.Left:
+                point.y =
+                    scrollY +
+                        targetRect.top +
+                        targetRect.getHeight() / 2 -
+                        popupHeight / 2;
+                point.x = scrollX + targetRect.left - popupWidth - offset - offsetArrow;
+                break;
+            case RelativePosition.LeftTop:
+                point.y = scrollY + targetRect.top;
+                point.x = scrollX + targetRect.left - popupWidth - offset - offsetArrow;
+                break;
+            case RelativePosition.Right:
+                point.y =
+                    scrollY +
+                        targetRect.top +
+                        targetRect.getHeight() / 2 -
+                        popupHeight / 2;
+                point.x = scrollX + targetRect.right + offset + offsetArrow;
+                break;
+            case RelativePosition.RightTop:
+                point.y = scrollY + targetRect.top;
+                point.x = scrollX + targetRect.right + offset + offsetArrow;
+                break;
+        }
+        return point;
+    };
     _toggleRelativePosition() {
         const { target, position, offset } = this.props;
         if (!this._popup || !target)
@@ -418,6 +399,37 @@ export class Popup extends React.Component {
         }
         return newPosition;
     }
+    // fit the popup within the extents of the view port
+    _fitPopup = (point) => {
+        const fittedPoint = point;
+        if (!this._popup) {
+            return fittedPoint;
+        }
+        const { popupWidth, popupHeight } = this._getPopupDimensions();
+        const container = this.getContainer();
+        const containerBounds = container.getBoundingClientRect();
+        if (fittedPoint.y + popupHeight > containerBounds.height) {
+            fittedPoint.y = containerBounds.height - popupHeight;
+        }
+        if (fittedPoint.x + popupWidth > containerBounds.width) {
+            fittedPoint.x = containerBounds.width - popupWidth;
+        }
+        if (fittedPoint.y < 0) {
+            fittedPoint.y = 0;
+        }
+        if (fittedPoint.x < 0) {
+            fittedPoint.x = 0;
+        }
+        return fittedPoint;
+    };
+    _handleAnimationEnd = (event) => {
+        if (event.target === this._popup) {
+            this.setState({ animationEnded: true });
+        }
+    };
+    _handleThemeProviderRef = (el) => {
+        this.setState({ portalContainer: el ?? undefined });
+    };
     render() {
         const animate = this.props.animate !== undefined ? this.props.animate : true;
         const className = classnames("core-popup", this._getClassNameByPosition(this.state.position), this.props.showShadow && "core-popup-shadow", this.props.showArrow && "arrow", !animate && "core-popup-animation-none", this.props.className, this.state.animationEnded && "core-animation-ended", !this.props.isOpen &&
@@ -445,18 +457,6 @@ export class Popup extends React.Component {
             this.state.parentDocument.body);
     }
 }
-/** @internal */
-Popup.contextType = PopupContext;
-// eslint-disable-next-line @typescript-eslint/no-deprecated
-Popup.defaultProps = {
-    position: RelativePosition.Bottom,
-    showShadow: true,
-    showArrow: false,
-    isOpen: false,
-    offset: 4,
-    top: -1,
-    left: -1,
-};
 function parsePxString(pxStr) {
     const parsed = parseInt(pxStr, 10);
     return parsed || 0;