@zohodesk/dot 1.0.0-temp-187.4 → 1.0.0-temp-187.5

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.
@@ -1,5 +1,273 @@
1
1
  // Jest Snapshot v1, https://goo.gl/fbAQLP
2
2
 
3
+ exports[`RadioField rendering options with isBoxStyle 1`] = `
4
+ <DocumentFragment>
5
+ <div
6
+ class="container "
7
+ data-selector-id="radioField"
8
+ >
9
+ <div
10
+ class="fieldContainer radiosWrapper radioContainer"
11
+ >
12
+ <span
13
+ class=" radioWrap"
14
+ >
15
+ <div
16
+ aria-checked="false"
17
+ aria-readonly="false"
18
+ class="container pointer hoverEfffect radioBox hoverableRadioBox flex rowdir both"
19
+ data-id="1"
20
+ data-selector-id="container"
21
+ data-test-id="1"
22
+ role="radio"
23
+ tabindex="0"
24
+ >
25
+ <div
26
+ class="radio
27
+ hoverprimary medium filled centerPathprimary shrinkOff"
28
+ data-id="boxComponent"
29
+ data-selector-id="box"
30
+ data-test-id="boxComponent"
31
+ >
32
+ <input
33
+ id="0"
34
+ type="hidden"
35
+ value="1"
36
+ />
37
+ <label
38
+ class="radioLabel pointer"
39
+ >
40
+ <svg
41
+ viewBox="0 0 40 40"
42
+ xmlns="http://www.w3.org/2000/svg"
43
+ >
44
+ <circle
45
+ class="rdBox"
46
+ cx="20"
47
+ cy="20"
48
+ r="19"
49
+ />
50
+ </svg>
51
+ </label>
52
+ </div>
53
+ <div
54
+ class="text grow basis shrinkOff"
55
+ data-id="boxComponent"
56
+ data-selector-id="box"
57
+ data-test-id="boxComponent"
58
+ >
59
+ <label
60
+ class="label title medium default font_primary
61
+ dotted cursor
62
+ primaryLabel pointer "
63
+ data-id="Chennai_label"
64
+ data-selector-id="label"
65
+ data-test-id="Chennai_label"
66
+ data-title="Chennai"
67
+ >
68
+ Chennai
69
+ </label>
70
+ </div>
71
+ </div>
72
+ </span>
73
+ <span
74
+ class=" radioWrap"
75
+ >
76
+ <div
77
+ aria-checked="false"
78
+ aria-readonly="true"
79
+ class="container disabled radioBox flex rowdir both"
80
+ data-id="2"
81
+ data-selector-id="container"
82
+ data-test-id="2"
83
+ data-title="Disabled Option"
84
+ role="radio"
85
+ tabindex="-1"
86
+ >
87
+ <div
88
+ class="radio
89
+ medium filled centerPathprimary shrinkOff"
90
+ data-id="boxComponent"
91
+ data-selector-id="box"
92
+ data-test-id="boxComponent"
93
+ >
94
+ <input
95
+ id="1"
96
+ type="hidden"
97
+ value="2"
98
+ />
99
+ <label
100
+ class="radioLabel disabled"
101
+ >
102
+ <svg
103
+ viewBox="0 0 40 40"
104
+ xmlns="http://www.w3.org/2000/svg"
105
+ >
106
+ <circle
107
+ class="rdBox"
108
+ cx="20"
109
+ cy="20"
110
+ r="19"
111
+ />
112
+ </svg>
113
+ </label>
114
+ </div>
115
+ <div
116
+ class="text grow basis shrinkOff"
117
+ data-id="boxComponent"
118
+ data-selector-id="box"
119
+ data-test-id="boxComponent"
120
+ >
121
+ <label
122
+ class="label title medium default font_primary
123
+ dotted cursor
124
+ primaryLabel disabled "
125
+ data-id="Mumbai_label"
126
+ data-selector-id="label"
127
+ data-test-id="Mumbai_label"
128
+ data-title="Disabled Option"
129
+ >
130
+ Mumbai
131
+ </label>
132
+ </div>
133
+ </div>
134
+ </span>
135
+ <span
136
+ class=" radioWrap"
137
+ >
138
+ <div
139
+ aria-checked="false"
140
+ aria-readonly="false"
141
+ class="container pointer hoverEfffect radioBox hoverableRadioBox flex rowdir both"
142
+ data-id="3"
143
+ data-selector-id="container"
144
+ data-test-id="3"
145
+ role="radio"
146
+ tabindex="-1"
147
+ >
148
+ <div
149
+ class="radio
150
+ hoverprimary medium filled centerPathprimary shrinkOff"
151
+ data-id="boxComponent"
152
+ data-selector-id="box"
153
+ data-test-id="boxComponent"
154
+ >
155
+ <input
156
+ id="2"
157
+ type="hidden"
158
+ value="3"
159
+ />
160
+ <label
161
+ class="radioLabel pointer"
162
+ >
163
+ <svg
164
+ viewBox="0 0 40 40"
165
+ xmlns="http://www.w3.org/2000/svg"
166
+ >
167
+ <circle
168
+ class="rdBox"
169
+ cx="20"
170
+ cy="20"
171
+ r="19"
172
+ />
173
+ </svg>
174
+ </label>
175
+ </div>
176
+ <div
177
+ class="text grow basis shrinkOff"
178
+ data-id="boxComponent"
179
+ data-selector-id="box"
180
+ data-test-id="boxComponent"
181
+ >
182
+ <label
183
+ class="label title medium default font_primary
184
+ dotted cursor
185
+ primaryLabel pointer "
186
+ data-id="Delhi_label"
187
+ data-selector-id="label"
188
+ data-test-id="Delhi_label"
189
+ data-title="Delhi"
190
+ >
191
+ Delhi
192
+ </label>
193
+ </div>
194
+ <i
195
+ aria-hidden="true"
196
+ class="zd_font_icons basic icon-info infoIcon "
197
+ data-id="fontIcon"
198
+ data-selector-id="fontIcon"
199
+ data-test-id="fontIcon"
200
+ data-title="Capital of India"
201
+ style="--zd-iconfont-size: var(--zd_font_size16);"
202
+ />
203
+ </div>
204
+ </span>
205
+ <span
206
+ class=" radioWrap"
207
+ >
208
+ <div
209
+ aria-checked="false"
210
+ aria-readonly="false"
211
+ class="container pointer hoverEfffect radioBox hoverableRadioBox flex rowdir both"
212
+ data-id="4"
213
+ data-selector-id="container"
214
+ data-test-id="4"
215
+ role="radio"
216
+ tabindex="-1"
217
+ >
218
+ <div
219
+ class="radio
220
+ hoverprimary medium filled centerPathprimary shrinkOff"
221
+ data-id="boxComponent"
222
+ data-selector-id="box"
223
+ data-test-id="boxComponent"
224
+ >
225
+ <input
226
+ id="3"
227
+ type="hidden"
228
+ value="4"
229
+ />
230
+ <label
231
+ class="radioLabel pointer"
232
+ >
233
+ <svg
234
+ viewBox="0 0 40 40"
235
+ xmlns="http://www.w3.org/2000/svg"
236
+ >
237
+ <circle
238
+ class="rdBox"
239
+ cx="20"
240
+ cy="20"
241
+ r="19"
242
+ />
243
+ </svg>
244
+ </label>
245
+ </div>
246
+ <div
247
+ class="text grow basis shrinkOff"
248
+ data-id="boxComponent"
249
+ data-selector-id="box"
250
+ data-test-id="boxComponent"
251
+ >
252
+ <label
253
+ class="label title medium default font_primary
254
+ dotted cursor
255
+ primaryLabel pointer "
256
+ data-id="Kolkata_label"
257
+ data-selector-id="label"
258
+ data-test-id="Kolkata_label"
259
+ data-title="Kolkata"
260
+ >
261
+ Kolkata
262
+ </label>
263
+ </div>
264
+ </div>
265
+ </span>
266
+ </div>
267
+ </div>
268
+ </DocumentFragment>
269
+ `;
270
+
3
271
  exports[`RadioField rendering the defult props 1`] = `
4
272
  <DocumentFragment>
5
273
  <div
@@ -7,8 +275,276 @@ exports[`RadioField rendering the defult props 1`] = `
7
275
  data-selector-id="radioField"
