@zohodesk/components 1.2.32 → 1.2.34

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 (62) hide show
  1. package/.cli/propValidation_report.html +1 -1
  2. package/README.md +8 -0
  3. package/es/AppContainer/__tests__/AppContainer.spec.js +82 -0
  4. package/es/AppContainer/__tests__/__snapshots__/AppContainer.spec.js.snap +201 -0
  5. package/es/Button/__tests__/Button.spec.js +8 -21
  6. package/es/Button/__tests__/__snapshots__/Button.spec.js.snap +0 -28
  7. package/es/CheckBox/__tests__/CheckBox.spec.js +240 -0
  8. package/es/CheckBox/__tests__/__snapshots__/CheckBox.spec.js.snap +1878 -0
  9. package/es/MultiSelect/AdvancedMultiSelect.js +6 -2
  10. package/es/MultiSelect/props/defaultProps.js +2 -1
  11. package/es/MultiSelect/props/propTypes.js +2 -1
  12. package/es/Radio/__tests__/Radio.spec.js +6 -9
  13. package/es/Radio/__tests__/__snapshots__/Radio.spec.js.snap +128 -49
  14. package/es/RippleEffect/__tests__/RippleEffect.spec.js +1 -1
  15. package/es/RippleEffect/__tests__/__snapshots__/RippleEffect.spec.js.snap +0 -10
  16. package/es/Select/GroupSelect.js +2 -2
  17. package/es/Tag/__tests__/Tag.spec.js +235 -0
  18. package/es/Tag/__tests__/__snapshots__/Tag.spec.js.snap +3054 -0
  19. package/es/TextBox/__tests__/TextBox.spec.js +327 -0
  20. package/es/TextBox/__tests__/__snapshots__/TextBox.spec.js.snap +615 -0
  21. package/es/TextBox/props/propTypes.js +0 -3
  22. package/es/TextBoxIcon/__tests__/TextBoxIcon.spec.js +268 -0
  23. package/es/TextBoxIcon/__tests__/__snapshots__/TextBoxIcon.spec.js.snap +1784 -0
  24. package/es/TextBoxIcon/props/propTypes.js +1 -1
  25. package/es/Textarea/__tests__/Textarea.spec.js +228 -0
  26. package/es/Textarea/__tests__/__snapshots__/Textarea.spec.js.snap +476 -0
  27. package/es/utils/dropDownUtils.js +4 -1
  28. package/es/v1/MultiSelect/AdvancedMultiSelect.js +6 -2
  29. package/es/v1/MultiSelect/props/defaultProps.js +2 -1
  30. package/es/v1/MultiSelect/props/propTypes.js +2 -1
  31. package/es/v1/Select/GroupSelect.js +2 -2
  32. package/lib/AppContainer/__tests__/AppContainer.spec.js +90 -0
  33. package/lib/AppContainer/__tests__/__snapshots__/AppContainer.spec.js.snap +201 -0
  34. package/lib/Button/__tests__/Button.spec.js +8 -21
  35. package/lib/Button/__tests__/__snapshots__/Button.spec.js.snap +0 -28
  36. package/lib/CheckBox/__tests__/CheckBox.spec.js +248 -0
  37. package/lib/CheckBox/__tests__/__snapshots__/CheckBox.spec.js.snap +1878 -0
  38. package/lib/MultiSelect/AdvancedMultiSelect.js +5 -2
  39. package/lib/MultiSelect/props/defaultProps.js +2 -1
  40. package/lib/MultiSelect/props/propTypes.js +2 -1
  41. package/lib/Radio/__tests__/Radio.spec.js +9 -13
  42. package/lib/Radio/__tests__/__snapshots__/Radio.spec.js.snap +128 -49
  43. package/lib/RippleEffect/__tests__/RippleEffect.spec.js +1 -1
  44. package/lib/RippleEffect/__tests__/__snapshots__/RippleEffect.spec.js.snap +0 -10
  45. package/lib/Select/GroupSelect.js +12 -12
  46. package/lib/Tag/__tests__/Tag.spec.js +252 -0
  47. package/lib/Tag/__tests__/__snapshots__/Tag.spec.js.snap +3054 -0
  48. package/lib/TextBox/__tests__/TextBox.spec.js +334 -0
  49. package/lib/TextBox/__tests__/__snapshots__/TextBox.spec.js.snap +615 -0
  50. package/lib/TextBox/props/propTypes.js +53 -51
  51. package/lib/TextBoxIcon/__tests__/TextBoxIcon.spec.js +279 -0
  52. package/lib/TextBoxIcon/__tests__/__snapshots__/TextBoxIcon.spec.js.snap +1784 -0
  53. package/lib/TextBoxIcon/props/propTypes.js +1 -1
  54. package/lib/Textarea/__tests__/Textarea.spec.js +235 -0
  55. package/lib/Textarea/__tests__/__snapshots__/Textarea.spec.js.snap +476 -0
  56. package/lib/utils/dropDownUtils.js +14 -2
  57. package/lib/v1/MultiSelect/AdvancedMultiSelect.js +5 -2
  58. package/lib/v1/MultiSelect/props/defaultProps.js +2 -1
  59. package/lib/v1/MultiSelect/props/propTypes.js +2 -1
  60. package/lib/v1/Select/GroupSelect.js +12 -12
  61. package/package.json +1 -1
  62. package/result.json +1 -1
