@jetbrains/ring-ui-built 7.0.0-beta.9 → 7.0.0

package/components/button/button__classes.d.ts

@@ -1,2 +1,2 @@
 import { ButtonProps } from './button';
-export declare function getButtonClasses({ className, active, disabled, loader, primary, short, inline, danger, delayed, icon, height, children }: ButtonProps): string;
+export declare function getButtonClasses({ className, active, disabled, loader, primary, short, inline, danger, delayed, icon, height, children, }: ButtonProps): string;

package/components/button-group/button-group.js

@@ -5,10 +5,9 @@ import classNames from 'classnames';
 import joinDataTestAttributes from '../global/data-tests.js';
 import { ControlLabel } from '../control-label/control-label.js';
 import ControlHelp from '../control-help/control-help.js';
-import { m as modules_1068e447 } from '../_helpers/caption.js';
+import { s as styles } from '../_helpers/caption.js';
 export { C as Caption } from '../_helpers/caption.js';
 import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
-import 'core-js/modules/es.array.reduce.js';
 import 'core-js/modules/web.dom-collections.iterator.js';
 
 const _excluded = ["className", "split", "data-test", "label", "help"];
@@ -23,7 +22,7 @@ class ButtonGroup extends PureComponent {
         help
       } = _this$props,
       restProps = _objectWithoutProperties(_this$props, _excluded);
-    const classes = classNames(split ? modules_1068e447.split : modules_1068e447.buttonGroup, className);
+    const classes = classNames(split ? styles.split : styles.buttonGroup, className);
     return /*#__PURE__*/jsxs(Fragment, {
       children: [label && /*#__PURE__*/jsx(ControlLabel, {
         children: label
@@ -31,7 +30,7 @@ class ButtonGroup extends PureComponent {
         "data-test": joinDataTestAttributes('ring-button-group', dataTest),
         className: classes
       })), help && /*#__PURE__*/jsx(ControlHelp, {
-        className: modules_1068e447.help,
+        className: styles.help,
         children: help
       })]
     });

package/components/button-set/button-set.js

@@ -3,10 +3,9 @@ import { PureComponent } from 'react';
 import classNames from 'classnames';
 import joinDataTestAttributes from '../global/data-tests.js';
 import { jsx } from 'react/jsx-runtime';
-import 'core-js/modules/es.array.reduce.js';
 import 'core-js/modules/web.dom-collections.iterator.js';
 
