@zohodesk/dot 1.0.0-beta.219 → 1.0.0-beta.221

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 (112) hide show
  1. package/README.md +5 -1
  2. package/es/ActionButton/ActionButton.module.css +9 -25
  3. package/es/AlphabeticList/AlphabeticList.module.css +4 -7
  4. package/es/Attachment/Attachment.module.css +9 -20
  5. package/es/AttachmentViewer/AttachmentViewer.js +27 -0
  6. package/es/AttachmentViewer/AttachmentViewer.module.css +27 -82
  7. package/es/ChannelIcon/ChannelIcon.module.css +21 -30
  8. package/es/Drawer/Drawer.module.css +11 -59
  9. package/es/FlipCard/FlipCard.module.css +5 -14
  10. package/es/FormAction/FormAction.module.css +9 -34
  11. package/es/FreezeLayer/FreezeLayer.module.css +2 -6
  12. package/es/IconButton/IconButton.module.css +1 -1
  13. package/es/ImportantNotes/ImportantNotes.module.css +2 -7
  14. package/es/Loader/Loader.module.css +4 -25
  15. package/es/Message/Message.module.css +9 -42
  16. package/es/MessageBanner/MessageBanner.module.css +4 -12
  17. package/es/NewStar/NewStar.module.css +5 -42
  18. package/es/ToastMessage/ToastMessage.module.css +25 -96
  19. package/es/Upload/Upload.module.css +8 -27
  20. package/es/alert/AlertHeader/AlertHeader.module.css +3 -21
  21. package/es/alert/AlertLookup/AlertLookup.module.css +2 -6
  22. package/es/avatar/AvatarClose/AvatarClose.module.css +3 -9
  23. package/es/avatar/AvatarCollision/AvatarCollision.module.css +4 -18
  24. package/es/avatar/AvatarIcon/AvatarIcon.module.css +4 -3
  25. package/es/avatar/AvatarStatus/AvatarStatus.module.css +9 -59
  26. package/es/avatar/AvatarThread/AvatarThread.module.css +5 -55
  27. package/es/avatar/AvatarUser/AvatarUser.module.css +10 -81
  28. package/es/avatar/AvatarWithTeam/AvatarWithTeam.module.css +3 -10
  29. package/es/common/dot_animation.module.css +3 -16
  30. package/es/deprecated/SelectDropdown/SelectDropdown.module.css +3 -11
  31. package/es/dropdown/ToggleDropDown/ToggleDropDown.module.css +6 -19
  32. package/es/emptystate/CommonEmptyState/CommonEmptyState.module.css +4 -12
  33. package/es/emptystate/EditionPage/EditionPage.css +3 -9
  34. package/es/errorstate/EmptyStates.module.css +10 -13
  35. package/es/errorstate/Inconvenience/Inconvenience.module.css +0 -3
  36. package/es/errorstate/LinkText/LinkText.module.css +1 -1
  37. package/es/errorstate/PermissionPlay/PermissionPlay.module.css +2 -2
  38. package/es/errorstate/WillBack/WillBack.module.css +3 -1
  39. package/es/form/fields/Fields.module.css +14 -49
  40. package/es/form/fields/TagsMultiSelect/TagsMultiSelect.module.css +7 -19
  41. package/es/form/fields/TagsMultiSelectField/TagsMultiSelectField.module.css +1 -4
  42. package/es/form/fields/TextEditor/TextEditor.js +4 -1
  43. package/es/form/fields/TextEditor/TextEditor.module.css +72 -149
  44. package/es/form/fields/TextEditorWrapper/TextEditorWrapper.module.css +2 -13
  45. package/es/form/fields/ValidationMessage/ValidationMessage.module.css +4 -9
  46. package/es/layout/SetupDetailLayout/SetupDetailLayout.module.css +16 -52
  47. package/es/layout/SubtabLayout/SubtabLayout.module.css +29 -55
  48. package/es/list/BluePrintStatus/BluePrintStatus.module.css +1 -4
  49. package/es/list/Comment/Comment.module.css +0 -5
  50. package/es/list/DotNew/DotNew.module.css +3 -3
  51. package/es/list/GridStencils/GridStencils.module.css +16 -70
  52. package/es/list/Icons/Icons.module.css +1 -1
  53. package/es/list/ListLayout/ListLayout.module.css +14 -22
  54. package/es/list/ListStencils/ListStencils.module.css +6 -11
  55. package/es/list/SecondaryText/SecondaryText.module.css +3 -13
  56. package/es/list/SentimentStatus/SentimentStatus.module.css +1 -4
  57. package/es/list/TagNew/TagNew.module.css +7 -14
  58. package/es/list/Thread/Thread.module.css +1 -13
  59. package/es/list/UserTime/UserTime.module.css +0 -6
  60. package/es/list/listCommon.module.css +1 -9
  61. package/es/list/status/StatusDropdown/StatusDropdown.module.css +6 -19
  62. package/es/list/status/StatusListItem/StatusListItem.module.css +15 -38
  63. package/es/lookup/Lookup/Lookup.module.css +2 -2
  64. package/es/lookup/Section/LookupSection.module.css +2 -2
  65. package/es/lookup/header/Close/LookupClose.module.css +4 -4
  66. package/es/lookup/header/Search/LookupSearch.module.css +12 -21
  67. package/es/lookup/header/TicketHeader/TicketHeader.module.css +2 -5
  68. package/es/lookup/header/ViewDropDown/ViewDropDown.module.css +3 -8
  69. package/es/lookup/header/lookupHeaderCommon.module.css +6 -16
  70. package/es/lookup/header/lookupHeaderCommonResponsive.module.css +3 -12
  71. package/es/setup/header/Button/HeaderButton.module.css +1 -3
  72. package/es/setup/header/Link/HeaderLink.module.css +1 -7
  73. package/es/setup/header/Search/Search.module.css +8 -19
  74. package/es/setup/header/Views/Views.module.css +5 -15
  75. package/es/setup/helptips/Link/HelpTipsLink.module.css +0 -1
  76. package/es/setup/helptips/ListGroup/ListGroup.module.css +1 -6
  77. package/es/setup/table/TableData/SetupTableData.module.css +3 -11
  78. package/es/setup/table/TableHead/SetupTableHead.module.css +0 -4
  79. package/es/setup/table/TableRow/SetupTableRow.module.css +2 -6
  80. package/es/version2/AlertClose/AlertClose.module.css +1 -1
  81. package/es/version2/GlobalNotification/GlobalNotification.module.css +9 -44
  82. package/es/version2/lookup/AlertHeader/AlertHeaderNew.module.css +2 -25
  83. package/es/version2/lookup/AlertLookup/AlertLookupNew.module.css +3 -7
  84. package/es/version2/lookup/alertLookupCommonNew.module.css +1 -8
  85. package/es/version2/notification/DesktopNotification/DesktopNotification.module.css +10 -26
  86. package/es/version2/notification/DesktopNotificationHeader/DesktopNotificationHeader.module.css +10 -47
  87. package/lib/ActionButton/ActionButton.module.css +1 -0
  88. package/lib/FreezeLayer/FreezeLayer.js +4 -31
  89. package/lib/form/fields/CheckBoxField/CheckBoxField.js +1 -1
  90. package/lib/form/fields/CurrencyField/CurrencyField.js +8 -9
  91. package/lib/form/fields/DateField/DateField.js +1 -1
  92. package/lib/form/fields/MultiSelectField/MultiSelectField.js +1 -1
  93. package/lib/form/fields/PhoneField/PhoneField.js +1 -1
  94. package/lib/form/fields/RadioField/RadioField.js +1 -1
  95. package/lib/form/fields/SelectField/SelectField.js +1 -1
  96. package/lib/form/fields/TagsMultiSelect/TagsMultiSelect.js +4 -7
  97. package/lib/form/fields/TextBoxField/TextBoxField.js +1 -1
  98. package/lib/form/fields/TextEditor/TextEditor.module.css +2 -13
  99. package/lib/form/fields/TextareaField/TextareaField.js +1 -1
  100. package/lib/list/status/StatusDropdown/StatusDropdown.js +37 -44
  101. package/lib/setup/header/Views/Views.js +2 -2
  102. package/lib/utils/General.js +24 -0
  103. package/package.json +1 -1
  104. package/lib/AttachmentViewer/Attachment.js +0 -28
  105. package/lib/AttachmentViewer/AttachmentImage.js +0 -129
  106. package/lib/AttachmentViewer/AttachmentViewer.js +0 -618
  107. package/lib/AttachmentViewer/AttachmentViewer.module.css +0 -346
  108. package/lib/AttachmentViewer/utils.js +0 -134
  109. package/lib/Provider/Config.js +0 -21
  110. package/lib/common/dot_animation.module.css +0 -27
  111. package/lib/common/dot_common.module.css +0 -4
  112. package/lib/deprecated/utils/General.js +0 -29
