@zohodesk/components 1.4.10-exp.1 → 1.4.10

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 (42) hide show
  1. package/README.md +3 -0
  2. package/es/AppContainer/AppContainer.js +0 -1
  3. package/es/AppContainer/AppContainer.module.css +2 -3
  4. package/es/Button/css/Button.module.css +4 -13
  5. package/es/DateTime/DateTime.module.css +9 -12
  6. package/es/DateTime/YearView.module.css +1 -1
  7. package/es/Heading/Heading.module.css +1 -0
  8. package/es/Label/Label.module.css +8 -8
  9. package/es/MultiSelect/MultiSelect.module.css +1 -1
  10. package/es/Select/Select.js +3 -3
  11. package/es/Tab/Tabs.module.css +1 -1
  12. package/es/TextBox/TextBox.module.css +4 -4
  13. package/es/Textarea/Textarea.module.css +1 -1
  14. package/es/Tooltip/Tooltip.module.css +1 -1
  15. package/es/Typography/css/Typography.module.css +4 -4
  16. package/es/common/basic.module.css +6 -39
  17. package/es/common/basicReset.module.css +2 -2
  18. package/es/common/common.module.css +5 -5
  19. package/es/utils/dropDownUtils.js +3 -1
  20. package/es/v1/Tab/v1Tabs.module.css +1 -1
  21. package/es/v1/Typography/css/v1_Typography.module.css +4 -4
  22. package/lib/AppContainer/AppContainer.js +0 -2
  23. package/lib/AppContainer/AppContainer.module.css +2 -3
  24. package/lib/Button/css/Button.module.css +4 -13
  25. package/lib/DateTime/DateTime.module.css +9 -12
  26. package/lib/DateTime/YearView.module.css +1 -1
  27. package/lib/Heading/Heading.module.css +1 -0
  28. package/lib/Label/Label.module.css +8 -8
  29. package/lib/MultiSelect/MultiSelect.module.css +1 -1
  30. package/lib/Select/Select.js +2 -2
  31. package/lib/Tab/Tabs.module.css +1 -1
  32. package/lib/TextBox/TextBox.module.css +4 -4
  33. package/lib/Textarea/Textarea.module.css +1 -1
  34. package/lib/Tooltip/Tooltip.module.css +1 -1
  35. package/lib/Typography/css/Typography.module.css +4 -4
  36. package/lib/common/basic.module.css +6 -39
  37. package/lib/common/basicReset.module.css +2 -2
  38. package/lib/common/common.module.css +5 -5
  39. package/lib/utils/dropDownUtils.js +3 -1
  40. package/lib/v1/Tab/v1Tabs.module.css +1 -1
  41. package/lib/v1/Typography/css/v1_Typography.module.css +4 -4
  42. package/package.json +3 -3
package/README.md CHANGED
@@ -7,6 +7,9 @@ Dot UI is a customizable React component library built to deliver a clean, acces
7
7
  - **Select, MultiSelect**
8
8
  - Searching with leading spaces is not reflected the results correctly. Issue Fixed.
9
9
 
10
+ - **Select**
11
+ - Fixed performance issue in options formatting caused by unnecessary rendering triggers
12
+
10
13
  # 1.4.9
11
14
 
12
15
  - **MultiSelect , MultiSelectWithAvatar, AdvancedMultiSelect, AdvancedGroupMultiSelect**
@@ -9,7 +9,6 @@ import '@zohodesk/variables/assets/dotVariables.module.css';
9
9
  import '@zohodesk/variables/assets/sizeVariables.module.css';
10
10
  import '@zohodesk/variables/assets/fontsizeVariables.module.css';
11
11
  import '@zohodesk/variables/es/fontFamilyVariables.module.css';
12
- import '@zohodesk/variables/es/fontWeightVariables.module.css';
13
12
  import '@zohodesk/variables/assets/transitionVariables.module.css';
14
13
  import '@zohodesk/variables/assets/no_transitionVariables.module.css';
15
14
  import "../common/a11y.module.css";
@@ -8,9 +8,8 @@
8
8
  -moz-box-sizing: border-box;
9
9
  -ms-box-sizing: border-box;
10
10
  }
11
- .container, .container button, .container input, .container textarea ,.container select {
12
- /* font-family: var(--zd_regular); */
13
- font-family: var(--zd-font-family, ZDLato);
11
+ .container {
12
+ font-family: var(--zd_regular);
14
13
  }
15
14
  .tooltip {
16
15
  height: 0 ;
@@ -5,7 +5,7 @@
5
5
  --button_cursor: pointer;
6
6
  --button_font_size: var(--zd_font_size13);
7
7
  --button_text_color: var(--zdt_button_default_text);
8
- --button_font_weight: var(--zd-fw-normal);
8
+ --button_font_family: var(--zd_regular);
9
9
  --button_text_transform: capitalize;
10
10
  --button_bg_color: var(--zdt_button_default_bg);
11
11
  --button_border_radius: 4px;
@@ -49,7 +49,7 @@
49
49
  position: relative;
50
50
  font-size: var(--button_font_size);
51
51
  color: var(--button_text_color);
52
- font-weight: var(--button_font_weight);
52
+ font-family: var(--button_font_family);
53
53
  text-transform: var(--button_text_transform);
54
54
  min-width: var(--button_min_width);
55
55
  height: var(--button_height);
@@ -63,7 +63,7 @@
63
63
  }
64
64
 
65
65
  .bold {
66
- --button_font_weight: var(--zd-fw-semibold);
66
+ --button_font_family: var(--zd_semibold);
67
67
  composes: ftsmooth from '../../common/common.module.css';
68
68
  }
69
69
 
@@ -569,7 +569,7 @@
569
569
  }