-var modules_fd849143 = {"button":"button_rui_6ad6","light":"light_rui_2ac4","buttonSet":"buttonSet_rui_97ff"};
+var styles = {"button":"button_rui_6ad6","buttonSet":"buttonSet_rui_97ff"};
 
 const _excluded = ["className", "data-test", "children"];
 class ButtonSet extends PureComponent {
@@ -18,7 +17,7 @@ class ButtonSet extends PureComponent {
         children
       } = _this$props,
       restProps = _objectWithoutProperties(_this$props, _excluded);
-    const classes = classNames(modules_fd849143.buttonSet, className);
+    const classes = classNames(styles.buttonSet, className);
     return /*#__PURE__*/jsx("div", _objectSpread2(_objectSpread2({}, restProps), {}, {
       "data-test": joinDataTestAttributes('ring-button-set', dataTest),
       className: classes,

package/components/button-toolbar/button-toolbar.d.ts

@@ -4,7 +4,7 @@ export interface ButtonToolbarProps extends HTMLAttributes<HTMLElement> {
 }
 /**
  * @name Button Toolbar
-*/
+ */
 export default class ButtonToolbar extends PureComponent<ButtonToolbarProps> {
     render(): import("react").JSX.Element;
 }

package/components/button-toolbar/button-toolbar.js

@@ -3,10 +3,9 @@ import { PureComponent } from 'react';
 import classNames from 'classnames';
 import joinDataTestAttributes from '../global/data-tests.js';
 import { jsx } from 'react/jsx-runtime';
-import 'core-js/modules/es.array.reduce.js';
 import 'core-js/modules/web.dom-collections.iterator.js';
 
-var modules_34154ec0 = {"button":"button_rui_6ad6","light":"light_rui_2ac4","buttonToolbar":"buttonToolbar_rui_5c90","buttonGroup":"buttonGroup_rui_5c90","split":"split_rui_5c90"};
+var styles = {"button":"button_rui_6ad6","buttonToolbar":"buttonToolbar_rui_5c90","buttonGroup":"buttonGroup_rui_5c90","split":"split_rui_5c90"};
 
 const _excluded = ["className", "data-test"];
 class ButtonToolbar extends PureComponent {
@@ -17,7 +16,7 @@ class ButtonToolbar extends PureComponent {
         'data-test': dataTest
       } = _this$props,
       restProps = _objectWithoutProperties(_this$props, _excluded);
-    const classes = classNames(modules_34154ec0.buttonToolbar, className);
+    const classes = classNames(styles.buttonToolbar, className);
     return /*#__PURE__*/jsx("div", _objectSpread2(_objectSpread2({}, restProps), {}, {
       "data-test": joinDataTestAttributes('ring-button-toolbar', dataTest),
       className: classes

package/components/checkbox/checkbox.js

@@ -16,7 +16,7 @@ import 'core-js/modules/es.string.replace.js';
 import '../global/memoize.js';
 import 'memoize-one';
 
-var modules_3199090e = {"checkboxSize":"14px","light":"light_rui_2ac4","checkbox":"checkbox_rui_219d","cell":"cell_rui_219d","icon":"icon_rui_219d","check":"check_rui_219d icon_rui_219d","minus":"minus_rui_219d icon_rui_219d","input":"input_rui_219d","cellWrapper":"cellWrapper_rui_219d","focus":"focus_rui_219d","label":"label_rui_219d"};
+var styles = {"checkbox":"checkbox_rui_219d","cell":"cell_rui_219d","icon":"icon_rui_219d","check":"check_rui_219d icon_rui_219d","minus":"minus_rui_219d icon_rui_219d","input":"input_rui_219d","cellWrapper":"cellWrapper_rui_219d","focus":"focus_rui_219d","label":"label_rui_219d"};
 
 const _excluded = ["children", "label", "className", "containerClassName", "containerStyle", "cellClassName", "labelClassName", "indeterminate", "inputRef", "help"];
 class Checkbox extends PureComponent {
@@ -59,10 +59,10 @@ class Checkbox extends PureComponent {
         help
       } = _this$props,
       restProps = _objectWithoutProperties(_this$props, _excluded);
-    const classes = classNames(modules_3199090e.input, className);
-    const containerClasses = classNames(modules_3199090e.checkbox, containerClassName);
-    const cellClasses = classNames(modules_3199090e.cell, cellClassName);
-    const labelClasses = classNames(modules_3199090e.label, labelClassName);
+    const classes = classNames(styles.input, className);
+    const containerClasses = classNames(styles.checkbox, containerClassName);
+    const cellClasses = classNames(styles.cell, cellClassName);
+    const labelClasses = classNames(styles.label, labelClassName);
     return /*#__PURE__*/jsxs("label", {
       className: containerClasses,
       style: containerStyle,
@@ -73,15 +73,15 @@ class Checkbox extends PureComponent {
         type: "checkbox",
         className: classes
       })), /*#__PURE__*/jsx("div", {
-        className: modules_3199090e.cellWrapper,
+        className: styles.cellWrapper,
         children: /*#__PURE__*/jsxs("span", {
           className: cellClasses,
           children: [/*#__PURE__*/jsx(Icon, {
             glyph: checkmarkIcon,
-            className: modules_3199090e.check
+            className: styles.check
           }), /*#__PURE__*/jsx(Icon, {
             glyph: minusIcon,
-            className: modules_3199090e.minus
+            className: styles.minus
           })]
         })
       }), /*#__PURE__*/jsxs("span", {

package/components/clipboard/clipboard.js

@@ -21,7 +21,6 @@ import '../global/memoize.js';
 import 'react/jsx-runtime';
 import '../loader-inline/loader-inline.js';
 import '../global/data-tests.js';
-import 'core-js/modules/es.array.reduce.js';
 import '../global/dom.js';
 import '../button/button.js';
 import '@jetbrains/icons/chevron-down';

package/components/code/code.d.ts

@@ -5,7 +5,7 @@ export interface CodeProps {
     code: string;
     inline: boolean;
     softWrap: boolean;
-    replacer: ((element: HTMLElement | null) => void);
+    replacer: (element: HTMLElement | null) => void;
     className?: string | null | undefined;
     language?: string | null | undefined;
     codeRef?: Ref<HTMLElement> | null | undefined;

package/components/code/code.js

@@ -11,13 +11,13 @@ import { jsx } from 'react/jsx-runtime';
 import 'core-js/modules/es.array.reverse.js';
 import 'core-js/modules/es.regexp.exec.js';
 
-var modules_66c414ea = {"light":"light_rui_2ac4","code":"code_rui_1c82","inline":"inline_rui_1c82","softWrap":"softWrap_rui_1c82"};
+var styles = {"code":"code_rui_1c82","inline":"inline_rui_1c82","softWrap":"softWrap_rui_1c82"};
 
-var modules_39cf09e8 = {"highlightContainer":"highlightContainer_rui_1a79"};
+var highlightStyles = {"highlightContainer":"highlightContainer_rui_1a79"};
 
 function noop() {}
 const registerLanguage = memoize(async language => {
-  const languageExports = await import( /* webpackChunkName: "highlight-[request]" */"highlight.js/lib/languages/".concat(language));
+  const languageExports = await import(/* webpackChunkName: "highlight-[request]" */"highlight.js/lib/languages/".concat(language));
   highlight.registerLanguage(language, languageExports.default);
 });
 /**
@@ -83,9 +83,9 @@ class Code extends PureComponent {
       language
     } = this.props;
     const Tag = inline ? 'span' : 'pre';
-    const classes = classNames(modules_66c414ea.code, className, language, {
-      [modules_66c414ea.inline]: inline,
-      [modules_66c414ea.softWrap]: softWrap
+    const classes = classNames(styles.code, className, language, {
+      [styles.inline]: inline,
+      [styles.softWrap]: softWrap
     });
     return /*#__PURE__*/jsx(Tag, {
       className: classes,
@@ -94,7 +94,7 @@ class Code extends PureComponent {
         // should be focusable because it can be scrollable
         tabIndex: inline ? -1 : 0,
         ref: this.initCodeRef,
-        className: modules_39cf09e8.highlightContainer,
+        className: highlightStyles.highlightContainer,
         children: normalizeIndent(code)
       })
     });

package/components/collapse/collapse-content.d.ts

@@ -1,5 +1,4 @@
-import { PropsWithChildren } from 'react';
-import * as React from 'react';
+import React, { PropsWithChildren } from 'react';
 type Props = {
     minHeight?: number;
     className?: string;

package/components/collapse/collapse-content.js

@@ -7,11 +7,10 @@ import { toPx } from './utils.js';
 import { CollapseContext } from './collapse-context.js';
 import { COLLAPSE_CONTENT_CONTAINER_TEST_ID, COLLAPSE_CONTENT_TEST_ID } from './consts.js';
 import { jsxs, jsx } from 'react/jsx-runtime';
-import 'core-js/modules/es.array.reduce.js';
 import '../_helpers/_rollupPluginBabelHelpers.js';
 import 'core-js/modules/es.regexp.exec.js';
 
-var modules_9c8b5b00 = {"container":"container_rui_93ce","transition":"transition_rui_93ce","summary":"summary_rui_93ce","trigger":"trigger_rui_93ce","fade":"fade_rui_93ce"};
+var styles = {"container":"container_rui_93ce","transition":"transition_rui_93ce","summary":"summary_rui_93ce","trigger":"trigger_rui_93ce","fade":"fade_rui_93ce"};
 
 const DURATION_FACTOR = 0.5;
 const DEFAULT_HEIGHT = 0;
@@ -41,13 +40,27 @@ const CollapseContent = _ref => {
     height: 0
   });
   const [height, setHeight] = useState(toPx(minHeight));
-  const [showFade, setShowFade] = useState(true);
+  const [showFade, setShowFade] = useState(collapsed);
+  const [shouldHideContent, setShouldHideContent] = useState(collapsed && minHeight <= DEFAULT_HEIGHT);
   useEffect(() => {
-    if (!collapsed) {
-      setShowFade(false);
-    } else {
-      setShowFade(true);
+    function onTransitionEnd() {
+      if (initialContentHeight.current <= DEFAULT_HEIGHT) {
+        setShouldHideContent(collapsed);
+      }
     }
+    const container = containerRef.current;
+    if (container) {
+      container.addEventListener('transitionend', onTransitionEnd);
+    }
+    return () => {
+      if (container) {
+        container.removeEventListener('transitionend', onTransitionEnd);
+      }
+    };
+  }, [collapsed]);
+  useEffect(() => {
+    setShowFade(collapsed);
+    if (!collapsed) setShouldHideContent(false);
   }, [collapsed]);
   useEffect(() => {
     if (contentRef.current) {
@@ -85,20 +98,21 @@ const CollapseContent = _ref => {
     };
   }, [duration, height, collapsed, minHeight]);
   const fadeShouldBeVisible = useMemo(() => Boolean(minHeight && showFade), [minHeight, showFade]);
+  const shouldRenderContent = disableAnimation ? !collapsed : !shouldHideContent;
   return /*#__PURE__*/jsxs("div", {
     ref: containerRef,
     id: "collapse-content-".concat(id),
     "data-test": joinDataTestAttributes(COLLAPSE_CONTENT_CONTAINER_TEST_ID),
-    className: classNames(modules_9c8b5b00.container, {
-      [modules_9c8b5b00.transition]: !disableAnimation
+    className: classNames(styles.container, {
+      [styles.transition]: !disableAnimation
     }),
     style: style,
     children: [/*#__PURE__*/jsx("div", {
       ref: contentRef,
       "data-test": joinDataTestAttributes(COLLAPSE_CONTENT_TEST_ID, dataTest),
-      children: children
+      children: shouldRenderContent ? children : null
     }), fadeShouldBeVisible && /*#__PURE__*/jsx("div", {
-      className: modules_9c8b5b00.fade
+      className: styles.fade
     })]
   });
 };

package/components/collapse/collapse-control.js

@@ -3,7 +3,6 @@ import joinDataTestAttributes from '../global/data-tests.js';
 import { CollapseContext } from './collapse-context.js';
 import { COLLAPSE_CONTROL_TEST_ID } from './consts.js';
 import { jsx } from 'react/jsx-runtime';
-import 'core-js/modules/es.array.reduce.js';
 import 'core-js/modules/web.dom-collections.iterator.js';
 
 const CollapseControl = _ref => {

package/components/confirm/confirm.d.ts

@@ -9,8 +9,8 @@ export interface ConfirmProps {
     cancelIsDefault: boolean;
     confirmLabel: string;
     rejectLabel: string;
-    onConfirm: ((event: React.MouseEvent<HTMLButtonElement>) => void);
-    onReject: ((event?: React.MouseEvent<HTMLButtonElement>) => void);
+    onConfirm: (event: React.MouseEvent<HTMLButtonElement>) => void;
+    onReject: (event?: React.MouseEvent<HTMLButtonElement>) => void;
     className?: string | undefined;
     native?: boolean;
 }

package/components/confirm/confirm.js

@@ -5,8 +5,8 @@ import { PureComponent } from 'react';
 import Dialog from '../dialog/dialog.js';
 import { Button } from '../button/button.js';
 import 'classnames';
-import 'core-js/modules/es.array.reduce.js';
 import { jsxs, jsx } from 'react/jsx-runtime';
+import '../_helpers/island.js';
 import HeaderWrapper from '../island/header.js';
 import ContentWrapper from '../island/content.js';
 import Panel from '../panel/panel.js';
@@ -16,7 +16,6 @@ import '../island/island.js';
 import '../global/data-tests.js';
 import '../island/adaptive-island-hoc.js';
 import '../global/linear-function.js';
-import '../_helpers/island.js';
 import 'element-resize-detector';
 import '../global/schedule-raf.js';
 import '../global/get-uid.js';
@@ -42,7 +41,7 @@ import '../link/clickableLink.js';
 import '../global/controls-height.js';
 import '../_helpers/button__classes.js';
 
-var modules_4c9c3a3a = {"light":"light_rui_2ac4","description":"description_rui_f040"};
+var styles = {"description":"description_rui_f040"};
 
 class Confirm extends PureComponent {
   constructor() {
@@ -79,7 +78,7 @@ class Confirm extends PureComponent {
         children: text
       }), description && /*#__PURE__*/jsx(ContentWrapper, {
         children: /*#__PURE__*/jsx("div", {
-          className: modules_4c9c3a3a.description,
+          className: styles.description,
           children: description
         })
       }), /*#__PURE__*/jsxs(Panel, {

package/components/confirm-service/confirm-service.d.ts

@@ -17,5 +17,5 @@ export interface ConfirmServiceParams {
     onBeforeConfirm?: (() => void) | undefined;
     buttonsHeight?: ControlsHeight | undefined;
 }
-export default function confirm({ text, description, confirmLabel, rejectLabel, cancelIsDefault, onBeforeConfirm, buttonsHeight }: ConfirmServiceParams): Promise<void>;
+export default function confirm({ text, description, confirmLabel, rejectLabel, cancelIsDefault, onBeforeConfirm, buttonsHeight, }: ConfirmServiceParams): Promise<void>;
 export declare function hideConfirm(): void;

package/components/confirm-service/confirm-service.js

@@ -12,7 +12,6 @@ import 'classnames';
 import '@jetbrains/icons/close';
 import '../island/island.js';
 import '../global/data-tests.js';
-import 'core-js/modules/es.array.reduce.js';
 import '../island/adaptive-island-hoc.js';
 import '../global/linear-function.js';
 import '../_helpers/island.js';
@@ -55,7 +54,7 @@ function renderConfirm(props) {
       buttonsHeight = getGlobalControlsHeight()
     } = props,
     restProps = _objectWithoutProperties(props, _excluded);
-  reactRoot.render( /*#__PURE__*/jsx(ControlsHeightContext.Provider, {
+  reactRoot.render(/*#__PURE__*/jsx(ControlsHeightContext.Provider, {
     value: buttonsHeight,
     children: /*#__PURE__*/jsx(Confirm, _objectSpread2({}, restProps))
   }));

package/components/content-layout/content-layout.js

@@ -2,7 +2,7 @@ import { _ as _defineProperty, a as _objectWithoutProperties, b as _objectSpread
 import 'core-js/modules/web.dom-collections.iterator.js';
 import { Component, Children, cloneElement } from 'react';
 import classNames from 'classnames';
-import { m as modules_b8a9dd4f, S as Sidebar } from '../_helpers/sidebar.js';
+import { s as styles, S as Sidebar } from '../_helpers/sidebar.js';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import 'react-waypoint';
 
@@ -28,10 +28,10 @@ class ContentLayout extends Component {
         responsive
       } = _this$props,
       restProps = _objectWithoutProperties(_this$props, _excluded);
-    const classes = classNames(modules_b8a9dd4f.contentLayout, className, {
-      [modules_b8a9dd4f.contentLayoutResponsive]: responsive
+    const classes = classNames(styles.contentLayout, className, {
+      [styles.contentLayoutResponsive]: responsive
     });
-    const contentClasses = classNames(modules_b8a9dd4f.contentLayoutContent, contentClassName);
+    const contentClasses = classNames(styles.contentLayoutContent, contentClassName);
     const childrenArray = Children.toArray(children);
     const sidebarChild = childrenArray.filter(child => child != null && typeof child === 'object' && 'type' in child && child.type === Sidebar)[0];
     const sidebar = sidebarChild && /*#__PURE__*/cloneElement(sidebarChild, {

package/components/contenteditable/contenteditable.d.ts

@@ -5,7 +5,7 @@ import { Component, HTMLAttributes, Ref } from 'react';
 declare function noop(): void;
 export interface ContentEditableBaseProps extends HTMLAttributes<HTMLElement> {
     disabled: boolean;
-    onComponentUpdate: ((prevProps: ContentEditableBaseProps) => void);
+    onComponentUpdate: (prevProps: ContentEditableBaseProps) => void;
     inputRef?: Ref<HTMLDivElement> | null | undefined;
     __html: string;
 }

package/components/control-help/control-help.js

@@ -2,7 +2,7 @@ import { a as _objectWithoutProperties, b as _objectSpread2 } from '../_helpers/
 import classNames from 'classnames';
 import { jsx } from 'react/jsx-runtime';
 
-var modules_7bfdf71c = {"light":"light_rui_2ac4","help":"help_rui_63a3"};
+var styles = {"help":"help_rui_63a3"};
 
 const _excluded = ["className"];
 function ControlHelp(_ref) {
@@ -11,7 +11,7 @@ function ControlHelp(_ref) {
     } = _ref,
     restProps = _objectWithoutProperties(_ref, _excluded);
   return /*#__PURE__*/jsx("div", _objectSpread2({
-    className: classNames(className, modules_7bfdf71c.help)
+    className: classNames(className, styles.help)
   }, restProps));
 }
 

package/components/control-label/control-label.js

@@ -3,7 +3,7 @@ import 'react';
 import classNames from 'classnames';
 import { jsx } from 'react/jsx-runtime';
 
-var modules_9eb96a10 = {"label":"label_rui_fe46","formLabel":"formLabel_rui_fe46","secondaryLabel":"secondaryLabel_rui_fe46","disabledLabel":"disabledLabel_rui_fe46"};
+var styles = {"label":"label_rui_fe46","formLabel":"formLabel_rui_fe46","secondaryLabel":"secondaryLabel_rui_fe46","disabledLabel":"disabledLabel_rui_fe46"};
 
 const _excluded = ["children", "type", "disabled"];
 var LabelType;
@@ -12,8 +12,8 @@ var LabelType;
   LabelType["FORM"] = "form";
 })(LabelType || (LabelType = {}));
 const classNameByType = {
-  [LabelType.SECONDARY]: modules_9eb96a10.secondaryLabel,
-  [LabelType.FORM]: modules_9eb96a10.formLabel
+  [LabelType.SECONDARY]: styles.secondaryLabel,
+  [LabelType.FORM]: styles.formLabel
 };
 const ControlLabel = _ref => {
   let {
@@ -23,8 +23,8 @@ const ControlLabel = _ref => {
     } = _ref,
     rest = _objectWithoutProperties(_ref, _excluded);
   return /*#__PURE__*/jsx("label", _objectSpread2(_objectSpread2({
-    className: classNames(modules_9eb96a10.label, classNameByType[type], {
-      [modules_9eb96a10.disabledLabel]: disabled
+    className: classNames(styles.label, classNameByType[type], {
+      [styles.disabledLabel]: disabled
     })
   }, rest), {}, {
     children: children

package/components/data-list/data-list.d.ts

@@ -1,6 +1,6 @@
 /**
-  * @name Data List
-  */
+ * @name Data List
+ */
 import { Component } from 'react';
 import { FocusSensorOuterProps } from '../global/focus-sensor-hoc';
 import { SelectionShortcutsAddProps, SelectionShortcutsOuterProps } from '../table/selection-shortcuts-hoc';

package/components/data-list/data-list.js

@@ -9,7 +9,7 @@ import getUID from '../global/get-uid.js';
 import Shortcuts from '../shortcuts/shortcuts.js';
 import Loader from '../loader/loader.js';
 import Item, { moreLessButtonStates } from './item.js';
-import { m as modules_09d014b4 } from '../_helpers/title.js';
+import { s as styles } from '../_helpers/title.js';
 import { jsx, jsxs } from 'react/jsx-runtime';
 import '../global/composeRefs.js';
 import 'memoize-one';
@@ -19,7 +19,6 @@ import 'combokeys';
 import '../global/sniffer.js';
 import 'sniffr';
 import '../global/data-tests.js';
-import 'core-js/modules/es.array.reduce.js';
 import '../loader/loader__core.js';
 import '../global/dom.js';
 import '@jetbrains/icons/chevron-right';
@@ -116,12 +115,12 @@ class DataList extends PureComponent {
     } = this.props;
     const shortcutsMap = _objectSpread2(_objectSpread2({}, this.shortcutsMap), this.props.shortcutsMap);
     const classes = classNames(className, {
-      [modules_09d014b4.dataList]: true,
-      [modules_09d014b4.disabledHover]: disabledHover,
-      [modules_09d014b4.multiSelection]: selection.getSelected().size > 0
+      [styles.dataList]: true,
+      [styles.disabledHover]: disabledHover,
+      [styles.multiSelection]: selection.getSelected().size > 0
     });
     return /*#__PURE__*/jsxs("div", {
-      className: modules_09d014b4.dataListWrapper,
+      className: styles.dataListWrapper,
       "data-test": "ring-data-list",
       ref: innerRef,
       children: [focused && /*#__PURE__*/jsx(Shortcuts, {
@@ -159,7 +158,7 @@ class DataList extends PureComponent {
           }, key || id);
         })
       }), loading && /*#__PURE__*/jsx("div", {
-        className: data.length > 0 ? modules_09d014b4.loadingOverlay : undefined,
+        className: data.length > 0 ? styles.loadingOverlay : undefined,
         children: /*#__PURE__*/jsx(Loader, {})
       })]
     });

package/components/data-list/data-list.mock.js

@@ -1,16 +1,25 @@
 import Link from '../link/link.js';
-import Badge from '../badge/badge.js';
+import Tag from '../tag/tag.js';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import '../_helpers/_rollupPluginBabelHelpers.js';
 import 'react';
 import 'classnames';
 import '../global/data-tests.js';
-import 'core-js/modules/es.array.reduce.js';
 import 'core-js/modules/web.dom-collections.iterator.js';
 import '../link/clickableLink.js';
 import '../_helpers/link.js';
+import '@jetbrains/icons/close-12px';
+import '../icon/icon.js';
 import 'util-deprecate';
-import '../_helpers/badge.js';
+import '../icon/icon__constants.js';
+import '../_helpers/icon__svg.js';
+import 'core-js/modules/es.regexp.exec.js';
+import 'core-js/modules/es.string.replace.js';
+import '../global/memoize.js';
+import '../button/button.js';
+import '@jetbrains/icons/chevron-down';
+import '../global/controls-height.js';
+import '../_helpers/button__classes.js';
 
 const items = [{
   id: 1,
@@ -81,8 +90,7 @@ const items = [{
         children: "JetProfile"
       }), /*#__PURE__*/jsx("span", {
         children: " "
-      }), /*#__PURE__*/jsx(Badge, {
-        gray: true,
+      }), /*#__PURE__*/jsx(Tag, {
         children: "duplicate"
       })]
     })
@@ -209,7 +217,7 @@ const items = [{
       children: "Developer"
     }), /*#__PURE__*/jsx("span", {
       children: " in 57 projects "
-    }), /*#__PURE__*/jsx(Badge, {
+    }), /*#__PURE__*/jsx(Tag, {
       children: "team role"
     })]
   }),
@@ -257,8 +265,7 @@ const moreItems = [{
       children: "More item 1"
     }), /*#__PURE__*/jsx("span", {
       children: " "
-    }), /*#__PURE__*/jsx(Badge, {
-      gray: true,
+    }), /*#__PURE__*/jsx(Tag, {
       children: "duplicate"
     })]
   })
@@ -272,8 +279,7 @@ const moreItems = [{
       children: "More item 2"
     }), /*#__PURE__*/jsx("span", {
       children: " "
-    }), /*#__PURE__*/jsx(Badge, {
-      gray: true,
+    }), /*#__PURE__*/jsx(Tag, {
       children: "duplicate"
     })]
   })

package/components/data-list/item.js

@@ -7,11 +7,10 @@ import Link from '../link/link.js';
 import Text from '../text/text.js';
 import LoaderInline from '../loader-inline/loader-inline.js';
 import { Button } from '../button/button.js';
-import { m as modules_09d014b4, T as Title } from '../_helpers/title.js';
+import { s as styles, T as Title } from '../_helpers/title.js';
 import { jsx, jsxs } from 'react/jsx-runtime';
 import 'classnames';
 import '../global/data-tests.js';
-import 'core-js/modules/es.array.reduce.js';
 import '../link/clickableLink.js';
 import '../_helpers/link.js';
 import 'util-deprecate';
@@ -126,7 +125,7 @@ class Item extends PureComponent {
           onClick: this.onShowMore,
           children: 'Show more'
         }), showMoreLessButton === moreLessButtonStates.MORE_LOADING && /*#__PURE__*/jsx(LoaderInline, {
-          className: modules_09d014b4.showMoreLoader
+          className: styles.showMoreLoader
         })]
       });
     } else if (showMoreLessButton === moreLessButtonStates.LESS) {
@@ -147,8 +146,8 @@ class Item extends PureComponent {
           title: "Expand",
           onClick: onExpand,
           icon: chevronRightIcon,
-          className: modules_09d014b4.collapseButton,
-          iconClassName: modules_09d014b4.collapseIcon,
+          className: styles.collapseButton,
+          iconClassName: styles.collapseIcon,
           "data-test": "ring-data-list-expand"
         });
       } else {
@@ -156,8 +155,8 @@ class Item extends PureComponent {
           title: "Collapse",
           onClick: onCollapse,
           icon: chevronDownIcon,
-          className: modules_09d014b4.collapseButton,
-          iconClassName: modules_09d014b4.collapseIcon,
+          className: styles.collapseButton,
+          iconClassName: styles.collapseIcon,
           "data-test": "ring-data-list-collapse"
         });
       }
@@ -176,9 +175,9 @@ class Item extends PureComponent {
         onSelect: this.onSelect,
         offset: offset
       }), !itemIsEmpty ? /*#__PURE__*/jsxs("ul", {
-        className: modules_09d014b4.itemContent,
+        className: styles.itemContent,
         children: [items.map(model => this.renderItem(model, parentShift)), showMoreLessButton !== moreLessButtonStates.UNUSED ? /*#__PURE__*/jsx("li", {
-          className: modules_09d014b4.showMore,
+          className: styles.showMore,
           children: moreLessButton
         }) : null]
       }) : null]

package/components/date-picker/date-input.js

@@ -7,7 +7,7 @@ import classNames from 'classnames';
 import { I as Input } from '../_helpers/input.js';
 import { ControlsHeight } from '../global/controls-height.js';
 import { I18nContext } from '../i18n/i18n-context.js';
-import { m as modules_0c7b7d96 } from '../_helpers/date-picker.js';
+import { s as styles } from '../_helpers/date-picker.js';
 import { jsx } from 'react/jsx-runtime';
 import '@jetbrains/icons/close-12px';
 import '../button/button.js';
@@ -121,7 +121,7 @@ class DateInput extends React.PureComponent {
           return ((_translations$selectN = translations === null || translations === void 0 ? void 0 : translations.selectName) !== null && _translations$selectN !== void 0 ? _translations$selectN : translate('selectName')).replace('%name%', name).replace('{{name}}', name);
       }
     })();
-    const classes = classNames(modules_0c7b7d96.filter, modules_0c7b7d96["".concat(name, "Input")], divider && modules_0c7b7d96["".concat(name, "InputWithDivider")], 'ring-js-shortcuts');
+    const classes = classNames(styles.filter, styles["".concat(name, "Input")], divider && styles["".concat(name, "InputWithDivider")], 'ring-js-shortcuts');
     return /*#__PURE__*/jsx(Input, {
       autoComplete: "off",
       borderless: true,