@jetbrains/ring-ui 7.0.62 → 7.0.63

package/components/list/{list__hint.d.ts → list-hint.d.ts}

@@ -1,4 +1,4 @@
-import { PureComponent, ReactNode } from 'react';
+import { PureComponent, type ReactNode } from 'react';
 export interface ListHintProps {
     label: ReactNode;
 }

package/components/list/{list__hint.js → list-hint.js}

@@ -8,6 +8,6 @@ import styles from './list.css';
  */
 export default class ListHint extends PureComponent {
     render() {
-        return (_jsx("span", { className: classnames(styles.item, styles.hint), "data-test": "ring-list-hint", children: this.props.label }));
+        return (_jsx("span", { className: classnames(styles.item, styles.hint), "data-test": 'ring-list-hint', children: this.props.label }));
     }
 }

package/components/list/{list__item.d.ts → list-item.d.ts}

@@ -1,5 +1,5 @@
-import { PureComponent, SyntheticEvent } from 'react';
-import { ListDataItemProps } from './consts';
+import { PureComponent, type SyntheticEvent } from 'react';
+import { type ListDataItemProps } from './consts';
 export default class ListItem<T> extends PureComponent<ListDataItemProps<T>> {
     id: string;
     stopBubbling: (e: SyntheticEvent) => void;

package/components/list/{list__item.js → list-item.js}

@@ -9,7 +9,7 @@ import getUID from '../global/get-uid';
 import Link, { linkHOC } from '../link/link';
 import styles from './list.css';
 import { Type } from './consts';
-import { getListClasses } from './list__classes';
+import { getListClasses } from './list.classes';
 /**
  * @constructor
  * @extends {ReactComponent}
@@ -21,11 +21,12 @@ export default class ListItem extends PureComponent {
     id = getUID('list-item-');
     stopBubbling = (e) => e.stopPropagation();
     _isString = (val) => typeof val === 'string' || val instanceof String;
+    // eslint-disable-next-line complexity
     render() {
         const { disabled, checkbox, avatar, subavatar, glyph, icon, rightGlyph, description, label, title, details, hover, level, tabIndex, onClick, onCheckboxChange, onMouseOver, onMouseDown, onMouseUp, rightNodes, leftNodes, showGeneratedAvatar, username, labelWrapper, rgItemType, scrolling, 'data-test': dataTest, className, url, LinkComponent, compact, hoverClassName, children, ...restLinkProps // TODO use an allow list in 8.0
          } = this.props;
         const checkable = checkbox !== undefined;
-        const shouldShowGeneratedAvatar = showGeneratedAvatar && username != null;
+        const shouldShowGeneratedAvatar = showGeneratedAvatar && !!username;
         const hasLeftNodes = leftNodes || glyph || avatar || shouldShowGeneratedAvatar;
         const showCheckbox = checkable && (checkbox || !hasLeftNodes || (hover && !disabled));
         const classes = getListClasses(this.props);
@@ -53,7 +54,7 @@ export default class ListItem extends PureComponent {
             'ring-list-item-selected': checkbox,
             'ring-list-link': isLink,
         }, dataTest);
-        const labelElement = (_jsx("span", { className: styles.label, title: computedTitle, "data-test": "ring-list-item-label", children: label ?? children }));
+        const labelElement = (_jsx("span", { className: styles.label, title: computedTitle, "data-test": 'ring-list-item-label', children: label ?? children }));
         const commonProps = {
             id: this.id,
             tabIndex,
@@ -65,9 +66,9 @@ export default class ListItem extends PureComponent {
             className: classes,
             style,
             disabled,
-            children: (_jsxs(_Fragment, { children: [_jsxs("div", { className: styles.top, onMouseOut: this.stopBubbling, onBlur: this.stopBubbling, children: [!showCheckbox && (_jsxs("div", { className: styles.left, children: [leftNodes, glyph && (_jsx(Icon, { className: styles.glyph, glyph: glyph, size: this.props.iconSize, suppressSizeWarning: this.props.suppressSizeWarning })), (avatar || shouldShowGeneratedAvatar) && (_jsx(Avatar, { className: styles.avatar, url: avatar, size: AvatarSize.Size20, subavatar: subavatar, username: username }))] })), labelWrapper ? labelWrapper(labelElement) : labelElement, description && (_jsx("span", { className: styles.description, "data-test": "ring-list-item-description", children: description })), _jsxs("div", { className: styles.right, children: [rightGlyph && (_jsx(Icon, { className: styles.rightGlyph, glyph: rightGlyph, suppressSizeWarning: this.props.suppressSizeWarning, size: this.props.iconSize })), icon && _jsx("div", { className: styles.icon, style: { backgroundImage: `url("${icon}")` } }), rightNodes] })] }), details && _jsx("div", { className: detailsClasses, children: details })] })),
+            children: (_jsxs(_Fragment, { children: [_jsxs("div", { className: styles.top, onMouseOut: this.stopBubbling, onBlur: this.stopBubbling, children: [!showCheckbox && (_jsxs("div", { className: styles.left, children: [leftNodes, glyph && (_jsx(Icon, { className: styles.glyph, glyph: glyph, size: this.props.iconSize, suppressSizeWarning: this.props.suppressSizeWarning })), (avatar || shouldShowGeneratedAvatar) && (_jsx(Avatar, { className: styles.avatar, url: avatar, size: AvatarSize.Size20, subavatar: subavatar, username: username }))] })), labelWrapper ? labelWrapper(labelElement) : labelElement, description && (_jsx("span", { className: styles.description, "data-test": 'ring-list-item-description', children: description })), _jsxs("div", { className: styles.right, children: [rightGlyph && (_jsx(Icon, { className: styles.rightGlyph, glyph: rightGlyph, suppressSizeWarning: this.props.suppressSizeWarning, size: this.props.iconSize })), icon && _jsx("div", { className: styles.icon, style: { backgroundImage: `url("${icon}")` } }), rightNodes] })] }), details && _jsx("div", { className: detailsClasses, children: details })] })),
         };
         const LinkComponentToUse = LinkComponent ? linkHOC(LinkComponent) : Link;
-        return (_jsxs("div", { className: styles.itemContainer, "data-test": combinedDataTest, children: [showCheckbox && (_jsx("div", { className: styles.checkboxContainer, children: _jsx(Checkbox, { "aria-labelledby": this.id, checked: checkbox, disabled: disabled, onChange: onCheckboxChange, onClick: this.stopBubbling }) })), isLink ? (_jsx(LinkComponentToUse, { pseudo: !restLinkProps.href, ...commonProps, ...restLinkProps })) : (_jsx("button", { type: "button", ...commonProps }))] }));
+        return (_jsxs("div", { className: styles.itemContainer, "data-test": combinedDataTest, children: [showCheckbox && (_jsx("div", { className: styles.checkboxContainer, children: _jsx(Checkbox, { "aria-labelledby": this.id, checked: checkbox, disabled: disabled, onChange: onCheckboxChange, onClick: this.stopBubbling }) })), isLink ? (_jsx(LinkComponentToUse, { pseudo: !restLinkProps.href, ...commonProps, ...restLinkProps })) : (_jsx("button", { type: 'button', ...commonProps }))] }));
     }
 }

package/components/list/{list__separator.d.ts → list-separator.d.ts}

@@ -1,5 +1,5 @@
 import { PureComponent } from 'react';
-import { ListDataItemProps } from './consts';
+import { type ListDataItemProps } from './consts';
 export default class ListSeparator<T> extends PureComponent<ListDataItemProps<T>> {
     render(): import("react/jsx-runtime").JSX.Element;
 }

package/components/list/{list__separator.js → list-separator.js}

@@ -8,6 +8,6 @@ export default class ListSeparator extends PureComponent {
         const classes = classNames(styles.separator, className, {
             [styles.separator_first]: isFirst,
         });
-        return (_jsx("span", { "data-test": "ring-list-separator", className: classes, children: description }));
+        return (_jsx("span", { "data-test": 'ring-list-separator', className: classes, children: description }));
     }
 }

package/components/list/{list__title.d.ts → list-title.d.ts}

@@ -1,5 +1,5 @@
 import { PureComponent } from 'react';
-import { ListDataItemProps } from './consts';
+import { type ListDataItemProps } from './consts';
 export default class ListTitle<T> extends PureComponent<ListDataItemProps<T>> {
     render(): import("react/jsx-runtime").JSX.Element;
 }

package/components/list/{list__title.js → list-title.js}

@@ -8,6 +8,6 @@ export default class ListTitle extends PureComponent {
         const classes = classnames(styles.title, className, {
             [styles.title_first]: isFirst,
         });
-        return (_jsxs("span", { className: classes, "data-test": "ring-list-title", children: [_jsx("span", { className: classnames(styles.label, styles.text), "data-test": "ring-list-title-label", children: label }), _jsx("div", { className: styles.description, "data-test": "ring-list-title-description", children: description })] }));
+        return (_jsxs("span", { className: classes, "data-test": 'ring-list-title', children: [_jsx("span", { className: classnames(styles.label, styles.text), "data-test": 'ring-list-title-label', children: label }), _jsx("div", { className: styles.description, "data-test": 'ring-list-title-description', children: description })] }));
     }
 }

package/components/list/{list__users-groups-source.d.ts → list-users-groups-source.d.ts}

@@ -1,5 +1,6 @@
-import Auth, { AuthUser } from '../auth/auth';
-import HubSourceUsersGroups, { HubSourceUsersGroupsOptions, UserGroup } from '../hub-source/hub-source__users-groups';
+import HubSourceUsersGroups, { type HubSourceUsersGroupsOptions, type UserGroup } from '../hub-source/hub-source-users-groups';
+import type Auth from '../auth/auth';
+import type { AuthUser } from '../auth/auth';
 interface ListUsersGroupsSourceOptions extends Partial<HubSourceUsersGroupsOptions> {
     GroupsTitle: string;
     NoGroupsTitle: string;

package/components/list/{list__users-groups-source.js → list-users-groups-source.js}

@@ -1,5 +1,5 @@
 import GroupIcon from '@jetbrains/icons/group';
-import HubSourceUsersGroups from '../hub-source/hub-source__users-groups';
+import HubSourceUsersGroups from '../hub-source/hub-source-users-groups';
 import List from './list';
 const defaultOptions = {
     GroupsTitle: 'Groups',

package/components/list/{list__classes.d.ts → list.classes.d.ts}

@@ -1,2 +1,2 @@
-import { ListDataItemProps } from './consts';
+import { type ListDataItemProps } from './consts';
 export declare function getListClasses<T = unknown>({ className, disabled, hover, compact, scrolling, rgItemType, }: Readonly<ListDataItemProps<T>>): string;

package/components/list/list.css

@@ -1,7 +1,7 @@
-@import "../global/variables.css";
+@import '../global/variables.css';
 
 /* ensure style order */
-@import "../link/link.css";
+@import '../link/link.css';
 
 .list {
   position: relative;
@@ -43,7 +43,7 @@
   margin-top: 0;
   padding-top: 0;
 
-  border: none;
+  border: 0;
 }
 
 .item {
@@ -107,7 +107,7 @@
   white-space: nowrap;
   text-overflow: ellipsis;
 
-  [dir="rtl"] & {
+  [dir='rtl'] & {
     text-align: right;
     direction: ltr;
   }
@@ -268,7 +268,7 @@
 
   text-align: left;
 
-  [dir="rtl"] & {
+  [dir='rtl'] & {
     text-align: right;
     direction: ltr;
   }

package/components/list/list.d.ts

@@ -1,13 +1,13 @@
 /**
  * @name List
  */
-import { Component, ReactNode, SyntheticEvent } from 'react';
-import VirtualizedList, { ListRowProps } from 'react-virtualized/dist/es/List';
-import { Size } from 'react-virtualized/dist/es/AutoSizer';
-import { WindowScrollerChildProps } from 'react-virtualized/dist/es/WindowScroller';
-import { ShortcutsMap } from '../shortcuts/core';
-import ListHint from './list__hint';
-import { ListDataItem, ListDataItemProps, Type } from './consts';
+import { Component, type ReactNode, type SyntheticEvent } from 'react';
+import VirtualizedList, { type ListRowProps } from 'react-virtualized/dist/es/List';
+import { type Size } from 'react-virtualized/dist/es/AutoSizer';
+import { type WindowScrollerChildProps } from 'react-virtualized/dist/es/WindowScroller';
+import { type ShortcutsMap } from '../shortcuts/core';
+import ListHint from './list-hint';
+import { type ListDataItem, type ListDataItemProps, Type } from './consts';
 export type { ListDataItem };
 declare function noop(): void;
 /**

package/components/list/list.js

@@ -1,13 +1,14 @@
 import { createElement as _createElement } from "react";
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+/* eslint-disable max-lines */
 /**
  * @name List
  */
-import { Component } from 'react';
+import { Component, } from 'react';
 import classNames from 'classnames';
 import VirtualizedList from 'react-virtualized/dist/es/List';
 import AutoSizer from 'react-virtualized/dist/es/AutoSizer';
-import WindowScroller from 'react-virtualized/dist/es/WindowScroller';
+import WindowScrollerComponent from 'react-virtualized/dist/es/WindowScroller';
 import { CellMeasurer, CellMeasurerCache } from 'react-virtualized/dist/es/CellMeasurer';
 import deprecate from 'util-deprecate';
 import memoizeOne from 'memoize-one';
@@ -18,11 +19,11 @@ import memoize from '../global/memoize';
 import { preventDefault } from '../global/dom';
 import Shortcuts from '../shortcuts/shortcuts';
 import createStatefulContext from '../global/create-stateful-context';
-import ListItem from './list__item';
-import ListCustom from './list__custom';
-import ListTitle from './list__title';
-import ListSeparator from './list__separator';
-import ListHint from './list__hint';
+import ListItem from './list-item';
+import ListCustom from './list-custom';
+import ListTitle from './list-title';
+import ListSeparator from './list-separator';
+import ListHint from './list-hint';
 import { DEFAULT_ITEM_TYPE, Dimension, Type } from './consts';
 import styles from './list.css';
 function noop() { }
@@ -33,14 +34,14 @@ const warnEmptyKey = deprecate(() => { }, 'No key passed for list item with non-
  */
 function isItemType(listItemType, item) {
     let type = item.rgItemType;
-    if (type == null) {
+    if (type === null || type === undefined) {
         type = DEFAULT_ITEM_TYPE;
     }
     return type === listItemType;
 }
 const nonActivatableTypes = [Type.SEPARATOR, Type.TITLE, Type.MARGIN];
 function isActivatable(item) {
-    return item != null && !nonActivatableTypes.includes(item.rgItemType) && !item.disabled;
+    return item !== null && item !== undefined && !nonActivatableTypes.includes(item.rgItemType) && !item.disabled;
 }
 function getDataHash(data) {
     return data.map(it => `${it.key}-${it.disabled}`).join('-');
@@ -90,14 +91,14 @@ export default class List extends Component {
                 activeItem: null,
             });
         }
-        if (activeIndex != null && activeIndex !== prevActiveIndex && data[activeIndex] != null) {
+        if (activeIndex !== null && activeIndex !== undefined && activeIndex !== prevActiveIndex && data[activeIndex]) {
             Object.assign(nextState, {
                 activeIndex,
                 activeItem: data[activeIndex],
                 needScrollToActive: true,
             });
         }
-        else if (data !== prevData && restoreActiveIndex && activeItem != null && activeItem.key != null) {
+        else if (data !== prevData && restoreActiveIndex && activeItem && activeItem.key) {
             // Restore active index if there is an item with the same "key" property
             const index = data.findIndex(item => item.key === activeItem.key);
             if (index >= 0) {
@@ -110,7 +111,8 @@ export default class List extends Component {
         return nextState;
     }
     componentDidMount() {
-        if (this.props.activeIndex == null && shouldActivateFirstItem(this.props)) {
+        if ((this.props.activeIndex === null || this.props.activeIndex === undefined) &&
+            shouldActivateFirstItem(this.props)) {
             this.activateFirst();
         }
     }
@@ -126,7 +128,7 @@ export default class List extends Component {
         const isActiveItemRetainedPosition = activeIndex
             ? prevProps.data[activeIndex]?.key === this.props.data[activeIndex]?.key
             : false;
-        if (this.props.activeIndex == null &&
+        if ((this.props.activeIndex === null || this.props.activeIndex === undefined) &&
             getDataHash(this.props.data) !== getDataHash(prevProps.data) &&
             shouldActivateFirstItem(this.props) &&
             !isActiveItemRetainedPosition) {
@@ -253,7 +255,7 @@ export default class List extends Component {
         if (this.props.data.length === 0 || !this.hasActivatableItems()) {
             return;
         }
-        else if (this.props.data.length < index) {
+        if (this.props.data.length < index) {
             correctedIndex = 0;
         }
         else {
@@ -285,7 +287,7 @@ export default class List extends Component {
             const item = this.props.data[this.state.activeIndex];
             this.selectHandler(this.state.activeIndex)(event);
             if (item.href && !event.defaultPrevented) {
-                if (shortcut != null && ['command+enter', 'ctrl+enter'].includes(shortcut)) {
+                if (shortcut !== null && shortcut !== undefined && ['command+enter', 'ctrl+enter'].includes(shortcut)) {
                     window.open(item.href, '_blank');
                 }
                 else if (shortcut === 'shift+enter') {
@@ -297,15 +299,13 @@ export default class List extends Component {
             }
             return false; // do not propagate event
         }
-        else {
-            return true; // propagate event to the parent component (e.g., QueryAssist)
-        }
+        return true; // propagate event to the parent component (e.g., QueryAssist)
     };
     getFirst() {
         return this.props.data.find(item => item.rgItemType === Type.ITEM || item.rgItemType === Type.CUSTOM);
     }
     getSelected() {
-        return this.state.activeIndex != null ? this.props.data[this.state.activeIndex] : null;
+        return this.state.activeIndex ? this.props.data[this.state.activeIndex] : null;
     }
     defaultItemHeight() {
         return this.props.compact ? Dimension.COMPACT_ITEM_HEIGHT : Dimension.ITEM_HEIGHT;
@@ -345,8 +345,11 @@ export default class List extends Component {
         return `${itemProps.rgItemType}_${identificator}`;
     }
     getId(item) {
-        return item != null ? `${this.id}:${item.key || this._deprecatedGenerateKeyFromContent(item)}` : undefined;
+        return item !== null && item !== undefined
+            ? `${this.id}:${item.key || this._deprecatedGenerateKeyFromContent(item)}`
+            : undefined;
     }
+    // eslint-disable-next-line complexity
     renderItem = ({ index = 1, style, isScrolling = false, parent, key }) => {
         let itemKey;
         let el;
@@ -374,7 +377,7 @@ export default class List extends Component {
             const itemProps = Object.assign({ rgItemType: DEFAULT_ITEM_TYPE }, restProps);
             itemKey = key || itemId;
             itemProps.hover = isActive;
-            if (itemProps.hoverClassName != null && itemProps.hover) {
+            if (itemProps.hoverClassName !== null && itemProps.hoverClassName !== undefined && itemProps.hover) {
                 itemProps.className = classNames(itemProps.className, itemProps.hoverClassName);
             }
             itemProps.tabIndex = -1;
@@ -387,7 +390,7 @@ export default class List extends Component {
                 itemProps.onClick = selectHandler;
             }
             itemProps.onCheckboxChange = this.checkboxHandler(realIndex);
-            if (itemProps.compact == null) {
+            if (itemProps.compact === null || itemProps.compact === undefined) {
                 itemProps.compact = this.props.compact;
             }
             let ItemComponent;
@@ -415,7 +418,7 @@ export default class List extends Component {
             }
             el = _createElement(ItemComponent, { ...itemProps, key: itemProps.key });
         }
-        return parent ? (_jsx(CellMeasurer, { cache: this._cache, parent: parent, rowIndex: index, columnIndex: 0, children: ({ registerChild }) => (_jsx("div", { ref: registerChild, style: style, role: "row", "aria-selected": isActive, id: itemId, children: _jsx("div", { role: "cell", children: el }) })) }, itemKey)) : (_jsx("div", { role: "row", "aria-selected": isActive, id: itemId, children: _jsx("div", { role: "cell", children: el }) }, itemKey));
+        return parent ? (_jsx(CellMeasurer, { cache: this._cache, parent: parent, rowIndex: index, columnIndex: 0, children: ({ registerChild }) => (_jsx("div", { ref: registerChild, style: style, role: 'row', "aria-selected": isActive, id: itemId, children: _jsx("div", { role: 'cell', children: el }) })) }, itemKey)) : (_jsx("div", { role: 'row', "aria-selected": isActive, id: itemId, children: _jsx("div", { role: 'cell', children: el }) }, itemKey));
     };
     addItemDataTestToProp = (props) => {
         props['data-test'] = dataTests('ring-list-item', props['data-test']);
@@ -441,16 +444,19 @@ export default class List extends Component {
                         this.scrollEndHandler();
                     }, scrollTop: scrollTop, rowCount: rowCount, estimatedRowSize: this.defaultItemHeight(), rowHeight: this._cache.rowHeight, rowRenderer: this.renderItem, overscanRowCount: this._bufferSize, 
                     // ensure rerendering
-                    noop: () => { }, scrollToIndex: !this.props.disableScrollToActive && this.state.needScrollToActive && this.state.activeIndex != null
+                    noop: () => { }, scrollToIndex: !this.props.disableScrollToActive &&
+                        this.state.needScrollToActive &&
+                        this.state.activeIndex !== null &&
+                        this.state.activeIndex !== undefined
                         ? this.state.activeIndex + 1
-                        : undefined, scrollToAlignment: "center", deferredMeasurementCache: this._cache, onRowsRendered: this.checkOverflow, containerRole: "none" // row role is set by rowRenderer
+                        : undefined, scrollToAlignment: 'center', deferredMeasurementCache: this._cache, onRowsRendered: this.checkOverflow, containerRole: 'none' // row role is set by rowRenderer
                  }) })) }));
     }
     renderVirtualized(maxHeight, rowCount) {
         if (maxHeight) {
             return this.renderVirtualizedInner({ height: maxHeight, maxHeight, rowCount });
         }
-        return (_jsx(WindowScroller, { children: props => this.renderVirtualizedInner({ ...props, rowCount, autoHeight: true }) }));
+        return (_jsx(WindowScrollerComponent, { children: props => this.renderVirtualizedInner({ ...props, rowCount, autoHeight: true }) }));
     }
     renderSimple(maxHeight, rowCount) {
         const items = [];
@@ -460,7 +466,7 @@ export default class List extends Component {
                 isScrolling: this.state.scrolling,
             }));
         }
-        return (_jsx("div", { className: classNames('ring-list__i', styles.simpleInner), onScroll: this.scrollHandler, onMouseMove: this.mouseHandler, children: _jsx("div", { "aria-label": this.props.ariaLabel, role: "grid", style: maxHeight ? { maxHeight: this.getVisibleListHeight(maxHeight) } : undefined, children: items }) }));
+        return (_jsx("div", { className: classNames('ring-list__i', styles.simpleInner), onScroll: this.scrollHandler, onMouseMove: this.mouseHandler, children: _jsx("div", { "aria-label": this.props.ariaLabel, role: 'grid', style: maxHeight ? { maxHeight: this.getVisibleListHeight(maxHeight) } : undefined, children: items }) }));
     }
     id = getUID('list-');
     shortcutsScope = this.id;
@@ -482,7 +488,7 @@ export default class List extends Component {
         const rowCount = this.props.data.length + 2;
         const maxHeight = this.props.maxHeight && this.getVisibleListHeight(this.props.maxHeight);
         const classes = classNames(styles.list, this.props.className);
-        return (_jsxs(_Fragment, { children: [_jsx(ActiveItemContext.Updater, { value: this.getId(this.state.activeItem), skipUpdate: this.props.hidden || !isActivatable(this.state.activeItem) }), _jsxs("div", { id: this.props.id, ref: this.containerRef, className: classes, onMouseOut: this.props.onMouseOut, onBlur: this.props.onMouseOut, "data-test": "ring-list", children: [this.props.shortcuts && (_jsx(Shortcuts, { map: this.props.shortcutsMap ? { ...this.shortcutsMap, ...this.props.shortcutsMap } : this.shortcutsMap, scope: this.shortcutsScope })), this.props.renderOptimization
+        return (_jsxs(_Fragment, { children: [_jsx(ActiveItemContext.Updater, { value: this.getId(this.state.activeItem), skipUpdate: this.props.hidden || !isActivatable(this.state.activeItem) }), _jsxs("div", { id: this.props.id, ref: this.containerRef, className: classes, onMouseOut: this.props.onMouseOut, onBlur: this.props.onMouseOut, "data-test": 'ring-list', children: [this.props.shortcuts && (_jsx(Shortcuts, { map: this.props.shortcutsMap ? { ...this.shortcutsMap, ...this.props.shortcutsMap } : this.shortcutsMap, scope: this.shortcutsScope })), this.props.renderOptimization
                             ? this.renderVirtualized(maxHeight, rowCount)
                             : this.renderSimple(maxHeight, rowCount), this.state.hasOverflow && !this.state.scrolledToBottom && _jsx("div", { className: styles.fade, style: fadeStyles }), hint && _jsx(ListHint, { label: hint })] })] }));
     }

package/components/loader/{loader__core.js → loader-core.js}

@@ -137,7 +137,7 @@ export default class LoaderCore {
         if (coord + radius * 2 + this.baseSpeed >= limit) {
             return -(this.baseSpeed + randomizedSpeedChange);
         }
-        else if (coord <= this.baseSpeed) {
+        if (coord <= this.baseSpeed) {
             return this.baseSpeed + randomizedSpeedChange;
         }
         return speed;
@@ -187,7 +187,7 @@ export default class LoaderCore {
     }
     draw() {
         const ctx = this.ctx;
-        if (ctx == null) {
+        if (ctx === null) {
             return;
         }
         ctx.clearRect(0, 0, this.width, this.height);

package/components/loader/loader.css

@@ -1,4 +1,4 @@
-@import "../global/variables.css";
+@import '../global/variables.css';
 
 @keyframes rotation-keyframes {
   100% {

package/components/loader/loader.d.ts

@@ -1,5 +1,5 @@
-import { HTMLAttributes, PureComponent } from 'react';
-import LoaderCore, { LoaderCoreProps } from './loader__core';
+import { type HTMLAttributes, PureComponent } from 'react';
+import LoaderCore, { type LoaderCoreProps } from './loader-core';
 export interface LoaderProps extends Partial<LoaderCoreProps>, HTMLAttributes<HTMLElement> {
     'data-test'?: string | null | undefined;
 }

package/components/loader/loader.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { PureComponent } from 'react';
-import LoaderCore from './loader__core';
+import LoaderCore from './loader-core';
 /**
  * @name Loader
  */

package/components/loader-inline/loader-inline.css

@@ -1,4 +1,4 @@
-@import "../global/variables.css";
+@import '../global/variables.css';
 
 :root,
 :host {
@@ -58,7 +58,7 @@
     width: calc(var(--ring-unit) * 2);
     height: calc(var(--ring-unit) * 2);
 
-    content: "";
+    content: '';
     animation: pulse 0.85s cubic-bezier(0.68, 0, 0.74, 0.74) infinite alternate;
 
     background-image: conic-gradient(var(--ring-loader-inline-stops));

package/components/loader-inline/loader-inline.d.ts

@@ -1,4 +1,4 @@
-import { HTMLAttributes, PureComponent } from 'react';
+import { type HTMLAttributes, PureComponent } from 'react';
 export interface LoaderInlineProps extends HTMLAttributes<HTMLDivElement> {
     'data-test'?: string | null | undefined;
 }

package/components/loader-screen/loader-screen.css

@@ -1,4 +1,4 @@
-@import "../global/variables.css";
+@import '../global/variables.css';
 
 .loaderScreen {
   position: absolute;
@@ -14,7 +14,7 @@
 
     height: 100%;
 
-    content: "";
+    content: '';
 
     vertical-align: middle;
   }

package/components/loader-screen/loader-screen.d.ts

@@ -1,5 +1,5 @@
 import { PureComponent } from 'react';
-import { LoaderProps } from '../loader/loader';
+import { type LoaderProps } from '../loader/loader';
 export interface LoaderScreenProps extends LoaderProps {
     containerClassName?: string | null | undefined;
 }

package/components/login-dialog/login-dialog.css

@@ -1,9 +1,9 @@
-@import "../global/variables.css";
+@import '../global/variables.css';
 
 .iFrame {
   overflow: hidden;
 
-  border: none;
+  border: 0;
 }
 
 .dialogContent {

package/components/login-dialog/login-dialog.d.ts

@@ -1,4 +1,4 @@
-import { Component, ReactNode } from 'react';
+import { Component, type ReactNode } from 'react';
 export interface LoginDialogProps {
     onCancel: () => void;
     show: boolean;

package/components/login-dialog/login-dialog.js

@@ -61,6 +61,6 @@ export default class LoginDialog extends Component {
         const { show, className, url, loadingMessage, renderFallbackLink, onCancel } = this.props;
         const { loading, height, width, loggingIn, showFallbackLink } = this.state;
         const iFrameStyle = { height, width };
-        return (_jsxs(Dialog, { "data-test": "ring-login-dialog", className: className, contentClassName: styles.dialogContent, trapFocus: true, autoFocusFirst: false, show: show, showCloseButton: true, onCloseAttempt: onCancel, children: [_jsx(Content, { children: _jsx("iframe", { title: "Login dialog", style: iFrameStyle, src: url, className: styles.iFrame, scrolling: "no" }) }), loading && _jsx(LoaderScreen, { message: loadingMessage, containerClassName: styles.nonOpaqueLoader }), showFallbackLink && _jsx("div", { className: styles.fallbackLinkContainer, children: renderFallbackLink(loggingIn) })] }));
+        return (_jsxs(Dialog, { "data-test": 'ring-login-dialog', className: className, contentClassName: styles.dialogContent, trapFocus: true, autoFocusFirst: false, show: show, showCloseButton: true, onCloseAttempt: onCancel, children: [_jsx(Content, { children: _jsx("iframe", { title: 'Login dialog', style: iFrameStyle, src: url, className: styles.iFrame, scrolling: 'no' }) }), loading && _jsx(LoaderScreen, { message: loadingMessage, containerClassName: styles.nonOpaqueLoader }), showFallbackLink && _jsx("div", { className: styles.fallbackLinkContainer, children: renderFallbackLink(loggingIn) })] }));
     }
 }

package/components/login-dialog/service.d.ts

@@ -1,2 +1,2 @@
-import { LoginDialogAttrs } from './login-dialog';
+import { type LoginDialogAttrs } from './login-dialog';
 export default function showAuthDialog(props?: LoginDialogAttrs): () => void;

package/components/markdown/markdown.css

@@ -1,4 +1,4 @@
-@import "../global/variables.css";
+@import '../global/variables.css';
 
 .inline {
   &,
@@ -10,7 +10,7 @@
 .markdown {
   --ring-markdown-p-margin: 10px;
 
-  composes: font from "../global/global.css";
+  composes: font from '../global/global.css';
 
   & ol,
   & ul {
@@ -44,7 +44,7 @@
   & hr {
     margin: var(--ring-markdown-p-margin) 0;
 
-    border: none;
+    border: 0;
     border-bottom: 1px solid var(--ring-line-color);
   }
 

package/components/markdown/markdown.d.ts

@@ -1,4 +1,4 @@
-import { PureComponent, ReactNode } from 'react';
+import { PureComponent, type ReactNode } from 'react';
 export interface MarkdownProps {
     inline?: boolean | null | undefined;
     children: ReactNode;

package/components/markdown/markdown.js

@@ -14,6 +14,6 @@ export default class Markdown extends PureComponent {
             [styles.markdown]: !inline,
             [styles.inline]: inline,
         });
-        return (_jsx("div", { "data-test": "ring-markdown", className: classes, children: children }));
+        return (_jsx("div", { "data-test": 'ring-markdown', className: classes, children: children }));
     }
 }

package/components/message/message.css

@@ -1,7 +1,7 @@
-@import "../global/variables.css";
+@import '../global/variables.css';
 
 /* ensure style order */
-@import "../popup/popup.css";
+@import '../popup/popup.css';
 
 .container {
   display: inline;
@@ -29,7 +29,7 @@
 }
 
 .title {
-  composes: font-lower from "../global/global.css";
+  composes: font-lower from '../global/global.css';
 
   margin: 0;
 

package/components/message/message.d.ts

@@ -1,8 +1,8 @@
-import { Component, ReactNode } from 'react';
-import Popup, { PopupAttrs } from '../popup/popup';
+import { Component, type ReactNode } from 'react';
+import Popup, { type PopupAttrs } from '../popup/popup';
 import { Directions } from '../popup/popup.consts';
-import { IconType } from '../icon/icon';
-import { ButtonAttrs } from '../button/button';
+import { type IconType } from '../icon/icon';
+import { type ButtonAttrs } from '../button/button';
 import Theme from '../global/theme';
 export interface MessageTranslations {
     gotIt: string;

package/components/message/message.js

@@ -76,7 +76,7 @@ export default class Message extends Component {
     getTailOffset() {
         const DEFAULT_OFFSET = 32;
         const { popupProps } = this.props;
-        if (this.props.tailOffset != null) {
+        if (this.props.tailOffset) {
             return this.props.tailOffset;
         }
         const anchor = popupProps?.anchorElement || this.popup?.parent;
@@ -84,7 +84,7 @@ export default class Message extends Component {
             return DEFAULT_OFFSET;
         }
         const offset = Math.floor(anchor.offsetWidth / 2);
-        const isOpenedToRight = this.state.direction != null && [Directions.TOP_RIGHT, Directions.BOTTOM_RIGHT].includes(this.state.direction);
+        const isOpenedToRight = this.state.direction && [Directions.TOP_RIGHT, Directions.BOTTOM_RIGHT].includes(this.state.direction);
         if (popupProps?.left && isOpenedToRight) {
             return offset - popupProps?.left;
         }
@@ -98,6 +98,6 @@ export default class Message extends Component {
         const tailClasses = classNames(styles.tail, tailClassName);
         const popupDirections = this.props.direction ? [this.props.direction] : this.props.directions;
         const { direction } = this.state;
-        return (_jsx(I18nContext.Consumer, { children: ({ translate }) => (_jsx(WithThemeClasses, { theme: theme, children: themeClasses => (_jsx(Popup, { ref: this.popupRef, hidden: false, directions: popupDirections, className: classNames(classes, themeClasses), offset: UNIT * 2, onDirectionChange: this._onDirectionChange, ...popupProps, children: _jsxs(ThemeProvider, { theme: theme, passToPopups: true, children: [direction && _jsx("div", { className: tailClasses, style: getTailOffsets(this.getTailOffset())[direction] }), icon && _jsx(Icon, { className: styles.icon, glyph: icon }), title && (_jsx("h1", { "data-test": "rgMessageTitle", className: styles.title, children: title })), children && _jsx("div", { className: styles.description, children: children }), (onClose || buttonProps) && (_jsx(Button, { className: styles.gotIt, onClick: onClose, primary: true, ...buttonProps, children: translations?.gotIt ?? translate('gotIt') })), onDismiss && (_jsx(Button, { onClick: onDismiss, inline: true, children: translations?.dismiss ?? translate('dismiss') }))] }) })) })) }));
+        return (_jsx(I18nContext.Consumer, { children: ({ translate }) => (_jsx(WithThemeClasses, { theme: theme, children: themeClasses => (_jsx(Popup, { ref: this.popupRef, hidden: false, directions: popupDirections, className: classNames(classes, themeClasses), offset: UNIT * 2, onDirectionChange: this._onDirectionChange, ...popupProps, children: _jsxs(ThemeProvider, { theme: theme, passToPopups: true, children: [direction && _jsx("div", { className: tailClasses, style: getTailOffsets(this.getTailOffset())[direction] }), icon && _jsx(Icon, { className: styles.icon, glyph: icon }), title && (_jsx("h1", { "data-test": 'rgMessageTitle', className: styles.title, children: title })), children && _jsx("div", { className: styles.description, children: children }), (onClose || buttonProps) && (_jsx(Button, { className: styles.gotIt, onClick: onClose, primary: true, ...buttonProps, children: translations?.gotIt ?? translate('gotIt') })), onDismiss && (_jsx(Button, { onClick: onDismiss, inline: true, children: translations?.dismiss ?? translate('dismiss') }))] }) })) })) }));
     }
 }