@zohodesk/components 1.0.0-temp-199.10 → 1.0.0-temp-199.12

package/es/Select/props/propTypes.js

@@ -178,7 +178,7 @@ export const GroupSelect_propTypes = {
   customProps: PropTypes.shape({
     TextBoxProps: PropTypes.object,
     TextBoxIconProps: PropTypes.object,
-    suggestionsProps: PropTypes.object
+    SuggestionsProps: PropTypes.object
   })
 };
 export const SelectWithAvatar_propTypes = { ...Select_propTypes,
@@ -241,7 +241,9 @@ export const SelectWithAvatar_propTypes = { ...Select_propTypes,
   needEffect: PropTypes.bool,
   isLoading: PropTypes.bool,
   dataSelectorId: PropTypes.string,
-  customProps: PropTypes.string
+  customProps: PropTypes.shape({
+    SuggestionsProps: PropTypes.object
+  })
 };
 export const SelectWithIcon_propTypes = {
   animationStyle: PropTypes.oneOf(['default', 'bounce']),
@@ -303,6 +305,7 @@ export const SelectWithIcon_propTypes = {
   customProps: PropTypes.shape({
     TextBoxProps: PropTypes.object,
     DropdownSearchTextBoxProps: PropTypes.object,
-    TextBoxIconProps: PropTypes.object
+    TextBoxIconProps: PropTypes.object,
+    ListItemProps: PropTypes.object
   })
 };

package/es/Tag/Tag.js

@@ -47,7 +47,7 @@ export default class Tag extends PureComponent {
     e && e.preventDefault();
     e.stopPropagation && e.stopPropagation();
     e.nativeEvent.stopImmediatePropagation && e.nativeEvent.stopImmediatePropagation();
-    onRemove && onRemove(id);
+    onRemove && onRemove(id, e);
   }
 
   getRef(el) {

package/es/Textarea/Textarea.js

@@ -59,7 +59,10 @@ export default class Textarea extends React.Component {
       htmlId,
       a11y,
       customClass,
-      isFocus
+      isFocus,
+      rows,
+      cols,
+      customAttributes
     } = this.props;
     let {
       ariaLabel,
@@ -86,7 +89,7 @@ export default class Textarea extends React.Component {
     }
 
     const isEditable = !(isReadOnly || isDisabled);
-    let classList = needAppearance ? `${style.container} ${style[size]} ${style[variant]} ${needBorder ? style.needBorder : style.noBorder} ${resize ? style[resizes[resize]] : style[resizes.none]}  ${animated ? `${style[`${size}animated`]}` : ''}   ${isDisabled && !needEffect || isReadOnly && !needEffect ? '' : style.effect} ${isEditable && isFocus ? style.active : ''}` : `${style.basic}`;
+    let classList = needAppearance ? `${style.container} ${size !== 'default' ? style[size] : ''} ${!rows && size === 'default' ? style.defaultHeight : ''} ${!cols ? style.defaultWidth : ''} ${style[variant]} ${needBorder ? style.needBorder : style.noBorder} ${resize ? style[resizes[resize]] : style[resizes.none]}  ${animated && size !== 'default' ? `${style[`${size}animated`]}` : ''}   ${isDisabled && !needEffect || isReadOnly && !needEffect ? '' : style.effect} ${isEditable && isFocus ? style.active : ''}` : `${style.basic}`;
     return /*#__PURE__*/React.createElement("textarea", {
       "aria-label": ariaLabel,
       "aria-labelledby": ariaLabelledby,
@@ -103,7 +106,10 @@ export default class Textarea extends React.Component {
       ref: getRef,
       value: text,
       id: htmlId,
-      "data-selector-id": dataSelectorId
+      "data-selector-id": dataSelectorId,
+      rows: rows,
+      cols: cols,
+      ...customAttributes
     });
   }
 

package/es/Textarea/Textarea.module.css

@@ -7,7 +7,8 @@
   --textarea_font_size: var(--zd_font_size14);
   --textarea_line_height: 1.5712;
   --textarea_padding: var(--zd_size2) 0;
-  --textarea_height: var(--zd_size30);
+  --textarea_height: auto;
+  --textarea_width: auto;
 
   /* textarea placeholder default variable */
   --textarea_placeholder_text_color: var(--zdt_textarea_placeholder_text);
@@ -63,7 +64,7 @@
     height var(--zd_transition2) linear 0s;
   -moz-transition: border var(--zd_transition2) linear 0s,
     height var(--zd_transition2) linear 0s;
-  width: 100% ;
+  width: var(--textarea_width);
   max-width: 100% ;
   min-width: var(--zd_size100) ;
   font-size: var(--textarea_font_size);
@@ -91,6 +92,13 @@
 .effect:focus,.effect.active {
   --textarea_border_color: var(--zdt_textarea_focus_border);
 }
+
+.defaultHeight{
+  --textarea_height: var(--zd_size30);
+} 
+.defaultWidth {
+  --textarea_width: 100%;
+}
 .xsmall,
 .xmedium {
   vertical-align: middle;
@@ -107,7 +115,7 @@
   --textarea_height: var(--zd_size25);
   --textarea_line_height: 1.3077;
 }
-.small {
+ .small{
   --textarea_height: var(--zd_size30);
   --textarea_padding: var(--zd_size2) 0;
 }

package/es/Textarea/__tests__/Textarea.spec.js

@@ -225,4 +225,42 @@ describe('Textarea component', () => {
     }));
     expect(asFragment()).toMatchSnapshot();
   });
+  test('Should be render rows and cols ', () => {
+    const {
+      asFragment
+    } = render( /*#__PURE__*/React.createElement(Textarea, {
+      size: "default",
+      rows: "3",
+      cols: "3"
+    }));
+    expect(asFragment()).toMatchSnapshot();
+  });
+  test('Should be render rows only ', () => {
+    const {
+      asFragment
+    } = render( /*#__PURE__*/React.createElement(Textarea, {
+      size: "default",
+      rows: "3"
+    }));
+    expect(asFragment()).toMatchSnapshot();
+  });
+  test('Should be render  cols only ', () => {
+    const {
+      asFragment
+    } = render( /*#__PURE__*/React.createElement(Textarea, {
+      size: "default",
+      cols: "3"
+    }));
+    expect(asFragment()).toMatchSnapshot();
+  });
+  test('Should be render custom Attributes ', () => {
+    const {
+      asFragment
+    } = render( /*#__PURE__*/React.createElement(Textarea, {
+      customAttributes: {
+        disabled: true
+      }
+    }));
+    expect(asFragment()).toMatchSnapshot();
+  });
 });

