@jetbrains/ring-ui 5.0.0-beta.2 → 5.0.0-beta.22

package/dist/permissions/permissions.js

@@ -89,7 +89,7 @@ class Permissions {
       return undefined;
     }
 
-    return services.map(service => `service:{${service}}`).join(' or ');
+    return services.map(service => "service:{".concat(service, "}")).join(' or ');
   }
 
   set(cachedPermissions) {

package/dist/permissions-ng/permissions-ng.js

@@ -2,6 +2,7 @@ import angular from 'angular';
 import '../auth-ng/auth-ng.js';
 import Permissions from '../permissions/permissions.js';
 import PermissionCache from '../permissions/permissions__cache.js';
+import 'core-js/modules/es.string.replace.js';
 import '../auth/auth.js';
 import '../auth/window-flow.js';
 import '../_helpers/_rollupPluginBabelHelpers.js';
@@ -12,6 +13,8 @@ import '../auth/down-notification.js';
 import 'react';
 import 'prop-types';
 import '../alert-service/alert-service.js';
+import 'core-js/modules/web.dom-collections.iterator.js';
+import '../global/react-render-adapter.js';
 import 'react-dom';
 import '../global/get-uid.js';
 import '../alert/alert.js';
@@ -27,19 +30,29 @@ import '../_helpers/icon.js';
 import '../icon/icon__svg.js';
 import '../global/memoize.js';
 import '../loader-inline/loader-inline.js';
-import '../global/theme.js';
 import '../global/data-tests.js';
-import '../_helpers/inject-styles.js';
-import '../global/conic-gradient.js';
-import 'conic-gradient';
-import '../global/supports-css.js';
-import '../global/inject-styles.js';
-import '../global/radial-gradient-mask.js';
+import '../_helpers/loader-inline.js';
 import '../global/dom.js';
-import '../alert/container.js';
-import '../link/link.js';
+import '../button/button.js';
 import 'focus-visible';
+import '@jetbrains/icons/chevron-10px';
 import '../link/clickableLink.js';
+import '../global/controls-height.js';
+import '../_helpers/button__classes.js';
+import '../_helpers/theme.js';
+import '../popup/popup.target.js';
+import '../popup/popup.js';
+import '../global/schedule-raf.js';
+import '../shortcuts/shortcuts.js';
+import '../shortcuts/core.js';
+import 'combokeys';
+import '../global/sniffer.js';
+import 'sniffr';
+import '../tab-trap/tab-trap.js';
+import '../popup/position.js';
+import '../popup/popup.consts.js';
+import '../alert/container.js';
+import '../link/link.js';
 import '../_helpers/link.js';
 import '../group/group.js';
 import '../_helpers/group.js';
@@ -201,7 +214,7 @@ angularModule.directive('rgPermissionIf', ["$animate", "userPermissions", "$inte
             $transclude(childScope, clone => {
               block = {
                 startNode: clone[0],
-                endNode: clone[clone.length++] = document.createComment(` end rgPermissionIf: ${iAttrs.rgPermissionIf} `)
+                endNode: clone[clone.length++] = document.createComment(" end rgPermissionIf: ".concat(iAttrs.rgPermissionIf, " "))
               };
               $animate.enter(clone, iElement.parent(), iElement);
             });

package/dist/place-under-ng/place-under-ng.js

@@ -3,6 +3,7 @@ import debounce from 'just-debounce-it';
 import createResizeDetector from 'element-resize-detector';
 import { getDocumentScrollTop } from '../global/dom.js';
 import '../_helpers/_rollupPluginBabelHelpers.js';
+import 'core-js/modules/web.dom-collections.iterator.js';
 
 const resizeDetector = createResizeDetector();
 const angularModule = angular.module('Ring.place-under', []);
@@ -82,7 +83,7 @@ angularModule.factory('rgPlaceUnderHelper', ["$window", $window => {
         const syncedElementOffsetTop = syncElement.getBoundingClientRect().top + documentScrollTop;
         const bottom = syncedElementOffsetTop + syncedElementHeight;
         const margin = Math.max(bottom - documentScrollTop, syncedElementHeight);
-        element.style.marginTop = `${margin + topOffset}px`;
+        element.style.marginTop = "".concat(margin + topOffset, "px");
 
         if (syncHeight) {
           /**
@@ -115,7 +116,7 @@ angularModule.factory('rgPlaceUnderHelper', ["$window", $window => {
             }
           }
 
-          element.style.height = `calc(100% - ${parseInt(element.style.marginTop, 10) + bottomOffset}px)`;
+          element.style.height = "calc(100% - ".concat(parseInt(element.style.marginTop, 10) + bottomOffset, "px)");
         }
       }
 

package/dist/popup/popup.d.ts

@@ -18,6 +18,7 @@ export interface BasePopupProps {
     keepMounted: boolean;
     directions: readonly Directions[];
     autoPositioning: boolean;
+    autoPositioningOnScroll: boolean;
     autoCorrectTopOverflow: boolean;
     left: number;
     top: number;
@@ -27,6 +28,8 @@ export interface BasePopupProps {
     autoFocusFirst: boolean;
     offset: number;
     legacy: boolean;
+    withTail?: boolean;
+    tailOffset?: number;
     anchorElement?: HTMLElement | null | undefined;
     target?: string | Element | null | undefined;
     className?: string | null | undefined;
@@ -42,6 +45,7 @@ export interface BasePopupProps {
     onContextMenu?: ((e: React.MouseEvent<HTMLElement>) => void) | undefined;
     onDirectionChange?: ((direction: Directions) => void) | null | undefined;
     onShow?: (() => void) | null | undefined;
+    children?: ReactNode;
 }
 export interface PopupProps extends BasePopupProps {
     children: ReactNode;
@@ -67,6 +71,7 @@ export default class Popup<P extends BasePopupProps = PopupProps> extends PureCo
         keepMounted: boolean;
         directions: Directions[];
         autoPositioning: boolean;
+        autoPositioningOnScroll: boolean;
         autoCorrectTopOverflow: boolean;
         left: number;
         top: number;
@@ -131,7 +136,7 @@ export default class Popup<P extends BasePopupProps = PopupProps> extends PureCo
      * @private
      */
     private _onDocumentClick;
-    getInternalContent(): React.ReactNode;
+    getInternalContent(): JSX.Element | P["children"] | undefined;
     shortcutsScope: string;
     shortcutsMap: {
         esc: (evt: KeyboardEvent) => void;
@@ -139,3 +144,4 @@ export default class Popup<P extends BasePopupProps = PopupProps> extends PureCo
     render(): JSX.Element;
 }
 export declare type PopupAttrs = JSX.LibraryManagedAttributes<typeof Popup, PopupProps>;
+export declare type BasePopupAttrs = JSX.LibraryManagedAttributes<typeof Popup, BasePopupProps>;

package/dist/popup/popup.js

@@ -1,4 +1,6 @@
 import { _ as _defineProperty } from '../_helpers/_rollupPluginBabelHelpers.js';
+import 'core-js/modules/web.dom-collections.iterator.js';
+import 'core-js/modules/es.string.replace.js';
 import React, { PureComponent } from 'react';
 import { createPortal } from 'react-dom';
 import PropTypes from 'prop-types';
@@ -18,11 +20,11 @@ import 'combokeys';
 import '../global/sniffer.js';
 import 'sniffr';
 
-var modules_2f69e2e2 = {"popup":"popup_rui_8cd0 font_rui_750f","hidden":"hidden_rui_8cd0","showing":"showing_rui_8cd0","attached":"attached_rui_8cd0"};
+var modules_2f69e2e2 = {"popup":"popup_rui_7cd4 font_rui_8bff","hidden":"hidden_rui_7cd4","showing":"showing_rui_7cd4","attached":"attached_rui_7cd4"};
 
 const stop = e => e.stopPropagation();
 
-const getPopupContainer = target => typeof target === 'string' ? document.querySelector(`[data-portaltarget=${target}]`) : target;
+const getPopupContainer = target => typeof target === 'string' ? document.querySelector("[data-portaltarget=".concat(target, "]")) : target;
 /**
  * @constructor
  * @name Popup
@@ -104,7 +106,7 @@ class Popup extends PureComponent {
             const propKey = key;
 
             if (typeof value === 'number') {
-              popup.style[propKey] = `${value}px`;
+              popup.style[propKey] = "".concat(value, "px");
             } else {
               popup.style[propKey] = value.toString();
             }
@@ -154,7 +156,6 @@ class Popup extends PureComponent {
 
   componentDidMount() {
     if (!this.props.client) {
-      // eslint-disable-next-line react/no-did-mount-set-state
       this.setState({
         client: true
       });
@@ -244,7 +245,11 @@ class Popup extends PureComponent {
       setTimeout(() => {
         this._listenersEnabled = true;
         this.listeners.add(window, 'resize', this._redraw);
-        this.listeners.add(window, 'scroll', this._redraw);
+
+        if (this.props.autoPositioningOnScroll) {
+          this.listeners.add(window, 'scroll', this._redraw);
+        }
+
         this.listeners.add(document, 'pointerdown', this._onDocumentClick, true);
 
         let el = this._getAnchor();
@@ -360,6 +365,7 @@ _defineProperty(Popup, "defaultProps", {
   keepMounted: false,
   directions: DEFAULT_DIRECTIONS,
   autoPositioning: true,
+  autoPositioningOnScroll: true,
   autoCorrectTopOverflow: true,
   left: 0,
   top: 0,

package/dist/popup/popup.target.d.ts

@@ -1,6 +1,7 @@
 import React, { HTMLAttributes, ReactNode } from 'react';
-export declare const PopupTargetContext: React.Context<string | undefined>;
+export declare const PopupTargetContext: React.Context<string | Element | undefined>;
 export interface PopupTargetProps extends Omit<HTMLAttributes<HTMLDivElement>, 'children'> {
+    id: string;
     children: ReactNode | ((target: ReactNode) => ReactNode);
 }
 export declare const PopupTarget: React.ForwardRefExoticComponent<PopupTargetProps & React.RefAttributes<HTMLDivElement>>;

package/dist/popup/position.d.ts

@@ -9,7 +9,7 @@ export interface PositionStyles extends Position {
     minWidth?: number;
 }
 export interface PositionAttrs {
-    popup: Element | null | undefined;
+    popup: HTMLElement | null | undefined;
     anchor: Element | null | undefined;
     container: Element | null;
     directions: readonly Directions[];

package/dist/popup/position.js

@@ -2,6 +2,7 @@ import { getRect, isMounted, getDocumentScrollTop, getDocumentScrollLeft, getWin
 import { Directions, MaxHeight, Dimension, MinWidth } from './popup.consts.js';
 export { Dimension, Directions, MaxHeight, MinWidth } from './popup.consts.js';
 import '../_helpers/_rollupPluginBabelHelpers.js';
+import 'core-js/modules/web.dom-collections.iterator.js';
 
 function getScrollingCoordinates(container) {
   if (container !== null) {
@@ -18,8 +19,8 @@ function getScrollingCoordinates(container) {
 }
 
 function getPositionStyles(popup, anchorRect, anchorLeft, anchorTop, offset) {
-  const popupWidth = popup.clientWidth;
-  const popupHeight = popup.clientHeight;
+  const popupWidth = popup.offsetWidth;
+  const popupHeight = popup.offsetHeight;
   const anchorBottom = anchorTop + anchorRect.height;
   const anchorRight = anchorLeft + anchorRect.width;
   const popupLeft = anchorLeft - popupWidth;

package/dist/popup-menu/popup-menu.d.ts

@@ -26,6 +26,7 @@ export default class PopupMenu<T = unknown> extends Popup<PopupMenuProps<T>> {
         keepMounted: boolean;
         directions: import("../popup/popup.consts").Directions[];
         autoPositioning: boolean;
+        autoPositioningOnScroll: boolean;
         autoCorrectTopOverflow: boolean;
         left: number;
         top: number;

package/dist/popup-menu/popup-menu.js

@@ -1,8 +1,10 @@
 import { _ as _defineProperty, a as _extends } from '../_helpers/_rollupPluginBabelHelpers.js';
+import 'core-js/modules/web.dom-collections.iterator.js';
 import React from 'react';
 import PropTypes from 'prop-types';
 import Popup from '../popup/popup.js';
 import List from '../list/list.js';
+import 'core-js/modules/es.string.replace.js';
 import 'react-dom';
 import 'classnames';
 import '../global/get-uid.js';
@@ -37,7 +39,7 @@ import '../avatar/avatar.js';
 import '../global/url.js';
 import '../avatar/fallback-avatar.js';
 import '../checkbox/checkbox.js';
-import '@jetbrains/icons/checkmark';
+import '@jetbrains/icons/checkmark-14px';
 import '@jetbrains/icons/remove-10px';
 import '../icon/icon.js';
 import '../icon/icon__constants.js';

package/dist/progress-bar/progress-bar.d.ts

@@ -1,10 +1,8 @@
 import { HTMLAttributes, PureComponent } from 'react';
 import PropTypes from 'prop-types';
-import Theme from '../global/theme';
 export interface ProgressBarProps extends HTMLAttributes<HTMLElement> {
     max: number;
     value: number;
-    theme: Theme;
     label: string;
     global?: boolean | null | undefined;
 }
@@ -21,7 +19,6 @@ export default class ProgressBar extends PureComponent<ProgressBarProps> {
     static toPercent(value: number, max: number): number;
     static propTypes: {
         label: PropTypes.Requireable<string>;
-        theme: PropTypes.Requireable<string>;
         /**
          * Sets the ring-progress-bar_global class to position the progress bar on top of the screen.
          * Should be placed directly inside body, will be positioned right below .ring-header
@@ -50,7 +47,6 @@ export default class ProgressBar extends PureComponent<ProgressBarProps> {
     static defaultProps: {
         max: number;
         value: number;
-        theme: Theme;
         label: string;
     };
     progressbarWrapper?: (HTMLElement | null);

package/dist/progress-bar/progress-bar.js

@@ -1,10 +1,10 @@
 import { _ as _defineProperty, a as _extends } from '../_helpers/_rollupPluginBabelHelpers.js';
+import 'core-js/modules/web.dom-collections.iterator.js';
 import React, { PureComponent } from 'react';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';
-import Theme from '../global/theme.js';
 
-var modules_fb7af416 = {"unit":"8px","light":"light_rui_d044","progressBar":"progressBar_rui_d044","dark":"dark_rui_d044","line":"line_rui_d044","globalMode":"globalMode_rui_d044","progress-bar":"progressBar_rui_d044"};
+var modules_fb7af416 = {"dark":"dark_rui_eb55","unit":"8px","progressBar":"progressBar_rui_5875","globalMode":"globalMode_rui_5875","line":"line_rui_5875","progress-bar":"progress-bar_rui_5875"};
 
 /**
  * @name Progress Bar
@@ -41,7 +41,6 @@ class ProgressBar extends PureComponent {
 
   render() {
     const {
-      theme,
       className,
       global,
       max,
@@ -49,10 +48,8 @@ class ProgressBar extends PureComponent {
       label,
       ...otherProps
     } = this.props;
-    const width = value ? `${ProgressBar.toPercent(value, max)}%` : undefined;
+    const width = value ? "".concat(ProgressBar.toPercent(value, max), "%") : undefined;
     const classes = classNames(modules_fb7af416.progressBar, className, {
-      [modules_fb7af416.light]: theme === Theme.LIGHT,
-      [modules_fb7af416.dark]: theme === Theme.DARK,
       [modules_fb7af416.globalMode]: global
     });
     return /*#__PURE__*/React.createElement("div", _extends({}, otherProps, {
@@ -76,7 +73,6 @@ class ProgressBar extends PureComponent {
 
 _defineProperty(ProgressBar, "propTypes", {
   label: PropTypes.string,
-  theme: PropTypes.string,
 
   /**
    * Sets the ring-progress-bar_global class to position the progress bar on top of the screen.
@@ -110,7 +106,6 @@ _defineProperty(ProgressBar, "propTypes", {
 _defineProperty(ProgressBar, "defaultProps", {
   max: 1.0,
   value: 0,
-  theme: Theme.LIGHT,
   label: 'Progress'
 });
 

package/dist/progress-bar-ng/progress-bar-ng.js

@@ -1,14 +1,15 @@
 import angularComponentFactory from '../global/angular-component-factory.js';
 import ProgressBar from '../progress-bar/progress-bar.js';
 import '../_helpers/_rollupPluginBabelHelpers.js';
+import 'core-js/modules/web.dom-collections.iterator.js';
 import 'angular';
 import 'react';
+import '../global/react-render-adapter.js';
 import 'react-dom';
 import '../global/ring-angular-component.js';
 import '../global/react-dom-renderer.js';
 import 'prop-types';
 import 'classnames';
-import '../global/theme.js';
 
 var progressBarNg = angularComponentFactory(ProgressBar, 'ProgressBar').name;
 

package/dist/promised-click-ng/promised-click-ng.js

@@ -1,16 +1,18 @@
 import { _ as _defineProperty } from '../_helpers/_rollupPluginBabelHelpers.js';
+import 'core-js/modules/web.dom-collections.iterator.js';
 import angular from 'angular';
 import { m as modules_e81895c9 } from '../_helpers/button__classes.js';
 import { applyMethodToClasses } from '../global/dom.js';
 import RingAngularComponent from '../global/ring-angular-component.js';
 import { LOADER_BACKGROUND_SELECTOR } from '../button-ng/button-ng.js';
 import 'classnames';
-import '../global/theme.js';
-import 'react';
 import '../icon-ng/icon-ng.js';
+import 'core-js/modules/es.string.replace.js';
 import '../icon/icon__constants.js';
 import '../template-ng/template-ng.js';
 import '../_helpers/icon.js';
+import '../global/controls-height.js';
+import 'react';
 
 /**
  * @name Promised Click Ng

package/dist/proxy-attrs/proxy-attrs.js

@@ -1,3 +1,5 @@
+import 'core-js/modules/es.string.replace.js';
+
 function proxyAttrs(template, attrsWhitelist) {
   return function copyAttrs(iElement, iAttrs) {
     const PREFIX = 'data-proxy-';
@@ -7,9 +9,9 @@ function proxyAttrs(template, attrsWhitelist) {
       if (iAttrs[attrName] !== undefined) {
         const attrLower = iAttrs.$attr[attrName];
         const attrValue = iAttrs[attrName];
-        const attrFind = `${PREFIX}${attrLower}`.replace(/[-\/\\^$*+?.()|[\]{}]/g, '\\$&');
-        const attrReplace = `${attrLower}="${attrValue}"`;
-        resultTemplate = resultTemplate.replace(RegExp(`${attrFind}(="")*`, 'g'), attrReplace);
+        const attrFind = "".concat(PREFIX).concat(attrLower).replace(/[-\/\\^$*+?.()|[\]{}]/g, '\\$&');
+        const attrReplace = "".concat(attrLower, "=\"").concat(attrValue, "\"");
+        resultTemplate = resultTemplate.replace(RegExp("".concat(attrFind, "(=\"\")*"), 'g'), attrReplace);
       }
     });
     return resultTemplate;

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

@@ -2,7 +2,6 @@ import React, { Component, ComponentRef, ReactNode, SyntheticEvent } from 'react
 import PropTypes from 'prop-types';
 import Caret, { Position } from '../caret/caret';
 import PopupMenu from '../popup-menu/popup-menu';
-import Theme from '../global/theme';
 import Button from '../button/button';
 import { ShortcutsMap } from '../shortcuts/core';
 import { QueryAssistSuggestion, SuggestionItem } from './query-assist__suggestions';
@@ -34,7 +33,6 @@ export interface QueryAssistRequestParams {
     omitSuggestions?: boolean;
 }
 export interface QueryAssistProps {
-    theme: Theme;
     onApply: (change: QueryAssistChange) => void;
     onChange: (change: QueryAssistChange) => void;
     onApplySuggestion: (suggestion: QueryAssistSuggestion, change: QueryAssistChange) => void;
@@ -60,7 +58,7 @@ export interface QueryAssistProps {
     actions?: ReactNode[] | null | undefined;
     'data-test'?: string | null | undefined;
 }
-interface StyleRange {
+export interface StyleRange {
     style: string;
     start: number;
     length: number;
@@ -125,7 +123,6 @@ interface HistoryEntry {
  */
 export default class QueryAssist extends Component<QueryAssistProps> {
     static propTypes: {
-        theme: PropTypes.Requireable<string>;
         /**
          * Open suggestions popup during the initial render
          */
@@ -212,7 +209,6 @@ export default class QueryAssist extends Component<QueryAssistProps> {
         'data-test': PropTypes.Requireable<string>;
     };
     static defaultProps: {
-        theme: Theme;
         onApply: typeof noop;
         onChange: typeof noop;
         onApplySuggestion: typeof noop;
@@ -230,7 +226,6 @@ export default class QueryAssist extends Component<QueryAssistProps> {
     shouldComponentUpdate(props: QueryAssistProps, state: QueryAssistState): boolean;
     componentDidUpdate(prevProps: QueryAssistProps): void;
     static ngModelStateField: string;
-    static Theme: typeof Theme;
     immediateState: QueryAssistChange;
     requestData?: (afterCompletion?: boolean) => void;
     ngModelStateField: string;
@@ -299,18 +294,14 @@ export default class QueryAssist extends Component<QueryAssistProps> {
 export declare type QueryAssistAttrs = JSX.LibraryManagedAttributes<typeof QueryAssist, QueryAssistProps>;
 export declare const RerenderableQueryAssist: {
     new (props: QueryAssistProps): {
-        _propsCache: Readonly<QueryAssistProps> & Readonly<{
-            children?: React.ReactNode;
-        }>;
-        rerender(props?: Partial<QueryAssistProps>, callback?: (() => void) | undefined): void | Element | React.Component<QueryAssistProps, any, any>;
+        _propsCache: QueryAssistProps & React.RefAttributes<unknown>;
+        rerender(props?: Partial<QueryAssistProps>, callback?: (() => void) | undefined): void;
         node?: HTMLElement | null | undefined;
-        context: any;
+        context: unknown;
         setState<K extends never>(state: {} | ((prevState: Readonly<{}>, props: Readonly<QueryAssistProps>) => {} | Pick<{}, K> | null) | Pick<{}, K> | null, callback?: (() => void) | undefined): void;
         forceUpdate(callback?: (() => void) | undefined): void;
         render(): React.ReactNode;
-        readonly props: Readonly<QueryAssistProps> & Readonly<{
-            children?: React.ReactNode;
-        }>;
+        readonly props: Readonly<QueryAssistProps>;
         state: Readonly<{}>;
         refs: {
             [key: string]: React.ReactInstance;

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

@@ -1,22 +1,23 @@
 import { _ as _defineProperty } from '../_helpers/_rollupPluginBabelHelpers.js';
+import 'core-js/modules/es.string.replace.js';
+import 'core-js/modules/web.dom-collections.iterator.js';
 import React, { Component } from 'react';
 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';
-import closeIcon from '@jetbrains/icons/close';
+import searchIcon from '@jetbrains/icons/search-12px';
+import closeIcon from '@jetbrains/icons/close-12px';
 import getUID from '../global/get-uid.js';
 import joinDataTestAttributes from '../global/data-tests.js';
 import { preventDefault, getRect } from '../global/dom.js';
 import Caret from '../caret/caret.js';
 import ContentEditable from '../contenteditable/contenteditable.js';
 import PopupMenu from '../popup-menu/popup-menu.js';
-import ThemedLoaderInline from '../loader-inline/loader-inline.js';
+import LoaderInline from '../loader-inline/loader-inline.js';
 import Shortcuts from '../shortcuts/shortcuts.js';
 import rerenderHOC from '../global/rerender-hoc.js';
-import Theme from '../global/theme.js';
-import ThemedButton from '../button/button.js';
+import { Button } from '../button/button.js';
 import { Q as QueryAssistSuggestions, m as modules_da7ab055 } from '../_helpers/query-assist__suggestions.js';
 import 'react-dom/server';
 import '../popup/popup.js';
@@ -50,7 +51,7 @@ import '../avatar/avatar.js';
 import '../global/url.js';
 import '../avatar/fallback-avatar.js';
 import '../checkbox/checkbox.js';
-import '@jetbrains/icons/checkmark';
+import '@jetbrains/icons/checkmark-14px';
 import '@jetbrains/icons/remove-10px';
 import '../icon/icon.js';
 import '../icon/icon__constants.js';
@@ -63,13 +64,11 @@ import '../list/list__title.js';
 import '../list/list__separator.js';
 import '../list/list__hint.js';
 import '../list/consts.js';
-import '../_helpers/inject-styles.js';
-import '../global/conic-gradient.js';
-import 'conic-gradient';
-import '../global/supports-css.js';
-import '../global/inject-styles.js';
-import '../global/radial-gradient-mask.js';
+import '../_helpers/loader-inline.js';
+import '../global/react-render-adapter.js';
+import '../global/composeRefs.js';
 import '@jetbrains/icons/chevron-10px';
+import '../global/controls-height.js';
 import '../_helpers/button__classes.js';
 
 const POPUP_COMPENSATION = PopupMenu.ListProps.Dimension.ITEM_PADDING + PopupMenu.PopupProps.Dimension.BORDER_WIDTH;
@@ -868,7 +867,7 @@ class QueryAssist extends Component {
           return;
         }
 
-        const styleName = `${LETTER_CLASS}-${item.style.replace('_', '-')}`;
+        const styleName = "".concat(LETTER_CLASS, "-").concat(item.style.replace('_', '-'));
 
         for (let i = item.start; i < item.start + item.length; i++) {
           classes[i] = modules_da7ab055[styleName];
@@ -911,7 +910,7 @@ class QueryAssist extends Component {
     const renderClear = this.props.clear && !!this.state.query;
 
     if (renderClear) {
-      actions.push( /*#__PURE__*/React.createElement(ThemedButton, {
+      actions.push( /*#__PURE__*/React.createElement(Button, {
         icon: closeIcon,
         key: 'clearAction',
         className: modules_da7ab055.icon,
@@ -928,7 +927,6 @@ class QueryAssist extends Component {
 
   render() {
     const {
-      theme,
       glass,
       'data-test': dataTest,
       className,
@@ -937,10 +935,9 @@ class QueryAssist extends Component {
     const renderPlaceholder = !!this.props.placeholder && this.state.placeholderEnabled;
     const renderLoader = this.props.loader !== false && this.state.loading;
     const renderGlass = glass && !renderLoader;
-    const renderUnderline = theme === Theme.DARK;
     const actions = this.renderActions();
     const inputClasses = classNames({
-      [`${modules_da7ab055.input} ring-js-shortcuts`]: true,
+      ["".concat(modules_da7ab055.input, " ring-js-shortcuts")]: true,
       [modules_da7ab055.inputGap]: actions.length || this.isRenderingGlassOrLoader() && !glass,
       [modules_da7ab055.inputGap2]: actions.length === 2,
       [modules_da7ab055.inputLeftGap]: this.isRenderingGlassOrLoader() && glass,
@@ -948,13 +945,13 @@ class QueryAssist extends Component {
     });
     return /*#__PURE__*/React.createElement("div", {
       "data-test": joinDataTestAttributes('ring-query-assist', dataTest),
-      className: classNames(className, modules_da7ab055.queryAssist, modules_da7ab055[theme]),
+      className: classNames(className, modules_da7ab055.queryAssist),
       role: "presentation",
       ref: this.nodeRef
     }, this.state.shortcuts && /*#__PURE__*/React.createElement(Shortcuts, {
       map: this.shortcutsMap,
       scope: this.shortcutsScope
-    }), renderGlass && /*#__PURE__*/React.createElement(ThemedButton, {
+    }), renderGlass && /*#__PURE__*/React.createElement(Button, {
       icon: searchIcon,
       className: modules_da7ab055.icon,
       iconClassName: modules_da7ab055.iconInner,
@@ -967,9 +964,7 @@ class QueryAssist extends Component {
         [modules_da7ab055.loaderOnTheRight]: !glass
       }),
       ref: this.loaderRef
-    }, /*#__PURE__*/React.createElement(ThemedLoaderInline, {
-      theme: theme
-    })), /*#__PURE__*/React.createElement(ContentEditable, {
+    }, /*#__PURE__*/React.createElement(LoaderInline, null)), /*#__PURE__*/React.createElement(ContentEditable, {
       "aria-label": this.props.translations.searchTitle,
       className: inputClasses,
       "data-test": "ring-query-assist-input",
@@ -998,9 +993,7 @@ class QueryAssist extends Component {
       ref: this.placeholderRef,
       onClick: this.handleCaretMove,
       "data-test": "query-assist-placeholder"
-    }, this.props.placeholder), renderUnderline && /*#__PURE__*/React.createElement("div", {
-      className: modules_da7ab055.focusUnderline
-    }), actions && /*#__PURE__*/React.createElement("div", {
+    }, this.props.placeholder), actions && /*#__PURE__*/React.createElement("div", {
       "data-test": "ring-query-assist-actions",
       className: modules_da7ab055.actions
     }, actions), /*#__PURE__*/React.createElement(PopupMenu, {
@@ -1010,7 +1003,7 @@ class QueryAssist extends Component {
       anchorElement: this.node,
       keepMounted: true,
       attached: true,
-      className: classNames(modules_da7ab055[theme], this.props.popupClassName),
+      className: this.props.popupClassName,
       directions: [PopupMenu.PopupProps.Directions.BOTTOM_RIGHT],
       data: useCustomItemRender ? this.state.suggestions : this.renderSuggestions(),
       "data-test": "ring-query-assist-popup",
@@ -1027,8 +1020,6 @@ class QueryAssist extends Component {
 }
 
 _defineProperty(QueryAssist, "propTypes", {
-  theme: PropTypes.string,
-
   /**
    * Open suggestions popup during the initial render
    */
@@ -1135,7 +1126,6 @@ _defineProperty(QueryAssist, "propTypes", {
 });
 
 _defineProperty(QueryAssist, "defaultProps", {
-  theme: Theme.LIGHT,
   onApply: noop,
   onChange: noop,
   onApplySuggestion: noop,
@@ -1149,8 +1139,6 @@ _defineProperty(QueryAssist, "defaultProps", {
 
 _defineProperty(QueryAssist, "ngModelStateField", ngModelStateField);
 
-_defineProperty(QueryAssist, "Theme", Theme);
-
 const RerenderableQueryAssist = rerenderHOC(QueryAssist);
 
 export { RerenderableQueryAssist, QueryAssist as default };