@zohodesk/components 1.2.59 → 1.2.60

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (9) hide show
  1. package/README.md +4 -0
  2. package/es/Textarea/Textarea.js +1 -1
  3. package/es/Textarea/Textarea.module.css +8 -8
  4. package/es/Textarea/__tests__/__snapshots__/Textarea.spec.js.snap +43 -43
  5. package/lib/Textarea/Textarea.js +1 -1
  6. package/lib/Textarea/Textarea.module.css +8 -8
  7. package/lib/Textarea/__tests__/__snapshots__/Textarea.spec.js.snap +43 -43
  8. package/package.json +5 -5
  9. package/result.json +1 -1
package/README.md CHANGED
@@ -32,6 +32,10 @@ In this Package, we Provide Some Basic Components to Build Web App
32
32
  - TextBoxIcon
33
33
  - Tooltip
34
34
 
35
+ # 1.2.60
36
+
37
+ - **Textarea** - Handle the default height and width appropriately based on the rows and cols props.
38
+
35
39
  # 1.2.59
36
40
 
37
41
  - **Textarea** - `rows, cols, customAttributes` prop supported
package/es/Textarea/Textarea.js CHANGED
@@ -89,7 +89,7 @@ export default class Textarea extends React.Component {
89
89
  }
90
90
 
91
91
  const isEditable = !(isReadOnly || isDisabled);