package/es/Textarea/__tests__/__snapshots__/Textarea.spec.js.snap

@@ -1,9 +1,21 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
+exports[`Textarea component Should be render  cols only  1`] = `
+<DocumentFragment>
+  <textarea
+    class="  container  defaultHeight  default needBorder noresize     effect  borderColor_default"
+    cols="3"
+    data-id="TextareaComp"
+    data-selector-id="textarea"
+    data-test-id="TextareaComp"
+  />
+</DocumentFragment>
+`;
+
 exports[`Textarea component Should be render autofocus true  1`] = `
 <DocumentFragment>
   <textarea
-    class="  container small default needBorder noresize     effect  borderColor_default"
+    class="  container small  defaultWidth default needBorder noresize     effect  borderColor_default"
     data-id="TextareaComp"
     data-selector-id="textarea"
     data-test-id="TextareaComp"
@@ -11,10 +23,22 @@ exports[`Textarea component Should be render autofocus true  1`] = `
 </DocumentFragment>
 `;
 
+exports[`Textarea component Should be render custom Attributes  1`] = `
+<DocumentFragment>
+  <textarea
+    class="  container small  defaultWidth default needBorder noresize     effect  borderColor_default"
+    data-id="TextareaComp"
+    data-selector-id="textarea"
+    data-test-id="TextareaComp"
+    disabled=""
+  />
+</DocumentFragment>
+`;
+
 exports[`Textarea component Should be render customClass  1`] = `
 <DocumentFragment>
   <textarea