@@ -1,7 +1,5 @@
1
- [dir=ltr] .container {
1
+ .container {
2
2
  padding-left: var(--zd_size20);
3
- }[dir=rtl] .container {
4
- padding-right: var(--zd_size20);
5
3
  }
6
4
  .size70 {
7
5
  flex-basis: var(--zd_size70);
@@ -30,15 +28,9 @@
30
28
  .center {
31
29
  text-align: center;
32
30
  }
33
- [dir=ltr] .left {
31
+ .left {
34
32
  text-align: left;
35
33
  }
36
- [dir=rtl] .left {
34
+ .right {
37
35
  text-align: right;
38
36
  }
39
- [dir=ltr] .right {
40
- text-align: right;
41
- }
42
- [dir=rtl] .right {
43
- text-align: left;
44
- }
@@ -1,11 +1,7 @@
1
1
  .container {
2
2
  border-bottom: 1px solid var(--zdt_setuptablehead_border);
3
- }[dir=ltr] .container {
4
3
  padding-right: var(--zd_size40);
5
4
  padding-left: var(--zd_size40);
6
- }[dir=rtl] .container {
7
- padding-left: var(--zd_size40);
8
- padding-right: var(--zd_size40);
9
5
  }
10
6
  .subContainer {
11
7
  height: var(--zd_size40);
@@ -1,13 +1,9 @@
1
1
  .container {
2
2
  position: relative;
3
- height: var(--zd_size52);
4
- border-bottom: 1px solid var(--zdt_setuptablerow_border);
5
- }[dir=ltr] .container {
6
3
  margin-right: var(--zd_size40);
7
4
  margin-left: var(--zd_size40);
8
- }[dir=rtl] .container {
9
- margin-left: var(--zd_size40);
10
- margin-right: var(--zd_size40);
5
+ border-bottom: 1px solid var(--zdt_setuptablerow_border);
6
+ height: var(--zd_size52);
11
7
  }
12
8
  .container:hover {
13
9
  background-color: var( --zdt_setuptablerow_hover_bg);
@@ -1,9 +1,9 @@
1
1
  .close {
2
2
  width: var(--zd_size25);
3
3
  height: var(--zd_size25);
4
- color: var(--zdt_commonalert_close_icon);
5
4
  border-radius: var(--zd_size4);
6
5
  cursor: pointer;
6
+ color: var(--zdt_commonalert_close_icon);
7
7
  }
8
8
 
9
9
  .closeIcon {
@@ -11,38 +11,25 @@
11
11
  top: 0;
12
12
  z-index: 1000;
13
13
  /*Hook for editor alert*/
14
- pointer-events: none;
15
- text-align: center;
16
- }
17
- [dir=ltr] .message {
18
14
  right: 0;
15
+ text-align: center;
19
16
  left: 0;
20
- }
21
- [dir=rtl] .message {
22
- left: 0;
23
- right: 0;
17
+ pointer-events: none;
24
18
  }
25
19
 
26
20
  .container {
21
+ padding: var(--zd_size18) var(--zd_size70) var(--zd_size19) var(--zd_size75);
27
22
  position: relative;
28
23
  pointer-events: initial;
29
- color: var(--globalnotification_text_color);
30
- max-width: var(--zd_size490);
31
- composes: wbreak from '~@zohodesk/components/lib/common/common.module.css';
32
24
  box-shadow: 0 4px 20px var(--globalnotification_box_shadow);
33
25
  border-radius: 0 0 var(--zd_size10) var(--zd_size10);
34
26
  background-color: var(--globalnotification_bg_color);
35
27
  border-style: solid;
36
28
  border-color: var(--commonalert_border_color);
37
29
  border-width: 2px 1px 1px 1px;
38
- }
39
-
40
- [dir=ltr] .container {
41
- padding: var(--zd_size18) var(--zd_size70) var(--zd_size19) var(--zd_size75);
42
- }
43
-
44
- [dir=rtl] .container {
45
- padding: var(--zd_size18) var(--zd_size75) var(--zd_size19) var(--zd_size70);
30
+ color: var(--globalnotification_text_color);
31
+ max-width: var(--zd_size490);
32
+ composes: wbreak from '~@zohodesk/components/lib/common/common.module.css';
46
33
  }
47
34
 
48
35
  .icon {
@@ -51,15 +38,8 @@
51
38
  position: absolute;
52
39
  top: 0;
53
40
  bottom: 0;
54
- margin: auto 0;
55
- }
56
-
57
- [dir=ltr] .icon {
58
41
  left: var(--zd_size18);
59
- }
60
-
61
- [dir=rtl] .icon {
62
- right: var(--zd_size18);
42
+ margin: auto 0;
63
43
  }
64
44
 
65
45
  .success {
@@ -96,30 +76,15 @@
96
76
  font-size: var(--zd_font_size14);
97
77
  font-family: var(--zd_semibold);
98
78
  composes: ftsmooth from '~@zohodesk/components/lib/common/common.module.css';
99
- line-height: var(--zd_size20);
100
- }
101
-
102
- [dir=ltr] .text {
103
79
  text-align: left;
104
- }
105
-
106
- [dir=rtl] .text {
107
- text-align: right;
80
+ line-height: var(--zd_size20);
108
81
  }
109
82
 
110
83
  .close {
111
84
  position: absolute;
112
85
  top: 0;
113
86
  bottom: 0;
114
- height: var(--zd_size25);
115
- }
116
-
117
- [dir=ltr] .close {
118
87
  right: var(--zd_size12);
119
88
  margin: auto 0 auto var(--zd_size25);
120
- }
121
-
122
- [dir=rtl] .close {
123
- left: var(--zd_size12);
124
- margin: auto var(--zd_size25) auto 0;
89
+ height: var(--zd_size25);
125
90
  }
@@ -11,13 +11,8 @@
11
11
  }
12
12
  .headerLayout {
13
13
  min-height: var(--zd_size54);
14
- }
15
- [dir=ltr] .headerLayout {
16
14
  padding: var(--zd_size15) var(--zd_size45) 0 var(--zd_size20);
17
15
  }
18
- [dir=rtl] .headerLayout {
19
- padding: var(--zd_size15) var(--zd_size20) 0 var(--zd_size45);
20
- }
21
16
 
22
17
  .success {
23
18
  --commonalert_border_color: var(--zdt_commonalert_success_border);
@@ -39,14 +34,10 @@
39
34
  --commonalert_border_color: var(--zdt_commonalert_warning_border);
40
35
  }
41
36
 
42
- [dir=ltr] .extraSmall {
37
+ .extraSmall {
43
38
  padding: var(--zd_size12) var(--zd_size45) var(--zd_size12) var(--zd_size16);
44
39
  }
45
40
 
46
- [dir=rtl] .extraSmall {
47
- padding: var(--zd_size12) var(--zd_size16) var(--zd_size12) var(--zd_size45);
48
- }
49
-
50
41
  .iconContainer {
51
42
  height: var(--zd_size51);
52
43
  width: var(--zd_size51);
@@ -54,6 +45,7 @@
54
45
 
55
46
  .title {
56
47
  color: var(--zdt_alertlookupnew_text);
48
+ margin: 0 var(--zd_size5) 0 var(--zd_size10);
57
49
  font-size: var(--zd_font_size18);
58
50
  line-height: var(--zd_size22);
59
51
  font-family: var(--zd_bold);
@@ -61,14 +53,6 @@
61
53
  vertical-align: middle;
62
54
  }
63
55
 
64
- [dir=ltr] .title {
65
- margin: 0 var(--zd_size5) 0 var(--zd_size10);
66
- }
67
-
68
- [dir=rtl] .title {
69
- margin: 0 var(--zd_size10) 0 var(--zd_size5);
70
- }
71
-
72
56
  .iconStyle {
73
57
  display: block;
74
58
  }
@@ -76,12 +60,5 @@
76
60
  .close {
77
61
  position: absolute;
78
62
  top: var(--zd_size12);
79
- }
80
-
81
- [dir=ltr] .close {
82
63
  right: var(--zd_size12);
83
- }
84
-
85
- [dir=rtl] .close {
86
- left: var(--zd_size12);
87
64
  }
@@ -3,21 +3,17 @@
3
3
  }
4
4
 
5
5
  .innerSection {
6
+ padding: var(--zd_size17) var(--zd_size30) var(--zd_size30);
6
7
  color: var(--zdt_alertlookupnew_text);
7
8
  font-size: var(--zd_font_size14);
8
9
  line-height: var(--zd_size18);
9
10
  composes: wbreak from '~@zohodesk/components/lib/common/common.module.css';
10
- padding: var(--zd_size17) var(--zd_size30) var(--zd_size30);
11
11
  }
12
12
 
13
- [dir=ltr] .buttonGap {
13
+ .buttonGap {
14
14
  margin: 0 0 0 var(--zd_size12);
15
15
  }
16
16
 
17
- [dir=rtl] .buttonGap {
18
- margin: 0 var(--zd_size12) 0 0;
19
- }
20
-
21
17
  .confirmMsgText {
22
18
  margin-top: var(--zd_size20);
23
19
  }
@@ -27,8 +23,8 @@
27
23
  }
28
24
 
29
25
  .footer {
30
- overflow: hidden;
31
26
  border-radius: 0 0 var(--zd_size10) var(--zd_size10);
27
+ overflow: hidden;
32
28
  }
33
29
  .horizontalScroll, .verticalScroll, .bothScroll {
34
30
  height: 100%;
@@ -2,16 +2,9 @@
2
2
 
3
3
  .noteContainer {
4
4
  padding: var(--zd_size4) var(--zd_size30) 0;
5
- }
6
-
7
- [dir=ltr] .noteContainer {
8
5
  border-left: solid 1px var(--zdt_alertlookup_border);
9
6
  }
10
7
 
11
- [dir=rtl] .noteContainer {
12
- border-right: solid 1px var(--zdt_alertlookup_border);
13
- }
14
-
15
8
  .noteTitle {
16
9
  font-size: var(--zd_font_size13);
17
10
  font-family: var(--zd_semibold);
@@ -27,7 +20,7 @@
27
20
  font-size: var(--zd_font_size12);
28
21
  /* line-height: var(--zd_size14); */
29
22
  color: var(--zdt_alertlookuop_text);
23
+ margin-bottom: var(--zd_size15);
30
24
  list-style-type: disc;
31
25
  line-height: initial;
32
- margin-bottom: var(--zd_size15);
33
26
  }
@@ -1,22 +1,17 @@
1
1
  .parentElement {
2
- position: relative;
3
2
  margin-bottom: var(--zd_size7);
3
+ position: relative;
4
4
  }
5
5
  .container {
6
+ background-color: var(--zdt_desktopnotification_bg);
6
7
  color: var(--zdt_desktopnotification_text);
7
8
  transition: all var(--zd_transition4);
8
9
  position: relative;
10
+ transform-origin: right center;
9
11
  max-height: 100%;
10
- pointer-events: auto;
11
- background-color: var(--zdt_desktopnotification_bg);
12
12
  box-shadow: 0 4px 20px var(--zdt_desktopnotification_box_shadow);
13
13
  border-radius: 0 0 var(--zd_size10) var(--zd_size10);
14
- }
15
- [dir=ltr] .container {
16
- transform-origin: right center;
17
- }
18
- [dir=rtl] .container {
19
- transform-origin: left center;
14
+ pointer-events: auto;
20
15
  }
21
16
  .globalNotify {
22
17
  max-width: var(--zd_size490);
@@ -32,17 +27,11 @@
32
27
  /* Animation Style */
33
28
  .closeAnimation {
34
29
  max-height: 0;
35
- transition: all var(--zd_transition3) 0.4s;
36
30
  margin-bottom: 0;
31
+ transition: all var(--zd_transition3) 0.4s;
37
32
  }
38
33
  .animation {
39
34
  composes: modeForward from '~@zohodesk/components/lib/common/animation.module.css';
40
- }
41
- [dir=ltr] .animation {
42
- animation-duration: var(--zd_transition4);
43
- -webkit-animation-duration: var(--zd_transition4);
44
- }
45
- [dir=rtl] .animation {
46
35
  animation-duration: var(--zd_transition4);
47
36
  -webkit-animation-duration: var(--zd_transition4);
48
37
  }
@@ -51,8 +40,8 @@
51
40
  composes: animation;
52
41
  }
53
42
  .leftnoanimate {
54
- opacity: 1;
55
43
  transform: translateX(0) scale(1);
44
+ opacity: 1;
56
45
  }
57
46
  .rightanimate {
58
47
  composes: slideRight from '~@zohodesk/components/lib/common/animation.module.css';
@@ -61,20 +50,15 @@
61
50
  }
62
51
  /* Container Style */
63
52
  .message {
53
+ padding: var(--zd_size10) var(--zd_size20) var(--zd_size10) var(--zd_size76);
54
+ border-top: 1px solid var(--zd_smoke1);
55
+ cursor: pointer;
64
56
  position: relative;
65
57
  color: var(--zd_smoke18);
66
58
  font-size: var(--zd_font_size11);
67
59
  composes: dotted textCap from '~@zohodesk/components/lib/common/common.module.css';
68
60
  height: var(--zd_size33);
69
61
  transition: padding var(--zd_transition3), height var(--zd_transition3);
70
- border-top: 1px solid var(--zd_smoke1);
71
- cursor: pointer;
72
- }
73
- [dir=ltr] .message {
74
- padding: var(--zd_size10) var(--zd_size20) var(--zd_size10) var(--zd_size76);
75
- }
76
- [dir=rtl] .message {
77
- padding: var(--zd_size10) var(--zd_size76) var(--zd_size10) var(--zd_size20);
78
62
  }
79
63
  .message:hover {
80
64
  background: var(--zd_alabaster);
@@ -101,6 +85,6 @@
101
85
  margin-top: var(--zd_size20);
102
86
  }
103
87
  .footer {
104
- overflow: hidden;
105
88
  border-radius: 0 0 var(--zd_size10) var(--zd_size10);
89
+ overflow: hidden;
106
90
  }
@@ -5,27 +5,20 @@
5
5
  composes: varClass;
6
6
  min-height: var(--zd_size54);
7
7
  position: relative;
8
- color: var(--zdt_desktopnotification_text);
9
8
  background-color: var(--alert_lookup_bg_color);
10
9
  border-style: solid;
11
10
  border-color: var(--commonalert_border_color);
12
11
  border-width: 2px 0 0 0;
12
+ color: var(--zdt_desktopnotification_text);
13
13
  }
14
14
 
15
15
  .title {
16
+ margin: 0 var(--zd_size5) 0 var(--zd_size10);
16
17
  font-size: var(--zd_font_size18);
17
18
  line-height: var(--zd_size22);
18
19
  font-family: var(--zd_bold);
19
20
  composes: ftsmooth wbreak from '~@zohodesk/components/lib/common/common.module.css';
20
21
  }
21
-
22
- [dir=ltr] .title {
23
- margin: 0 var(--zd_size5) 0 var(--zd_size10);
24
- }
25
-
26
- [dir=rtl] .title {
27
- margin: 0 var(--zd_size10) 0 var(--zd_size5);
28
- }
29
22
 
30
23
  .infoText {
31
24
  font-size: var(--zd_font_size14);
@@ -57,11 +50,8 @@
57
50
 
58
51
 
59
52
  /* Primary Header */
60
- [dir=ltr] .primary {
61
- padding: var(--zd_size15) var(--zd_size45) 0 var(--zd_size20);
62
- }
63
- [dir=rtl] .primary {
64
- padding: var(--zd_size15) var(--zd_size20) 0 var(--zd_size45);
53
+ .primary {
54
+ padding: var(--zd_size15) var(--zd_size45) 0 var(--zd_size20);
65
55
  }
66
56
 
67
57
  .primary .iconContainer {
@@ -76,26 +66,14 @@
76
66
  .primary .close {
77
67
  position: absolute;
78
68
  top: var(--zd_size12);
79
- }
80
-
81
- [dir=ltr] .primary .close {
82
- right: var(--zd_size12);
83
- }
84
-
85
- [dir=rtl] .primary .close {
86
- left: var(--zd_size12);
69
+ right: var(--zd_size12);
87
70
  }
88
71
 
89
72
  /* Secondary Header */
90
73
  .secondary {
91
- composes: wbreak from '~@zohodesk/components/lib/common/common.module.css';
74
+ padding: var(--zd_size18) var(--zd_size70) var(--zd_size19) var(--zd_size75);
92
75
  border-radius: 0 0 var(--zd_size10) var(--zd_size10);
93
- }
94
- [dir=ltr] .secondary {
95
- padding: var(--zd_size18) var(--zd_size70) var(--zd_size19) var(--zd_size75);
96
- }
97
- [dir=rtl] .secondary {
98
- padding: var(--zd_size18) var(--zd_size75) var(--zd_size19) var(--zd_size70);
76
+ composes: wbreak from '~@zohodesk/components/lib/common/common.module.css';
99
77
  }
100
78
 
101
79
  .secondary .infoText {
@@ -108,30 +86,15 @@
108
86
  position: absolute;
109
87
  top: 0;
110
88
  bottom: 0;
89
+ left: var(--zd_size18);
111
90
  margin: auto 0;
112
91
  }
113
92
 
114
- [dir=ltr] .secondary .iconContainer {
115
- left: var(--zd_size18);
116
- }
117
-
118
- [dir=rtl] .secondary .iconContainer {
119
- right: var(--zd_size18);
120
- }
121
-
122
93
  .secondary .close {
123
94
  position: absolute;
124
95
  top: 0;
125
96
  bottom: 0;
97
+ right: var(--zd_size12);
98
+ margin: auto 0 auto var(--zd_size25);
126
99
  height: var(--zd_size25);
127
- }
128
-
129
- [dir=ltr] .secondary .close {
130
- right: var(--zd_size12);
131
- margin: auto 0 auto var(--zd_size25);
132
- }
133
-
134
- [dir=rtl] .secondary .close {
135
- left: var(--zd_size12);
136
- margin: auto var(--zd_size25) auto 0;
137
100
  }
@@ -119,6 +119,7 @@
119
119
  .btn {
120
120
  height: 100%;
121
121
  width: 100%;
122
+ color:var(--dot_mirror)
122
123
  }
123
124
  .popupWrapper {
124
125
  padding: var(--zd_size10) 0;
@@ -17,9 +17,9 @@ var _VelocityAnimationGroup = _interopRequireDefault(require("@zohodesk/componen
17
17
 
18
18
  var _FreezeLayerModule = _interopRequireDefault(require("./FreezeLayer.module.css"));
19
19
 
20
- var _ZindexProvider = require("@zohodesk/components/lib/Provider/ZindexProvider");
20
+ var _KeyboardApi = require("../utils/KeyboardApi");
21
21
 
22
- var _Config = require("../Provider/Config");
22
+ var _ZindexProvider = require("@zohodesk/components/lib/Provider/ZindexProvider");
23
23
 
24
24
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
25
25
 
@@ -63,29 +63,10 @@ var FreezeLayer = /*#__PURE__*/function (_Component) {
63
63
  isChildActive: false
64
64
  };
65
65
  _this.getNextIndex = (0, _ZindexProvider.getZIndex)(_assertThisInitialized(_this));
66
- _this.isFreezeLayerEnabled = false;
67
66
  return _this;
68
67
  }
69
68
 
70
69
  _createClass(FreezeLayer, [{
71
- key: "enableFreeze",
72
- value: function enableFreeze() {
73
- if (!this.isFreezeLayerEnabled) {
74
- this.isFreezeLayerEnabled = true;
75
- var freezeLayerEnable = ((0, _Config.getDotLibraryConfig)('freezeLayer') || {}).enable;
76
- freezeLayerEnable && freezeLayerEnable();
77
- }
78
- }
79
- }, {
80
- key: "disableFreeze",
81
- value: function disableFreeze() {
82
- if (this.isFreezeLayerEnabled) {
83
- this.isFreezeLayerEnabled = false;
84
- var freezeLayerDisable = ((0, _Config.getDotLibraryConfig)('freezeLayer') || {}).disable;
85
- freezeLayerDisable && freezeLayerDisable();
86
- }
87
- }
88
- }, {
89
70
  key: "componentDidMount",
90
71
  value: function componentDidMount() {
91
72
  var isActive = this.props.isActive;
@@ -94,7 +75,6 @@ var FreezeLayer = /*#__PURE__*/function (_Component) {
94
75
  this.setState({
95
76
  isChildActive: true
96
77
  });
97
- this.enableFreeze();
98
78
  }
99
79
  }
100
80
  }, {
@@ -106,8 +86,7 @@ var FreezeLayer = /*#__PURE__*/function (_Component) {
106
86
 
107
87
  if (isActive != prevProps.isActive) {
108
88
  if (isActive) {
109
- this.enableFreeze(); // Shortcut && Shortcut.setState(false);
110
-
89
+ _KeyboardApi.Shortcut && _KeyboardApi.Shortcut.setState(false);
111
90
  this.setState({
112
91
  isActive: true
113
92
  }, function () {
@@ -116,8 +95,7 @@ var FreezeLayer = /*#__PURE__*/function (_Component) {
116
95
  });
117
96
  });
118
97
  } else {
119
- this.disableFreeze(); // Shortcut && Shortcut.setState(true);
120
-
98
+ _KeyboardApi.Shortcut && _KeyboardApi.Shortcut.setState(true);
121
99
  this.setState({
122
100
  isChildActive: false
123
101
  }, function () {
@@ -128,11 +106,6 @@ var FreezeLayer = /*#__PURE__*/function (_Component) {
128
106
  }
129
107
  }
130
108
  }
131
- }, {
132
- key: "componentWillUnmount",
133
- value: function componentWillUnmount() {
134
- this.disableFreeze();
135
- }
136
109
  }, {
137
110
  key: "render",
138
111
  value: function render() {
@@ -154,7 +154,7 @@ var CheckBoxField = /*#__PURE__*/function (_PureComponent) {
154
154
 
155
155
  return /*#__PURE__*/_react["default"].createElement("div", {
156
156
  className: "".concat(_FieldsModule["default"].container, " ").concat(isDisabled ? _FieldsModule["default"].disabled : isReadOnly ? _FieldsModule["default"].readonly : ''),
157
- "data-title": isDisabled ? title : null
157
+ "data-title": isDisabled ? title : ''
158
158
  }, isDirectCol && labelElement, /*#__PURE__*/_react["default"].createElement("div", {
159
159
  className: "".concat(isDirectCol ? _FieldsModule["default"].fieldContainer : _FieldsModule["default"].checkboxFieldContainer, " ").concat(isDirectCol && labelName ? _FieldsModule["default"]["fieldMargin_".concat(fieldSize)] : '')
160
160
  }, /*#__PURE__*/_react["default"].createElement(_Layout.Container, {
@@ -23,6 +23,8 @@ var _Icon = _interopRequireDefault(require("@zohodesk/icons/lib/Icon"));
23
23
 
24
24
  var _FieldsModule = _interopRequireDefault(require("../Fields.module.css"));
25
25
 
26
+ var _General = require("../../../utils/General");
27
+
26
28
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
27
29
 
28
30
  function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
@@ -143,8 +145,7 @@ var CurrencyField = /*#__PURE__*/function (_PureComponent) {
143
145
  needReadOnlyStyle = _this$props3.needReadOnlyStyle,
144
146
  isClickable = _this$props3.isClickable,
145
147
  userCurrencyType = _this$props3.userCurrencyType,
146
- customProps = _this$props3.customProps,
147
- formatCurrency = _this$props3.formatCurrency;
148
+ customProps = _this$props3.customProps;
148
149
  var _customProps$LabelPro = customProps.LabelProps,
149
150
  LabelProps = _customProps$LabelPro === void 0 ? {} : _customProps$LabelPro,
150
151
  _customProps$TextBoxP = customProps.TextBoxProps,
@@ -156,8 +157,8 @@ var CurrencyField = /*#__PURE__*/function (_PureComponent) {
156
157
  var isActive = this.state.isActive;
157
158
  var formatValue = value;
158
159
 
159
- if (!isActive) {
160
- formatValue = formatCurrency(value, userCurrencyType);
160
+ if (!isActive && value != 0) {
161
+ formatValue = (0, _General.formatCurrency)(value, userCurrencyType);
161
162
  } else {
162
163
  formatValue = value;
163
164
  }
@@ -165,7 +166,7 @@ var CurrencyField = /*#__PURE__*/function (_PureComponent) {
165
166
  var uniqueId = htmlId ? htmlId : this.getNextId();
166
167
  return /*#__PURE__*/_react["default"].createElement("div", {
167
168
  className: "".concat(_FieldsModule["default"].container, " ").concat(isDisabled ? _FieldsModule["default"].disabled : isReadOnly ? _FieldsModule["default"].readonly : ''),
168
- "data-title": isDisabled ? title : null
169
+ "data-title": isDisabled ? title : ''
169
170
  }, labelName && /*#__PURE__*/_react["default"].createElement("div", {
170
171
  className: _FieldsModule["default"].labelContainer
171
172
  }, /*#__PURE__*/_react["default"].createElement(_Label["default"], _extends({
@@ -265,8 +266,7 @@ CurrencyField.propTypes = {
265
266
  TextBoxProps: _propTypes["default"].object,
266
267
  ValidationMessageProps1: _propTypes["default"].object,
267
268
  ValidationMessageProps2: _propTypes["default"].object
268
- }),
269
- formatCurrency: _propTypes["default"].func
269
+ })
270
270
  };
271
271
  CurrencyField.defaultProps = {
272
272
  errorType: 'primary',
@@ -282,8 +282,7 @@ CurrencyField.defaultProps = {
282
282
  labelCustomClass: '',
283
283
  isClickable: false,
284
284
  needReadOnlyStyle: true,
285
- customProps: {},
286
- formatCurrency: function formatCurrency() {}
285
+ customProps: {}
287
286
  };
288
287
 
289
288
  if (false) {
@@ -172,7 +172,7 @@ var DateField = /*#__PURE__*/function (_PureComponent) {
172
172
  var getAriaId = htmlId ? htmlId : this.getNextId();
173
173
  return /*#__PURE__*/_react["default"].createElement("div", {
174
174
  className: "".concat(_FieldsModule["default"].container, " ").concat(isDisabled ? _FieldsModule["default"].disabled : isReadOnly ? _FieldsModule["default"].readonly : ''),
175
- "data-title": isDisabled ? title : null
175
+ "data-title": isDisabled ? title : ''
176
176
  }, labelName && /*#__PURE__*/_react["default"].createElement("div", {
177
177
  className: _FieldsModule["default"].labelContainer
178
178
  }, /*#__PURE__*/_react["default"].createElement(_Label["default"], _extends({
@@ -185,7 +185,7 @@ var MultiSelectField = /*#__PURE__*/function (_PureComponent) {
185
185
  var uniqueId = htmlId ? htmlId : this.getNextId();
186
186
  return /*#__PURE__*/_react["default"].createElement("div", {
187
187
  className: "".concat(_FieldsModule["default"].container, " ").concat(isDisabled ? _FieldsModule["default"].disabled : isReadOnly ? _FieldsModule["default"].readonly : ''),
188
- "data-title": isDisabled ? title : null
188
+ "data-title": isDisabled ? title : ''
189
189
  }, labelName && /*#__PURE__*/_react["default"].createElement("div", {
190
190
  className: _FieldsModule["default"].labelContainer
191
191
  }, /*#__PURE__*/_react["default"].createElement(_Label["default"], _extends({
@@ -169,7 +169,7 @@ var PhoneField = /*#__PURE__*/function (_PureComponent) {
169
169
  return /*#__PURE__*/_react["default"].createElement(_Layout.Container, {
170
170
  alignBox: "row",
171
171
  className: "".concat(_FieldsModule["default"].container, " ").concat(isDisabled ? _FieldsModule["default"].disabled : ''),
172
- "data-title": isDisabled ? title : null
172
+ "data-title": isDisabled ? title : ''
173
173
  }, /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
174
174
  flexible: true
175
175
  }, /*#__PURE__*/_react["default"].createElement(_TextBoxField["default"], _extends({
@@ -106,7 +106,7 @@ var RadioField = /*#__PURE__*/function (_PureComponent) {
106
106
  ValidationMessageProps2 = _customProps$Validati2 === void 0 ? {} : _customProps$Validati2;
107
107
  return /*#__PURE__*/_react["default"].createElement("div", {
108
108
  className: "".concat(_FieldsModule["default"].container, " ").concat(isDisabled ? _FieldsModule["default"].disabled : isReadOnly ? _FieldsModule["default"].readonly : ''),
109
- "data-title": isDisabled ? title : null
109
+ "data-title": isDisabled ? title : ''
110
110
  }, labelName && /*#__PURE__*/_react["default"].createElement(_Label["default"], _extends({
111
111
  text: labelName,
112
112
  size: "medium",