570
570
 
571
571
  .loader {
572
- color: var(--dot_mirror);
572
+ color: var(--dot_mirror)
573
573
  }
574
574
 
575
575
  [dir=ltr] .strike {
@@ -579,43 +579,34 @@
579
579
  [dir=rtl] .strike {
580
580
  background-image: repeating-linear-gradient(-120deg, var(--button_strike_color) 0 1px, transparent 1px 8px);
581
581
  }
582
-
583
582
  .primaryStrike {
584
583
  --button_strike_color: var(--zdt_button_primary_strike);
585
584
  }
586
-
587
585
  .primaryfilledStrike {
588
586
  --button_strike_color: var(--zdt_button_primaryFilled_strike);
589
587
  --button_border_color: var(--zdt_button_primaryfill_bg);
590
588
  }
591
-
592
589
  .dangerStrike {
593
590
  --button_strike_color: var(--zdt_button_danger_strike);
594
591
  }
595
-
596
592
  .dangerfilledStrike {
597
593
  --button_strike_color: var(--zdt_button_dangerFilled_strike);
598
594
  --button_border_color: var(--zdt_button_dangerfill_bg);
599
595
  }
600
-
601
596
  .secondaryStrike {
602
597
  --button_strike_color: var(--zdt_button_secondary_border);
603
598
  }
604
-
605
599
  .secondaryfilledStrike {
606
600
  --button_strike_color: var(--zdt_button_secondaryFilled_strike);
607
601
  --button_border_color: var(--zdt_button_secondaryfill_bg);
608
602
  }
609
-
610
603
  .tertiaryfilledStrike {
611
604
  --button_strike_color: var(--zdt_button_tertiaryFilled_strike);
612
605
  --button_border_color: var(--zdt_button_tertiaryfill_bg);
613
606
  }
614
-
615
607
  .successStrike {
616
608
  --button_strike_color: var(--zdt_button_success_strike);
617
609
  }
618
-
619
610
  .successfilledStrike {
620
611
  --button_strike_color: var(--zdt_button_successFilled_strike);
621
612
  --button_border_color: var(--zdt_button_successfill_bg);
@@ -1,5 +1,5 @@
1
1
  .semibold {
2
- font-weight: var(--zd-fw-semibold);
2
+ font-family: var(--zd_semibold);
3
3
  }
4
4
 
5
5
  [dir=ltr] .boxPadding {
@@ -29,7 +29,7 @@
29
29
  }
30
30
 
31
31
  .datesStr {
32
- font-weight: var(--zd-fw-normal);
32
+ font-family: var(--zd_regular);
33
33
  }
34
34
 
35
35
  .grid {
@@ -122,8 +122,7 @@
122
122
  color: var(--zdt_datetime_invalid_text);
123
123
  }
124
124
 
125
- .invalidDate.holiday,
126
- .inActiveDate.holiday:hover {
125
+ .invalidDate.holiday,.inActiveDate.holiday:hover {
127
126
  color: var(--zdt_datetime_invaliddate_text);
128
127
  }
129
128
 
@@ -148,17 +147,15 @@
148
147
  background-color: var(--zdt_datetime_selected_bg);
149
148
  border-radius: 50%;
150
149
  }
151
-
152
- .inActiveDate {
153
- color: var(--zdt_datetime_invalid_text);
154
- cursor: no-drop;
150
+ .inActiveDate{
151
+ color: var(--zdt_datetime_invalid_text);
152
+ cursor: no-drop;
155
153
  }
156
-
157
- .inActiveDate:hover {
154
+ .inActiveDate:hover
155
+ {
158
156
  color: var(--zdt_datetime_invalid_text);
159
157
  }
160
-
161
- .inActiveDate:hover, .inActiveDate.holiday:hover {
158
+ .inActiveDate:hover, .inActiveDate.holiday:hover{
162
159
  background-color: var(--zdt_datetime_inactivedate_hover_bg);
163
160
 
164
161
  }
@@ -61,7 +61,7 @@
61
61
  }
62
62
 
63
63
  .isActive .yearText {
64
- font-weight: var(--zd-fw-semibold);
64
+ font-family: var(--zd_semibold);
65
65
  color: var(--zdt_yearview_year_hover_text);
66
66
  font-size: var(--zd_font_size11) ;
67
67
  }
@@ -1,4 +1,5 @@
1
1
  .reset {
2
2
  font-size: inherit ;
3
+ font-weight: initial;
3
4
  margin: initial ;
4
5
  }
@@ -2,7 +2,7 @@
2
2
  /* label default variables */
3
3
  --label_font_size: var(--zd_font_size14);
4
4
  --label_text_color: var(--zdt_label_default_text);
5
- --label_font_weight: var(--zd-fw-normal);
5
+ --label_font_family: var(--zd_regular);
6
6
  --label_cursor: default;
7
7
  --label_line_height: 1.286;
8
8
  }
@@ -13,24 +13,24 @@
13
13
  line-height: var(--label_line_height);
14
14
  font-size: var(--label_font_size);
15
15
  color: var(--label_text_color);
16
- font-weight: var(--label_font_weight);
16
+ font-family: var(--label_font_family);
17
17
  cursor: var(--label_cursor);
18
18
  }
19
19
  .xsmall {
20
20
  --label_font_size: var(--zd_font_size12);
21
- --label_line_height: 1.5;
21
+ --label_line_height:1.5;
22
22
  }
23
23
  .small {
24
24
  --label_font_size: var(--zd_font_size13);
25
- --label_line_height: 1.385;
25
+ --label_line_height:1.385;
26
26
  }
27
27
  .medium {
28
28
  --label_font_size: var(--zd_font_size14);
29
- --label_line_height: 1.286;
29
+ --label_line_height:1.286;
30
30
  }
31
31
  .large {
32
32
  --label_font_size: var(--zd_font_size26);
33
- --label_line_height: 0.6923;
33
+ --label_line_height:0.6923;
34
34
  composes: semibold from '../common/common.module.css';
35
35
  }
36
36
  .pointer {
@@ -46,10 +46,10 @@
46
46
  display: inline-block;
47
47
  }
48
48
  .font_default {
49
- --label_font_weight: var(--zd-fw-normal);
49
+ --label_font_family: var(--zd_regular);
50
50
  }
51
51
  .font_primary {
52
- --label_font_weight: var(--zd-fw-semibold);
52
+ --label_font_family: var(--zd_semibold);
53
53
  composes: ftsmooth from '../common/common.module.css';
54
54
  }
55
55
  .dotted {
@@ -196,7 +196,7 @@
196
196
  .more {
197
197
  font-size: var(--zd_font_size14) ;
198
198
  color: var(--zdt_multiselect_more_text);
199
- font-weight: var(--zd-fw-normal);
199
+ font-family: inherit;
200
200
  cursor: pointer;
201
201
  margin-top: var(--zd_size5) ;
202
202
  background-color: var(--zdt_multiselect_delete_bg);
@@ -18,7 +18,7 @@ import { ResponsiveReceiver } from "../Responsive/CustomResponsive";
18
18
  import Loader from '@zohodesk/svg/lib/Loader/Loader';
19
19
  /**** Methods ****/
20
20
 
21
- import { makeFormatOptions, makeGetMultiSelectFilterSuggestions as makeGetFilterSuggestions, makeGetSelectedValueText as makeGetSelectedValue } from "../utils/dropDownUtils";
21
+ import { dummyObj, makeFormatOptions, makeGetMultiSelectFilterSuggestions as makeGetFilterSuggestions, makeGetSelectedValueText as makeGetSelectedValue } from "../utils/dropDownUtils";
22
22
  import { debounce, scrollTo, getIsEmptyValue, getSearchString, findScrollEnd, getKeyValue } from "../utils/Common.js";
23
23
  /**** CSS ****/
24
24
 
@@ -251,10 +251,10 @@ export class SelectComponent extends Component {
251
251
  valueField,
252
252
  textField,
253
253
  allowValueFallback,
254
- customProps = {}
254
+ customProps = dummyObj
255
255
  } = props;
256
256
  let {
257
- listItemProps = {}
257
+ listItemProps = dummyObj
258
258
  } = customProps;
259
259
  return this.formatOptions({
260
260
  options,
@@ -145,7 +145,7 @@
145
145
  }
146
146
 
147
147
  .emptyStateTitle {
148
- font-weight: var(--zd-fw-semibold);
148
+ font-family: var(--zd_semibold);
149
149
  word-wrap: break-word;
150
150
  font-size: var(--zd_font_size16) ;
151
151
  max-width: var(--zd_size430) ;
@@ -9,7 +9,7 @@
9
9
  --textbox_width: 100%;
10
10
  --textbox_height: var(--zd_size35);
11
11
  --textbox_border_radius: none;
12
- --textbox_font_weight: var(--zd-fw-normal);
12
+ --textbox_font_family: var(--zd_regular);
13
13
  /* Variable:Ignore */
14
14
  --textbox_letter_spacing: 0.1px;
15
15
  --textbox_padding: 0;
@@ -166,18 +166,18 @@
166
166
  .primary,
167
167
  .secondary,
168
168
  .light {
169
- font-weight: var(--textbox_font_weight);
169
+ font-family: var(--textbox_font_family);
170
170
  }
171
171
 
172
172
  .primary {
173
173
  --textbox_text_color: var(--zdt_textbox_default_text);
174
- --textbox_font_weight: var(--zd-fw-semibold);
174
+ --textbox_font_family: var(--zd_semibold);
175
175
  composes: ftsmooth from '../common/common.module.css';
176
176
  }
177
177
 
178
178
  .secondary {
179
179
  --textbox_text_color: var(--zdt_textbox_secondary_text);
180
- --textbox_font_weight: var(--zd-fw-light);
180
+ --textbox_font_family: var(--zd_light);
181
181
  }
182
182
 
183
183
  .light {
@@ -139,7 +139,7 @@
139
139
  --textarea_height: var(--zd_size184);
140
140
  }
141
141
  .default {
142
- font-weight: var(--zd-fw-normal);
142
+ font-family: var(--zd_regular);
143
143
  --textarea_text_color: var(--zdt_textarea_black_text);
144
144
  }
145
145
  .primary {
@@ -14,7 +14,7 @@
14
14
  .tooltipcont {
15
15
  color: var(--zdt_tooltip_default_text);
16
16
  font-size: var(--zd_font_size13) ;
17
- font-weight: var(--zd-fw-semibold);
17
+ font-family: var(--zd_semibold);
18
18
  word-break: break-word;
19
19
  max-width: var(--zd_size420) ;
20
20
  line-height: 1.5385;
@@ -25,20 +25,20 @@
25
25
  }
26
26
 
27
27
  .font_regular {
28
- font-weight: var(--zd-fw-normal);
28
+ font-family: var(--zd_regular);
29
29
  }
30
30
 
31
31
  .font_light {
32
- font-weight: var(--zd-fw-light);
32
+ font-family: var(--zd_light);
33
33
  }
34
34
 
35
35
  .font_semibold {
36
- font-weight: var(--zd-fw-semibold);
36
+ font-family: var(--zd_semibold);
37
37
  composes: ftsmooth from '../../common/common.module.css';
38
38
  }
39
39
 
40
40
  .font_bold {
41
- font-weight: var(--zd-fw-bold);
41
+ font-family: var(--zd_bold);
42
42
  composes: ftsmooth from '../../common/common.module.css';
43
43
  }
44
44
 
@@ -1,15 +1,15 @@
1
1
  @font-face {
2
- font-family: Light;
3
- src: url('https://static.zohocdn.com/webfonts/lato2light/font.woff2') format('woff2');
4
- font-weight: 300;
2
+ font-family: Regular;
3
+ src: url('https://static.zohocdn.com/webfonts/lato2regular/font.woff2') format('woff2');
4
+ font-weight: 400;
5
5
  font-style: normal;
6
6
  font-display: swap;
7
7
  }
8
8
 
9
9
  @font-face {
10
- font-family: Regular;
11
- src: url('https://static.zohocdn.com/webfonts/lato2regular/font.woff2') format('woff2');
12
- font-weight: 400;
10
+ font-family: Light;
11
+ src: url('https://static.zohocdn.com/webfonts/lato2light/font.woff2') format('woff2');
12
+ font-weight: 300;
13
13
  font-style: normal;
14
14
  font-display: swap;
15
15
  }
@@ -29,36 +29,3 @@
29
29
  font-style: normal;
30
30
  font-display: swap;
31
31
  }
32
-
33
-
34
- @font-face {
35
- font-family: ZDLato;
36
- src: url('https://static.zohocdn.com/webfonts/lato2light/font.woff2') format('woff2');
37
- font-weight: 100 300;
38
- font-style: normal;
39
- font-display: swap;
40
- }
41
-
42
- @font-face {
43
- font-family: ZDLato;
44
- src: url('https://static.zohocdn.com/webfonts/lato2regular/font.woff2') format('woff2');
45
- font-weight: 400;
46
- font-style: normal;
47
- font-display: swap;
48
- }
49
-
50
- @font-face {
51
- font-family: ZDLato;
52
- src: url('https://static.zohocdn.com/webfonts/lato2semibold/font.woff2') format('woff2');
53
- font-weight: 500 600;
54
- font-style: normal;
55
- font-display: swap;
56
- }
57
-
58
- @font-face {
59
- font-family: ZDLato;
60
- src: url('https://static.zohocdn.com/webfonts/lato2bold/font.woff2') format('woff2');
61
- font-weight: 700 900;
62
- font-style: normal;
63
- font-display: swap;
64
- }
@@ -27,7 +27,7 @@ html {
27
27
  }
28
28
 
29
29
  textarea {
30
- font-weight: var(--zd-fw-normal);
30
+ font-family: var(--zd_regular);
31
31
  }
32
32
 
33
33
  label, input[type='button'], input[type='submit'], input[type='file'], button {
@@ -37,4 +37,4 @@ label, input[type='button'], input[type='submit'], input[type='file'], button {
37
37
  /*Moz Required Box shadow Isssue*/
38
38
  input[required]:-moz-ui-invalid {
39
39
  box-shadow: none;
40
- }
40
+ }
@@ -303,22 +303,22 @@
303
303
  resize: vertical;
304
304
  }
305
305
 
306
- /*font-weight*/
306
+ /*font-family*/
307
307
  .regular {
308
- font-weight: var(--zd-fw-normal);
308
+ font-family: var(--zd_regular, Regular);
309
309
  }
310
310
 
311
311
  .light {
312
- font-weight: var(--zd-fw-light);
312
+ font-family: var(--zd_light, Light);
313
313
  }
314
314
 
315
315
  .semibold {
316
- font-weight: var(--zd-fw-semibold);
316
+ font-family: var(--zd_semibold, Semibold);
317
317
  composes: ftsmooth;
318
318
  }
319
319
 
320
320
  .bold {
321
- font-weight: var(--zd-fw-bold);
321
+ font-family: var(--zd_bold, Bold);
322
322
  composes: ftsmooth;
323
323
  }
324
324
 
@@ -43,8 +43,10 @@ const getDisabledOptions = props => props.disabledOptions || dummyArray;
43
43
 
44
44
  const getListItemProps = props => props.listItemProps || '';
45
45
 
46
+ const defaultSearchFields = ['value'];
47
+
46
48
  const getSearchFields = props => {
47
- return props.searchFields || ['value'];
49
+ return props.searchFields || defaultSearchFields;
48
50
  }; // const isObjectContainsSearchString = (searchFields = [], searchStr = '', obj) => {
49
51
  // const matchedFields = searchFields.filter(element => {
50
52
  // return getSearchString(obj[element]).indexOf(searchStr) !== -1
@@ -145,7 +145,7 @@
145
145
  }
146
146
 
147
147
  .emptyStateTitle {
148
- font-weight: var(--zd-fw-semibold);
148
+ font-family: var(--zd_semibold);
149
149
  word-wrap: break-word;
150
150
  font-size: var(--zd_font_size16) ;
151
151
  max-width: var(--zd_size430) ;
@@ -19,17 +19,17 @@
19
19
  display: initial;
20
20
  }
21
21
  .font_regular {
22
- font-weight: var(--zd-fw-normal);
22
+ font-family: var(--zd_regular);
23
23
  }
24
24
  .font_light {
25
- font-weight: var(--zd-fw-light);
25
+ font-family: var(--zd_light);
26
26
  }
27
27
  .font_semibold {
28
- font-weight: var(--zd-fw-semibold);
28
+ font-family: var(--zd_semibold);
29
29
  composes: ftsmooth from '../../../common/common.module.css';
30
30
  }
31
31
  .font_bold {
32
- font-weight: var(--zd-fw-bold);
32
+ font-family: var(--zd_bold);
33
33
  composes: ftsmooth from '../../../common/common.module.css';
34
34
  }
35
35
  .fontStyles_normal{
@@ -29,8 +29,6 @@ require("@zohodesk/variables/assets/fontsizeVariables.module.css");
29
29
 
30
30
  require("@zohodesk/variables/es/fontFamilyVariables.module.css");
31
31
 
32
- require("@zohodesk/variables/es/fontWeightVariables.module.css");
33
-
34
32
  require("@zohodesk/variables/assets/transitionVariables.module.css");
35
33
 
36
34
  require("@zohodesk/variables/assets/no_transitionVariables.module.css");
@@ -8,9 +8,8 @@
8
8
  -moz-box-sizing: border-box;
9
9
  -ms-box-sizing: border-box;
10
10
  }
11
- .container, .container button, .container input, .container textarea ,.container select {
12
- /* font-family: var(--zd_regular); */
13
- font-family: var(--zd-font-family, ZDLato);
11
+ .container {
12
+ font-family: var(--zd_regular);
14
13
  }
15
14
  .tooltip {
16
15
  height: 0 ;
@@ -5,7 +5,7 @@
5
5
  --button_cursor: pointer;
6
6
  --button_font_size: var(--zd_font_size13);
7
7
  --button_text_color: var(--zdt_button_default_text);
8
- --button_font_weight: var(--zd-fw-normal);
8
+ --button_font_family: var(--zd_regular);
9
9
  --button_text_transform: capitalize;
10
10
  --button_bg_color: var(--zdt_button_default_bg);
11
11
  --button_border_radius: 4px;
@@ -49,7 +49,7 @@
49
49
  position: relative;
50
50
  font-size: var(--button_font_size);
51
51
  color: var(--button_text_color);
52
- font-weight: var(--button_font_weight);
52
+ font-family: var(--button_font_family);
53
53
  text-transform: var(--button_text_transform);
54
54
  min-width: var(--button_min_width);
55
55
  height: var(--button_height);
@@ -63,7 +63,7 @@
63
63
  }
64
64
 
65
65
  .bold {
66
- --button_font_weight: var(--zd-fw-semibold);
66
+ --button_font_family: var(--zd_semibold);
67
67
  composes: ftsmooth from '../../common/common.module.css';
68
68
  }
69
69
 
@@ -569,7 +569,7 @@
569
569
  }
570
570
 
571
571
  .loader {
572
- color: var(--dot_mirror);
572
+ color: var(--dot_mirror)
573
573
  }
574
574
 
575
575
  [dir=ltr] .strike {
@@ -579,43 +579,34 @@
579
579
  [dir=rtl] .strike {
580
580
  background-image: repeating-linear-gradient(-120deg, var(--button_strike_color) 0 1px, transparent 1px 8px);
581
581
  }
582
-
583
582
  .primaryStrike {
584
583
  --button_strike_color: var(--zdt_button_primary_strike);
585
584
  }
586
-
587
585
  .primaryfilledStrike {
588
586
  --button_strike_color: var(--zdt_button_primaryFilled_strike);
589
587
  --button_border_color: var(--zdt_button_primaryfill_bg);
590
588
  }
591
-
592
589
  .dangerStrike {
593
590
  --button_strike_color: var(--zdt_button_danger_strike);
594
591
  }
595
-
596
592
  .dangerfilledStrike {
597
593
  --button_strike_color: var(--zdt_button_dangerFilled_strike);
598
594
  --button_border_color: var(--zdt_button_dangerfill_bg);
599
595
  }
600
-
601
596
  .secondaryStrike {
602
597
  --button_strike_color: var(--zdt_button_secondary_border);
603
598
  }
604
-
605
599
  .secondaryfilledStrike {
606
600
  --button_strike_color: var(--zdt_button_secondaryFilled_strike);
607
601
  --button_border_color: var(--zdt_button_secondaryfill_bg);
608
602
  }
609
-
610
603
  .tertiaryfilledStrike {
611
604
  --button_strike_color: var(--zdt_button_tertiaryFilled_strike);
612
605
  --button_border_color: var(--zdt_button_tertiaryfill_bg);
613
606
  }
614
-
615
607
  .successStrike {
616
608
  --button_strike_color: var(--zdt_button_success_strike);
617
609
  }
618
-
619
610
  .successfilledStrike {
620
611
  --button_strike_color: var(--zdt_button_successFilled_strike);
621
612
  --button_border_color: var(--zdt_button_successfill_bg);
@@ -1,5 +1,5 @@
1
1
  .semibold {
2
- font-weight: var(--zd-fw-semibold);
2
+ font-family: var(--zd_semibold);
3
3
  }
4
4
 
5
5
  [dir=ltr] .boxPadding {
@@ -29,7 +29,7 @@
29
29
  }
30
30
 
31
31
  .datesStr {
32
- font-weight: var(--zd-fw-normal);
32
+ font-family: var(--zd_regular);
33
33
  }
34
34
 
35
35
  .grid {
@@ -122,8 +122,7 @@
122
122
  color: var(--zdt_datetime_invalid_text);
123
123
  }
124
124
 
125
- .invalidDate.holiday,
126
- .inActiveDate.holiday:hover {
125
+ .invalidDate.holiday,.inActiveDate.holiday:hover {
127
126
  color: var(--zdt_datetime_invaliddate_text);
128
127
  }
129
128
 
@@ -148,17 +147,15 @@
148
147
  background-color: var(--zdt_datetime_selected_bg);
149
148
  border-radius: 50%;
150
149
  }
151
-
152
- .inActiveDate {
153
- color: var(--zdt_datetime_invalid_text);
154
- cursor: no-drop;
150
+ .inActiveDate{
151
+ color: var(--zdt_datetime_invalid_text);
152
+ cursor: no-drop;
155
153
  }
156
-
157
- .inActiveDate:hover {
154
+ .inActiveDate:hover
155
+ {
158
156
  color: var(--zdt_datetime_invalid_text);
159
157
  }
160
-
161
- .inActiveDate:hover, .inActiveDate.holiday:hover {
158
+ .inActiveDate:hover, .inActiveDate.holiday:hover{
162
159
  background-color: var(--zdt_datetime_inactivedate_hover_bg);
163
160
 
164
161
  }
@@ -61,7 +61,7 @@
61
61
  }
62
62
 
63
63
  .isActive .yearText {
64
- font-weight: var(--zd-fw-semibold);
64
+ font-family: var(--zd_semibold);
65
65
  color: var(--zdt_yearview_year_hover_text);
66
66
  font-size: var(--zd_font_size11) ;
67
67
  }
@@ -1,4 +1,5 @@
1
1
  .reset {
2
2
  font-size: inherit ;
3
+ font-weight: initial;
3
4
  margin: initial ;
4
5
  }
@@ -2,7 +2,7 @@
2
2
  /* label default variables */
3
3
  --label_font_size: var(--zd_font_size14);
4
4
  --label_text_color: var(--zdt_label_default_text);
5
- --label_font_weight: var(--zd-fw-normal);
5
+ --label_font_family: var(--zd_regular);
6
6
  --label_cursor: default;
7
7
  --label_line_height: 1.286;
8
8
  }
@@ -13,24 +13,24 @@
13
13
  line-height: var(--label_line_height);
14
14
  font-size: var(--label_font_size);
15
15
  color: var(--label_text_color);
16
- font-weight: var(--label_font_weight);
16
+ font-family: var(--label_font_family);
17
17
  cursor: var(--label_cursor);
18
18
  }
19
19
  .xsmall {
20
20
  --label_font_size: var(--zd_font_size12);
21
- --label_line_height: 1.5;
21
+ --label_line_height:1.5;
22
22
  }
23
23
  .small {
24
24
  --label_font_size: var(--zd_font_size13);
25
- --label_line_height: 1.385;
25
+ --label_line_height:1.385;
26
26
  }
27
27
  .medium {
28
28
  --label_font_size: var(--zd_font_size14);
29
- --label_line_height: 1.286;
29
+ --label_line_height:1.286;
30
30
  }
31
31
  .large {
32
32
  --label_font_size: var(--zd_font_size26);
33
- --label_line_height: 0.6923;
33
+ --label_line_height:0.6923;
34
34
  composes: semibold from '../common/common.module.css';
35
35
  }
36
36
  .pointer {
@@ -46,10 +46,10 @@
46
46
  display: inline-block;
47
47
  }
48
48
  .font_default {
49
- --label_font_weight: var(--zd-fw-normal);
49
+ --label_font_family: var(--zd_regular);
50
50
  }
51
51
  .font_primary {
52
- --label_font_weight: var(--zd-fw-semibold);
52
+ --label_font_family: var(--zd_semibold);
53
53
  composes: ftsmooth from '../common/common.module.css';
54
54
  }
55
55
  .dotted {
@@ -196,7 +196,7 @@
196
196
  .more {
197
197
  font-size: var(--zd_font_size14) ;
198
198
  color: var(--zdt_multiselect_more_text);
199
- font-weight: var(--zd-fw-normal);
199
+ font-family: inherit;
200
200
  cursor: pointer;
201
201
  margin-top: var(--zd_size5) ;
202
202
  background-color: var(--zdt_multiselect_delete_bg);
@@ -309,9 +309,9 @@ var SelectComponent = /*#__PURE__*/function (_Component) {
309
309
  textField = props.textField,
310
310
  allowValueFallback = props.allowValueFallback,
311
311
  _props$customProps = props.customProps,
312
- customProps = _props$customProps === void 0 ? {} : _props$customProps;
312
+ customProps = _props$customProps === void 0 ? _dropDownUtils.dummyObj : _props$customProps;
313
313
  var _customProps$listItem = customProps.listItemProps,
314
- listItemProps = _customProps$listItem === void 0 ? {} : _customProps$listItem;
314
+ listItemProps = _customProps$listItem === void 0 ? _dropDownUtils.dummyObj : _customProps$listItem;
315
315
  return this.formatOptions({
316
316
  options: options,
317
317
  valueField: valueField,
@@ -145,7 +145,7 @@
145
145
  }
146
146
 
147
147
  .emptyStateTitle {
148
- font-weight: var(--zd-fw-semibold);
148
+ font-family: var(--zd_semibold);
149
149
  word-wrap: break-word;
150
150
  font-size: var(--zd_font_size16) ;
151
151
  max-width: var(--zd_size430) ;
@@ -9,7 +9,7 @@
9
9
  --textbox_width: 100%;
10
10
  --textbox_height: var(--zd_size35);
11
11
  --textbox_border_radius: none;
12
- --textbox_font_weight: var(--zd-fw-normal);
12
+ --textbox_font_family: var(--zd_regular);
13
13
  /* Variable:Ignore */
14
14
  --textbox_letter_spacing: 0.1px;
15
15
  --textbox_padding: 0;
@@ -166,18 +166,18 @@
166
166
  .primary,
167
167
  .secondary,
168
168
  .light {
169
- font-weight: var(--textbox_font_weight);
169
+ font-family: var(--textbox_font_family);
170
170
  }
171
171
 
172
172
  .primary {
173
173
  --textbox_text_color: var(--zdt_textbox_default_text);
174
- --textbox_font_weight: var(--zd-fw-semibold);
174
+ --textbox_font_family: var(--zd_semibold);
175
175
  composes: ftsmooth from '../common/common.module.css';
176
176
  }
177
177
 
178
178
  .secondary {
179
179
  --textbox_text_color: var(--zdt_textbox_secondary_text);
180
- --textbox_font_weight: var(--zd-fw-light);
180
+ --textbox_font_family: var(--zd_light);
181
181
  }
182
182
 
183
183
  .light {
@@ -139,7 +139,7 @@
139
139
  --textarea_height: var(--zd_size184);
140
140
  }
141
141
  .default {
142
- font-weight: var(--zd-fw-normal);
142
+ font-family: var(--zd_regular);
143
143
  --textarea_text_color: var(--zdt_textarea_black_text);
144
144
  }
145
145
  .primary {
@@ -14,7 +14,7 @@
14
14
  .tooltipcont {
15
15
  color: var(--zdt_tooltip_default_text);
16
16
  font-size: var(--zd_font_size13) ;
17
- font-weight: var(--zd-fw-semibold);
17
+ font-family: var(--zd_semibold);
18
18
  word-break: break-word;
19
19
  max-width: var(--zd_size420) ;
20
20
  line-height: 1.5385;
@@ -25,20 +25,20 @@
25
25
  }
26
26
 
27
27
  .font_regular {
28
- font-weight: var(--zd-fw-normal);
28
+ font-family: var(--zd_regular);
29
29
  }
30
30
 
31
31
  .font_light {
32
- font-weight: var(--zd-fw-light);
32
+ font-family: var(--zd_light);
33
33
  }
34
34
 
35
35
  .font_semibold {
36
- font-weight: var(--zd-fw-semibold);
36
+ font-family: var(--zd_semibold);
37
37
  composes: ftsmooth from '../../common/common.module.css';
38
38
  }
39
39
 
40
40
  .font_bold {
41
- font-weight: var(--zd-fw-bold);
41
+ font-family: var(--zd_bold);
42
42
  composes: ftsmooth from '../../common/common.module.css';
43
43
  }
44
44
 
@@ -1,15 +1,15 @@
1
1
  @font-face {
2
- font-family: Light;
3
- src: url('https://static.zohocdn.com/webfonts/lato2light/font.woff2') format('woff2');
4
- font-weight: 300;
2
+ font-family: Regular;
3
+ src: url('https://static.zohocdn.com/webfonts/lato2regular/font.woff2') format('woff2');
4
+ font-weight: 400;
5
5
  font-style: normal;
6
6
  font-display: swap;
7
7
  }
8
8
 
9
9
  @font-face {
10
- font-family: Regular;
11
- src: url('https://static.zohocdn.com/webfonts/lato2regular/font.woff2') format('woff2');
12
- font-weight: 400;
10
+ font-family: Light;
11
+ src: url('https://static.zohocdn.com/webfonts/lato2light/font.woff2') format('woff2');
12
+ font-weight: 300;
13
13
  font-style: normal;
14
14
  font-display: swap;
15
15
  }
@@ -29,36 +29,3 @@
29
29
  font-style: normal;
30
30
  font-display: swap;
31
31
  }
32
-
33
-
34
- @font-face {
35
- font-family: ZDLato;
36
- src: url('https://static.zohocdn.com/webfonts/lato2light/font.woff2') format('woff2');
37
- font-weight: 100 300;
38
- font-style: normal;
39
- font-display: swap;
40
- }
41
-
42
- @font-face {
43
- font-family: ZDLato;
44
- src: url('https://static.zohocdn.com/webfonts/lato2regular/font.woff2') format('woff2');
45
- font-weight: 400;
46
- font-style: normal;
47
- font-display: swap;
48
- }
49
-
50
- @font-face {
51
- font-family: ZDLato;
52
- src: url('https://static.zohocdn.com/webfonts/lato2semibold/font.woff2') format('woff2');
53
- font-weight: 500 600;
54
- font-style: normal;
55
- font-display: swap;
56
- }
57
-
58
- @font-face {
59
- font-family: ZDLato;
60
- src: url('https://static.zohocdn.com/webfonts/lato2bold/font.woff2') format('woff2');
61
- font-weight: 700 900;
62
- font-style: normal;
63
- font-display: swap;
64
- }
@@ -27,7 +27,7 @@ html {
27
27
  }
28
28
 
29
29
  textarea {
30
- font-weight: var(--zd-fw-normal);
30
+ font-family: var(--zd_regular);
31
31
  }
32
32
 
33
33
  label, input[type='button'], input[type='submit'], input[type='file'], button {
@@ -37,4 +37,4 @@ label, input[type='button'], input[type='submit'], input[type='file'], button {
37
37
  /*Moz Required Box shadow Isssue*/
38
38
  input[required]:-moz-ui-invalid {
39
39
  box-shadow: none;
40
- }
40
+ }
@@ -303,22 +303,22 @@
303
303
  resize: vertical;
304
304
  }
305
305
 
306
- /*font-weight*/
306
+ /*font-family*/
307
307
  .regular {
308
- font-weight: var(--zd-fw-normal);
308
+ font-family: var(--zd_regular, Regular);
309
309
  }
310
310
 
311
311
  .light {
312
- font-weight: var(--zd-fw-light);
312
+ font-family: var(--zd_light, Light);
313
313
  }
314
314
 
315
315
  .semibold {
316
- font-weight: var(--zd-fw-semibold);
316
+ font-family: var(--zd_semibold, Semibold);
317
317
  composes: ftsmooth;
318
318
  }
319
319
 
320
320
  .bold {
321
- font-weight: var(--zd-fw-bold);
321
+ font-family: var(--zd_bold, Bold);
322
322
  composes: ftsmooth;
323
323
  }
324
324
 
@@ -152,8 +152,10 @@ var getListItemProps = function getListItemProps(props) {
152
152
  return props.listItemProps || '';
153
153
  };
154
154
 
155
+ var defaultSearchFields = ['value'];
156
+
155
157
  var getSearchFields = function getSearchFields(props) {
156
- return props.searchFields || ['value'];
158
+ return props.searchFields || defaultSearchFields;
157
159
  }; // const isObjectContainsSearchString = (searchFields = [], searchStr = '', obj) => {
158
160
  // const matchedFields = searchFields.filter(element => {
159
161
  // return getSearchString(obj[element]).indexOf(searchStr) !== -1
@@ -145,7 +145,7 @@
145
145
  }
146
146
 
147
147
  .emptyStateTitle {
148
- font-weight: var(--zd-fw-semibold);
148
+ font-family: var(--zd_semibold);
149
149
  word-wrap: break-word;
150
150
  font-size: var(--zd_font_size16) ;
151
151
  max-width: var(--zd_size430) ;
@@ -19,17 +19,17 @@
19
19
  display: initial;
20
20
  }
21
21
  .font_regular {
22
- font-weight: var(--zd-fw-normal);
22
+ font-family: var(--zd_regular);
23
23
  }
24
24
  .font_light {
25
- font-weight: var(--zd-fw-light);
25
+ font-family: var(--zd_light);
26
26
  }
27
27
  .font_semibold {
28
- font-weight: var(--zd-fw-semibold);
28
+ font-family: var(--zd_semibold);
29
29
  composes: ftsmooth from '../../../common/common.module.css';
30
30
  }
31
31
  .font_bold {
32
- font-weight: var(--zd-fw-bold);
32
+ font-family: var(--zd_bold);
33
33
  composes: ftsmooth from '../../../common/common.module.css';
34
34
  }
35
35
  .fontStyles_normal{
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@zohodesk/components",
3
- "version": "1.4.10-exp.1",
3
+ "version": "1.4.10",
4
4
  "main": "es/index.js",
5
5
  "module": "es/index.js",
6
6
  "private": false,
@@ -39,7 +39,7 @@
39
39
  "build:css:umd": "npm run clean && npm run init && react-cli build:css:umd",
40
40
  "coverage": "react-cli coverage",
41
41
  "prepare": "npm run init && npm run css:build ",
42
- "prepublishOnly": "node prePublish.js && npm run test-clean && npm run customTest && npm run download && npm run css:review && npm run review:props ",
42
+ "prepublishOnly": "node prePublish.js && npm run test-clean && npm run download && npm run css:review && npm run review:props ",
43
43
  "postpublish": "node postPublish.js",
44
44
  "report": "react-cli publish:report",
45
45
  "test": "react-cli test",
@@ -48,7 +48,7 @@
48
48
  "snap-update": "npm run test-clean && npm run test -- -u",
49
49
  "sstest": "npm run init && react-cli sstest",
50
50
  "build:external": "npm run clean && npm run init && npm run docsjs:build && npm run build:externalDocCopy && react-cli build:component:umd && npm run externalDocHTMLChange",
51
- "download": "react-cli clean ./node_modules ./package-lock.json && npm install && cd ../ && npm run download",
51
+ "download": "react-cli clean ./node_modules ./package-lock.json && npm install ",
52
52
  "expublish": "npm publish --tag experimental-version",
53
53
  "css:lineheight:validate": "node ./node_modules/@zohodesk-private/node-plugins/es/lineheight_automation/lineHeightErrorCheck.js ./src/",
54
54
  "cssVariableConvert": "react-cli variableConverter ./lib ./lib && react-cli variableConverter ./es ./es",