92
- let classList = needAppearance ? `${style.container} ${size !== 'default' ? style[size] : ''} ${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}`;
92
+ let classList = needAppearance ? `${style.container} ${size !== 'default' ? style[size] : ''} ${!rows ? 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}`;
93
93
  return /*#__PURE__*/React.createElement("textarea", {
94
94
  "aria-label": ariaLabel,
95
95
  "aria-labelledby": ariaLabelledby,
package/es/Textarea/Textarea.module.css CHANGED
@@ -92,6 +92,13 @@
92
92
  .effect:focus,.effect.active {
93
93
  --textarea_border_color: var(--zdt_textarea_focus_border);
94
94
  }
95
+
96
+ .defaultHeight{
97
+ --textarea_height: var(--zd_size30);
98
+ }
99
+ .defaultWidth {
100
+ --textarea_width: 100%;
101
+ }
95
102
  .xsmall,
96
103
  .xmedium {
97
104
  vertical-align: middle;
@@ -108,7 +115,7 @@
108
115
  --textarea_height: var(--zd_size25);
109
116
  --textarea_line_height: 1.3077;
110
117
  }
111
- .small {
118
+ .small{
112
119
  --textarea_height: var(--zd_size30);
113
120
  --textarea_padding: var(--zd_size2) 0;
114
121
  }
@@ -139,10 +146,3 @@
139
146
  composes: semibold from '../common/common.module.css';
140
147
  --textarea_text_color: var(--zdt_textarea_black_text);
141
148
  }
142
- .xsmall,
143
- .small,
144
- .xmedium,
145
- .medium,
146
- .large {
147
- --textarea_width: 100%;
148
- }
package/es/Textarea/__tests__/__snapshots__/Textarea.spec.js.snap CHANGED
@@ -3,7 +3,7 @@
3
3
  exports[`Textarea component Should be render autofocus true 1`] = `
4
4
  <DocumentFragment>
5
5
  <textarea
6
- class=" container small default needBorder noresize effect borderColor_default"
6
+ class=" container small defaultHeight defaultWidth default needBorder noresize effect borderColor_default"
7
7
  data-id="TextareaComp"
8
8
  data-selector-id="textarea"
9
9
  data-test-id="TextareaComp"
@@ -14,7 +14,7 @@ exports[`Textarea component Should be render autofocus true 1`] = `
14
14
  exports[`Textarea component Should be render custom Attributes 1`] = `
15
15
  <DocumentFragment>
16
16
  <textarea
17
- class=" container small default needBorder noresize effect borderColor_default"
17
+ class=" container small defaultHeight defaultWidth default needBorder noresize effect borderColor_default"
18
18
  data-id="TextareaComp"
19
19
  data-selector-id="textarea"
20
20
  data-test-id="TextareaComp"
@@ -26,7 +26,7 @@ exports[`Textarea component Should be render custom Attributes 1`] = `
26
26
  exports[`Textarea component Should be render customClass 1`] = `
27
27
  <DocumentFragment>
28
28
  <textarea
29
- class="textAreaCustomClass container small default needBorder noresize effect borderColor_default"
29
+ class="textAreaCustomClass container small defaultHeight defaultWidth default needBorder noresize effect borderColor_default"
30
30
  data-id="TextareaComp"
31
31
  data-selector-id="textarea"
32
32
  data-test-id="TextareaComp"
@@ -37,7 +37,7 @@ exports[`Textarea component Should be render customClass 1`] = `
37
37
  exports[`Textarea component Should be render htmlId 1`] = `
38
38
  <DocumentFragment>
39
39
  <textarea
40
- class=" container small default needBorder noresize effect borderColor_default"
40
+ class=" container small defaultHeight defaultWidth default needBorder noresize effect borderColor_default"
41
41
  data-id="TextareaComp"
42
42
  data-selector-id="textarea"
43
43
  data-test-id="TextareaComp"
@@ -49,7 +49,7 @@ exports[`Textarea component Should be render htmlId 1`] = `
49
49
  exports[`Textarea component Should be render isDisabled is false and needEffect is false 1`] = `
50
50
  <DocumentFragment>
51
51
  <textarea
52
- class=" container small default needBorder noresize effect borderColor_default"
52
+ class=" container small defaultHeight defaultWidth default needBorder noresize effect borderColor_default"
53
53
  data-id="TextareaComp"
54
54
  data-selector-id="textarea"
55
55
  data-test-id="TextareaComp"
@@ -60,7 +60,7 @@ exports[`Textarea component Should be render isDisabled is false and needEffect
60
60
  exports[`Textarea component Should be render isDisabled is true 1`] = `
61
61
  <DocumentFragment>
62
62
  <textarea
63
- class=" container small default needBorder noresize borderColor_default"
63
+ class=" container small defaultHeight defaultWidth default needBorder noresize borderColor_default"
64
64
  data-id="TextareaComp"
65
65
  data-selector-id="textarea"
66
66
  data-test-id="TextareaComp"
@@ -72,7 +72,7 @@ exports[`Textarea component Should be render isDisabled is true 1`] = `
72
72
  exports[`Textarea component Should be render isDisabled is true and needEffect is false 1`] = `
73
73
  <DocumentFragment>
74
74
  <textarea
75
- class=" container small default needBorder noresize borderColor_default"
75
+ class=" container small defaultHeight defaultWidth default needBorder noresize borderColor_default"
76
76
  data-id="TextareaComp"
77
77
  data-selector-id="textarea"
78
78
  data-test-id="TextareaComp"
@@ -84,7 +84,7 @@ exports[`Textarea component Should be render isDisabled is true and needEffect i
84
84
  exports[`Textarea component Should be render isDisabled is true and needEffect is true 1`] = `
85
85
  <DocumentFragment>
86
86
  <textarea
87
- class=" container small default needBorder noresize effect borderColor_default"
87
+ class=" container small defaultHeight defaultWidth default needBorder noresize effect borderColor_default"
88
88
  data-id="TextareaComp"
89
89
  data-selector-id="textarea"
90
90
  data-test-id="TextareaComp"
@@ -96,7 +96,7 @@ exports[`Textarea component Should be render isDisabled is true and needEffect i
96
96
  exports[`Textarea component Should be render isReadOnly is false and needEffect is false 1`] = `
97
97
  <DocumentFragment>
98
98
  <textarea
99
- class=" container small default needBorder noresize effect borderColor_default"
99
+ class=" container small defaultHeight defaultWidth default needBorder noresize effect borderColor_default"
100
100
  data-id="TextareaComp"
101
101
  data-selector-id="textarea"
102
102
  data-test-id="TextareaComp"
@@ -107,7 +107,7 @@ exports[`Textarea component Should be render isReadOnly is false and needEffect
107
107
  exports[`Textarea component Should be render isReadOnly is true and needEffect is false 1`] = `
108
108
  <DocumentFragment>
109
109
  <textarea
110
- class=" readonly container small default needBorder noresize borderColor_default"
110
+ class=" readonly container small defaultHeight defaultWidth default needBorder noresize borderColor_default"
111
111
  data-id="TextareaComp"
112
112
  data-selector-id="textarea"
113
113
  data-test-id="TextareaComp"
@@ -119,7 +119,7 @@ exports[`Textarea component Should be render isReadOnly is true and needEffect i
119
119
  exports[`Textarea component Should be render isReadOnly is true and needEffect is true 1`] = `
120
120
  <DocumentFragment>
121
121
  <textarea
122
- class=" readonly container small default needBorder noresize effect borderColor_default"
122
+ class=" readonly container small defaultHeight defaultWidth default needBorder noresize effect borderColor_default"
123
123
  data-id="TextareaComp"
124
124
  data-selector-id="textarea"
125
125
  data-test-id="TextareaComp"
@@ -131,7 +131,7 @@ exports[`Textarea component Should be render isReadOnly is true and needEffect i
131
131
  exports[`Textarea component Should be render maxLength in number 1`] = `
132
132
  <DocumentFragment>
133
133
  <textarea
134
- class=" container small default needBorder noresize effect borderColor_default"
134
+ class=" container small defaultHeight defaultWidth default needBorder noresize effect borderColor_default"
135
135
  data-id="TextareaComp"
136
136
  data-selector-id="textarea"
137
137
  data-test-id="TextareaComp"
@@ -143,7 +143,7 @@ exports[`Textarea component Should be render maxLength in number 1`] = `
143
143
  exports[`Textarea component Should be render maxLength in string 1`] = `
144
144
  <DocumentFragment>
145
145
  <textarea
146
- class=" container small default needBorder noresize effect borderColor_default"
146
+ class=" container small defaultHeight defaultWidth default needBorder noresize effect borderColor_default"
147
147
  data-id="TextareaComp"
148
148
  data-selector-id="textarea"
149
149
  data-test-id="TextareaComp"
@@ -166,7 +166,7 @@ exports[`Textarea component Should be render needAppearance is false 1`] = `
166
166
  exports[`Textarea component Should be render needBorder is false 1`] = `
167
167
  <DocumentFragment>
168
168
  <textarea
169
- class=" container small default noBorder noresize effect borderColor_default"
169
+ class=" container small defaultHeight defaultWidth default noBorder noresize effect borderColor_default"
170
170
  data-id="TextareaComp"
171
171
  data-selector-id="textarea"
172
172
  data-test-id="TextareaComp"
@@ -177,7 +177,7 @@ exports[`Textarea component Should be render needBorder is false 1`] = `
177
177
  exports[`Textarea component Should be render needReadOnlyStyle is false 1`] = `
178
178
  <DocumentFragment>
179
179
  <textarea
180
- class=" container small default needBorder noresize effect borderColor_default"
180
+ class=" container small defaultHeight defaultWidth default needBorder noresize effect borderColor_default"
181
181
  data-id="TextareaComp"
182
182
  data-selector-id="textarea"
183
183
  data-test-id="TextareaComp"
@@ -188,7 +188,7 @@ exports[`Textarea component Should be render needReadOnlyStyle is false 1`] = `
188
188
  exports[`Textarea component Should be render placeholder 1`] = `
189
189
  <DocumentFragment>
190
190
  <textarea
191
- class=" container small default needBorder noresize effect borderColor_default"
191
+ class=" container small defaultHeight defaultWidth default needBorder noresize effect borderColor_default"
192
192
  data-id="TextareaComp"
193
193
  data-selector-id="textarea"
194
194
  data-test-id="TextareaComp"
@@ -200,7 +200,7 @@ exports[`Textarea component Should be render placeholder 1`] = `
200
200
  exports[`Textarea component Should be render rows and cols 1`] = `
201
201
  <DocumentFragment>
202
202
  <textarea
203
- class=" container default needBorder noresize effect borderColor_default"
203
+ class=" container default needBorder noresize effect borderColor_default"
204
204
  cols="3"
205
205
  data-id="TextareaComp"
206
206
  data-selector-id="textarea"
@@ -213,7 +213,7 @@ exports[`Textarea component Should be render rows and cols 1`] = `
213
213
  exports[`Textarea component Should be render text 1`] = `
214
214
  <DocumentFragment>
215
215
  <textarea
216
- class=" container small default needBorder noresize effect borderColor_default"
216
+ class=" container small defaultHeight defaultWidth default needBorder noresize effect borderColor_default"
217
217
  data-id="TextareaComp"
218
218
  data-selector-id="textarea"
219
219
  data-test-id="TextareaComp"
@@ -226,7 +226,7 @@ exports[`Textarea component Should be render text 1`] = `
226
226
  exports[`Textarea component Should be render with the basic set of default props 1`] = `
227
227
  <DocumentFragment>
228
228
  <textarea
229
- class=" container small default needBorder noresize effect borderColor_default"
229
+ class=" container small defaultHeight defaultWidth default needBorder noresize effect borderColor_default"
230
230
  data-id="TextareaComp"
231
231
  data-selector-id="textarea"
232
232
  data-test-id="TextareaComp"
@@ -237,7 +237,7 @@ exports[`Textarea component Should be render with the basic set of default props
237
237
  exports[`Textarea component Should render Varient - default 1`] = `
238
238
  <DocumentFragment>
239
239
  <textarea
240
- class=" container small default needBorder noresize effect borderColor_default"
240
+ class=" container small defaultHeight defaultWidth default needBorder noresize effect borderColor_default"
241
241
  data-id="TextareaComp"
242
242
  data-selector-id="textarea"
243
243
  data-test-id="TextareaComp"
@@ -248,7 +248,7 @@ exports[`Textarea component Should render Varient - default 1`] = `
248
248
  exports[`Textarea component Should render Varient - primary 1`] = `
249
249
  <DocumentFragment>
250
250
  <textarea
251
- class=" container small primary needBorder noresize effect borderColor_default"
251
+ class=" container small defaultHeight defaultWidth primary needBorder noresize effect borderColor_default"
252
252
  data-id="TextareaComp"
253
253
  data-selector-id="textarea"
254
254
  data-test-id="TextareaComp"
@@ -259,7 +259,7 @@ exports[`Textarea component Should render Varient - primary 1`] = `
259
259
  exports[`Textarea component Should render animated is false - large 1`] = `
260
260
  <DocumentFragment>
261
261
  <textarea
262
- class=" container large default needBorder noresize effect borderColor_default"
262
+ class=" container large defaultHeight defaultWidth default needBorder noresize effect borderColor_default"
263
263
  data-id="TextareaComp"
264
264
  data-selector-id="textarea"
265
265
  data-test-id="TextareaComp"
@@ -270,7 +270,7 @@ exports[`Textarea component Should render animated is false - large 1`] = `
270
270
  exports[`Textarea component Should render animated is false - medium 1`] = `
271
271
  <DocumentFragment>
272
272
  <textarea
273
- class=" container medium default needBorder noresize effect borderColor_default"
273
+ class=" container medium defaultHeight defaultWidth default needBorder noresize effect borderColor_default"
274
274
  data-id="TextareaComp"
275
275
  data-selector-id="textarea"
276
276
  data-test-id="TextareaComp"
@@ -281,7 +281,7 @@ exports[`Textarea component Should render animated is false - medium 1`] = `
281
281
  exports[`Textarea component Should render animated is false - small 1`] = `
282
282
  <DocumentFragment>
283
283
  <textarea
284
- class=" container small default needBorder noresize effect borderColor_default"
284
+ class=" container small defaultHeight defaultWidth default needBorder noresize effect borderColor_default"
285
285
  data-id="TextareaComp"
286
286
  data-selector-id="textarea"
287
287
  data-test-id="TextareaComp"
@@ -292,7 +292,7 @@ exports[`Textarea component Should render animated is false - small 1`] = `
292
292
  exports[`Textarea component Should render animated is false - xmedium 1`] = `
293
293
  <DocumentFragment>
294
294
  <textarea
295
- class=" container xmedium default needBorder noresize effect borderColor_default"
295
+ class=" container xmedium defaultHeight defaultWidth default needBorder noresize effect borderColor_default"
296
296
  data-id="TextareaComp"
297
297
  data-selector-id="textarea"
298
298
  data-test-id="TextareaComp"
@@ -303,7 +303,7 @@ exports[`Textarea component Should render animated is false - xmedium 1`] = `
303
303
  exports[`Textarea component Should render animated is false - xsmall 1`] = `
304
304
  <DocumentFragment>
305
305
  <textarea
306
- class=" container xsmall default needBorder noresize effect borderColor_default"
306
+ class=" container xsmall defaultHeight defaultWidth default needBorder noresize effect borderColor_default"
307
307
  data-id="TextareaComp"
308
308
  data-selector-id="textarea"
309
309
  data-test-id="TextareaComp"
@@ -314,7 +314,7 @@ exports[`Textarea component Should render animated is false - xsmall 1`] = `
314
314
  exports[`Textarea component Should render animated is true - large 1`] = `
315
315
  <DocumentFragment>
316
316
  <textarea
317
- class=" container large default needBorder noresize largeanimated effect borderColor_default"
317
+ class=" container large defaultHeight defaultWidth default needBorder noresize largeanimated effect borderColor_default"
318
318
  data-id="TextareaComp"
319
319
  data-selector-id="textarea"
320
320
  data-test-id="TextareaComp"
@@ -325,7 +325,7 @@ exports[`Textarea component Should render animated is true - large 1`] = `
325
325
  exports[`Textarea component Should render animated is true - medium 1`] = `
326
326
  <DocumentFragment>
327
327
  <textarea
328
- class=" container medium default needBorder noresize undefined effect borderColor_default"
328
+ class=" container medium defaultHeight defaultWidth default needBorder noresize undefined effect borderColor_default"
329
329
  data-id="TextareaComp"
330
330
  data-selector-id="textarea"
331
331
  data-test-id="TextareaComp"
@@ -336,7 +336,7 @@ exports[`Textarea component Should render animated is true - medium 1`] = `
336
336
  exports[`Textarea component Should render animated is true - small 1`] = `
337
337
  <DocumentFragment>
338
338
  <textarea
339
- class=" container small default needBorder noresize smallanimated effect borderColor_default"
339
+ class=" container small defaultHeight defaultWidth default needBorder noresize smallanimated effect borderColor_default"
340
340
  data-id="TextareaComp"
341
341
  data-selector-id="textarea"
342
342
  data-test-id="TextareaComp"
@@ -347,7 +347,7 @@ exports[`Textarea component Should render animated is true - small 1`] = `
347
347
  exports[`Textarea component Should render animated is true - xmedium 1`] = `
348
348
  <DocumentFragment>
349
349
  <textarea
350
- class=" container xmedium default needBorder noresize xmediumanimated effect borderColor_default"
350
+ class=" container xmedium defaultHeight defaultWidth default needBorder noresize xmediumanimated effect borderColor_default"
351
351
  data-id="TextareaComp"
352
352
  data-selector-id="textarea"
353
353
  data-test-id="TextareaComp"
@@ -358,7 +358,7 @@ exports[`Textarea component Should render animated is true - xmedium 1`] = `
358
358
  exports[`Textarea component Should render animated is true - xsmall 1`] = `
359
359
  <DocumentFragment>
360
360
  <textarea
361
- class=" container xsmall default needBorder noresize xsmallanimated effect borderColor_default"
361
+ class=" container xsmall defaultHeight defaultWidth default needBorder noresize xsmallanimated effect borderColor_default"
362
362
  data-id="TextareaComp"
363
363
  data-selector-id="textarea"
364
364
  data-test-id="TextareaComp"
@@ -369,7 +369,7 @@ exports[`Textarea component Should render animated is true - xsmall 1`] = `
369
369
  exports[`Textarea component Should render borderColor - default 1`] = `
370
370
  <DocumentFragment>
371
371
  <textarea
372
- class=" container small default needBorder noresize effect borderColor_default"
372
+ class=" container small defaultHeight defaultWidth default needBorder noresize effect borderColor_default"
373
373
  data-id="TextareaComp"
374
374
  data-selector-id="textarea"
375
375
  data-test-id="TextareaComp"
@@ -380,7 +380,7 @@ exports[`Textarea component Should render borderColor - default 1`] = `
380
380
  exports[`Textarea component Should render borderColor - transparent 1`] = `
381
381
  <DocumentFragment>
382
382
  <textarea
383
- class=" container small default needBorder noresize effect borderColor_transparent"
383
+ class=" container small defaultHeight defaultWidth default needBorder noresize effect borderColor_transparent"
384
384
  data-id="TextareaComp"
385
385
  data-selector-id="textarea"
386
386
  data-test-id="TextareaComp"
@@ -391,7 +391,7 @@ exports[`Textarea component Should render borderColor - transparent 1`] = `
391
391
  exports[`Textarea component Should render resize - both 1`] = `
392
392
  <DocumentFragment>
393
393
  <textarea
394
- class=" container small default needBorder resizeboth effect borderColor_default"
394
+ class=" container small defaultHeight defaultWidth default needBorder resizeboth effect borderColor_default"
395
395
  data-id="TextareaComp"
396
396
  data-selector-id="textarea"
397
397
  data-test-id="TextareaComp"
@@ -402,7 +402,7 @@ exports[`Textarea component Should render resize - both 1`] = `
402
402
  exports[`Textarea component Should render resize - horizontal 1`] = `
403
403
  <DocumentFragment>
404
404
  <textarea
405
- class=" container small default needBorder resizeX effect borderColor_default"
405
+ class=" container small defaultHeight defaultWidth default needBorder resizeX effect borderColor_default"
406
406
  data-id="TextareaComp"
407
407
  data-selector-id="textarea"
408
408
  data-test-id="TextareaComp"
@@ -413,7 +413,7 @@ exports[`Textarea component Should render resize - horizontal 1`] = `
413
413
  exports[`Textarea component Should render resize - none 1`] = `
414
414
  <DocumentFragment>
415
415
  <textarea
416
- class=" container small default needBorder noresize effect borderColor_default"
416
+ class=" container small defaultHeight defaultWidth default needBorder noresize effect borderColor_default"
417
417
  data-id="TextareaComp"
418
418
  data-selector-id="textarea"
419
419
  data-test-id="TextareaComp"
@@ -424,7 +424,7 @@ exports[`Textarea component Should render resize - none 1`] = `
424
424
  exports[`Textarea component Should render resize - vertical 1`] = `
425
425
  <DocumentFragment>
426
426
  <textarea
427
- class=" container small default needBorder resizeY effect borderColor_default"
427
+ class=" container small defaultHeight defaultWidth default needBorder resizeY effect borderColor_default"
428
428
  data-id="TextareaComp"
429
429
  data-selector-id="textarea"
430
430
  data-test-id="TextareaComp"
@@ -435,7 +435,7 @@ exports[`Textarea component Should render resize - vertical 1`] = `
435
435
  exports[`Textarea component Should render size - large 1`] = `
436
436
  <DocumentFragment>
437
437
  <textarea
438
- class=" container large default needBorder noresize largeanimated effect borderColor_default"
438
+ class=" container large defaultHeight defaultWidth default needBorder noresize largeanimated effect borderColor_default"
439
439
  data-id="TextareaComp"
440
440
  data-selector-id="textarea"
441
441
  data-test-id="TextareaComp"
@@ -446,7 +446,7 @@ exports[`Textarea component Should render size - large 1`] = `
446
446
  exports[`Textarea component Should render size - medium 1`] = `
447
447
  <DocumentFragment>
448
448
  <textarea
449
- class=" container medium default needBorder noresize undefined effect borderColor_default"
449
+ class=" container medium defaultHeight defaultWidth default needBorder noresize undefined effect borderColor_default"
450
450
  data-id="TextareaComp"
451
451
  data-selector-id="textarea"
452
452
  data-test-id="TextareaComp"
@@ -457,7 +457,7 @@ exports[`Textarea component Should render size - medium 1`] = `
457
457
  exports[`Textarea component Should render size - small 1`] = `
458
458
  <DocumentFragment>
459
459
  <textarea
460
- class=" container small default needBorder noresize smallanimated effect borderColor_default"
460
+ class=" container small defaultHeight defaultWidth default needBorder noresize smallanimated effect borderColor_default"
461
461
  data-id="TextareaComp"
462
462
  data-selector-id="textarea"
463
463
  data-test-id="TextareaComp"
@@ -468,7 +468,7 @@ exports[`Textarea component Should render size - small 1`] = `
468
468
  exports[`Textarea component Should render size - xmedium 1`] = `
469
469
  <DocumentFragment>
470
470
  <textarea
471
- class=" container xmedium default needBorder noresize xmediumanimated effect borderColor_default"
471
+ class=" container xmedium defaultHeight defaultWidth default needBorder noresize xmediumanimated effect borderColor_default"
472
472
  data-id="TextareaComp"
473
473
  data-selector-id="textarea"
474
474
  data-test-id="TextareaComp"
@@ -479,7 +479,7 @@ exports[`Textarea component Should render size - xmedium 1`] = `
479
479
  exports[`Textarea component Should render size - xsmall 1`] = `
480
480
  <DocumentFragment>
481
481
  <textarea
482
- class=" container xsmall default needBorder noresize xsmallanimated effect borderColor_default"
482
+ class=" container xsmall defaultHeight defaultWidth default needBorder noresize xsmallanimated effect borderColor_default"
483
483
  data-id="TextareaComp"
484
484
  data-selector-id="textarea"
485
485
  data-test-id="TextareaComp"
@@ -492,7 +492,7 @@ exports[`Textarea component rendering ally clearLabel 1`] = `
492
492
  <textarea
493
493
  aria-label="TextAreaAriaLabel"
494
494
  aria-labelledby="TexareaAriaLabelledby"
495
- class=" container small default needBorder noresize effect borderColor_default"
495
+ class=" container small defaultHeight defaultWidth default needBorder noresize effect borderColor_default"
496
496
  data-id="TextareaComp"
497
497
  data-selector-id="textarea"
498
498
  data-test-id="TextareaComp"
package/lib/Textarea/Textarea.js CHANGED
@@ -129,7 +129,7 @@ var Textarea = /*#__PURE__*/function (_React$Component) {
129
129
  }
130
130
 
131
131
  var isEditable = !(isReadOnly || isDisabled);
132
- var classList = needAppearance ? "".concat(_TextareaModule["default"].container, " ").concat(size !== 'default' ? _TextareaModule["default"][size] : '', " ").concat(_TextareaModule["default"][variant], " ").concat(needBorder ? _TextareaModule["default"].needBorder : _TextareaModule["default"].noBorder, " ").concat(resize ? _TextareaModule["default"][resizes[resize]] : _TextareaModule["default"][resizes.none], " ").concat(animated && size !== 'default' ? "".concat(_TextareaModule["default"]["".concat(size, "animated")]) : '', " ").concat(isDisabled && !needEffect || isReadOnly && !needEffect ? '' : _TextareaModule["default"].effect, " ").concat(isEditable && isFocus ? _TextareaModule["default"].active : '') : "".concat(_TextareaModule["default"].basic);
132
+ var classList = needAppearance ? "".concat(_TextareaModule["default"].container, " ").concat(size !== 'default' ? _TextareaModule["default"][size] : '', " ").concat(!rows ? _TextareaModule["default"].defaultHeight : '', " ").concat(!cols ? _TextareaModule["default"].defaultWidth : '', " ").concat(_TextareaModule["default"][variant], " ").concat(needBorder ? _TextareaModule["default"].needBorder : _TextareaModule["default"].noBorder, " ").concat(resize ? _TextareaModule["default"][resizes[resize]] : _TextareaModule["default"][resizes.none], " ").concat(animated && size !== 'default' ? "".concat(_TextareaModule["default"]["".concat(size, "animated")]) : '', " ").concat(isDisabled && !needEffect || isReadOnly && !needEffect ? '' : _TextareaModule["default"].effect, " ").concat(isEditable && isFocus ? _TextareaModule["default"].active : '') : "".concat(_TextareaModule["default"].basic);
133
133
  return /*#__PURE__*/_react["default"].createElement("textarea", _extends({
134
134
  "aria-label": ariaLabel,
135
135
  "aria-labelledby": ariaLabelledby,
package/lib/Textarea/Textarea.module.css CHANGED
@@ -92,6 +92,13 @@
92
92
  .effect:focus,.effect.active {
93
93
  --textarea_border_color: var(--zdt_textarea_focus_border);
94
94
  }
95
+
96
+ .defaultHeight{
97
+ --textarea_height: var(--zd_size30);
98
+ }
99
+ .defaultWidth {
100
+ --textarea_width: 100%;
101
+ }
95
102
  .xsmall,
96
103
  .xmedium {
97
104
  vertical-align: middle;
@@ -108,7 +115,7 @@
108
115
  --textarea_height: var(--zd_size25);
109
116
  --textarea_line_height: 1.3077;
110
117
  }
111
- .small {
118
+ .small{
112
119
  --textarea_height: var(--zd_size30);
113
120
  --textarea_padding: var(--zd_size2) 0;
114
121
  }
@@ -139,10 +146,3 @@
139
146
  composes: semibold from '../common/common.module.css';
140
147
  --textarea_text_color: var(--zdt_textarea_black_text);
141
148
  }
142
- .xsmall,
143
- .small,
144
- .xmedium,
145
- .medium,
146
- .large {
147
- --textarea_width: 100%;
148
- }