@jetbrains/ring-ui 6.0.55 → 6.0.57

package/components/auth/auth__core.js

@@ -137,7 +137,10 @@ export default class Auth {
             this.addListener(LOGOUT_EVENT, this.config.onLogout);
         }
         if (this.config.reloadOnUserChange) {
-            this.addListener(USER_CHANGED_EVENT, () => this._reloadCurrentPage());
+            this.addListener(USER_CHANGED_EVENT, () => {
+                // Timeout is needed to ensure all other listeners triggered before stopping current page
+                setTimeout(() => this._reloadCurrentPage());
+            });
         }
         this.addListener(LOGOUT_POSTPONED_EVENT, () => this._setPostponed(true));
         this.addListener(USER_CHANGE_POSTPONED_EVENT, () => this._setPostponed(true));

package/components/dialog/dialog.d.ts

@@ -21,6 +21,7 @@ export interface DialogProps extends Partial<TabTrapProps> {
     dense?: boolean | null | undefined;
     native?: boolean;
     modal?: boolean;
+    preventBodyScroll?: boolean;
 }
 export default class Dialog extends PureComponent<DialogProps> {
     static propTypes: {
@@ -41,6 +42,7 @@ export default class Dialog extends PureComponent<DialogProps> {
         portalTarget: PropTypes.Requireable<HTMLElement>;
         autoFocusFirst: PropTypes.Requireable<boolean>;
         'data-test': PropTypes.Requireable<string>;
+        preventBodyScroll: PropTypes.Requireable<boolean>;
     };
     static defaultProps: Partial<DialogProps>;
     state: {

package/components/dialog/dialog.js

@@ -41,7 +41,8 @@ export default class Dialog extends PureComponent {
         trapFocus: PropTypes.bool,
         portalTarget: PropTypes.instanceOf(HTMLElement),
         autoFocusFirst: PropTypes.bool,
-        'data-test': PropTypes.string
+        'data-test': PropTypes.string,
+        preventBodyScroll: PropTypes.bool
     };
     static defaultProps = {
         label: 'Dialog',
@@ -54,7 +55,8 @@ export default class Dialog extends PureComponent {
         shortcutOptions: { modal: false },
         trapFocus: false,
         autoFocusFirst: true,
-        modal: true
+        modal: true,
+        preventBodyScroll: true
     };
     state = {
         shortcutsScope: getUID('ring-dialog-')
@@ -93,6 +95,9 @@ export default class Dialog extends PureComponent {
         }
     }
     toggleScrollPreventer() {
+        if (!this.props.preventBodyScroll) {
+            return;
+        }
         if (this.props.show) {
             this.scrollPreventer.prevent();
         }
@@ -125,7 +130,7 @@ export default class Dialog extends PureComponent {
     };
     nativeDialog = createRef();
     render() {
-        const { show, showCloseButton, onOverlayClick, onCloseAttempt, onEscPress, onCloseClick, children, className, contentClassName, trapFocus, 'data-test': dataTest, closeButtonInside, portalTarget, label, closeButtonTitle, dense, shortcutOptions, native, modal, ...restProps } = this.props;
+        const { show, showCloseButton, onOverlayClick, onCloseAttempt, onEscPress, onCloseClick, children, className, contentClassName, trapFocus, 'data-test': dataTest, closeButtonInside, portalTarget, label, closeButtonTitle, dense, shortcutOptions, native, modal, preventBodyScroll, ...restProps } = this.props;
         const classes = classNames(styles.container, className);
         const shortcutsMap = this.getShortcutsMap();
         const content = (<>

package/components/select/select.d.ts

@@ -213,6 +213,9 @@ export default class Select<T = unknown> extends Component<SelectProps<T>, Selec
     shortcutsScope: string;
     listId: string;
     private _focusHandler;
+    isClickingSelect: boolean;
+    mouseDownHandler: () => void;
+    mouseUpHandler: () => void;
     private _blurHandler;
     node?: HTMLElement | null;
     nodeRef: (el: HTMLElement | null) => void;

package/components/select/select.js

@@ -315,9 +315,17 @@ export default class Select extends Component {
             focused: true
         });
     };
+    isClickingSelect = false;
+    mouseDownHandler = () => {
+        this.isClickingSelect = true;
+    };
+    mouseUpHandler = () => {
+        this.isClickingSelect = false;
+    };
     _blurHandler = () => {
         this.props.onBlur();
-        if (this._popup && this._popup.isVisible() && !this._popup.isClickingPopup) {
+        if (this._popup && this._popup.isVisible() && !this._popup.isClickingPopup &&
+            !this.isClickingSelect) {
             window.setTimeout(() => {
                 this.setState({ showPopup: false });
             });
@@ -822,7 +830,8 @@ export default class Select extends Component {
         switch (this.props.type) {
             case Type.INPUT_WITHOUT_CONTROLS:
             case Type.INPUT: return (<>
-          <div ref={this.nodeRef} className={classNames(classes, styles.inputMode)} data-test={dataTests('ring-select', dataTest)}>
+          <div ref={this.nodeRef} className={classNames(classes, styles.inputMode)} data-test={dataTests('ring-select', dataTest)} role="presentation" // has interactive elements inside
+             onMouseDown={this.mouseDownHandler} onMouseUp={this.mouseUpHandler}>
             {shortcutsEnabled && (<Shortcuts map={this.getShortcutsMap()} scope={this.shortcutsScope}/>)}
             <Input {...ariaProps} height={this.props.height} autoComplete="off" id={this.props.id} onClick={this._clickHandler} inputRef={this.composedFilterRef(this.filterRef, this.props.filterRef)} disabled={this.props.disabled} value={this.state.filterValue} borderless={this.props.type === Type.INPUT_WITHOUT_CONTROLS} style={style} size={Size.FULL} onChange={this._filterChangeHandler} onFocus={this._focusHandler} onBlur={this._blurHandler} 
             // Input with error style without description

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jetbrains/ring-ui",
-  "version": "6.0.55",
+  "version": "6.0.57",
   "description": "JetBrains UI library",
   "author": "JetBrains",
   "license": "Apache-2.0",