package/es/TextBoxIcon/__tests__/__snapshots__/TextBoxIcon.spec.js.snap ADDED
@@ -0,0 +1,1784 @@
1
+ // Jest Snapshot v1, https://goo.gl/fbAQLP
2
+
3
+ exports[`TextBoxIcon component Should be render children 1`] = `
4
+ <DocumentFragment>
5
+ <div
6
+ class="container effect flex rowdir"
7
+ data-id="containerComponent"
8
+ data-selector-id="textBoxIcon"
9
+ data-test-id="containerComponent"
10
+ >
11
+ <div
12
+ class="grow basis shrinkOff"
13
+ data-id="boxComponent"
14
+ data-selector-id="box"
15
+ data-test-id="boxComponent"
16
+ >
17
+ <input
18
+ class=" container medium default effect borderColor_default "
19
+ data-id="textBoxIcon"
20
+ data-selector-id="textBoxIcon"
21
+ data-test-id="textBoxIcon"
22
+ maxlength="250"
23
+ type="text"
24
+ value=""
25
+ />
26
+ </div>
27
+ <div
28
+ class="iconContainer shrinkOff"
29
+ data-id="boxComponent"
30
+ data-selector-id="box"
31
+ data-test-id="boxComponent"
32
+ >
33
+ <div
34
+ class="flex cover rowdir"
35
+ data-id="containerComponent"
36
+ data-selector-id="container"
37
+ data-test-id="containerComponent"
38
+ >
39
+ <div
40
+ class="icon shrinkOff"
41
+ data-id="boxComponent"
42
+ data-selector-id="box"
43
+ data-test-id="boxComponent"
44
+ >
45
+
46
+ <div>
47
+ test
48
+ </div>
49
+
50
+ </div>
51
+ </div>
52
+ </div>
53
+ <div
54
+ class="line borderColor_default "
55
+ />
56
+ </div>
57
+ </DocumentFragment>
58
+ `;
59
+
60
+ exports[`TextBoxIcon component Should be render htmlId 1`] = `
61
+ <DocumentFragment>
62
+ <div
63
+ class="container effect flex rowdir"
64
+ data-id="containerComponent"
65
+ data-selector-id="textBoxIcon"
66
+ data-test-id="containerComponent"
67
+ >
68
+ <div
69
+ class="grow basis shrinkOff"
70
+ data-id="boxComponent"
71
+ data-selector-id="box"
72
+ data-test-id="boxComponent"
73
+ >
74
+ <input
75
+ class=" container medium default effect borderColor_default "
76
+ data-id="textBoxIcon"
77
+ data-selector-id="textBoxIcon"
78
+ data-test-id="textBoxIcon"
79
+ id="textBoxIconhtmlId"
80
+ maxlength="250"
81
+ type="text"
82
+ value=""
83
+ />
84
+ </div>
85
+ <div
86
+ class="iconContainer shrinkOff"
87
+ data-id="boxComponent"
88
+ data-selector-id="box"
89
+ data-test-id="boxComponent"
90
+ >
91
+ <div
92
+ class="flex cover rowdir"
93
+ data-id="containerComponent"
94
+ data-selector-id="container"
95
+ data-test-id="containerComponent"
96
+ />
97
+ </div>
98
+ <div
99
+ class="line borderColor_default "
100
+ />
101
+ </div>
102
+ </DocumentFragment>
103
+ `;
104
+
105
+ exports[`TextBoxIcon component Should be render iconOnHover is true , iconOnHover, isDisabled is false 1`] = `
106
+ <DocumentFragment>
107
+ <div
108
+ class="container effect iconOnHoverStyle flex rowdir"
109
+ data-id="containerComponent"
110
+ data-selector-id="textBoxIcon"
111
+ data-test-id="containerComponent"
112
+ >
113
+ <div
114
+ class="grow basis shrinkOff"
115
+ data-id="boxComponent"
116
+ data-selector-id="box"
117
+ data-test-id="boxComponent"
118
+ >
119
+ <input
120
+ class=" container medium default effect borderColor_default "
121
+ data-id="textBoxIcon"
122
+ data-selector-id="textBoxIcon"
123
+ data-test-id="textBoxIcon"
124
+ maxlength="250"
125
+ type="text"
126
+ value=""
127
+ />
128
+ </div>
129
+ <div
130
+ class="iconContainer shrinkOff"
131
+ data-id="boxComponent"
132
+ data-selector-id="box"
133
+ data-test-id="boxComponent"
134
+ >
135
+ <div
136
+ class="flex cover rowdir"
137
+ data-id="containerComponent"
138
+ data-selector-id="container"
139
+ data-test-id="containerComponent"
140
+ />
141
+ </div>
142
+ <div
143
+ class="line borderColor_default "
144
+ />
145
+ </div>
146
+ </DocumentFragment>
147
+ `;
148
+
149
+ exports[`TextBoxIcon component Should be render iconOnHover is true , iconOnHover, isDisabled is true 1`] = `
150
+ <DocumentFragment>
151
+ <div
152
+ class="container disabled iconOnHoverReadonly flex rowdir"
153
+ data-id="containerComponent"
154
+ data-selector-id="textBoxIcon"
155
+ data-test-id="containerComponent"
156
+ >
157
+ <div
158
+ class="grow basis shrinkOff"
159
+ data-id="boxComponent"
160
+ data-selector-id="box"
161
+ data-test-id="boxComponent"
162
+ >
163
+ <input
164
+ class="readonly container medium default effect borderColor_default "
165
+ data-id="textBoxIcon"
166
+ data-selector-id="textBoxIcon"
167
+ data-test-id="textBoxIcon"
168
+ disabled=""
169
+ maxlength="250"
170
+ readonly=""
171
+ type="text"
172
+ value=""
173
+ />
174
+ </div>
175
+ <div
176
+ class="iconContainer shrinkOff"
177
+ data-id="boxComponent"
178
+ data-selector-id="box"
179
+ data-test-id="boxComponent"
180
+ >
181
+ <div
182
+ class="flex cover rowdir"
183
+ data-id="containerComponent"
184
+ data-selector-id="container"
185
+ data-test-id="containerComponent"
186
+ />
187
+ </div>
188
+ <div
189
+ class="line borderColor_default "
190
+ />
191
+ </div>
192
+ </DocumentFragment>
193
+ `;
194
+
195
+ exports[`TextBoxIcon component Should be render iconRotated is true 1`] = `
196
+ <DocumentFragment>
197
+ <div
198
+ class="container effect flex rowdir"
199
+ data-id="containerComponent"
200
+ data-selector-id="textBoxIcon"
201
+ data-test-id="containerComponent"
202
+ >
203
+ <div
204
+ class="grow basis shrinkOff"
205
+ data-id="boxComponent"
206
+ data-selector-id="box"
207
+ data-test-id="boxComponent"
208
+ >
209
+ <input
210
+ class=" container medium default effect borderColor_default "
211
+ data-id="textBoxIcon"
212
+ data-selector-id="textBoxIcon"
213
+ data-test-id="textBoxIcon"
214
+ maxlength="250"
215
+ type="text"
216
+ value=""
217
+ />
218
+ </div>
219
+ <div
220
+ class="iconContainer shrinkOff"
221
+ data-id="boxComponent"
222
+ data-selector-id="box"
223
+ data-test-id="boxComponent"
224
+ >
225
+ <div
226
+ class="flex cover rowdir"
227
+ data-id="containerComponent"
228
+ data-selector-id="container"
229
+ data-test-id="containerComponent"
230
+ >
231
+ <div
232
+ class="icon rotated shrinkOff"
233
+ data-id="boxComponent"
234
+ data-selector-id="box"
235
+ data-test-id="boxComponent"
236
+ >
237
+
238
+ <div>
239
+ test
240
+ </div>
241
+
242
+ </div>
243
+ </div>
244
+ </div>
245
+ <div
246
+ class="line borderColor_default "
247
+ />
248
+ </div>
249
+ </DocumentFragment>
250
+ `;
251
+
252
+ exports[`TextBoxIcon component Should be render id 1`] = `
253
+ <DocumentFragment>
254
+ <div
255
+ class="container effect flex rowdir"
256
+ data-id="containerComponent"
257
+ data-selector-id="textBoxIcon"
258
+ data-test-id="containerComponent"
259
+ >
260
+ <div
261
+ class="grow basis shrinkOff"
262
+ data-id="boxComponent"
263
+ data-selector-id="box"
264
+ data-test-id="boxComponent"
265
+ >
266
+ <input
267
+ class=" container medium default effect borderColor_default "
268
+ data-id="textBoxIcon"
269
+ data-selector-id="textBoxIcon"
270
+ data-test-id="textBoxIcon"
271
+ id="TextboxIconId"
272
+ maxlength="250"
273
+ type="text"
274
+ value=""
275
+ />
276
+ </div>
277
+ <div
278
+ class="iconContainer shrinkOff"
279
+ data-id="boxComponent"
280
+ data-selector-id="box"
281
+ data-test-id="boxComponent"
282
+ >
283
+ <div
284
+ class="flex cover rowdir"
285
+ data-id="containerComponent"
286
+ data-selector-id="container"
287
+ data-test-id="containerComponent"
288
+ />
289
+ </div>
290
+ <div
291
+ class="line borderColor_default "
292
+ />
293
+ </div>
294
+ </DocumentFragment>
295
+ `;
296
+
297
+ exports[`TextBoxIcon component Should be render isClickable is true 1`] = `
298
+ <DocumentFragment>
299
+ <div
300
+ class="container effect flex rowdir"
301
+ data-id="containerComponent"
302
+ data-selector-id="textBoxIcon"
303
+ data-test-id="containerComponent"
304
+ >
305
+ <div
306
+ class="grow basis shrinkOff"
307
+ data-id="boxComponent"
308
+ data-selector-id="box"
309
+ data-test-id="boxComponent"
310
+ >
311
+ <input
312
+ class=" pointer container medium default effect borderColor_default "
313
+ data-id="textBoxIcon"
314
+ data-selector-id="textBoxIcon"
315
+ data-test-id="textBoxIcon"
316
+ maxlength="250"
317
+ type="text"
318
+ value=""
319
+ />
320
+ </div>
321
+ <div
322
+ class="iconContainer shrinkOff"
323
+ data-id="boxComponent"
324
+ data-selector-id="box"
325
+ data-test-id="boxComponent"
326
+ >
327
+ <div
328
+ class="flex cover rowdir"
329
+ data-id="containerComponent"
330
+ data-selector-id="container"
331
+ data-test-id="containerComponent"
332
+ />
333
+ </div>
334
+ <div
335
+ class="line borderColor_default "
336
+ />
337
+ </div>
338
+ </DocumentFragment>
339
+ `;
340
+
341
+ exports[`TextBoxIcon component Should be render isDisabled is true 1`] = `
342
+ <DocumentFragment>
343
+ <div
344
+ class="container disabled flex rowdir"
345
+ data-id="containerComponent"
346
+ data-selector-id="textBoxIcon"
347
+ data-test-id="containerComponent"
348
+ >
349
+ <div
350
+ class="grow basis shrinkOff"
351
+ data-id="boxComponent"
352
+ data-selector-id="box"
353
+ data-test-id="boxComponent"
354
+ >
355
+ <input
356
+ class=" container medium default effect borderColor_default "
357
+ data-id="textBoxIcon"
358
+ data-selector-id="textBoxIcon"
359
+ data-test-id="textBoxIcon"
360
+ disabled=""
361
+ maxlength="250"
362
+ type="text"
363
+ value=""
364
+ />
365
+ </div>
366
+ <div
367
+ class="iconContainer shrinkOff"
368
+ data-id="boxComponent"
369
+ data-selector-id="box"
370
+ data-test-id="boxComponent"
371
+ >
372
+ <div
373
+ class="flex cover rowdir"
374
+ data-id="containerComponent"
375
+ data-selector-id="container"
376
+ data-test-id="containerComponent"
377
+ />
378
+ </div>
379
+ <div
380
+ class="line borderColor_default "
381
+ />
382
+ </div>
383
+ </DocumentFragment>
384
+ `;
385
+
386
+ exports[`TextBoxIcon component Should be render isFocus is true 1`] = `
387
+ <DocumentFragment>
388
+ <div
389
+ class="container effect effectFocused flex rowdir"
390
+ data-id="containerComponent"
391
+ data-selector-id="textBoxIcon"
392
+ data-test-id="containerComponent"
393
+ >
394
+ <div
395
+ class="grow basis shrinkOff"
396
+ data-id="boxComponent"
397
+ data-selector-id="box"
398
+ data-test-id="boxComponent"
399
+ >
400
+ <input
401
+ class=" container medium default effect focus borderColor_default "
402
+ data-id="textBoxIcon"
403
+ data-selector-id="textBoxIcon"
404
+ data-test-id="textBoxIcon"
405
+ maxlength="250"
406
+ type="text"
407
+ value=""
408
+ />
409
+ </div>
410
+ <div
411
+ class="iconContainer shrinkOff"
412
+ data-id="boxComponent"
413
+ data-selector-id="box"
414
+ data-test-id="boxComponent"
415
+ >
416
+ <div
417
+ class="flex cover rowdir"
418
+ data-id="containerComponent"
419
+ data-selector-id="container"
420
+ data-test-id="containerComponent"
421
+ />
422
+ </div>
423
+ <div
424
+ class="line borderColor_default "
425
+ />
426
+ </div>
427
+ </DocumentFragment>
428
+ `;
429
+
430
+ exports[`TextBoxIcon component Should be render isReadOnly is true , needEffect is false 1`] = `
431
+ <DocumentFragment>
432
+ <div
433
+ class="container readonly flex rowdir"
434
+ data-id="containerComponent"
435
+ data-selector-id="textBoxIcon"
436
+ data-test-id="containerComponent"
437
+ >
438
+ <div
439
+ class="grow basis shrinkOff"
440
+ data-id="boxComponent"
441
+ data-selector-id="box"
442
+ data-test-id="boxComponent"
443
+ >
444
+ <input
445
+ class="readonly container medium default borderColor_default "
446
+ data-id="textBoxIcon"
447
+ data-selector-id="textBoxIcon"
448
+ data-test-id="textBoxIcon"
449
+ maxlength="250"
450
+ readonly=""
451
+ type="text"
452
+ value=""
453
+ />
454
+ </div>
455
+ <div
456
+ class="iconContainer shrinkOff"
457
+ data-id="boxComponent"
458
+ data-selector-id="box"
459
+ data-test-id="boxComponent"
460
+ >
461
+ <div
462
+ class="flex cover rowdir"
463
+ data-id="containerComponent"
464
+ data-selector-id="container"
465
+ data-test-id="containerComponent"
466
+ />
467
+ </div>
468
+ <div
469
+ class="line borderColor_default "
470
+ />
471
+ </div>
472
+ </DocumentFragment>
473
+ `;
474
+
475
+ exports[`TextBoxIcon component Should be render isReadOnly is true 1`] = `
476
+ <DocumentFragment>
477
+ <div
478
+ class="container effect flex rowdir"
479
+ data-id="containerComponent"
480
+ data-selector-id="textBoxIcon"
481
+ data-test-id="containerComponent"
482
+ >
483
+ <div
484
+ class="grow basis shrinkOff"
485
+ data-id="boxComponent"
486
+ data-selector-id="box"
487
+ data-test-id="boxComponent"
488
+ >
489
+ <input
490
+ class="readonly container medium default effect borderColor_default "
491
+ data-id="textBoxIcon"
492
+ data-selector-id="textBoxIcon"
493
+ data-test-id="textBoxIcon"
494
+ maxlength="250"
495
+ readonly=""
496
+ type="text"
497
+ value=""
498
+ />
499
+ </div>
500
+ <div
501
+ class="iconContainer shrinkOff"
502
+ data-id="boxComponent"
503
+ data-selector-id="box"
504
+ data-test-id="boxComponent"
505
+ >
506
+ <div
507
+ class="flex cover rowdir"
508
+ data-id="containerComponent"
509
+ data-selector-id="container"
510
+ data-test-id="containerComponent"
511
+ />
512
+ </div>
513
+ <div
514
+ class="line borderColor_default "
515
+ />
516
+ </div>
517
+ </DocumentFragment>
518
+ `;
519
+
520
+ exports[`TextBoxIcon component Should be render name 1`] = `
521
+ <DocumentFragment>
522
+ <div
523
+ class="container effect flex rowdir"
524
+ data-id="containerComponent"
525
+ data-selector-id="textBoxIcon"
526
+ data-test-id="containerComponent"
527
+ >
528
+ <div
529
+ class="grow basis shrinkOff"
530
+ data-id="boxComponent"
531
+ data-selector-id="box"
532
+ data-test-id="boxComponent"
533
+ >
534
+ <input
535
+ class=" container medium default effect borderColor_default "
536
+ data-id="textBoxIcon"
537
+ data-selector-id="textBoxIcon"
538
+ data-test-id="textBoxIcon"
539
+ maxlength="250"
540
+ name="TextBoxIconName"
541
+ type="text"
542
+ value=""
543
+ />
544
+ </div>
545
+ <div
546
+ class="iconContainer shrinkOff"
547
+ data-id="boxComponent"
548
+ data-selector-id="box"
549
+ data-test-id="boxComponent"
550
+ >
551
+ <div
552
+ class="flex cover rowdir"
553
+ data-id="containerComponent"
554
+ data-selector-id="container"
555
+ data-test-id="containerComponent"
556
+ />
557
+ </div>
558
+ <div
559
+ class="line borderColor_default "
560
+ />
561
+ </div>
562
+ </DocumentFragment>
563
+ `;
564
+
565
+ exports[`TextBoxIcon component Should be render needBorder is false 1`] = `
566
+ <DocumentFragment>
567
+ <div
568
+ class="container effect flex rowdir"
569
+ data-id="containerComponent"
570
+ data-selector-id="textBoxIcon"
571
+ data-test-id="containerComponent"
572
+ >
573
+ <div
574
+ class="grow basis shrinkOff"
575
+ data-id="boxComponent"
576
+ data-selector-id="box"
577
+ data-test-id="boxComponent"
578
+ >
579
+ <input
580
+ class=" container medium default effect borderColor_default "
581
+ data-id="textBoxIcon"
582
+ data-selector-id="textBoxIcon"
583
+ data-test-id="textBoxIcon"
584
+ maxlength="250"
585
+ type="text"
586
+ value=""
587
+ />
588
+ </div>
589
+ <div
590
+ class="iconContainer shrinkOff"
591
+ data-id="boxComponent"
592
+ data-selector-id="box"
593
+ data-test-id="boxComponent"
594
+ >
595
+ <div
596
+ class="flex cover rowdir"
597
+ data-id="containerComponent"
598
+ data-selector-id="container"
599
+ data-test-id="containerComponent"
600
+ />
601
+ </div>
602
+ </div>
603
+ </DocumentFragment>
604
+ `;
605
+
606
+ exports[`TextBoxIcon component Should be render needEffect is false 1`] = `
607
+ <DocumentFragment>
608
+ <div
609
+ class="container readonly flex rowdir"
610
+ data-id="containerComponent"
611
+ data-selector-id="textBoxIcon"
612
+ data-test-id="containerComponent"
613
+ >
614
+ <div
615
+ class="grow basis shrinkOff"
616
+ data-id="boxComponent"
617
+ data-selector-id="box"
618
+ data-test-id="boxComponent"
619
+ >
620
+ <input
621
+ class="readonly container medium default borderColor_default "
622
+ data-id="textBoxIcon"
623
+ data-selector-id="textBoxIcon"
624
+ data-test-id="textBoxIcon"
625
+ maxlength="250"
626
+ readonly=""
627
+ type="text"
628
+ value=""
629
+ />
630
+ </div>
631
+ <div
632
+ class="iconContainer shrinkOff"
633
+ data-id="boxComponent"
634
+ data-selector-id="box"
635
+ data-test-id="boxComponent"
636
+ >
637
+ <div
638
+ class="flex cover rowdir"
639
+ data-id="containerComponent"
640
+ data-selector-id="container"
641
+ data-test-id="containerComponent"
642
+ />
643
+ </div>
644
+ <div
645
+ class="line borderColor_default "
646
+ />
647
+ </div>
648
+ </DocumentFragment>
649
+ `;
650
+
651
+ exports[`TextBoxIcon component Should be render needReadOnlyStyle is false 1`] = `
652
+ <DocumentFragment>
653
+ <div
654
+ class="container effect flex rowdir"
655
+ data-id="containerComponent"
656
+ data-selector-id="textBoxIcon"
657
+ data-test-id="containerComponent"
658
+ >
659
+ <div
660
+ class="grow basis shrinkOff"
661
+ data-id="boxComponent"
662
+ data-selector-id="box"
663
+ data-test-id="boxComponent"
664
+ >
665
+ <input
666
+ class=" container medium default effect borderColor_default "
667
+ data-id="textBoxIcon"
668
+ data-selector-id="textBoxIcon"
669
+ data-test-id="textBoxIcon"
670
+ maxlength="250"
671
+ type="text"
672
+ value=""
673
+ />
674
+ </div>
675
+ <div
676
+ class="iconContainer shrinkOff"
677
+ data-id="boxComponent"
678
+ data-selector-id="box"
679
+ data-test-id="boxComponent"
680
+ >
681
+ <div
682
+ class="flex cover rowdir"
683
+ data-id="containerComponent"
684
+ data-selector-id="container"
685
+ data-test-id="containerComponent"
686
+ />
687
+ </div>
688
+ <div
689
+ class="line borderColor_default "
690
+ />
691
+ </div>
692
+ </DocumentFragment>
693
+ `;
694
+
695
+ exports[`TextBoxIcon component Should be render placeholder 1`] = `
696
+ <DocumentFragment>
697
+ <div
698
+ class="container effect flex rowdir"
699
+ data-id="containerComponent"
700
+ data-selector-id="textBoxIcon"
701
+ data-test-id="containerComponent"
702
+ >
703
+ <div
704
+ class="grow basis shrinkOff"
705
+ data-id="boxComponent"
706
+ data-selector-id="box"
707
+ data-test-id="boxComponent"
708
+ >
709
+ <input
710
+ class=" container medium default effect borderColor_default "
711
+ data-id="textBoxIcon"
712
+ data-selector-id="textBoxIcon"
713
+ data-test-id="textBoxIcon"
714
+ maxlength="250"
715
+ placeholder="TextBoxIconPlaceHolder"
716
+ type="text"
717
+ value=""
718
+ />
719
+ </div>
720
+ <div
721
+ class="iconContainer shrinkOff"
722
+ data-id="boxComponent"
723
+ data-selector-id="box"
724
+ data-test-id="boxComponent"
725
+ >
726
+ <div
727
+ class="flex cover rowdir"
728
+ data-id="containerComponent"
729
+ data-selector-id="container"
730
+ data-test-id="containerComponent"
731
+ />
732
+ </div>
733
+ <div
734
+ class="line borderColor_default "
735
+ />
736
+ </div>
737
+ </DocumentFragment>
738
+ `;
739
+
740
+ exports[`TextBoxIcon component Should be render showClearIcon is true 1`] = `
741
+ <DocumentFragment>
742
+ <div
743
+ class="container effect flex rowdir"
744
+ data-id="containerComponent"
745
+ data-selector-id="textBoxIcon"
746
+ data-test-id="containerComponent"
747
+ >
748
+ <div
749
+ class="grow basis shrinkOff"
750
+ data-id="boxComponent"
751
+ data-selector-id="box"
752
+ data-test-id="boxComponent"
753
+ >
754
+ <input
755
+ class=" container medium default effect borderColor_default "
756
+ data-id="textBoxIcon"
757
+ data-selector-id="textBoxIcon"
758
+ data-test-id="textBoxIcon"
759
+ maxlength="250"
760
+ type="text"
761
+ value=""
762
+ />
763
+ </div>
764
+ <div
765
+ class="iconContainer shrinkOff"
766
+ data-id="boxComponent"
767
+ data-selector-id="box"
768
+ data-test-id="boxComponent"
769
+ >
770
+ <div
771
+ class="flex cover rowdir"
772
+ data-id="containerComponent"
773
+ data-selector-id="container"
774
+ data-test-id="containerComponent"
775
+ >
776
+ <button
777
+ class="buttonReset icon shrinkOff"
778
+ data-id="textBoxIcon_ClearIcon"
779
+ data-selector-id="box"
780
+ data-test-id="textBoxIcon_ClearIcon"
781
+ data-title="Clear"
782
+ >
783
+ <div
784
+ aria-hidden="true"
785
+ class="flex cover coldir both"
786
+ data-id="containerComponent"
787
+ data-selector-id="container"
788
+ data-test-id="containerComponent"
789
+ >
790
+ <i
791
+ aria-hidden="true"
792
+ class="zd_font_icons basic icon-delete rtl "
793
+ data-id="fontIcon"
794
+ data-selector-id="fontIcon"
795
+ data-test-id="fontIcon"
796
+ style="--zd-iconfont-size: var(--zd_font_size14);"
797
+ />
798
+ </div>
799
+ </button>
800
+ </div>
801
+ </div>
802
+ <div
803
+ class="line borderColor_default "
804
+ />
805
+ </div>
806
+ </DocumentFragment>
807
+ `;
808
+
809
+ exports[`TextBoxIcon component Should be render title 1`] = `
810
+ <DocumentFragment>
811
+ <div
812
+ class="container disabled flex rowdir"
813
+ data-id="containerComponent"
814
+ data-selector-id="textBoxIcon"
815
+ data-test-id="containerComponent"
816
+ data-title="TextBoxIconTitle"
817
+ >
818
+ <div
819
+ class="grow basis shrinkOff"
820
+ data-id="boxComponent"
821
+ data-selector-id="box"
822
+ data-test-id="boxComponent"
823
+ >
824
+ <input
825
+ class=" container medium default effect borderColor_default "
826
+ data-id="textBoxIcon"
827
+ data-selector-id="textBoxIcon"
828
+ data-test-id="textBoxIcon"
829
+ disabled=""
830
+ maxlength="250"
831
+ type="text"
832
+ value=""
833
+ />
834
+ </div>
835
+ <div
836
+ class="iconContainer shrinkOff"
837
+ data-id="boxComponent"
838
+ data-selector-id="box"
839
+ data-test-id="boxComponent"
840
+ >
841
+ <div
842
+ class="flex cover rowdir"
843
+ data-id="containerComponent"
844
+ data-selector-id="container"
845
+ data-test-id="containerComponent"
846
+ />
847
+ </div>
848
+ <div
849
+ class="line borderColor_default "
850
+ />
851
+ </div>
852
+ </DocumentFragment>
853
+ `;
854
+
855
+ exports[`TextBoxIcon component Should be render value is number 1`] = `
856
+ <DocumentFragment>
857
+ <div
858
+ class="container effect flex rowdir"
859
+ data-id="containerComponent"
860
+ data-selector-id="textBoxIcon"
861
+ data-test-id="containerComponent"
862
+ >
863
+ <div
864
+ class="grow basis shrinkOff"
865
+ data-id="boxComponent"
866
+ data-selector-id="box"
867
+ data-test-id="boxComponent"
868
+ >
869
+ <input
870
+ class=" container medium default effect borderColor_default "
871
+ data-id="textBoxIcon"
872
+ data-selector-id="textBoxIcon"
873
+ data-test-id="textBoxIcon"
874
+ maxlength="250"
875
+ type="text"
876
+ value="10"
877
+ />
878
+ </div>
879
+ <div
880
+ class="iconContainer shrinkOff"
881
+ data-id="boxComponent"
882
+ data-selector-id="box"
883
+ data-test-id="boxComponent"
884
+ >
885
+ <div
886
+ class="flex cover rowdir"
887
+ data-id="containerComponent"
888
+ data-selector-id="container"
889
+ data-test-id="containerComponent"
890
+ />
891
+ </div>
892
+ <div
893
+ class="line borderColor_default "
894
+ />
895
+ </div>
896
+ </DocumentFragment>
897
+ `;
898
+
899
+ exports[`TextBoxIcon component Should be render value is string and length greater than 1 1`] = `
900
+ <DocumentFragment>
901
+ <div
902
+ class="container effect flex rowdir"
903
+ data-id="containerComponent"
904
+ data-selector-id="textBoxIcon"
905
+ data-test-id="containerComponent"
906
+ >
907
+ <div
908
+ class="grow basis shrinkOff"
909
+ data-id="boxComponent"
910
+ data-selector-id="box"
911
+ data-test-id="boxComponent"
912
+ >
913
+ <input
914
+ class=" container medium default effect borderColor_default "
915
+ data-id="textBoxIcon"
916
+ data-selector-id="textBoxIcon"
917
+ data-test-id="textBoxIcon"
918
+ maxlength="250"
919
+ type="text"
920
+ value="Text"
921
+ />
922
+ </div>
923
+ <div
924
+ class="iconContainer shrinkOff"
925
+ data-id="boxComponent"
926
+ data-selector-id="box"
927
+ data-test-id="boxComponent"
928
+ >
929
+ <div
930
+ class="flex cover rowdir"
931
+ data-id="containerComponent"
932
+ data-selector-id="container"
933
+ data-test-id="containerComponent"
934
+ >
935
+ <button
936
+ class="buttonReset icon shrinkOff"
937
+ data-id="textBoxIcon_ClearIcon"
938
+ data-selector-id="box"
939
+ data-test-id="textBoxIcon_ClearIcon"
940
+ data-title="Clear"
941
+ >
942
+ <div
943
+ aria-hidden="true"
944
+ class="flex cover coldir both"
945
+ data-id="containerComponent"
946
+ data-selector-id="container"
947
+ data-test-id="containerComponent"
948
+ >
949
+ <i
950
+ aria-hidden="true"
951
+ class="zd_font_icons basic icon-delete rtl "
952
+ data-id="fontIcon"
953
+ data-selector-id="fontIcon"
954
+ data-test-id="fontIcon"
955
+ style="--zd-iconfont-size: var(--zd_font_size14);"
956
+ />
957
+ </div>
958
+ </button>
959
+ </div>
960
+ </div>
961
+ <div
962
+ class="line borderColor_default "
963
+ />
964
+ </div>
965
+ </DocumentFragment>
966
+ `;
967
+
968
+ exports[`TextBoxIcon component Should be render value is string and length less than 1 1`] = `
969
+ <DocumentFragment>
970
+ <div
971
+ class="container effect flex rowdir"
972
+ data-id="containerComponent"
973
+ data-selector-id="textBoxIcon"
974
+ data-test-id="containerComponent"
975
+ >
976
+ <div
977
+ class="grow basis shrinkOff"
978
+ data-id="boxComponent"
979
+ data-selector-id="box"
980
+ data-test-id="boxComponent"
981
+ >
982
+ <input
983
+ class=" container medium default effect borderColor_default "
984
+ data-id="textBoxIcon"
985
+ data-selector-id="textBoxIcon"
986
+ data-test-id="textBoxIcon"
987
+ maxlength="250"
988
+ type="text"
989
+ value="0"
990
+ />
991
+ </div>
992
+ <div
993
+ class="iconContainer shrinkOff"
994
+ data-id="boxComponent"
995
+ data-selector-id="box"
996
+ data-test-id="boxComponent"
997
+ >
998
+ <div
999
+ class="flex cover rowdir"
1000
+ data-id="containerComponent"
1001
+ data-selector-id="container"
1002
+ data-test-id="containerComponent"
1003
+ />
1004
+ </div>
1005
+ <div
1006
+ class="line borderColor_default "
1007
+ />
1008
+ </div>
1009
+ </DocumentFragment>
1010
+ `;
1011
+
1012
+ exports[`TextBoxIcon component Should be render with the basic set of default props 1`] = `
1013
+ <DocumentFragment>
1014
+ <div
1015
+ class="container effect flex rowdir"
1016
+ data-id="containerComponent"
1017
+ data-selector-id="textBoxIcon"
1018
+ data-test-id="containerComponent"
1019
+ >
1020
+ <div
1021
+ class="grow basis shrinkOff"
1022
+ data-id="boxComponent"
1023
+ data-selector-id="box"
1024
+ data-test-id="boxComponent"
1025
+ >
1026
+ <input
1027
+ class=" container medium default effect borderColor_default "
1028
+ data-id="textBoxIcon"
1029
+ data-selector-id="textBoxIcon"
1030
+ data-test-id="textBoxIcon"
1031
+ maxlength="250"
1032
+ type="text"
1033
+ value=""
1034
+ />
1035
+ </div>
1036
+ <div
1037
+ class="iconContainer shrinkOff"
1038
+ data-id="boxComponent"
1039
+ data-selector-id="box"
1040
+ data-test-id="boxComponent"
1041
+ >
1042
+ <div
1043
+ class="flex cover rowdir"
1044
+ data-id="containerComponent"
1045
+ data-selector-id="container"
1046
+ data-test-id="containerComponent"
1047
+ />
1048
+ </div>
1049
+ <div
1050
+ class="line borderColor_default "
1051
+ />
1052
+ </div>
1053
+ </DocumentFragment>
1054
+ `;
1055
+
1056
+ exports[`TextBoxIcon component Should render Varient - default 1`] = `
1057
+ <DocumentFragment>
1058
+ <div
1059
+ class="container effect flex rowdir"
1060
+ data-id="containerComponent"
1061
+ data-selector-id="textBoxIcon"
1062
+ data-test-id="containerComponent"
1063
+ >
1064
+ <div
1065
+ class="grow basis shrinkOff"
1066
+ data-id="boxComponent"
1067
+ data-selector-id="box"
1068
+ data-test-id="boxComponent"
1069
+ >
1070
+ <input
1071
+ class=" container medium default effect borderColor_default "
1072
+ data-id="textBoxIcon"
1073
+ data-selector-id="textBoxIcon"
1074
+ data-test-id="textBoxIcon"
1075
+ maxlength="250"
1076
+ type="text"
1077
+ value=""
1078
+ />
1079
+ </div>
1080
+ <div
1081
+ class="iconContainer shrinkOff"
1082
+ data-id="boxComponent"
1083
+ data-selector-id="box"
1084
+ data-test-id="boxComponent"
1085
+ >
1086
+ <div
1087
+ class="flex cover rowdir"
1088
+ data-id="containerComponent"
1089
+ data-selector-id="container"
1090
+ data-test-id="containerComponent"
1091
+ />
1092
+ </div>
1093
+ <div
1094
+ class="line borderColor_default "
1095
+ />
1096
+ </div>
1097
+ </DocumentFragment>
1098
+ `;
1099
+
1100
+ exports[`TextBoxIcon component Should render Varient - primary 1`] = `
1101
+ <DocumentFragment>
1102
+ <div
1103
+ class="container effect flex rowdir"
1104
+ data-id="containerComponent"
1105
+ data-selector-id="textBoxIcon"
1106
+ data-test-id="containerComponent"
1107
+ >
1108
+ <div
1109
+ class="grow basis shrinkOff"
1110
+ data-id="boxComponent"
1111
+ data-selector-id="box"
1112
+ data-test-id="boxComponent"
1113
+ >
1114
+ <input
1115
+ class=" container medium primary effect borderColor_default "
1116
+ data-id="textBoxIcon"
1117
+ data-selector-id="textBoxIcon"
1118
+ data-test-id="textBoxIcon"
1119
+ maxlength="250"
1120
+ type="text"
1121
+ value=""
1122
+ />
1123
+ </div>
1124
+ <div
1125
+ class="iconContainer shrinkOff"
1126
+ data-id="boxComponent"
1127
+ data-selector-id="box"
1128
+ data-test-id="boxComponent"
1129
+ >
1130
+ <div
1131
+ class="flex cover rowdir"
1132
+ data-id="containerComponent"
1133
+ data-selector-id="container"
1134
+ data-test-id="containerComponent"
1135
+ />
1136
+ </div>
1137
+ <div
1138
+ class="line borderColor_default "
1139
+ />
1140
+ </div>
1141
+ </DocumentFragment>
1142
+ `;
1143
+
1144
+ exports[`TextBoxIcon component Should render Varient - secondary 1`] = `
1145
+ <DocumentFragment>
1146
+ <div
1147
+ class="container effect flex rowdir"
1148
+ data-id="containerComponent"
1149
+ data-selector-id="textBoxIcon"
1150
+ data-test-id="containerComponent"
1151
+ >
1152
+ <div
1153
+ class="grow basis shrinkOff"
1154
+ data-id="boxComponent"
1155
+ data-selector-id="box"
1156
+ data-test-id="boxComponent"
1157
+ >
1158
+ <input
1159
+ class=" container medium secondary effect borderColor_default "
1160
+ data-id="textBoxIcon"
1161
+ data-selector-id="textBoxIcon"
1162
+ data-test-id="textBoxIcon"
1163
+ maxlength="250"
1164
+ type="text"
1165
+ value=""
1166
+ />
1167
+ </div>
1168
+ <div
1169
+ class="iconContainer shrinkOff"
1170
+ data-id="boxComponent"
1171
+ data-selector-id="box"
1172
+ data-test-id="boxComponent"
1173
+ >
1174
+ <div
1175
+ class="flex cover rowdir"
1176
+ data-id="containerComponent"
1177
+ data-selector-id="container"
1178
+ data-test-id="containerComponent"
1179
+ />
1180
+ </div>
1181
+ <div
1182
+ class="line borderColor_default "
1183
+ />
1184
+ </div>
1185
+ </DocumentFragment>
1186
+ `;
1187
+
1188
+ exports[`TextBoxIcon component Should render borderColor - default 1`] = `
1189
+ <DocumentFragment>
1190
+ <div
1191
+ class="container effect flex rowdir"
1192
+ data-id="containerComponent"
1193
+ data-selector-id="textBoxIcon"
1194
+ data-test-id="containerComponent"
1195
+ >
1196
+ <div
1197
+ class="grow basis shrinkOff"
1198
+ data-id="boxComponent"
1199
+ data-selector-id="box"
1200
+ data-test-id="boxComponent"
1201
+ >
1202
+ <input
1203
+ class=" container medium default effect borderColor_default "
1204
+ data-id="textBoxIcon"
1205
+ data-selector-id="textBoxIcon"
1206
+ data-test-id="textBoxIcon"
1207
+ maxlength="250"
1208
+ type="text"
1209
+ value=""
1210
+ />
1211
+ </div>
1212
+ <div
1213
+ class="iconContainer shrinkOff"
1214
+ data-id="boxComponent"
1215
+ data-selector-id="box"
1216
+ data-test-id="boxComponent"
1217
+ >
1218
+ <div
1219
+ class="flex cover rowdir"
1220
+ data-id="containerComponent"
1221
+ data-selector-id="container"
1222
+ data-test-id="containerComponent"
1223
+ />
1224
+ </div>
1225
+ <div
1226
+ class="line borderColor_default "
1227
+ />
1228
+ </div>
1229
+ </DocumentFragment>
1230
+ `;
1231
+
1232
+ exports[`TextBoxIcon component Should render borderColor - error 1`] = `
1233
+ <DocumentFragment>
1234
+ <div
1235
+ class="container effect flex rowdir"
1236
+ data-id="containerComponent"
1237
+ data-selector-id="textBoxIcon"
1238
+ data-test-id="containerComponent"
1239
+ >
1240
+ <div
1241
+ class="grow basis shrinkOff"
1242
+ data-id="boxComponent"
1243
+ data-selector-id="box"
1244
+ data-test-id="boxComponent"
1245
+ >
1246
+ <input
1247
+ class=" container medium default effect undefined "
1248
+ data-id="textBoxIcon"
1249
+ data-selector-id="textBoxIcon"
1250
+ data-test-id="textBoxIcon"
1251
+ maxlength="250"
1252
+ type="text"
1253
+ value=""
1254
+ />
1255
+ </div>
1256
+ <div
1257
+ class="iconContainer shrinkOff"
1258
+ data-id="boxComponent"
1259
+ data-selector-id="box"
1260
+ data-test-id="boxComponent"
1261
+ >
1262
+ <div
1263
+ class="flex cover rowdir"
1264
+ data-id="containerComponent"
1265
+ data-selector-id="container"
1266
+ data-test-id="containerComponent"
1267
+ />
1268
+ </div>
1269
+ <div
1270
+ class="line borderColor_error "
1271
+ />
1272
+ </div>
1273
+ </DocumentFragment>
1274
+ `;
1275
+
1276
+ exports[`TextBoxIcon component Should render borderColor - transparent 1`] = `
1277
+ <DocumentFragment>
1278
+ <div
1279
+ class="container effect flex rowdir"
1280
+ data-id="containerComponent"
1281
+ data-selector-id="textBoxIcon"
1282
+ data-test-id="containerComponent"
1283
+ >
1284
+ <div
1285
+ class="grow basis shrinkOff"
1286
+ data-id="boxComponent"
1287
+ data-selector-id="box"
1288
+ data-test-id="boxComponent"
1289
+ >
1290
+ <input
1291
+ class=" container medium default effect borderColor_transparent "
1292
+ data-id="textBoxIcon"
1293
+ data-selector-id="textBoxIcon"
1294
+ data-test-id="textBoxIcon"
1295
+ maxlength="250"
1296
+ type="text"
1297
+ value=""
1298
+ />
1299
+ </div>
1300
+ <div
1301
+ class="iconContainer shrinkOff"
1302
+ data-id="boxComponent"
1303
+ data-selector-id="box"
1304
+ data-test-id="boxComponent"
1305
+ >
1306
+ <div
1307
+ class="flex cover rowdir"
1308
+ data-id="containerComponent"
1309
+ data-selector-id="container"
1310
+ data-test-id="containerComponent"
1311
+ />
1312
+ </div>
1313
+ <div
1314
+ class="line borderColor_transparent "
1315
+ />
1316
+ </div>
1317
+ </DocumentFragment>
1318
+ `;
1319
+
1320
+ exports[`TextBoxIcon component Should render size - medium 1`] = `
1321
+ <DocumentFragment>
1322
+ <div
1323
+ class="container effect flex rowdir"
1324
+ data-id="containerComponent"
1325
+ data-selector-id="textBoxIcon"
1326
+ data-test-id="containerComponent"
1327
+ >
1328
+ <div
1329
+ class="grow basis shrinkOff"
1330
+ data-id="boxComponent"
1331
+ data-selector-id="box"
1332
+ data-test-id="boxComponent"
1333
+ >
1334
+ <input
1335
+ class=" container medium default effect borderColor_default "
1336
+ data-id="textBoxIcon"
1337
+ data-selector-id="textBoxIcon"
1338
+ data-test-id="textBoxIcon"
1339
+ maxlength="250"
1340
+ type="text"
1341
+ value=""
1342
+ />
1343
+ </div>
1344
+ <div
1345
+ class="iconContainer shrinkOff"
1346
+ data-id="boxComponent"
1347
+ data-selector-id="box"
1348
+ data-test-id="boxComponent"
1349
+ >
1350
+ <div
1351
+ class="flex cover rowdir"
1352
+ data-id="containerComponent"
1353
+ data-selector-id="container"
1354
+ data-test-id="containerComponent"
1355
+ />
1356
+ </div>
1357
+ <div
1358
+ class="line borderColor_default "
1359
+ />
1360
+ </div>
1361
+ </DocumentFragment>
1362
+ `;
1363
+
1364
+ exports[`TextBoxIcon component Should render size - small 1`] = `
1365
+ <DocumentFragment>
1366
+ <div
1367
+ class="container effect flex rowdir"
1368
+ data-id="containerComponent"
1369
+ data-selector-id="textBoxIcon"
1370
+ data-test-id="containerComponent"
1371
+ >
1372
+ <div
1373
+ class="grow basis shrinkOff"
1374
+ data-id="boxComponent"
1375
+ data-selector-id="box"
1376
+ data-test-id="boxComponent"
1377
+ >
1378
+ <input
1379
+ class=" container small default effect borderColor_default "
1380
+ data-id="textBoxIcon"
1381
+ data-selector-id="textBoxIcon"
1382
+ data-test-id="textBoxIcon"
1383
+ maxlength="250"
1384
+ type="text"
1385
+ value=""
1386
+ />
1387
+ </div>
1388
+ <div
1389
+ class="iconContainer shrinkOff"
1390
+ data-id="boxComponent"
1391
+ data-selector-id="box"
1392
+ data-test-id="boxComponent"
1393
+ >
1394
+ <div
1395
+ class="flex cover rowdir"
1396
+ data-id="containerComponent"
1397
+ data-selector-id="container"
1398
+ data-test-id="containerComponent"
1399
+ />
1400
+ </div>
1401
+ <div
1402
+ class="line borderColor_default "
1403
+ />
1404
+ </div>
1405
+ </DocumentFragment>
1406
+ `;
1407
+
1408
+ exports[`TextBoxIcon component Should render size - xmedium 1`] = `
1409
+ <DocumentFragment>
1410
+ <div
1411
+ class="container effect flex rowdir"
1412
+ data-id="containerComponent"
1413
+ data-selector-id="textBoxIcon"
1414
+ data-test-id="containerComponent"
1415
+ >
1416
+ <div
1417
+ class="grow basis shrinkOff"
1418
+ data-id="boxComponent"
1419
+ data-selector-id="box"
1420
+ data-test-id="boxComponent"
1421
+ >
1422
+ <input
1423
+ class=" container xmedium default effect borderColor_default "
1424
+ data-id="textBoxIcon"
1425
+ data-selector-id="textBoxIcon"
1426
+ data-test-id="textBoxIcon"
1427
+ maxlength="250"
1428
+ type="text"
1429
+ value=""
1430
+ />
1431
+ </div>
1432
+ <div
1433
+ class="iconContainer shrinkOff"
1434
+ data-id="boxComponent"
1435
+ data-selector-id="box"
1436
+ data-test-id="boxComponent"
1437
+ >
1438
+ <div
1439
+ class="flex cover rowdir"
1440
+ data-id="containerComponent"
1441
+ data-selector-id="container"
1442
+ data-test-id="containerComponent"
1443
+ />
1444
+ </div>
1445
+ <div
1446
+ class="line borderColor_default "
1447
+ />
1448
+ </div>
1449
+ </DocumentFragment>
1450
+ `;
1451
+
1452
+ exports[`TextBoxIcon component Should render size - xsmall 1`] = `
1453
+ <DocumentFragment>
1454
+ <div
1455
+ class="container effect flex rowdir"
1456
+ data-id="containerComponent"
1457
+ data-selector-id="textBoxIcon"
1458
+ data-test-id="containerComponent"
1459
+ >
1460
+ <div
1461
+ class="grow basis shrinkOff"
1462
+ data-id="boxComponent"
1463
+ data-selector-id="box"
1464
+ data-test-id="boxComponent"
1465
+ >
1466
+ <input
1467
+ class=" container xsmall default effect borderColor_default "
1468
+ data-id="textBoxIcon"
1469
+ data-selector-id="textBoxIcon"
1470
+ data-test-id="textBoxIcon"
1471
+ maxlength="250"
1472
+ type="text"
1473
+ value=""
1474
+ />
1475
+ </div>
1476
+ <div
1477
+ class="iconContainer shrinkOff"
1478
+ data-id="boxComponent"
1479
+ data-selector-id="box"
1480
+ data-test-id="boxComponent"
1481
+ >
1482
+ <div
1483
+ class="flex cover rowdir"
1484
+ data-id="containerComponent"
1485
+ data-selector-id="container"
1486
+ data-test-id="containerComponent"
1487
+ />
1488
+ </div>
1489
+ <div
1490
+ class="line borderColor_default "
1491
+ />
1492
+ </div>
1493
+ </DocumentFragment>
1494
+ `;
1495
+
1496
+ exports[`TextBoxIcon component Should render type - number 1`] = `
1497
+ <DocumentFragment>
1498
+ <div
1499
+ class="container effect flex rowdir"
1500
+ data-id="containerComponent"
1501
+ data-selector-id="textBoxIcon"
1502
+ data-test-id="containerComponent"
1503
+ >
1504
+ <div
1505
+ class="grow basis shrinkOff"
1506
+ data-id="boxComponent"
1507
+ data-selector-id="box"
1508
+ data-test-id="boxComponent"
1509
+ >
1510
+ <input
1511
+ class=" container medium default effect borderColor_default "
1512
+ data-id="textBoxIcon"
1513
+ data-selector-id="textBoxIcon"
1514
+ data-test-id="textBoxIcon"
1515
+ maxlength="250"
1516
+ type="number"
1517
+ value=""
1518
+ />
1519
+ </div>
1520
+ <div
1521
+ class="iconContainer shrinkOff"
1522
+ data-id="boxComponent"
1523
+ data-selector-id="box"
1524
+ data-test-id="boxComponent"
1525
+ >
1526
+ <div
1527
+ class="flex cover rowdir"
1528
+ data-id="containerComponent"
1529
+ data-selector-id="container"
1530
+ data-test-id="containerComponent"
1531
+ />
1532
+ </div>
1533
+ <div
1534
+ class="line borderColor_default "
1535
+ />
1536
+ </div>
1537
+ </DocumentFragment>
1538
+ `;
1539
+
1540
+ exports[`TextBoxIcon component Should render type - password 1`] = `
1541
+ <DocumentFragment>
1542
+ <div
1543
+ class="container effect flex rowdir"
1544
+ data-id="containerComponent"
1545
+ data-selector-id="textBoxIcon"
1546
+ data-test-id="containerComponent"
1547
+ >
1548
+ <div
1549
+ class="grow basis shrinkOff"
1550
+ data-id="boxComponent"
1551
+ data-selector-id="box"
1552
+ data-test-id="boxComponent"
1553
+ >
1554
+ <input
1555
+ class=" container medium default effect borderColor_default "
1556
+ data-id="textBoxIcon"
1557
+ data-selector-id="textBoxIcon"
1558
+ data-test-id="textBoxIcon"
1559
+ maxlength="250"
1560
+ type="password"
1561
+ value=""
1562
+ />
1563
+ </div>
1564
+ <div
1565
+ class="iconContainer shrinkOff"
1566
+ data-id="boxComponent"
1567
+ data-selector-id="box"
1568
+ data-test-id="boxComponent"
1569
+ >
1570
+ <div
1571
+ class="flex cover rowdir"
1572
+ data-id="containerComponent"
1573
+ data-selector-id="container"
1574
+ data-test-id="containerComponent"
1575
+ />
1576
+ </div>
1577
+ <div
1578
+ class="line borderColor_default "
1579
+ />
1580
+ </div>
1581
+ </DocumentFragment>
1582
+ `;
1583
+
1584
+ exports[`TextBoxIcon component Should render type - text 1`] = `
1585
+ <DocumentFragment>
1586
+ <div
1587
+ class="container effect flex rowdir"
1588
+ data-id="containerComponent"
1589
+ data-selector-id="textBoxIcon"
1590
+ data-test-id="containerComponent"
1591
+ >
1592
+ <div
1593
+ class="grow basis shrinkOff"
1594
+ data-id="boxComponent"
1595
+ data-selector-id="box"
1596
+ data-test-id="boxComponent"
1597
+ >
1598
+ <input
1599
+ class=" container medium default effect borderColor_default "
1600
+ data-id="textBoxIcon"
1601
+ data-selector-id="textBoxIcon"
1602
+ data-test-id="textBoxIcon"
1603
+ maxlength="250"
1604
+ type="text"
1605
+ value=""
1606
+ />
1607
+ </div>
1608
+ <div
1609
+ class="iconContainer shrinkOff"
1610
+ data-id="boxComponent"
1611
+ data-selector-id="box"
1612
+ data-test-id="boxComponent"
1613
+ >
1614
+ <div
1615
+ class="flex cover rowdir"
1616
+ data-id="containerComponent"
1617
+ data-selector-id="container"
1618
+ data-test-id="containerComponent"
1619
+ />
1620
+ </div>
1621
+ <div
1622
+ class="line borderColor_default "
1623
+ />
1624
+ </div>
1625
+ </DocumentFragment>
1626
+ `;
1627
+
1628
+ exports[`TextBoxIcon component rendering the Custom Props 1`] = `
1629
+ <DocumentFragment>
1630
+ <div
1631
+ class="container effect flex rowdir"
1632
+ data-id="containerComponent"
1633
+ data-selector-id="textBoxIcon"
1634
+ data-test-id="containerComponent"
1635
+ >
1636
+ <div
1637
+ class="grow basis shrinkOff"
1638
+ data-id="boxComponent"
1639
+ data-selector-id="box"
1640
+ data-test-id="boxComponent"
1641
+ >
1642
+ <input
1643
+ class=" container medium default effect borderColor_default "
1644
+ data-id="textBoxIcon"
1645
+ data-selector-id="textBoxIcon"
1646
+ data-test-id="textBoxIcon"
1647
+ isclickable="false"
1648
+ maxlength="250"
1649
+ type="text"
1650
+ value=""
1651
+ />
1652
+ </div>
1653
+ <div
1654
+ class="iconContainer shrinkOff"
1655
+ data-id="boxComponent"
1656
+ data-selector-id="box"
1657
+ data-test-id="boxComponent"
1658
+ >
1659
+ <div
1660
+ class="flex cover rowdir"
1661
+ data-id="containerComponent"
1662
+ data-selector-id="container"
1663
+ data-test-id="containerComponent"
1664
+ />
1665
+ </div>
1666
+ <div
1667
+ class="line borderColor_default "
1668
+ />
1669
+ </div>
1670
+ </DocumentFragment>
1671
+ `;
1672
+
1673
+ exports[`TextBoxIcon component rendering the Custom class 1`] = `
1674
+ <DocumentFragment>
1675
+ <div
1676
+ class="container effect customTBoxWrapTextBoxIcon flex rowdir"
1677
+ data-id="containerComponent"
1678
+ data-selector-id="textBoxIcon"
1679
+ data-test-id="containerComponent"
1680
+ >
1681
+ <div
1682
+ class="grow basis shrinkOff"
1683
+ data-id="boxComponent"
1684
+ data-selector-id="box"
1685
+ data-test-id="boxComponent"
1686
+ >
1687
+ <input
1688
+ class=" container medium default effect borderColor_default customTextBoxTextBoxIcon"
1689
+ data-id="textBoxIcon"
1690
+ data-selector-id="textBoxIcon"
1691
+ data-test-id="textBoxIcon"
1692
+ maxlength="250"
1693
+ type="text"
1694
+ value=""
1695
+ />
1696
+ </div>
1697
+ <div
1698
+ class="iconContainer customTBoxIconTextBox shrinkOff"
1699
+ data-id="boxComponent"
1700
+ data-selector-id="box"
1701
+ data-test-id="boxComponent"
1702
+ >
1703
+ <div
1704
+ class="flex cover rowdir"
1705
+ data-id="containerComponent"
1706
+ data-selector-id="container"
1707
+ data-test-id="containerComponent"
1708
+ />
1709
+ </div>
1710
+ <div
1711
+ class="line borderColor_default customTBoxLineTextBox"
1712
+ />
1713
+ </div>
1714
+ </DocumentFragment>
1715
+ `;
1716
+
1717
+ exports[`TextBoxIcon component rendering the i18n value 1`] = `
1718
+ <DocumentFragment>
1719
+ <div
1720
+ class="container effect flex rowdir"
1721
+ data-id="containerComponent"
1722
+ data-selector-id="textBoxIcon"
1723
+ data-test-id="containerComponent"
1724
+ >
1725
+ <div
1726
+ class="grow basis shrinkOff"
1727
+ data-id="boxComponent"
1728
+ data-selector-id="box"
1729
+ data-test-id="boxComponent"
1730
+ >
1731
+ <input
1732
+ class=" container medium default effect borderColor_default "
1733
+ data-id="textBoxIcon"
1734
+ data-selector-id="textBoxIcon"
1735
+ data-test-id="textBoxIcon"
1736
+ maxlength="250"
1737
+ type="text"
1738
+ value="Text"
1739
+ />
1740
+ </div>
1741
+ <div
1742
+ class="iconContainer shrinkOff"
1743
+ data-id="boxComponent"
1744
+ data-selector-id="box"
1745
+ data-test-id="boxComponent"
1746
+ >
1747
+ <div
1748
+ class="flex cover rowdir"
1749
+ data-id="containerComponent"
1750
+ data-selector-id="container"
1751
+ data-test-id="containerComponent"
1752
+ >
1753
+ <button
1754
+ class="buttonReset icon shrinkOff"
1755
+ data-id="textBoxIcon_ClearIcon"
1756
+ data-selector-id="box"
1757
+ data-test-id="textBoxIcon_ClearIcon"
1758
+ data-title="TextBoxIcon Text"
1759
+ >
1760
+ <div
1761
+ aria-hidden="true"
1762
+ class="flex cover coldir both"
1763
+ data-id="containerComponent"
1764
+ data-selector-id="container"
1765
+ data-test-id="containerComponent"
1766
+ >
1767
+ <i
1768
+ aria-hidden="true"
1769
+ class="zd_font_icons basic icon-delete rtl "
1770
+ data-id="fontIcon"
1771
+ data-selector-id="fontIcon"
1772
+ data-test-id="fontIcon"
1773
+ style="--zd-iconfont-size: var(--zd_font_size14);"
1774
+ />
1775
+ </div>
1776
+ </button>
1777
+ </div>
1778
+ </div>
1779
+ <div
1780
+ class="line borderColor_default "
1781
+ />
1782
+ </div>
1783
+ </DocumentFragment>
1784
+ `;