@jetbrains/ring-ui 7.0.27 → 7.0.28

package/components/list/list.js

@@ -18,7 +18,6 @@ import memoize from '../global/memoize';
 import { preventDefault } from '../global/dom';
 import Shortcuts from '../shortcuts/shortcuts';
 import createStatefulContext from '../global/create-stateful-context';
-import ListLink from './list__link';
 import ListItem from './list__item';
 import ListCustom from './list__custom';
 import ListTitle from './list__title';
@@ -394,9 +393,6 @@ export default class List extends Component {
                     itemProps.isFirst = isFirst;
                     break;
                 case Type.LINK:
-                    ItemComponent = ListLink;
-                    this.addItemDataTestToProp(itemProps);
-                    break;
                 case Type.ITEM:
                     ItemComponent = ListItem;
                     this.addItemDataTestToProp(itemProps);

package/components/list/list__item.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { PureComponent } from 'react';
 import classNames from 'classnames';
 import dataTests from '../global/data-tests';
@@ -6,7 +6,9 @@ import Avatar, { Size as AvatarSize } from '../avatar/avatar';
 import Checkbox from '../checkbox/checkbox';
 import Icon from '../icon/icon';
 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';
 /**
  * @constructor
@@ -20,7 +22,7 @@ export default class ListItem extends PureComponent {
     stopBubbling = (e) => e.stopPropagation();
     _isString = (val) => typeof val === 'string' || val instanceof String;
     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, } = this.props;
+        const { disabled, checkbox, avatar, subavatar, glyph, icon, rightGlyph, description, label, title, details, hover, level, onCheckboxChange, rightNodes, leftNodes, showGeneratedAvatar, username, labelWrapper, rgItemType, scrolling, 'data-test': dataTest, className, url, LinkComponent, compact, hoverClassName, children, ...restProps } = this.props;
         const checkable = checkbox !== undefined;
         const shouldShowGeneratedAvatar = showGeneratedAvatar && username != null;
         const hasLeftNodes = leftNodes || glyph || avatar || shouldShowGeneratedAvatar;
@@ -43,12 +45,23 @@ export default class ListItem extends PureComponent {
             // label can also be an element, use empty string in this case
             computedTitle = this._isString(label) ? label : '';
         }
-        const dataTest = dataTests({
-            'ring-list-item': (this.props['data-test'] || '').indexOf('ring-list-item') === -1,
+        const isLink = rgItemType === Type.LINK;
+        const combinedDataTest = dataTests({
+            'ring-list-item': (dataTest || '').indexOf('ring-list-item') === -1,
             'ring-list-item-action': !disabled,
             'ring-list-item-selected': checkbox,
-        }, this.props['data-test']);
-        const labelElement = (_jsx("span", { className: styles.label, title: computedTitle, "data-test": "ring-list-item-label", children: label }));
-        return (_jsxs("div", { className: styles.itemContainer, "data-test": dataTest, children: [showCheckbox && (_jsx("div", { className: styles.checkboxContainer, children: _jsx(Checkbox, { "aria-labelledby": this.id, checked: checkbox, disabled: disabled, onChange: onCheckboxChange, onClick: this.stopBubbling }) })), _jsxs("button", { id: this.id, type: "button", tabIndex: tabIndex, onClick: onClick, onMouseOver: onMouseOver, onMouseDown: onMouseDown, onFocus: onMouseOver, onMouseUp: onMouseUp, className: classes, style: style, disabled: disabled, 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 })] })] }));
+            'ring-list-link': isLink,
+        }, dataTest);
+        const labelElement = (_jsx("span", { className: styles.label, title: computedTitle, "data-test": "ring-list-item-label", children: label ?? children }));
+        const commonProps = {
+            ...restProps,
+            id: this.id,
+            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 })] })),
+        };
+        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: !restProps.href, ...commonProps })) : (_jsx("button", { type: "button", ...commonProps }))] }));
     }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jetbrains/ring-ui",
-  "version": "7.0.27",
+  "version": "7.0.28",
   "description": "JetBrains UI library",
   "author": {
     "name": "JetBrains"

package/components/list/list__link.d.ts

@@ -1,9 +0,0 @@
-import { PureComponent } from 'react';
-import { ListDataItemProps } from './consts';
-/**
- * @constructor
- * @extends {ReactComponent}
- */
-export default class ListLink<T> extends PureComponent<ListDataItemProps<T>> {
-    render(): import("react/jsx-runtime").JSX.Element;
-}

package/components/list/list__link.js

@@ -1,17 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { PureComponent } from 'react';
-import Link, { linkHOC } from '../link/link';
-import dataTests from '../global/data-tests';
-import { getListClasses } from './list__classes';
-/**
- * @constructor
- * @extends {ReactComponent}
- */
-export default class ListLink extends PureComponent {
-    render() {
-        const { scrolling, 'data-test': dataTest, className, label, hover, description, rgItemType, url, onCheckboxChange, disabled, LinkComponent, compact, hoverClassName, children, ...restProps } = this.props;
-        const classes = getListClasses(this.props);
-        const Comp = LinkComponent ? linkHOC(LinkComponent) : Link;
-        return (_jsx(Comp, { pseudo: !this.props.href, ...restProps, className: classes, "data-test": dataTests('ring-list-link', dataTest), children: label ?? children }));
-    }
-}