@jetbrains/ring-ui 5.0.65 → 5.0.66

package/components/editable-heading/editable-heading.css

@@ -4,6 +4,8 @@
   display: flex;
   align-items: center;
 
+  max-width: 100%;
+
   &.fullSize {
     width: 100%;
   }
@@ -13,13 +15,8 @@
   }
 }
 
-.heading.heading {
-  margin-bottom: 0;
-
-  line-height: 28px;
-}
-
 .headingWrapperButton {
+  max-width: 100%;
   margin: 0;
   padding: 0;
 
@@ -43,10 +40,15 @@
 }
 
 .heading {
+  overflow: hidden;
+
   padding: 6px 0;
 
   cursor: pointer;
 
+  white-space: nowrap;
+  text-overflow: ellipsis;
+
   border-radius: var(--ring-border-radius);
 
   &:hover {
@@ -60,6 +62,12 @@
   }
 }
 
+.heading.heading {
+  margin-bottom: 0;
+
+  line-height: 28px;
+}
+
 .input {
   margin-bottom: 2px;
   padding: 0;
@@ -125,3 +133,19 @@
 .level3 {
   font-size: 14px;
 }
+
+.sizeS {
+  max-width: calc(unit * 12);
+}
+
+.sizeM {
+  max-width: calc(unit * 30);
+}
+
+.sizeL {
+  max-width: calc(unit * 50);
+}
+
+.sizeFULL {
+  max-width: 100%;
+}

package/components/editable-heading/editable-heading.js

@@ -26,12 +26,12 @@ export const EditableHeading = (props) => {
         esc: isCancelDisabled ? noop : onCancel
     }), [isSaveDisabled, isCancelDisabled, onSave, onCancel]);
     const classes = classNames(styles.editableHeading, className, {
-        [styles.fullSize]: size === Size.FULL,
+        [styles.fullSize]: isEditing && size === Size.FULL,
         [styles.isEditing]: isEditing,
         [styles.error]: hasError,
         [styles.disabled]: disabled
     });
-    const headingClasses = classNames(styles.heading, headingClassName);
+    const headingClasses = classNames(styles.heading, headingClassName, styles[`size${size}`]);
     const inputClasses = classNames('ring-js-shortcuts', styles.input, inputStyles[`size${size}`], styles[`level${level}`], inputClassName);
     const onHeadingClick = React.useCallback(() => {
         if (disabled) {

package/components/select/select.js

@@ -906,7 +906,7 @@ Select.propTypes = {
     left: PropTypes.number,
     renderOptimization: PropTypes.bool,
     ringPopupTarget: PropTypes.string,
-    error: PropTypes.bool,
+    error: PropTypes.string,
     hint: List.ListHint.propTypes.label,
     add: PropTypes.object,
     type: PropTypes.oneOf(Object.values(Type)),

package/dist/editable-heading/editable-heading.js

@@ -30,7 +30,7 @@ import 'combokeys';
 import '../global/sniffer.js';
 import 'sniffr';
 
-var modules_6e69b0fe = {"unit":"8px","editableHeading":"editableHeading_rui_0870","fullSize":"fullSize_rui_0870","isEditing":"isEditing_rui_0870","heading":"heading_rui_0870","headingWrapperButton":"headingWrapperButton_rui_0870","disabled":"disabled_rui_0870","input":"input_rui_0870","error":"error_rui_0870","button":"button_rui_0870","errorText":"errorText_rui_0870","level1":"level1_rui_0870","level2":"level2_rui_0870","level3":"level3_rui_0870"};
+var modules_6e69b0fe = {"unit":"8px","editableHeading":"editableHeading_rui_0870","fullSize":"fullSize_rui_0870","isEditing":"isEditing_rui_0870","headingWrapperButton":"headingWrapperButton_rui_0870","disabled":"disabled_rui_0870","heading":"heading_rui_0870","input":"input_rui_0870","error":"error_rui_0870","button":"button_rui_0870","errorText":"errorText_rui_0870","level1":"level1_rui_0870","level2":"level2_rui_0870","level3":"level3_rui_0870","sizeS":"sizeS_rui_0870","sizeM":"sizeM_rui_0870","sizeL":"sizeL_rui_0870","sizeFULL":"sizeFULL_rui_0870"};
 
 function noop() {}
 const EditableHeading = props => {
@@ -70,12 +70,12 @@ const EditableHeading = props => {
     esc: isCancelDisabled ? noop : onCancel
   }), [isSaveDisabled, isCancelDisabled, onSave, onCancel]);
   const classes = classNames(modules_6e69b0fe.editableHeading, className, {
-    [modules_6e69b0fe.fullSize]: size === Size.FULL,
+    [modules_6e69b0fe.fullSize]: isEditing && size === Size.FULL,
     [modules_6e69b0fe.isEditing]: isEditing,
     [modules_6e69b0fe.error]: hasError,
     [modules_6e69b0fe.disabled]: disabled
   });
-  const headingClasses = classNames(modules_6e69b0fe.heading, headingClassName);
+  const headingClasses = classNames(modules_6e69b0fe.heading, headingClassName, modules_6e69b0fe[`size${size}`]);
   const inputClasses = classNames('ring-js-shortcuts', modules_6e69b0fe.input, modules_88cfaf40[`size${size}`], modules_6e69b0fe[`level${level}`], inputClassName);
   const onHeadingClick = React.useCallback(() => {
     if (disabled) {

package/dist/select/select.js

@@ -1134,7 +1134,7 @@ Select.propTypes = {
   left: PropTypes.number,
   renderOptimization: PropTypes.bool,
   ringPopupTarget: PropTypes.string,
-  error: PropTypes.bool,
+  error: PropTypes.string,
   hint: List.ListHint.propTypes.label,
   add: PropTypes.object,
   type: PropTypes.oneOf(Object.values(Type)),