8
276
  >
9
277
  <div
10
- class="fieldContainer radioContainer"
278
+ class="fieldContainer radioContainer"
11
279
  />
12
280
  </div>
13
281
  </DocumentFragment>
14
282
  `;
283
+
284
+ exports[`RadioField rendering with options 1`] = `
285
+ <DocumentFragment>
286
+ <div
287
+ class="container "
288
+ data-selector-id="radioField"
289
+ >
290
+ <div
291
+ class="fieldContainer radioContainer"
292
+ >
293
+ <span
294
+ class="radio radioWrap"
295
+ >
296
+ <div
297
+ aria-checked="false"
298
+ aria-readonly="false"
299
+ class="container pointer hoverEfffect flex rowdir both"
300
+ data-id="1"
301
+ data-selector-id="container"
302
+ data-test-id="1"
303
+ role="radio"
304
+ tabindex="0"
305
+ >
306
+ <div
307
+ class="radio
308
+ hoverprimary medium filled centerPathprimary shrinkOff"
309
+ data-id="boxComponent"
310
+ data-selector-id="box"
311
+ data-test-id="boxComponent"
312
+ >
313
+ <input
314
+ id="0"
315
+ type="hidden"
316
+ value="1"
317
+ />
318
+ <label
319
+ class="radioLabel pointer"
320
+ >
321
+ <svg
322
+ viewBox="0 0 40 40"
323
+ xmlns="http://www.w3.org/2000/svg"
324
+ >
325
+ <circle
326
+ class="rdBox"
327
+ cx="20"
328
+ cy="20"
329
+ r="19"
330
+ />
331
+ </svg>
332
+ </label>
333
+ </div>
334
+ <div
335
+ class="text grow basis shrinkOff"
336
+ data-id="boxComponent"
337
+ data-selector-id="box"
338
+ data-test-id="boxComponent"
339
+ >
340
+ <label
341
+ class="label title medium default font_primary
342
+ dotted cursor
343
+ primaryLabel pointer "
344
+ data-id="Chennai_label"
345
+ data-selector-id="label"
346
+ data-test-id="Chennai_label"
347
+ data-title="Chennai"
348
+ >
349
+ Chennai
350
+ </label>
351
+ </div>
352
+ </div>
353
+ </span>
354
+ <span
355
+ class="radio radioWrap"
356
+ >
357
+ <div
358
+ aria-checked="false"
359
+ aria-readonly="true"
360
+ class="container disabled flex rowdir both"
361
+ data-id="2"
362
+ data-selector-id="container"
363
+ data-test-id="2"
364
+ data-title="Disabled Option"
365
+ role="radio"
366
+ tabindex="-1"
367
+ >
368
+ <div
369
+ class="radio
370
+ medium filled centerPathprimary shrinkOff"
371
+ data-id="boxComponent"
372
+ data-selector-id="box"
373
+ data-test-id="boxComponent"
374
+ >
375
+ <input
376
+ id="1"
377
+ type="hidden"
378
+ value="2"
379
+ />
380
+ <label
381
+ class="radioLabel disabled"
382
+ >
383
+ <svg
384
+ viewBox="0 0 40 40"
385
+ xmlns="http://www.w3.org/2000/svg"
386
+ >
387
+ <circle
388
+ class="rdBox"
389
+ cx="20"
390
+ cy="20"
391
+ r="19"
392
+ />
393
+ </svg>
394
+ </label>
395
+ </div>
396
+ <div
397
+ class="text grow basis shrinkOff"
398
+ data-id="boxComponent"
399
+ data-selector-id="box"
400
+ data-test-id="boxComponent"
401
+ >
402
+ <label
403
+ class="label title medium default font_primary
404
+ dotted cursor
405
+ primaryLabel disabled "
406
+ data-id="Mumbai_label"
407
+ data-selector-id="label"
408
+ data-test-id="Mumbai_label"
409
+ data-title="Disabled Option"
410
+ >
411
+ Mumbai
412
+ </label>
413
+ </div>
414
+ </div>
415
+ </span>
416
+ <span
417
+ class="radio radioWrap"
418
+ >
419
+ <div
420
+ aria-checked="false"
421
+ aria-readonly="false"
422
+ class="container pointer hoverEfffect flex rowdir both"
423
+ data-id="3"
424
+ data-selector-id="container"
425
+ data-test-id="3"
426
+ role="radio"
427
+ tabindex="-1"
428
+ >
429
+ <div
430
+ class="radio
431
+ hoverprimary medium filled centerPathprimary shrinkOff"
432
+ data-id="boxComponent"
433
+ data-selector-id="box"
434
+ data-test-id="boxComponent"
435
+ >
436
+ <input
437
+ id="2"
438
+ type="hidden"
439
+ value="3"
440
+ />
441
+ <label
442
+ class="radioLabel pointer"
443
+ >
444
+ <svg
445
+ viewBox="0 0 40 40"
446
+ xmlns="http://www.w3.org/2000/svg"
447
+ >
448
+ <circle
449
+ class="rdBox"
450
+ cx="20"
451
+ cy="20"
452
+ r="19"
453
+ />
454
+ </svg>
455
+ </label>
456
+ </div>
457
+ <div
458
+ class="text grow basis shrinkOff"
459
+ data-id="boxComponent"
460
+ data-selector-id="box"
461
+ data-test-id="boxComponent"
462
+ >
463
+ <label
464
+ class="label title medium default font_primary
465
+ dotted cursor
466
+ primaryLabel pointer "
467
+ data-id="Delhi_label"
468
+ data-selector-id="label"
469
+ data-test-id="Delhi_label"
470
+ data-title="Delhi"
471
+ >
472
+ Delhi
473
+ </label>
474
+ </div>
475
+ <i
476
+ aria-hidden="true"
477
+ class="zd_font_icons basic icon-info infoIcon "
478
+ data-id="fontIcon"
479
+ data-selector-id="fontIcon"
480
+ data-test-id="fontIcon"
481
+ data-title="Capital of India"
482
+ style="--zd-iconfont-size: var(--zd_font_size16);"
483
+ />
484
+ </div>
485
+ </span>
486
+ <span
487
+ class="radio radioWrap"
488
+ >
489
+ <div
490
+ aria-checked="false"
491
+ aria-readonly="false"
492
+ class="container pointer hoverEfffect flex rowdir both"
493
+ data-id="4"
494
+ data-selector-id="container"
495
+ data-test-id="4"
496
+ role="radio"
497
+ tabindex="-1"
498
+ >
499
+ <div
500
+ class="radio
501
+ hoverprimary medium filled centerPathprimary shrinkOff"
502
+ data-id="boxComponent"
503
+ data-selector-id="box"
504
+ data-test-id="boxComponent"
505
+ >
506
+ <input
507
+ id="3"
508
+ type="hidden"
509
+ value="4"
510
+ />
511
+ <label
512
+ class="radioLabel pointer"
513
+ >
514
+ <svg
515
+ viewBox="0 0 40 40"
516
+ xmlns="http://www.w3.org/2000/svg"
517
+ >
518
+ <circle
519
+ class="rdBox"
520
+ cx="20"
521
+ cy="20"
522
+ r="19"
523
+ />
524
+ </svg>
525
+ </label>
526
+ </div>
527
+ <div
528
+ class="text grow basis shrinkOff"
529
+ data-id="boxComponent"
530
+ data-selector-id="box"
531
+ data-test-id="boxComponent"
532
+ >
533
+ <label
534
+ class="label title medium default font_primary
535
+ dotted cursor
536
+ primaryLabel pointer "
537
+ data-id="Kolkata_label"
538
+ data-selector-id="label"
539
+ data-test-id="Kolkata_label"
540
+ data-title="Kolkata"
541
+ >
542
+ Kolkata
543
+ </label>
544
+ </div>
545
+ </div>
546
+ </span>
547
+ </div>
548
+ </div>
549
+ </DocumentFragment>
550
+ `;
@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
6
6
  exports.defaultProps = void 0;
7
7
  var defaultProps = {
8
8
  errorType: 'primary',
9
+ isBoxStyle: false,
9
10
  isMandatory: false,
10
11
  isDisabled: false,
11
12
  isReadOnly: false,
@@ -12,8 +12,10 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "d
12
12
  var propTypes = {
13
13
  dataId: _propTypes["default"].string,
14
14
  errorType: _propTypes["default"].oneOf(['primary', 'secondary']),
15
+ getRef: _propTypes["default"].func,
15
16
  id: _propTypes["default"].string,
16
17
  isActive: _propTypes["default"].bool,
18
+ isBoxStyle: _propTypes["default"].bool,
17
19
  isDisabled: _propTypes["default"].bool,
18
20
  isMandatory: _propTypes["default"].bool,
19
21
  isReadOnly: _propTypes["default"].bool,
@@ -33,6 +35,7 @@ var propTypes = {
33
35
  customProps: _propTypes["default"].shape({
34
36
  LabelProps: _propTypes["default"].object,
35
37
  RadioProps: _propTypes["default"].object,
38
+ InfoIconProps: _propTypes["default"].object,
36
39
  ValidationMessageProps1: _propTypes["default"].object,
37
40
  ValidationMessageProps2: _propTypes["default"].object
38
41
  }),
@@ -105,6 +105,7 @@ var RadioField = function RadioField(props) {
105
105
  disabled = _option$disabled === void 0 ? false : _option$disabled,
106
106
  tooltip = option.tooltip,
107
107
  infoTooltip = option.infoTooltip;
108
+ var isDisabledState = disabled || isDisabled;
108
109
  var isChecked = selectedValue == value;
109
110
  return /*#__PURE__*/_react["default"].createElement("span", {
110
111
  key: index,
@@ -117,7 +118,7 @@ var RadioField = function RadioField(props) {
117
118
  labelPalette: labelPalette,
118
119
  labelSize: labelSize,
119
120
  active: isActive || isBoxStyle && isChecked,
120
- disabled: disabled || isDisabled,
121
+ disabled: isDisabledState,
121
122
  disabledTitle: tooltip,
122
123
  title: tooltip,
123
124
  onChange: handleChange,
@@ -132,7 +133,7 @@ var RadioField = function RadioField(props) {
132
133
  tabIndex: !!selectedValue ? isChecked ? '0' : '-1' : index === 0 ? '0' : '-1'
133
134
  }, RadioProps.a11y),
134
135
  customClass: _objectSpread({
135
- customRadioWrap: "".concat(isBoxStyle ? _FieldsModule["default"].radioBox : '', " ").concat(isBoxStyle && isChecked ? _FieldsModule["default"].radioBoxActive : '')
136
+ customRadioWrap: isBoxStyle ? "".concat(_FieldsModule["default"].radioBox, " ").concat(!isDisabledState ? _FieldsModule["default"].hoverableRadioBox : '', " ").concat(isChecked ? _FieldsModule["default"].radioBoxActive : '') : ''
136
137
  }, RadioProps.customClass)
137
138
  }), !!infoTooltip ? /*#__PURE__*/_react["default"].createElement(_Icon["default"], _extends({
138
139
  name: "ZD-GN-info",
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@zohodesk/dot",
3
- "version": "1.0.0-temp-187.4",
3
+ "version": "1.0.0-temp-187.5",
4
4
  "main": "lib/index",
5
5
  "module": "es/index.js",
6
6
  "private": false,
@@ -63,9 +63,9 @@
63
63
  "@zohodesk-private/node-plugins": "1.1.8",
64
64
  "@zohodesk-private/react-prop-validator": "1.2.3",
65
65
  "@zohodesk/a11y": "2.2.6",
66
- "@zohodesk/components": "../components",
66
+ "@zohodesk/components": "1.0.0-temp-199.5",
67
67
  "@zohodesk/hooks": "2.0.5",
68
- "@zohodesk/icons": "1.0.66",
68
+ "@zohodesk/icons": "1.0.67",
69
69
  "@zohodesk/svg": "1.1.22",
70
70
  "@zohodesk/utils": "1.3.14",
71
71
  "@zohodesk/variables": "1.0.0",
@@ -76,8 +76,8 @@
76
76
  "peerDependencies": {
77
77
  "velocity-react": "1.4.3",
78
78
  "@zohodesk/variables": "1.0.0",
79
- "@zohodesk/components": "1.2.49",
80
- "@zohodesk/icons": "1.0.66",
79
+ "@zohodesk/components": "1.2.50",
80
+ "@zohodesk/icons": "1.0.67",
81
81
  "@zohodesk/svg": "1.1.22",
82
82
  "@zohodesk/virtualizer": "1.0.3",
83
83
  "react-sortable-hoc": "^0.8.3",