@jetbrains/ring-ui 5.0.17 → 5.0.20

package/components/query-assist/query-assist.js

@@ -3,7 +3,7 @@ import PropTypes from 'prop-types';
 import debounce from 'just-debounce-it';
 import classNames from 'classnames';
 import deepEqual from 'deep-equal';
-import searchIcon from '@jetbrains/icons/search-12px';
+import searchIcon from '@jetbrains/icons/search';
 import closeIcon from '@jetbrains/icons/close-12px';
 import getUID from '../global/get-uid';
 import dataTests from '../global/data-tests';
@@ -15,6 +15,7 @@ import LoaderInline from '../loader-inline/loader-inline';
 import Shortcuts from '../shortcuts/shortcuts';
 import rerenderHOC from '../global/rerender-hoc';
 import Button from '../button/button';
+import Icon from '../icon/icon';
 import QueryAssistSuggestions from './query-assist__suggestions';
 import styles from './query-assist.css';
 const POPUP_COMPENSATION = PopupMenu.ListProps.Dimension.ITEM_PADDING +
@@ -148,7 +149,8 @@ export default class QueryAssist extends Component {
         useCustomItemRender: PropTypes.bool,
         translations: PropTypes.object,
         actions: PropTypes.array,
-        'data-test': PropTypes.string
+        'data-test': PropTypes.string,
+        huge: PropTypes.bool
     };
     static defaultProps = {
         onApply: noop,
@@ -747,16 +749,21 @@ export default class QueryAssist extends Component {
         const actions = [...(this.props.actions || [])];
         const renderClear = this.props.clear && !!this.state.query;
         if (renderClear) {
-            actions.push(<Button icon={closeIcon} key={'clearAction'} className={styles.icon} iconClassName={styles.iconInner} title={this.props.translations.clearTitle} ref={this.clearRef} onClick={this.clearQuery} data-test="query-assist-clear-icon"/>);
+            actions.push(<Button icon={closeIcon} key={'clearAction'} className={styles.clear} title={this.props.translations.clearTitle} ref={this.clearRef} onClick={this.clearQuery} data-test="query-assist-clear-icon"/>);
         }
         return actions;
     }
     render() {
-        const { glass, 'data-test': dataTest, className, useCustomItemRender } = this.props;
+        const { glass, 'data-test': dataTest, className, useCustomItemRender, huge } = this.props;
         const renderPlaceholder = !!this.props.placeholder && this.state.placeholderEnabled;
         const renderLoader = this.props.loader !== false && this.state.loading;
         const renderGlass = glass && !renderLoader;
         const actions = this.renderActions();
+        const containerClasses = classNames(className, {
+            [styles.queryAssist]: true,
+            [styles.withIcon]: (renderGlass && !huge) || renderLoader,
+            [styles.huge]: huge
+        });
         const inputClasses = classNames({
             [`${styles.input} ring-js-shortcuts`]: true,
             [styles.inputGap]: actions.length || this.isRenderingGlassOrLoader() && !glass,
@@ -764,11 +771,12 @@ export default class QueryAssist extends Component {
             [styles.inputLeftGap]: this.isRenderingGlassOrLoader() && glass,
             [styles.inputDisabled]: this.props.disabled
         });
-        return (<div data-test={dataTests('ring-query-assist', dataTest)} className={classNames(className, styles.queryAssist)} role="presentation" ref={this.nodeRef}>
+        return (<div data-test={dataTests('ring-query-assist', dataTest)} className={containerClasses} role="presentation" ref={this.nodeRef}>
         {this.state.shortcuts &&
                 (<Shortcuts map={this.shortcutsMap} scope={this.shortcutsScope}/>)}
 
-        {renderGlass && (<Button icon={searchIcon} className={styles.icon} iconClassName={styles.iconInner} title={this.props.translations.searchTitle} ref={this.glassRef} onClick={this.handleApply} data-test="query-assist-search-icon"/>)}
+        {renderGlass && !huge && (<Icon glyph={searchIcon} className={styles.icon} title={this.props.translations.searchTitle} ref={this.glassRef} data-test="query-assist-search-icon"/>)}
+
         {renderLoader && (<div className={classNames(styles.icon, styles.loader, {
                     [styles.loaderOnTheRight]: !glass
                 })} ref={this.loaderRef}>
@@ -779,14 +787,17 @@ export default class QueryAssist extends Component {
          onKeyUp={this.handleInput} // to handle input and key up
          onKeyDown={this.handleEnter} onPaste={this.handlePaste} spellCheck="false">{this.state.query && <span>{this.renderQuery()}</span>}</ContentEditable>
 
-        {renderPlaceholder && (<button type="button" className={classNames(styles.placeholder, {
-                    [styles.placeholderSpaced]: glass
-                })} ref={this.placeholderRef} onClick={this.handleCaretMove} data-test="query-assist-placeholder">
+        {renderPlaceholder && (<button type="button" className={styles.placeholder} ref={this.placeholderRef} onClick={this.handleCaretMove} data-test="query-assist-placeholder">
             {this.props.placeholder}
           </button>)}
-        {actions &&
-                <div data-test="ring-query-assist-actions" className={styles.actions}>{actions}</div>}
+
+        {actions && (<div data-test="ring-query-assist-actions" className={styles.actions}>{actions}</div>)}
+
         <PopupMenu hidden={!this.state.showPopup} onCloseAttempt={this.closePopup} ref={this.popupRef} anchorElement={this.node} keepMounted attached className={this.props.popupClassName} directions={[PopupMenu.PopupProps.Directions.BOTTOM_RIGHT]} data={useCustomItemRender ? this.state.suggestions : this.renderSuggestions()} data-test="ring-query-assist-popup" hint={this.props.hint} hintOnSelection={this.props.hintOnSelection} left={this.getPopupOffset(this.state.suggestions)} maxHeight={PopupMenu.PopupProps.MaxHeight.SCREEN} onMouseDown={this.trackPopupMouseState} onMouseUp={this.trackPopupMouseState} onSelect={item => this.handleComplete(item)}/>
+
+        {glass && huge && (<div className={styles.rightSearchButton}>
+            <Icon glyph={searchIcon} className={styles.rightSearchIcon} title={this.props.translations.searchTitle} onClick={this.handleApply} ref={this.glassRef} data-test="query-assist-search-icon"/>
+          </div>)}
       </div>);
     }
 }

package/dist/_helpers/query-assist__suggestions.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import List from '../list/list.js';
 
-var modules_da7ab055 = {"dark":"dark_rui_eb55","unit":"8px","overInputZIndex":"2","inputGap":"24px","queryAssist":"queryAssist_rui_d22e font_rui_8bff","input":"input_rui_d22e","placeholder":"placeholder_rui_d22e resetButton_rui_8bff","letter-text":"letter-text_rui_d22e","letterDefault":"letterDefault_rui_d22e","letter-field-name":"letter-field-name_rui_d22e","letter-field-value":"letter-field-value_rui_d22e","letter-operator":"letter-operator_rui_d22e","letter-error":"letter-error_rui_d22e","iconInner":"iconInner_rui_d22e","highlight":"highlight_rui_d22e","service":"service_rui_d22e","icon":"icon_rui_d22e","loader":"loader_rui_d22e","actions":"actions_rui_d22e","24px":"24px_rui_d22e","inputGap2":"inputGap2_rui_d22e","inputLeftGap":"inputLeftGap_rui_d22e","inputDisabled":"inputDisabled_rui_d22e","placeholderSpaced":"placeholderSpaced_rui_d22e","letter":"letter_rui_d22e","loaderOnTheRight":"loaderOnTheRight_rui_d22e"};
+var modules_da7ab055 = {"unit":"8px","button-shadow":"inset 0 0 0 1px","height":"var(--ring-button-height)","loaderWidth":"64px","overInputZIndex":"2","inputGap":"24px","heightS":"heightS_rui_d22e","heightM":"heightM_rui_d22e","heightL":"heightL_rui_d22e","button":"button_rui_d22e","active":"active_rui_d22e","withIcon":"withIcon_rui_d22e","icon":"icon_rui_d22e","primary":"primary_rui_d22e","loader":"loader_rui_d22e","loaderBackground":"loaderBackground_rui_d22e","danger":"danger_rui_d22e","text":"text_rui_d22e","content":"content_rui_d22e","text-loading":"text-loading_rui_d22e","inline":"inline_rui_d22e","withNormalIcon":"withNormalIcon_rui_d22e","withDangerIcon":"withDangerIcon_rui_d22e","progress":"progress_rui_d22e","delayed":"delayed_rui_d22e","short":"short_rui_d22e","dropdownIcon":"dropdownIcon_rui_d22e","queryAssist":"queryAssist_rui_d22e","huge":"huge_rui_d22e","input":"input_rui_d22e","actions":"actions_rui_d22e","error":"error_rui_d22e","letter-text":"letter-text_rui_d22e","letterDefault":"letterDefault_rui_d22e","letter-field-name":"letter-field-name_rui_d22e","letter-field-value":"letter-field-value_rui_d22e","letter-operator":"letter-operator_rui_d22e","letter-error":"letter-error_rui_d22e","highlight":"highlight_rui_d22e","service":"service_rui_d22e","placeholder":"placeholder_rui_d22e resetButton_rui_8bff","letter":"letter_rui_d22e","rightSearchButton":"rightSearchButton_rui_d22e","clear":"clear_rui_d22e","loaderOnTheRight":"loaderOnTheRight_rui_d22e"};
 
 const ICON_ID_LENGTH = 44;
 class QueryAssistSuggestions {

package/dist/auth/auth__core.js

@@ -455,9 +455,16 @@ class Auth {
   }
 
   async handleInitValidationError(error) {
-    var _this$_initDeferred4, _this$_initDeferred4$;
+    var _error$cause, _this$_initDeferred4, _this$_initDeferred4$;
+
+    if ('cause' in error && ((_error$cause = error.cause) === null || _error$cause === void 0 ? void 0 : _error$cause.message) === 'invalid_client') {
+      // eslint-disable-next-line no-console
+      console.error('RingUI Auth: invalid client detected. Logging out', error);
+      await this.logout();
+      return undefined;
+    } // Redirect flow
+
 
-    // Redirect flow
     if ('authRedirect' in error && error.authRedirect && this.config.redirect) {
       return this.sendRedirect(error);
     } // Background flow

package/dist/auth/token-validator.js

@@ -151,8 +151,10 @@ class TokenValidator {
       }
 
       if (errorResponse.status === CODE.UNAUTHORIZED || TokenValidator.shouldRefreshToken(response.error)) {
+        var _errorResponse$data, _errorResponse$data2;
+
         // Token expired
-        throw new TokenValidator.TokenValidationError(response.error || errorResponse.message);
+        throw new TokenValidator.TokenValidationError(response.error || errorResponse.message, (_errorResponse$data = errorResponse.data) !== null && _errorResponse$data !== void 0 && _errorResponse$data.error ? new Error((_errorResponse$data2 = errorResponse.data) === null || _errorResponse$data2 === void 0 ? void 0 : _errorResponse$data2.error) : undefined);
       } // Request unexpectedly failed
 
 

package/dist/button-ng/button-ng.js

@@ -44,7 +44,7 @@ class ButtonController extends RingAngularComponent {
       } = this.$inject;
       const foreignClasses = [...this.element.classList].filter(name => !buttonClassesMap[name]);
       this.element.className = classNames(foreignClasses, getButtonClasses({
-        height: ControlsHeight.S,
+        height: $attrs.height || ControlsHeight.S,
         className: modules_e81895c9.button,
         active: this.getAttrValue($attrs.active),
         disabled: this.getAttrValue($attrs.disabled),

package/dist/pager/pager.d.ts

@@ -56,7 +56,7 @@ export default class Pager extends PureComponent<PagerProps> {
         selected: SelectItem<PagerSizeItem> | undefined;
         data: SelectItem<PagerSizeItem>[];
     };
-    getTotal(): number;
+    getTotalPages(): number;
     handlePageSizeChange: (item: PagerSizeItem | null) => void;
     handlePrevClick: () => void;
     handleNextClick: () => void;
@@ -76,7 +76,7 @@ export default class Pager extends PureComponent<PagerProps> {
     getPageSizeSelector(): false | JSX.Element;
     getPagerLinks(): JSX.Element;
     generateHref(page: number): string | undefined;
-    getPagerContent(): JSX.Element | null;
+    getPagerContent(): JSX.Element;
     render(): JSX.Element;
 }
 export declare type PagerAttrs = JSX.LibraryManagedAttributes<typeof Pager, PagerProps>;

package/dist/pager/pager.js

@@ -119,7 +119,7 @@ class Pager extends PureComponent {
         onLoadPage
       } = this.props;
       const nextPage = currentPage + 1;
-      const total = this.getTotal();
+      const total = this.getTotalPages();
 
       if (currentPage !== total) {
         var _this$props$onPageCha2, _this$props2;
@@ -157,7 +157,7 @@ class Pager extends PureComponent {
     };
   }
 
-  getTotal() {
+  getTotalPages() {
     const {
       total,
       pageSize
@@ -212,7 +212,7 @@ class Pager extends PureComponent {
 
   getPagerLinks() {
     const prevLinkAvailable = this.props.currentPage !== 1;
-    const nextLinkAvailable = this.props.openTotal || this.props.currentPage !== this.getTotal();
+    const nextLinkAvailable = this.props.openTotal || this.props.currentPage !== this.getTotalPages();
     const nextIcon = /*#__PURE__*/React.createElement(Icon, {
       glyph: chevronRightIcon,
       key: "icon"
@@ -271,10 +271,12 @@ class Pager extends PureComponent {
       currentPage,
       visiblePagesLimit
     } = this.props;
-    const totalPages = this.getTotal();
+    const totalPages = this.getTotalPages();
 
-    if (totalPages < 2 && !this.props.openTotal) {
-      return null;
+    if (totalPages < this.props.currentPage) {
+      var _this$props$onPageCha4, _this$props4;
+
+      (_this$props$onPageCha4 = (_this$props4 = this.props).onPageChange) === null || _this$props$onPageCha4 === void 0 ? void 0 : _this$props$onPageCha4.call(_this$props4, totalPages);
     }
 
     let start = 1;
@@ -321,7 +323,7 @@ class Pager extends PureComponent {
     return /*#__PURE__*/React.createElement("div", {
       "data-test": "ring-pager",
       className: classes
-    }, this.props.total > 1 ? this.getPagerContent() : this.getPageSizeSelector());
+    }, this.getTotalPages() > 1 || this.props.openTotal ? this.getPagerContent() : this.getPageSizeSelector());
   }
 
 }

package/dist/query-assist/query-assist.d.ts

@@ -3,6 +3,7 @@ import PropTypes from 'prop-types';
 import Caret, { Position } from '../caret/caret';
 import PopupMenu from '../popup-menu/popup-menu';
 import Button from '../button/button';
+import Icon from '../icon/icon';
 import { ShortcutsMap } from '../shortcuts/core';
 import { QueryAssistSuggestion, SuggestionItem } from './query-assist__suggestions';
 declare function noop(): void;
@@ -57,6 +58,7 @@ export interface QueryAssistProps {
     useCustomItemRender?: boolean | null | undefined;
     actions?: ReactNode[] | null | undefined;
     'data-test'?: string | null | undefined;
+    huge?: boolean | null | undefined;
 }
 export interface StyleRange {
     style: string;
@@ -207,6 +209,7 @@ export default class QueryAssist extends Component<QueryAssistProps> {
         translations: PropTypes.Requireable<object>;
         actions: PropTypes.Requireable<any[]>;
         'data-test': PropTypes.Requireable<string>;
+        huge: PropTypes.Requireable<boolean>;
     };
     static defaultProps: {
         onApply: typeof noop;
@@ -280,8 +283,8 @@ export default class QueryAssist extends Component<QueryAssistProps> {
     popupRef: (node: PopupMenu<SuggestionItem> | null) => void;
     placeholder?: HTMLElement | null;
     placeholderRef: (node: HTMLElement | null) => void;
-    glass?: ComponentRef<typeof Button> | null;
-    glassRef: (node: ComponentRef<typeof Button> | null) => void;
+    glass?: ComponentRef<typeof Icon> | null;
+    glassRef: (node: ComponentRef<typeof Icon> | null) => void;
     loader?: HTMLElement | null;
     loaderRef: (node: HTMLElement | null) => void;
     clear?: ComponentRef<typeof Button> | null;

package/dist/query-assist/query-assist.js

@@ -6,7 +6,7 @@ import PropTypes from 'prop-types';
 import debounce from 'just-debounce-it';
 import classNames from 'classnames';
 import deepEqual from 'deep-equal';
-import searchIcon from '@jetbrains/icons/search-12px';
+import searchIcon from '@jetbrains/icons/search';
 import closeIcon from '@jetbrains/icons/close-12px';
 import getUID from '../global/get-uid.js';
 import joinDataTestAttributes from '../global/data-tests.js';
@@ -18,6 +18,7 @@ import LoaderInline from '../loader-inline/loader-inline.js';
 import Shortcuts from '../shortcuts/shortcuts.js';
 import rerenderHOC from '../global/rerender-hoc.js';
 import { Button } from '../button/button.js';
+import Icon from '../icon/icon.js';
 import { Q as QueryAssistSuggestions, m as modules_da7ab055 } from '../_helpers/query-assist__suggestions.js';
 import 'react-dom/server';
 import '../popup/popup.js';
@@ -53,11 +54,10 @@ import '../avatar/fallback-avatar.js';
 import '../checkbox/checkbox.js';
 import '@jetbrains/icons/checkmark-14px';
 import '@jetbrains/icons/remove-10px';
-import '../icon/icon.js';
+import '../_helpers/checkbox.js';
 import '../icon/icon__constants.js';
 import '../_helpers/icon.js';
 import '../icon/icon__svg.js';
-import '../_helpers/checkbox.js';
 import '../list/list__custom.js';
 import '../global/get-event-key.js';
 import '../list/list__title.js';
@@ -913,8 +913,7 @@ class QueryAssist extends Component {
       actions.push( /*#__PURE__*/React.createElement(Button, {
         icon: closeIcon,
         key: 'clearAction',
-        className: modules_da7ab055.icon,
-        iconClassName: modules_da7ab055.iconInner,
+        className: modules_da7ab055.clear,
         title: this.props.translations.clearTitle,
         ref: this.clearRef,
         onClick: this.clearQuery,
@@ -930,12 +929,18 @@ class QueryAssist extends Component {
       glass,
       'data-test': dataTest,
       className,
-      useCustomItemRender
+      useCustomItemRender,
+      huge
     } = this.props;
     const renderPlaceholder = !!this.props.placeholder && this.state.placeholderEnabled;
     const renderLoader = this.props.loader !== false && this.state.loading;
     const renderGlass = glass && !renderLoader;
     const actions = this.renderActions();
+    const containerClasses = classNames(className, {
+      [modules_da7ab055.queryAssist]: true,
+      [modules_da7ab055.withIcon]: renderGlass && !huge || renderLoader,
+      [modules_da7ab055.huge]: huge
+    });
     const inputClasses = classNames({
       ["".concat(modules_da7ab055.input, " ring-js-shortcuts")]: true,
       [modules_da7ab055.inputGap]: actions.length || this.isRenderingGlassOrLoader() && !glass,
@@ -945,19 +950,17 @@ class QueryAssist extends Component {
     });
     return /*#__PURE__*/React.createElement("div", {
       "data-test": joinDataTestAttributes('ring-query-assist', dataTest),
-      className: classNames(className, modules_da7ab055.queryAssist),
+      className: containerClasses,
       role: "presentation",
       ref: this.nodeRef
     }, this.state.shortcuts && /*#__PURE__*/React.createElement(Shortcuts, {
       map: this.shortcutsMap,
       scope: this.shortcutsScope
-    }), renderGlass && /*#__PURE__*/React.createElement(Button, {
-      icon: searchIcon,
+    }), renderGlass && !huge && /*#__PURE__*/React.createElement(Icon, {
+      glyph: searchIcon,
       className: modules_da7ab055.icon,
-      iconClassName: modules_da7ab055.iconInner,
       title: this.props.translations.searchTitle,
       ref: this.glassRef,
-      onClick: this.handleApply,
       "data-test": "query-assist-search-icon"
     }), renderLoader && /*#__PURE__*/React.createElement("div", {
       className: classNames(modules_da7ab055.icon, modules_da7ab055.loader, {
@@ -987,9 +990,7 @@ class QueryAssist extends Component {
       spellCheck: "false"
     }, this.state.query && /*#__PURE__*/React.createElement("span", null, this.renderQuery())), renderPlaceholder && /*#__PURE__*/React.createElement("button", {
       type: "button",
-      className: classNames(modules_da7ab055.placeholder, {
-        [modules_da7ab055.placeholderSpaced]: glass
-      }),
+      className: modules_da7ab055.placeholder,
       ref: this.placeholderRef,
       onClick: this.handleCaretMove,
       "data-test": "query-assist-placeholder"
@@ -1014,7 +1015,16 @@ class QueryAssist extends Component {
       onMouseDown: this.trackPopupMouseState,
       onMouseUp: this.trackPopupMouseState,
       onSelect: item => this.handleComplete(item)
-    }));
+    }), glass && huge && /*#__PURE__*/React.createElement("div", {
+      className: modules_da7ab055.rightSearchButton
+    }, /*#__PURE__*/React.createElement(Icon, {
+      glyph: searchIcon,
+      className: modules_da7ab055.rightSearchIcon,
+      title: this.props.translations.searchTitle,
+      onClick: this.handleApply,
+      ref: this.glassRef,
+      "data-test": "query-assist-search-icon"
+    })));
   }
 
 }
@@ -1122,7 +1132,8 @@ _defineProperty(QueryAssist, "propTypes", {
   useCustomItemRender: PropTypes.bool,
   translations: PropTypes.object,
   actions: PropTypes.array,
-  'data-test': PropTypes.string
+  'data-test': PropTypes.string,
+  huge: PropTypes.bool
 });
 
 _defineProperty(QueryAssist, "defaultProps", {

package/dist/query-assist-ng/query-assist-ng.js

@@ -13,7 +13,7 @@ import 'core-js/modules/es.string.replace.js';
 import 'just-debounce-it';
 import 'classnames';
 import 'deep-equal';
-import '@jetbrains/icons/search-12px';
+import '@jetbrains/icons/search';
 import '@jetbrains/icons/close-12px';
 import '../global/get-uid.js';
 import '../global/data-tests.js';