-    class="textAreaCustomClass  container small default needBorder noresize     effect  borderColor_default"
+    class="textAreaCustomClass  container small  defaultWidth default needBorder noresize     effect  borderColor_default"
     data-id="TextareaComp"
     data-selector-id="textarea"
     data-test-id="TextareaComp"
@@ -25,7 +49,7 @@ exports[`Textarea component Should be render customClass  1`] = `
 exports[`Textarea component Should be render htmlId  1`] = `
 <DocumentFragment>
   <textarea
-    class="  container small default needBorder noresize     effect  borderColor_default"
+    class="  container small  defaultWidth default needBorder noresize     effect  borderColor_default"
     data-id="TextareaComp"
     data-selector-id="textarea"
     data-test-id="TextareaComp"
@@ -37,7 +61,7 @@ exports[`Textarea component Should be render htmlId  1`] = `
 exports[`Textarea component Should be render isDisabled is false and needEffect is false 1`] = `
 <DocumentFragment>
   <textarea
-    class="  container small default needBorder noresize     effect  borderColor_default"
+    class="  container small  defaultWidth default needBorder noresize     effect  borderColor_default"
     data-id="TextareaComp"
     data-selector-id="textarea"
     data-test-id="TextareaComp"
@@ -48,7 +72,7 @@ exports[`Textarea component Should be render isDisabled is false and needEffect
 exports[`Textarea component Should be render isDisabled is true 1`] = `
 <DocumentFragment>
   <textarea
-    class="  container small default needBorder noresize       borderColor_default"
+    class="  container small  defaultWidth default needBorder noresize       borderColor_default"
     data-id="TextareaComp"
     data-selector-id="textarea"
     data-test-id="TextareaComp"
@@ -60,7 +84,7 @@ exports[`Textarea component Should be render isDisabled is true 1`] = `
 exports[`Textarea component Should be render isDisabled is true and needEffect is false 1`] = `
 <DocumentFragment>
   <textarea
-    class="  container small default needBorder noresize       borderColor_default"
+    class="  container small  defaultWidth default needBorder noresize       borderColor_default"
     data-id="TextareaComp"
     data-selector-id="textarea"
     data-test-id="TextareaComp"
@@ -72,7 +96,7 @@ exports[`Textarea component Should be render isDisabled is true and needEffect i
 exports[`Textarea component Should be render isDisabled is true and needEffect is true 1`] = `
 <DocumentFragment>
   <textarea
-    class="  container small default needBorder noresize     effect  borderColor_default"
+    class="  container small  defaultWidth default needBorder noresize     effect  borderColor_default"
     data-id="TextareaComp"
     data-selector-id="textarea"
     data-test-id="TextareaComp"
@@ -84,7 +108,7 @@ exports[`Textarea component Should be render isDisabled is true and needEffect i
 exports[`Textarea component Should be render isReadOnly is false and needEffect is false 1`] = `
 <DocumentFragment>
   <textarea
-    class="  container small default needBorder noresize     effect  borderColor_default"
+    class="  container small  defaultWidth default needBorder noresize     effect  borderColor_default"
     data-id="TextareaComp"
     data-selector-id="textarea"
     data-test-id="TextareaComp"
@@ -95,7 +119,7 @@ exports[`Textarea component Should be render isReadOnly is false and needEffect
 exports[`Textarea component Should be render isReadOnly is true and needEffect is false 1`] = `
 <DocumentFragment>
   <textarea
-    class=" readonly container small default needBorder noresize       borderColor_default"
+    class=" readonly container small  defaultWidth default needBorder noresize       borderColor_default"
     data-id="TextareaComp"
     data-selector-id="textarea"
     data-test-id="TextareaComp"
@@ -107,7 +131,7 @@ exports[`Textarea component Should be render isReadOnly is true and needEffect i
 exports[`Textarea component Should be render isReadOnly is true and needEffect is true 1`] = `
 <DocumentFragment>
   <textarea
-    class=" readonly container small default needBorder noresize     effect  borderColor_default"
+    class=" readonly container small  defaultWidth default needBorder noresize     effect  borderColor_default"
     data-id="TextareaComp"
     data-selector-id="textarea"
     data-test-id="TextareaComp"
@@ -119,7 +143,7 @@ exports[`Textarea component Should be render isReadOnly is true and needEffect i
 exports[`Textarea component Should be render maxLength in number 1`] = `
 <DocumentFragment>
   <textarea
-    class="  container small default needBorder noresize     effect  borderColor_default"
+    class="  container small  defaultWidth default needBorder noresize     effect  borderColor_default"
     data-id="TextareaComp"
     data-selector-id="textarea"
     data-test-id="TextareaComp"
@@ -131,7 +155,7 @@ exports[`Textarea component Should be render maxLength in number 1`] = `
 exports[`Textarea component Should be render maxLength in string 1`] = `
 <DocumentFragment>
   <textarea
-    class="  container small default needBorder noresize     effect  borderColor_default"
+    class="  container small  defaultWidth default needBorder noresize     effect  borderColor_default"
     data-id="TextareaComp"
     data-selector-id="textarea"
     data-test-id="TextareaComp"
@@ -154,7 +178,7 @@ exports[`Textarea component Should be render needAppearance is false  1`] = `
 exports[`Textarea component Should be render needBorder is false 1`] = `
 <DocumentFragment>
   <textarea
-    class="  container small default noBorder noresize     effect  borderColor_default"
+    class="  container small  defaultWidth default noBorder noresize     effect  borderColor_default"
     data-id="TextareaComp"
     data-selector-id="textarea"
     data-test-id="TextareaComp"
@@ -165,7 +189,7 @@ exports[`Textarea component Should be render needBorder is false 1`] = `
 exports[`Textarea component Should be render needReadOnlyStyle is false  1`] = `
 <DocumentFragment>
   <textarea
-    class="  container small default needBorder noresize     effect  borderColor_default"
+    class="  container small  defaultWidth default needBorder noresize     effect  borderColor_default"
     data-id="TextareaComp"
     data-selector-id="textarea"
     data-test-id="TextareaComp"
@@ -176,7 +200,7 @@ exports[`Textarea component Should be render needReadOnlyStyle is false  1`] = `
 exports[`Textarea component Should be render placeholder 1`] = `
 <DocumentFragment>
   <textarea
-    class="  container small default needBorder noresize     effect  borderColor_default"
+    class="  container small  defaultWidth default needBorder noresize     effect  borderColor_default"
     data-id="TextareaComp"
     data-selector-id="textarea"
     data-test-id="TextareaComp"
@@ -185,10 +209,35 @@ exports[`Textarea component Should be render placeholder 1`] = `
 </DocumentFragment>
 `;
 
+exports[`Textarea component Should be render rows and cols  1`] = `
+<DocumentFragment>
+  <textarea
+    class="  container    default needBorder noresize     effect  borderColor_default"
+    cols="3"
+    data-id="TextareaComp"
+    data-selector-id="textarea"
+    data-test-id="TextareaComp"
+    rows="3"
+  />
+</DocumentFragment>
+`;
+
+exports[`Textarea component Should be render rows only  1`] = `
+<DocumentFragment>
+  <textarea
+    class="  container   defaultWidth default needBorder noresize     effect  borderColor_default"
+    data-id="TextareaComp"
+    data-selector-id="textarea"
+    data-test-id="TextareaComp"
+    rows="3"
+  />
+</DocumentFragment>
+`;
+
 exports[`Textarea component Should be render text 1`] = `
 <DocumentFragment>
   <textarea
-    class="  container small default needBorder noresize     effect  borderColor_default"
+    class="  container small  defaultWidth default needBorder noresize     effect  borderColor_default"
     data-id="TextareaComp"
     data-selector-id="textarea"
     data-test-id="TextareaComp"
@@ -201,7 +250,7 @@ exports[`Textarea component Should be render text 1`] = `
 exports[`Textarea component Should be render with the basic set of default props 1`] = `
 <DocumentFragment>
   <textarea
-    class="  container small default needBorder noresize     effect  borderColor_default"
+    class="  container small  defaultWidth default needBorder noresize     effect  borderColor_default"
     data-id="TextareaComp"
     data-selector-id="textarea"
     data-test-id="TextareaComp"
@@ -212,7 +261,7 @@ exports[`Textarea component Should be render with the basic set of default props
 exports[`Textarea component Should render Varient - default 1`] = `
 <DocumentFragment>
   <textarea
-    class="  container small default needBorder noresize     effect  borderColor_default"
+    class="  container small  defaultWidth default needBorder noresize     effect  borderColor_default"
     data-id="TextareaComp"
     data-selector-id="textarea"
     data-test-id="TextareaComp"
@@ -223,7 +272,7 @@ exports[`Textarea component Should render Varient - default 1`] = `
 exports[`Textarea component Should render Varient - primary 1`] = `
 <DocumentFragment>
   <textarea
-    class="  container small primary needBorder noresize     effect  borderColor_default"
+    class="  container small  defaultWidth primary needBorder noresize     effect  borderColor_default"
     data-id="TextareaComp"
     data-selector-id="textarea"
     data-test-id="TextareaComp"
@@ -234,7 +283,7 @@ exports[`Textarea component Should render Varient - primary 1`] = `
 exports[`Textarea component Should render animated is false - large 1`] = `
 <DocumentFragment>
   <textarea
-    class="  container large default needBorder noresize     effect  borderColor_default"
+    class="  container large  defaultWidth default needBorder noresize     effect  borderColor_default"
     data-id="TextareaComp"
     data-selector-id="textarea"
     data-test-id="TextareaComp"
@@ -245,7 +294,7 @@ exports[`Textarea component Should render animated is false - large 1`] = `
 exports[`Textarea component Should render animated is false - medium 1`] = `
 <DocumentFragment>
   <textarea
-    class="  container medium default needBorder noresize     effect  borderColor_default"
+    class="  container medium  defaultWidth default needBorder noresize     effect  borderColor_default"
     data-id="TextareaComp"
     data-selector-id="textarea"
     data-test-id="TextareaComp"
@@ -256,7 +305,7 @@ exports[`Textarea component Should render animated is false - medium 1`] = `
 exports[`Textarea component Should render animated is false - small 1`] = `
 <DocumentFragment>
   <textarea
-    class="  container small default needBorder noresize     effect  borderColor_default"
+    class="  container small  defaultWidth default needBorder noresize     effect  borderColor_default"
     data-id="TextareaComp"
     data-selector-id="textarea"
     data-test-id="TextareaComp"
@@ -267,7 +316,7 @@ exports[`Textarea component Should render animated is false - small 1`] = `
 exports[`Textarea component Should render animated is false - xmedium 1`] = `
 <DocumentFragment>
   <textarea
-    class="  container xmedium default needBorder noresize     effect  borderColor_default"
+    class="  container xmedium  defaultWidth default needBorder noresize     effect  borderColor_default"
     data-id="TextareaComp"
     data-selector-id="textarea"
     data-test-id="TextareaComp"
@@ -278,7 +327,7 @@ exports[`Textarea component Should render animated is false - xmedium 1`] = `
 exports[`Textarea component Should render animated is false - xsmall 1`] = `
 <DocumentFragment>
   <textarea
-    class="  container xsmall default needBorder noresize     effect  borderColor_default"
+    class="  container xsmall  defaultWidth default needBorder noresize     effect  borderColor_default"
     data-id="TextareaComp"
     data-selector-id="textarea"
     data-test-id="TextareaComp"
@@ -289,7 +338,7 @@ exports[`Textarea component Should render animated is false - xsmall 1`] = `
 exports[`Textarea component Should render animated is true - large 1`] = `
 <DocumentFragment>
   <textarea
-    class="  container large default needBorder noresize  largeanimated   effect  borderColor_default"
+    class="  container large  defaultWidth default needBorder noresize  largeanimated   effect  borderColor_default"
     data-id="TextareaComp"
     data-selector-id="textarea"
     data-test-id="TextareaComp"
@@ -300,7 +349,7 @@ exports[`Textarea component Should render animated is true - large 1`] = `
 exports[`Textarea component Should render animated is true - medium 1`] = `
 <DocumentFragment>
   <textarea
-    class="  container medium default needBorder noresize  undefined   effect  borderColor_default"
+    class="  container medium  defaultWidth default needBorder noresize  undefined   effect  borderColor_default"
     data-id="TextareaComp"
     data-selector-id="textarea"
     data-test-id="TextareaComp"
@@ -311,7 +360,7 @@ exports[`Textarea component Should render animated is true - medium 1`] = `
 exports[`Textarea component Should render animated is true - small 1`] = `
 <DocumentFragment>
   <textarea
-    class="  container small default needBorder noresize  smallanimated   effect  borderColor_default"
+    class="  container small  defaultWidth default needBorder noresize  smallanimated   effect  borderColor_default"
     data-id="TextareaComp"
     data-selector-id="textarea"
     data-test-id="TextareaComp"
@@ -322,7 +371,7 @@ exports[`Textarea component Should render animated is true - small 1`] = `
 exports[`Textarea component Should render animated is true - xmedium 1`] = `
 <DocumentFragment>
   <textarea
-    class="  container xmedium default needBorder noresize  xmediumanimated   effect  borderColor_default"
+    class="  container xmedium  defaultWidth default needBorder noresize  xmediumanimated   effect  borderColor_default"
     data-id="TextareaComp"
     data-selector-id="textarea"
     data-test-id="TextareaComp"
@@ -333,7 +382,7 @@ exports[`Textarea component Should render animated is true - xmedium 1`] = `
 exports[`Textarea component Should render animated is true - xsmall 1`] = `
 <DocumentFragment>
   <textarea
-    class="  container xsmall default needBorder noresize  xsmallanimated   effect  borderColor_default"
+    class="  container xsmall  defaultWidth default needBorder noresize  xsmallanimated   effect  borderColor_default"
     data-id="TextareaComp"
     data-selector-id="textarea"
     data-test-id="TextareaComp"
@@ -344,7 +393,7 @@ exports[`Textarea component Should render animated is true - xsmall 1`] = `
 exports[`Textarea component Should render borderColor - default 1`] = `
 <DocumentFragment>
   <textarea
-    class="  container small default needBorder noresize     effect  borderColor_default"
+    class="  container small  defaultWidth default needBorder noresize     effect  borderColor_default"
     data-id="TextareaComp"
     data-selector-id="textarea"
     data-test-id="TextareaComp"
@@ -355,7 +404,7 @@ exports[`Textarea component Should render borderColor - default 1`] = `
 exports[`Textarea component Should render borderColor - transparent 1`] = `
 <DocumentFragment>
   <textarea
-    class="  container small default needBorder noresize     effect  borderColor_transparent"
+    class="  container small  defaultWidth default needBorder noresize     effect  borderColor_transparent"
     data-id="TextareaComp"
     data-selector-id="textarea"
     data-test-id="TextareaComp"
@@ -366,7 +415,7 @@ exports[`Textarea component Should render borderColor - transparent 1`] = `
 exports[`Textarea component Should render resize  - both 1`] = `
 <DocumentFragment>
   <textarea
-    class="  container small default needBorder resizeboth     effect  borderColor_default"
+    class="  container small  defaultWidth default needBorder resizeboth     effect  borderColor_default"
     data-id="TextareaComp"
     data-selector-id="textarea"
     data-test-id="TextareaComp"
@@ -377,7 +426,7 @@ exports[`Textarea component Should render resize  - both 1`] = `
 exports[`Textarea component Should render resize  - horizontal 1`] = `
 <DocumentFragment>
   <textarea
-    class="  container small default needBorder resizeX     effect  borderColor_default"
+    class="  container small  defaultWidth default needBorder resizeX     effect  borderColor_default"
     data-id="TextareaComp"
     data-selector-id="textarea"
     data-test-id="TextareaComp"
@@ -388,7 +437,7 @@ exports[`Textarea component Should render resize  - horizontal 1`] = `
 exports[`Textarea component Should render resize  - none 1`] = `
 <DocumentFragment>
   <textarea
-    class="  container small default needBorder noresize     effect  borderColor_default"
+    class="  container small  defaultWidth default needBorder noresize     effect  borderColor_default"
     data-id="TextareaComp"
     data-selector-id="textarea"
     data-test-id="TextareaComp"
@@ -399,7 +448,7 @@ exports[`Textarea component Should render resize  - none 1`] = `
 exports[`Textarea component Should render resize  - vertical 1`] = `
 <DocumentFragment>
   <textarea
-    class="  container small default needBorder resizeY     effect  borderColor_default"
+    class="  container small  defaultWidth default needBorder resizeY     effect  borderColor_default"
     data-id="TextareaComp"
     data-selector-id="textarea"
     data-test-id="TextareaComp"
@@ -410,7 +459,7 @@ exports[`Textarea component Should render resize  - vertical 1`] = `
 exports[`Textarea component Should render size  - large 1`] = `
 <DocumentFragment>
   <textarea
-    class="  container large default needBorder noresize  largeanimated   effect  borderColor_default"
+    class="  container large  defaultWidth default needBorder noresize  largeanimated   effect  borderColor_default"
     data-id="TextareaComp"
     data-selector-id="textarea"
     data-test-id="TextareaComp"
@@ -421,7 +470,7 @@ exports[`Textarea component Should render size  - large 1`] = `
 exports[`Textarea component Should render size  - medium 1`] = `
 <DocumentFragment>
   <textarea
-    class="  container medium default needBorder noresize  undefined   effect  borderColor_default"
+    class="  container medium  defaultWidth default needBorder noresize  undefined   effect  borderColor_default"
     data-id="TextareaComp"
     data-selector-id="textarea"
     data-test-id="TextareaComp"
@@ -432,7 +481,7 @@ exports[`Textarea component Should render size  - medium 1`] = `
 exports[`Textarea component Should render size  - small 1`] = `
 <DocumentFragment>
   <textarea
-    class="  container small default needBorder noresize  smallanimated   effect  borderColor_default"
+    class="  container small  defaultWidth default needBorder noresize  smallanimated   effect  borderColor_default"
     data-id="TextareaComp"
     data-selector-id="textarea"
     data-test-id="TextareaComp"
@@ -443,7 +492,7 @@ exports[`Textarea component Should render size  - small 1`] = `
 exports[`Textarea component Should render size  - xmedium 1`] = `
 <DocumentFragment>
   <textarea
-    class="  container xmedium default needBorder noresize  xmediumanimated   effect  borderColor_default"
+    class="  container xmedium  defaultWidth default needBorder noresize  xmediumanimated   effect  borderColor_default"
     data-id="TextareaComp"
     data-selector-id="textarea"
     data-test-id="TextareaComp"
@@ -454,7 +503,7 @@ exports[`Textarea component Should render size  - xmedium 1`] = `
 exports[`Textarea component Should render size  - xsmall 1`] = `
 <DocumentFragment>
   <textarea
-    class="  container xsmall default needBorder noresize  xsmallanimated   effect  borderColor_default"
+    class="  container xsmall  defaultWidth default needBorder noresize  xsmallanimated   effect  borderColor_default"
     data-id="TextareaComp"
     data-selector-id="textarea"
     data-test-id="TextareaComp"
@@ -467,7 +516,7 @@ exports[`Textarea component rendering ally clearLabel 1`] = `
   <textarea
     aria-label="TextAreaAriaLabel"
     aria-labelledby="TexareaAriaLabelledby"
-    class="  container small default needBorder noresize     effect  borderColor_default"
+    class="  container small  defaultWidth default needBorder noresize     effect  borderColor_default"
     data-id="TextareaComp"
     data-selector-id="textarea"
     data-test-id="TextareaComp"

package/es/Textarea/props/defaultProps.js

@@ -13,5 +13,6 @@ export const defaultProps = {
   autoFocus: false,
   customClass: '',
   a11y: {},
-  dataSelectorId: 'textarea'
+  dataSelectorId: 'textarea',
+  customAttributes: {}
 };

package/es/Textarea/props/propTypes.js

@@ -20,7 +20,7 @@ export const propTypes = {
   onKeyDown: PropTypes.func,
   placeHolder: PropTypes.string,
   resize: PropTypes.oneOf(['horizontal', 'vertical', 'both', 'none']),
-  size: PropTypes.oneOf(['xsmall', 'small', 'xmedium', 'medium', 'large']),
+  size: PropTypes.oneOf(['xsmall', 'small', 'xmedium', 'medium', 'large', 'default']),
   text: PropTypes.string,
   variant: PropTypes.oneOf(['default', 'primary']),
   customClass: PropTypes.string,
@@ -28,5 +28,8 @@ export const propTypes = {
     ariaLabel: PropTypes.string,
     ariaLabelledby: PropTypes.string
   }),
-  isFocus: PropTypes.bool
+  isFocus: PropTypes.bool,
+  rows: PropTypes.number,
+  cols: PropTypes.number,
+  customAttributes: PropTypes.object
 };

package/es/common/common.module.css

@@ -494,9 +494,9 @@
   overflow: hidden;
 }
 
-.listItemClamp {
+.lineClamp {
   composes: wbreak clamp;
-  -webkit-line-clamp: var(--line-clamp-count,3);
+  -webkit-line-clamp: var(--line-clamp,3);
 }
 
 .offSelection {

package/es/v1/ListItem/ListItem.js

@@ -81,7 +81,7 @@ const ListItem = props => {
     autoHover: autoHover,
     needTick: needTick,
     needBorder: needBorder,
-    customClass: `${customListItem} ${needMultiLineText ? style.txtAlignBaseLine + ' ' + style.autoHeight : ''} ${customListItem}`,
+    customClass: customListItem,
     dataId: dataIdString,
     dataSelectorId: `${dataSelectorId}`,
     isLink: isLink,

package/es/v1/MultiSelect/AdvancedMultiSelect.js

@@ -549,8 +549,7 @@ export class AdvancedMultiSelectComponent extends MultiSelectComponent {
           role: 'option'
         },
         dataId: `${dataIdMultiSelectComp}_Options`,
-        ...SuggestionsProps,
-        needMultiLineText: true
+        ...SuggestionsProps
       }) : /*#__PURE__*/React.createElement(EmptyState, {
         isLoading: isFetchingOptions,
         options: options,

package/es/v1/MultiSelect/MultiSelect.js

@@ -1002,12 +1002,8 @@ export class MultiSelectComponent extends React.Component {
       boxSize,
       isLoading,
       selectAllText,
-      needSelectAll,
-      customProps
+      needSelectAll
     } = this.props;
-    const {
-      suggestionsProps = {}
-    } = customProps;
     const {
       selectedOptions,
       searchStr,
@@ -1097,8 +1093,7 @@ export class MultiSelectComponent extends React.Component {
       selectedOptions: selectedOptionIds,
       a11y: {
         role: 'option'
-      },
-      ...suggestionsProps
+      }
     }) : /*#__PURE__*/React.createElement(EmptyState, {
       isLoading: isFetchingOptions,
       options: options,