@zohodesk/dot 1.9.9 → 1.9.11

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 (168) hide show
  1. package/README.md +16 -0
  2. package/es/ActionButton/ActionButton.js +18 -8
  3. package/es/ActionButton/ActionButton.module.css +12 -11
  4. package/es/ActionButton/__tests__/__snapshots__/ActionButton.spec.js.snap +47 -60
  5. package/es/ActionButton/props/defaultProps.js +2 -1
  6. package/es/ActionButton/props/propTypes.js +4 -1
  7. package/es/AlphabeticList/AlphabeticList.module.css +7 -8
  8. package/es/Attachment/Attachment.module.css +9 -10
  9. package/es/AttachmentViewer/AttachmentViewer.module.css +24 -45
  10. package/es/AudioPlayer/AudioPlayer.module.css +5 -8
  11. package/es/DotProvider/DotProvider.js +2 -0
  12. package/es/DotProvider/__tests__/DotProvider.spec.js +106 -0
  13. package/es/DotProvider/hooks/useDotProvider.js +4 -2
  14. package/es/DotProvider/hooks/useDownloadAssetsAndSetAttr.js +44 -15
  15. package/es/DotProvider/props/defaultProps.js +2 -0
  16. package/es/DotProvider/props/propTypes.js +1 -0
  17. package/es/Drawer/Drawer.module.css +17 -64
  18. package/es/FormAction/FormAction.module.css +20 -54
  19. package/es/ImportantNotes/ImportantNotes.module.css +2 -9
  20. package/es/Message/Message.module.css +3 -16
  21. package/es/MessageBanner/MessageBanner.module.css +4 -13
  22. package/es/Separator/Separator.module.css +2 -1
  23. package/es/TagWithIcon/TagWithIcon.module.css +5 -8
  24. package/es/ToastMessage/ToastMessage.module.css +16 -30
  25. package/es/Upload/Upload.module.css +7 -9
  26. package/es/alert/AlertHeader/AlertHeader.module.css +11 -25
  27. package/es/alert/AlertLookup/AlertLookup.module.css +9 -10
  28. package/es/avatar/AvatarCollision/AvatarCollision.module.css +1 -1
  29. package/es/avatar/AvatarWithTeam/AvatarWithTeam.module.css +1 -1
  30. package/es/dropdown/ToggleDropDown/ToggleDropDown.module.css +16 -16
  31. package/es/emptystate/CommonEmptyState/CommonEmptyState.module.css +7 -9
  32. package/es/emptystate/EditionPage/EditionPage.css +7 -4
  33. package/es/errorstate/EmptyStates.module.css +7 -8
  34. package/es/errorstate/Inconvenience/Inconvenience.module.css +2 -5
  35. package/es/errorstate/NoRequestFound/NoRequestFound.module.css +1 -1
  36. package/es/errorstate/PermissionPlay/PermissionPlay.module.css +5 -4
  37. package/es/errorstate/RequestUrlNotFound/RequestUrlNotFound.module.css +1 -1
  38. package/es/errorstate/UnableToProcess/UnableToProcess.module.css +1 -1
  39. package/es/errorstate/UnauthorizedLogin/UnauthorizedLogin.module.css +1 -1
  40. package/es/errorstate/WillBack/WillBack.module.css +6 -4
  41. package/es/form/fields/Fields.module.css +23 -68
  42. package/es/form/fields/TagsMultiSelect/TagsMultiSelect.module.css +11 -16
  43. package/es/form/fields/TagsMultiSelectField/TagsMultiSelectField.module.css +1 -4
  44. package/es/form/fields/TextEditor/TextEditor.module.css +40 -66
  45. package/es/form/fields/TextEditorWrapper/TextEditorWrapper.module.css +2 -7
  46. package/es/form/fields/ValidationMessage/ValidationMessage.module.css +4 -3
  47. package/es/layout/SetupDetailLayout/SetupDetailLayout.module.css +14 -36
  48. package/es/layout/SubtabLayout/SubtabLayout.module.css +33 -46
  49. package/es/list/BluePrintStatus/BluePrintStatus.module.css +1 -4
  50. package/es/list/Comment/Comment.module.css +2 -1
  51. package/es/list/Dot/Dot.module.css +4 -2
  52. package/es/list/GridStencils/GridStencils.module.css +7 -9
  53. package/es/list/ListLayout/ListLayout.module.css +7 -4
  54. package/es/list/ListStencils/ListStencils.module.css +14 -15
  55. package/es/list/SecondaryText/SecondaryText.module.css +4 -13
  56. package/es/list/SentimentStatus/SentimentStatus.module.css +2 -4
  57. package/es/list/TagNew/TagNew.module.css +3 -2
  58. package/es/list/listCommon.module.css +3 -7
  59. package/es/list/status/StatusDropdown/StatusDropdown.module.css +17 -17
  60. package/es/list/status/StatusListItem/StatusListItem.module.css +10 -18
  61. package/es/lookup/EmptyPage/LookupEmptyPage.module.css +4 -3
  62. package/es/lookup/Lookup/Lookup.module.css +2 -2
  63. package/es/lookup/header/Search/LookupSearch.module.css +10 -23
  64. package/es/lookup/header/TicketHeader/TicketHeader.module.css +3 -2
  65. package/es/lookup/header/ViewDropDown/ViewDropDown.module.css +8 -12
  66. package/es/lookup/header/lookupHeaderCommon.module.css +8 -7
  67. package/es/lookup/header/lookupHeaderCommonResponsive.module.css +2 -6
  68. package/es/setup/header/Button/HeaderButton.module.css +2 -4
  69. package/es/setup/header/Link/HeaderLink.module.css +3 -9
  70. package/es/setup/header/Search/Search.module.css +2 -10
  71. package/es/setup/header/Views/Views.module.css +1 -4
  72. package/es/setup/helptips/Description/HelpTipsDescription.module.css +2 -1
  73. package/es/setup/helptips/Link/HelpTipsLink.module.css +2 -2
  74. package/es/setup/helptips/ListGroup/ListGroup.module.css +2 -6
  75. package/es/setup/table/TableData/SetupTableData.module.css +2 -4
  76. package/es/setup/table/TableHead/SetupTableHead.module.css +1 -6
  77. package/es/setup/table/TableRow/SetupTableRow.module.css +2 -7
  78. package/es/version2/GlobalNotification/GlobalNotification.module.css +7 -12
  79. package/es/version2/errorstate/V2_ErrorStates.module.css +5 -5
  80. package/es/version2/lookup/AlertHeader/css/AlertHeaderNew.module.css +8 -23
  81. package/es/version2/lookup/AlertLookup/AlertLookupNew.module.css +9 -10
  82. package/es/version2/lookup/alertLookupCommonNew.module.css +6 -4
  83. package/es/version2/notification/DesktopNotification/DesktopNotification.module.css +8 -11
  84. package/es/version2/notification/DesktopNotificationHeader/DesktopNotificationHeader.module.css +10 -22
  85. package/lib/ActionButton/ActionButton.js +17 -8
  86. package/lib/ActionButton/ActionButton.module.css +12 -11
  87. package/lib/ActionButton/__tests__/__snapshots__/ActionButton.spec.js.snap +47 -60
  88. package/lib/ActionButton/props/defaultProps.js +2 -1
  89. package/lib/ActionButton/props/propTypes.js +4 -1
  90. package/lib/AlphabeticList/AlphabeticList.module.css +7 -8
  91. package/lib/Attachment/Attachment.module.css +9 -10
  92. package/lib/AttachmentViewer/AttachmentViewer.module.css +24 -45
  93. package/lib/AudioPlayer/AudioPlayer.module.css +5 -8
  94. package/lib/DotProvider/DotProvider.js +3 -1
  95. package/lib/DotProvider/__tests__/DotProvider.spec.js +216 -0
  96. package/lib/DotProvider/hooks/useDotProvider.js +4 -2
  97. package/lib/DotProvider/hooks/useDownloadAssetsAndSetAttr.js +46 -15
  98. package/lib/DotProvider/props/defaultProps.js +3 -0
  99. package/lib/DotProvider/props/propTypes.js +1 -0
  100. package/lib/Drawer/Drawer.module.css +17 -64
  101. package/lib/FormAction/FormAction.module.css +20 -54
  102. package/lib/ImportantNotes/ImportantNotes.module.css +2 -9
  103. package/lib/Message/Message.module.css +3 -16
  104. package/lib/MessageBanner/MessageBanner.module.css +4 -13
  105. package/lib/Separator/Separator.module.css +2 -1
  106. package/lib/TagWithIcon/TagWithIcon.module.css +5 -8
  107. package/lib/ToastMessage/ToastMessage.module.css +16 -30
  108. package/lib/Upload/Upload.module.css +7 -9
  109. package/lib/alert/AlertHeader/AlertHeader.module.css +11 -25
  110. package/lib/alert/AlertLookup/AlertLookup.module.css +9 -10
  111. package/lib/avatar/AvatarCollision/AvatarCollision.module.css +1 -1
  112. package/lib/avatar/AvatarWithTeam/AvatarWithTeam.module.css +1 -1
  113. package/lib/dropdown/ToggleDropDown/ToggleDropDown.module.css +16 -16
  114. package/lib/emptystate/CommonEmptyState/CommonEmptyState.module.css +7 -9
  115. package/lib/emptystate/EditionPage/EditionPage.css +7 -4
  116. package/lib/errorstate/EmptyStates.module.css +7 -8
  117. package/lib/errorstate/Inconvenience/Inconvenience.module.css +2 -5
  118. package/lib/errorstate/NoRequestFound/NoRequestFound.module.css +1 -1
  119. package/lib/errorstate/PermissionPlay/PermissionPlay.module.css +5 -4
  120. package/lib/errorstate/RequestUrlNotFound/RequestUrlNotFound.module.css +1 -1
  121. package/lib/errorstate/UnableToProcess/UnableToProcess.module.css +1 -1
  122. package/lib/errorstate/UnauthorizedLogin/UnauthorizedLogin.module.css +1 -1
  123. package/lib/errorstate/WillBack/WillBack.module.css +6 -4
  124. package/lib/form/fields/Fields.module.css +23 -68
  125. package/lib/form/fields/TagsMultiSelect/TagsMultiSelect.module.css +11 -16
  126. package/lib/form/fields/TagsMultiSelectField/TagsMultiSelectField.module.css +1 -4
  127. package/lib/form/fields/TextEditor/TextEditor.module.css +40 -66
  128. package/lib/form/fields/TextEditorWrapper/TextEditorWrapper.module.css +2 -7
  129. package/lib/form/fields/ValidationMessage/ValidationMessage.module.css +4 -3
  130. package/lib/layout/SetupDetailLayout/SetupDetailLayout.module.css +14 -36
  131. package/lib/layout/SubtabLayout/SubtabLayout.module.css +33 -46
  132. package/lib/list/BluePrintStatus/BluePrintStatus.module.css +1 -4
  133. package/lib/list/Comment/Comment.module.css +2 -1
  134. package/lib/list/Dot/Dot.module.css +4 -2
  135. package/lib/list/GridStencils/GridStencils.module.css +7 -9
  136. package/lib/list/ListLayout/ListLayout.module.css +7 -4
  137. package/lib/list/ListStencils/ListStencils.module.css +14 -15
  138. package/lib/list/SecondaryText/SecondaryText.module.css +4 -13
  139. package/lib/list/SentimentStatus/SentimentStatus.module.css +2 -4
  140. package/lib/list/TagNew/TagNew.module.css +3 -2
  141. package/lib/list/listCommon.module.css +3 -7
  142. package/lib/list/status/StatusDropdown/StatusDropdown.module.css +17 -17
  143. package/lib/list/status/StatusListItem/StatusListItem.module.css +10 -18
  144. package/lib/lookup/EmptyPage/LookupEmptyPage.module.css +4 -3
  145. package/lib/lookup/Lookup/Lookup.module.css +2 -2
  146. package/lib/lookup/header/Search/LookupSearch.module.css +10 -23
  147. package/lib/lookup/header/TicketHeader/TicketHeader.module.css +3 -2
  148. package/lib/lookup/header/ViewDropDown/ViewDropDown.module.css +8 -12
  149. package/lib/lookup/header/lookupHeaderCommon.module.css +8 -7
  150. package/lib/lookup/header/lookupHeaderCommonResponsive.module.css +2 -6
  151. package/lib/setup/header/Button/HeaderButton.module.css +2 -4
  152. package/lib/setup/header/Link/HeaderLink.module.css +3 -9
  153. package/lib/setup/header/Search/Search.module.css +2 -10
  154. package/lib/setup/header/Views/Views.module.css +1 -4
  155. package/lib/setup/helptips/Description/HelpTipsDescription.module.css +2 -1
  156. package/lib/setup/helptips/Link/HelpTipsLink.module.css +2 -2
  157. package/lib/setup/helptips/ListGroup/ListGroup.module.css +2 -6
  158. package/lib/setup/table/TableData/SetupTableData.module.css +2 -4
  159. package/lib/setup/table/TableHead/SetupTableHead.module.css +1 -6
  160. package/lib/setup/table/TableRow/SetupTableRow.module.css +2 -7
  161. package/lib/version2/GlobalNotification/GlobalNotification.module.css +7 -12
  162. package/lib/version2/errorstate/V2_ErrorStates.module.css +5 -5
  163. package/lib/version2/lookup/AlertHeader/css/AlertHeaderNew.module.css +8 -23
  164. package/lib/version2/lookup/AlertLookup/AlertLookupNew.module.css +9 -10
  165. package/lib/version2/lookup/alertLookupCommonNew.module.css +6 -4
  166. package/lib/version2/notification/DesktopNotification/DesktopNotification.module.css +8 -11
  167. package/lib/version2/notification/DesktopNotificationHeader/DesktopNotificationHeader.module.css +10 -22
  168. package/package.json +18 -18
@@ -3,10 +3,10 @@
3
3
  background-color: var(--zdt_emptystate_default_bg);
4
4
  }
5
5
  .container {
6
- padding-top: var(--zd_size80) ;
6
+ padding-block-start: var(--zd_size80) ;
7
7
  }
8
8
  .tabletContainer {
9
- padding-top: var(--zd_size50) ;
9
+ padding-block-start: var(--zd_size50) ;
10
10
  }
11
11
  .top {
12
12
  position: relative;
@@ -26,11 +26,9 @@
26
26
  .tabletTitle,
27
27
  .mobileTitle {
28
28
  composes: semibold from '~@zohodesk/components/es/common/common.module.css';
29
+ margin-block-end: var(--zd_size5) ;
29
30
  letter-spacing: var(--zd_size1);
30
31
  }
31
- .title, .tabletTitle, .mobileTitle {
32
- margin-bottom: var(--zd_size5) ;
33
- }
34
32
  .title {
35
33
  font-size: var(--zd_font_size50) ;
36
34
  line-height: 1.4;
@@ -65,8 +63,9 @@
65
63
  .footerWidth {
66
64
  min-width: var(--zd_size400) ;
67
65
  }
68
- .btmText, .tabletBtmText {
69
- margin-bottom: var(--zd_size10) ;
66
+ .btmText,
67
+ .tabletBtmText {
68
+ margin-block-end: var(--zd_size10) ;
70
69
  }
71
70
  .btmText {
72
71
  font-size: var(--zd_font_size14) ;
@@ -85,4 +84,4 @@
85
84
  }
86
85
  .tabletImageContainer {
87
86
  height: var(--zd_size350) ;
88
- }
87
+ }
@@ -1,7 +1,4 @@
1
1
  .imageContainer {
2
- margin-top: calc( var(--zd_size35) * -1 ) ;
3
- }[dir=ltr] .imageContainer {
4
- margin-left: calc( var(--zd_size30) * -1 ) ;
5
- }[dir=rtl] .imageContainer {
6
- margin-right: calc( var(--zd_size30) * -1 ) ;
2
+ margin-block-start: calc( var(--zd_size35) * -1 ) ;
3
+ margin-inline-start: calc( var(--zd_size30) * -1 ) ;
7
4
  }
@@ -1,3 +1,3 @@
1
1
  .imageContainer {
2
- margin-top: calc( var(--zd_size60) * -1 ) ;
2
+ margin-block-start: calc( var(--zd_size60) * -1 ) ;
3
3
  }
@@ -1,8 +1,8 @@
1
1
  .headtingText {
2
2
  font-weight: var(--zd-fw-semibold);
3
3
  font-size: var(--zd_font_size50) ;
4
+ margin-block-end: var(--zd_size5) ;
4
5
  letter-spacing: var(--zd_size1);
5
- margin-bottom: var(--zd_size5) ;
6
6
  }
7
7
  .title,
8
8
  .headtingText,
@@ -15,15 +15,16 @@
15
15
  .lastBox {
16
16
  line-height: 1.7143;
17
17
  font-size: var(--zd_font_size14) ;
18
+ margin-block-end: var(--zd_size20) ;
18
19
  margin: 0 auto ;
19
- margin-bottom: var(--zd_size20) ;
20
20
  }
21
21
  .lineText {
22
- margin: 0 var(--zd_size4) ;
22
+ margin-inline: var(--zd_size4) ;
23
+ margin-block:0 ;
23
24
  }
24
25
  .imageContainer {
25
26
  height: var(--zd_size400) ;
26
- margin-bottom: var(--zd_size30) ;
27
+ margin-block-end: var(--zd_size30) ;
27
28
  }
28
29
 
29
30
  .min {
@@ -1,3 +1,3 @@
1
1
  .imageContainer {
2
- margin-top: calc( var(--zd_size60) * -1 ) ;
2
+ margin-block-start: calc( var(--zd_size60) * -1 ) ;
3
3
  }
@@ -1,3 +1,3 @@
1
1
  .imageContainer {
2
- margin-top: calc( var(--zd_size40) * -1 ) ;
2
+ margin-block-start: calc( var(--zd_size40) * -1 ) ;
3
3
  }
@@ -1,3 +1,3 @@
1
1
  .imageContainer {
2
- margin-top: calc( var(--zd_size10) * -1 ) ;
2
+ margin-block-start: calc( var(--zd_size10) * -1 ) ;
3
3
  }
@@ -16,9 +16,11 @@
16
16
  .header {
17
17
  min-width: var(--zd_size450) ;
18
18
  }
19
- .imageContainer, .tabletImageContainer, .mobileImageContainer {
20
- margin-top: calc( var(--zd_size70) * -1 ) ;
21
- margin-bottom: var(--zd_size30) ;
19
+ .imageContainer,
20
+ .tabletImageContainer,
21
+ .mobileImageContainer {
22
+ margin-block-start: calc( var(--zd_size70) * -1 ) ;
23
+ margin-block-end: var(--zd_size30) ;
22
24
  }
23
25
  .imageContainer {
24
26
  height: var(--zd_size450) ;
@@ -30,5 +32,5 @@
30
32
  height: var(--zd_size350) ;
31
33
  }
32
34
  .bottomSpace {
33
- margin-bottom: var(--zd_size20) ;
35
+ margin-block-end: var(--zd_size20) ;
34
36
  }
@@ -10,15 +10,15 @@
10
10
  }
11
11
 
12
12
  .fieldMargin_large {
13
- margin-top: var(--zd_size10) ;
13
+ margin-block-start: var(--zd_size10) ;
14
14
  }
15
15
 
16
16
  .fieldMargin_medium {
17
- margin-top: var(--zd_size5) ;
17
+ margin-block-start: var(--zd_size5) ;
18
18
  }
19
19
 
20
20
  .fieldMargin_small {
21
- margin-top: 0 ;
21
+ margin-block-start: 0 ;
22
22
  }
23
23
 
24
24
  .radioContainer,
@@ -48,18 +48,11 @@
48
48
  }
49
49
 
50
50
  .checkboxText {
51
+ padding-inline-start: var(--zd_size6) ;
51
52
  composes: wbreak from '~@zohodesk/components/es/common/common.module.css';
52
53
  line-height: normal;
53
54
  }
54
55
 
55
- [dir=ltr] .checkboxText {
56
- padding-left: var(--zd_size6) ;
57
- }
58
-
59
- [dir=rtl] .checkboxText {
60
- padding-right: var(--zd_size6) ;
61
- }
62
-
63
56
  .cbTextPointer {
64
57
  cursor: pointer;
65
58
  }
@@ -74,12 +67,9 @@
74
67
  --label_cursor: not-allowed;
75
68
  }
76
69
 
77
- [dir=ltr] .radio {
78
- margin: var(--zd_size5) var(--zd_size32) var(--zd_size5) 0 ;
79
- }
80
-
81
- [dir=rtl] .radio {
82
- margin: var(--zd_size5) 0 var(--zd_size5) var(--zd_size32) ;
70
+ .radio {
71
+ margin-block: var(--zd_size5) ;
72
+ margin-inline: 0 var(--zd_size32) ;
83
73
  }
84
74
 
85
75
  .radio,
@@ -99,12 +89,14 @@
99
89
  }
100
90
 
101
91
  .radioBox.primaryTextOnly {
92
+ padding-inline: var(--zd_size10) ;
93
+ padding-block:0 ;
102
94
  height: var(--zd_size36) ;
103
- padding: 0 var(--zd_size10) ;
104
95
  }
105
96
 
106
97
  .radioBox.withSecondaryText {
107
- padding: var(--zd_size18) var(--zd_size16) ;
98
+ padding-block: var(--zd_size18) ;
99
+ padding-inline:var(--zd_size16) ;
108
100
  }
109
101
 
110
102
  .hoverableRadioBox:hover, .radioBoxActive {
@@ -115,12 +107,8 @@
115
107
  background-color: var(--zdt_radiofield_box_active_bg)
116
108
  }
117
109
 
118
- [dir=ltr] .duration {
119
- margin-right: var(--zd_size15) ;
120
- }
121
-
122
- [dir=rtl] .duration {
123
- margin-left: var(--zd_size15) ;
110
+ .duration {
111
+ margin-inline-end: var(--zd_size15) ;
124
112
  }
125
113
 
126
114
  .durationWidth {
@@ -139,8 +127,9 @@
139
127
 
140
128
  .phoneIcon {
141
129
  color: var(--zdt_fields_phoneicon_icon);
130
+ margin-block: var(--zd_size15) 0 ;
131
+ margin-inline:var(--zd_size10) ;
142
132
  display: inline-block;
143
- margin: var(--zd_size15) var(--zd_size10) 0 var(--zd_size10) ;
144
133
  cursor: pointer;
145
134
  }
146
135
 
@@ -164,17 +153,10 @@
164
153
  .lockIcon,
165
154
  .infoIcon {
166
155
  color: var(--zdt_fields_lockicon_icon);
156
+ margin-inline-start: var(--zd_size5) ;
167
157
  composes: dInflex from '~@zohodesk/components/es/common/common.module.css';
168
158
  }
169
159
 
170
- [dir=ltr] .lockIcon, [dir=ltr] .infoIcon {
171
- margin-left: var(--zd_size5) ;
172
- }
173
-
174
- [dir=rtl] .lockIcon, [dir=rtl] .infoIcon {
175
- margin-right: var(--zd_size5) ;
176
- }
177
-
178
160
  /* .infoIcon {
179
161
  opacity: 0;
180
162
  visibility: hidden;
@@ -192,32 +174,18 @@
192
174
 
193
175
  .timeFormat {
194
176
  font-size: var(--zd_font_size11) ;
177
+ margin-inline-start: var(--zd_size4) ;
195
178
  color: var(--zdt_fields_lockicon_icon);
196
179
  }
197
180
 
198
- [dir=ltr] .timeFormat {
199
- margin-left: var(--zd_size4) ;
200
- }
201
-
202
- [dir=rtl] .timeFormat {
203
- margin-right: var(--zd_size4) ;
204
- }
205
-
206
181
  .newTab {
182
+ margin-inline-start: var(--zd_size6) ;
207
183
  color: var(--zdt_fields_lockicon_icon);
208
184
  font-size: 0 ;
209
185
  display: none;
210
186
  cursor: pointer;
211
187
  }
212
188
 
213
- [dir=ltr] .newTab {
214
- margin-left: var(--zd_size6) ;
215
- }
216
-
217
- [dir=rtl] .newTab {
218
- margin-right: var(--zd_size6) ;
219
- }
220
-
221
189
  .newTab:hover {
222
190
  color: var(--zdt_fields_phoneicon_icon);
223
191
  }
@@ -234,37 +202,24 @@
234
202
 
235
203
  .labelMandatory:after {
236
204
  content: '*';
205
+ padding-inline-start: var(--zd_size2) ;
237
206
  color: var(--zdt_fields_lockicon_hover_icon);
238
207
  }
239
208
 
240
- [dir=ltr] .labelMandatory:after {
241
- padding-left: var(--zd_size2) ;
242
- }
243
-
244
- [dir=rtl] .labelMandatory:after {
245
- padding-right: var(--zd_size2) ;
246
- }
247
-
248
209
  .ePhiTag {
249
210
  composes: flexshrink from '~@zohodesk/components/es/common/common.module.css';
250
211
  color: var(--zdt_fields_phitag_text);
251
212
  font-size: var(--zd_font_size12) ;
213
+ padding-inline: var(--zd_size5) ;
214
+ padding-block:0 ;
215
+ margin-inline-start: var(--zd_size8) ;
252
216
  height: var(--zd_size18) ;
253
217
  line-height: 1.5;
254
218
  background-color: var(--zdt_fields_phitag_bg);
255
219
  border: 1px solid var(--zdt_fields_phitag_border);
256
- padding: 0 var(--zd_size5) ;
257
220
  border-radius: 3px;
258
221
  }
259
222
 
260
- [dir=ltr] .ePhiTag {
261
- margin-left: var(--zd_size8) ;
262
- }
263
-
264
- [dir=rtl] .ePhiTag {
265
- margin-right: var(--zd_size8) ;
266
- }
267
-
268
223
  .hasChildren {
269
224
  position: relative;
270
225
  }
@@ -288,4 +243,4 @@
288
243
 
289
244
  .lineClampPickListItem {
290
245
  --line-clamp: var(--picklist-field-line-clamp, 3);
291
- }
246
+ }
@@ -4,23 +4,22 @@
4
4
  .tag {
5
5
  max-width: 100% ;
6
6
  }
7
- [dir=ltr] .moreLess, [dir=ltr] .tag {
8
- margin: 0 var(--zd_size6) var(--zd_size6) 0 ;
9
- }
10
- [dir=rtl] .moreLess, [dir=rtl] .tag {
11
- margin: 0 0 var(--zd_size6) var(--zd_size6) ;
7
+ .moreLess,
8
+ .tag {
9
+ margin-block:0 var(--zd_size6) ;
10
+ margin-inline:0 var(--zd_size6) ;
12
11
  }
13
12
  .input {
14
13
  height: var(--zd_size20) ;
14
+ margin-block-end: var(--zd_size4) ;
15
15
  width: 100% ;
16
- margin-bottom: var(--zd_size4) ;
17
16
  }
18
17
  .viewpopNew {
19
18
  max-height: var(--zd_size250) ;
20
19
  }
21
20
  .tagDiv {
21
+ margin-block-start: var(--zd_size5) ;
22
22
  max-height: var(--zd_size160) ;
23
- margin-top: var(--zd_size5) ;
24
23
  }
25
24
  .hasBorder {
26
25
  transition: border var(--zd_transition2) linear 0s;
@@ -82,10 +81,11 @@
82
81
  composes: dotted from '~@zohodesk/components/es/common/common.module.css';
83
82
  }
84
83
  .dropdown {
85
- margin-top: var(--zd_size1) ;
84
+ margin-block-start: var(--zd_size1) ;
86
85
  }
87
86
  .custmSpan {
88
87
  height: var(--zd_size25) ;
88
+ padding-inline-end: var(--zd_size28) ;
89
89
  display: inline-block;
90
90
  vertical-align: middle;
91
91
  opacity: 0;
@@ -94,12 +94,6 @@
94
94
  max-width: 100% ;
95
95
  visibility: hidden;
96
96
  }
97
- [dir=ltr] .custmSpan {
98
- padding-right: var(--zd_size28) ;
99
- }
100
- [dir=rtl] .custmSpan {
101
- padding-left: var(--zd_size28) ;
102
- }
103
97
  .custmInp {
104
98
  position: absolute;
105
99
  top: 0 ;
@@ -116,5 +110,6 @@
116
110
  }
117
111
 
118
112
  .searchEmpty{
119
- padding:0 var(--zd_size10)
120
- }
113
+ padding-inline:var(--zd_size10) ;
114
+ padding-block:0 ;
115
+ }
@@ -1,9 +1,6 @@
1
1
  .count {
2
2
  color: var(--zdt_tagsmultiselectField_count_text);
3
3
  font-size: var(--zd_font_size12) ;
4
+ margin-inline-start: var(--zd_size4) ;
4
5
  word-break: break-word;
5
- }[dir=ltr] .count {
6
- margin-left: var(--zd_size4) ;
7
- }[dir=rtl] .count {
8
- margin-right: var(--zd_size4) ;
9
6
  }
@@ -166,21 +166,14 @@
166
166
  -webkit-box-align: center;
167
167
  -ms-flex-align: center;
168
168
  align-items: center;
169
+ margin-inline-end: 0 ;
169
170
  }
170
171
 
171
172
  .large :global .KB_Editor_menus .KB_Editor_MultiTools>li, .default :global .KB_Editor_menus .KB_Editor_MultiTools>li {
172
- padding: 0 ;
173
+ padding:0 ;
173
174
  float: unset;
174
175
  }
175
176
 
176
- [dir=ltr] .large :global .KB_Editor_menus .KB_Editor_MultiTools>li, [dir=ltr] .default :global .KB_Editor_menus .KB_Editor_MultiTools>li {
177
- margin-right: 0 ;
178
- }
179
-
180
- [dir=rtl] .large :global .KB_Editor_menus .KB_Editor_MultiTools>li, [dir=rtl] .default :global .KB_Editor_menus .KB_Editor_MultiTools>li {
181
- margin-left: 0 ;
182
- }
183
-
184
177
  .large :global .KB_Editor_menus .KB_Editor_MultiTools li span,
185
178
  .default :global .KB_Editor_menus .KB_Editor_MultiTools li span {
186
179
  line-height: 0;
@@ -205,13 +198,11 @@
205
198
  .large :global .KB_Editor_MultiTools .KBEditortools-Block-down-arrow svg,
206
199
  .default :global .KB_Editor_MultiTools .KBEditortools-Block-down-arrow svg {
207
200
  height: var(--zd_size10) ;
201
+ padding-block: var(--zd_size7) ;
202
+ padding-inline: var(--zd_size5) ;
208
203
  width: var(--zd_size17) ;
209
204
  }
210
205
 
211
- .large :global .KB_Editor_MultiTools .KBEditortools-Block-down-arrow svg, .default :global .KB_Editor_MultiTools .KBEditortools-Block-down-arrow svg {
212
- padding: var(--zd_size7) var(--zd_size5) ;
213
- }
214
-
215
206
  .large :global .KB_Editor_menus .KB_Editor_MultiTools .KB_Editor_Bdr_div,
216
207
  .large :global .KB_Editor_MultiTools .KB_Editor_Bdr_div.Insert_Type,
217
208
  .large :global .KB_Editor_menus .KB_Editor_MultiTools .KB_Editor_PlainText,
@@ -221,10 +212,8 @@
221
212
  .default :global .KB_Editor_menus .KB_Editor_MultiTools .KB_Editor_PlainText,
222
213
  .default :global .KB_Editor_menus .KB_Editor_MultiTools .KB_Editor_Richtext {
223
214
  line-height: unset;
224
- }
225
-
226
- .large :global .KB_Editor_menus .KB_Editor_MultiTools .KB_Editor_Bdr_div, .large :global .KB_Editor_MultiTools .KB_Editor_Bdr_div.Insert_Type, .large :global .KB_Editor_menus .KB_Editor_MultiTools .KB_Editor_PlainText, .large :global .KB_Editor_menus .KB_Editor_MultiTools .KB_Editor_Richtext, .default :global .KB_Editor_menus .KB_Editor_MultiTools .KB_Editor_Bdr_div, .default :global .KB_Editor_MultiTools .KB_Editor_Bdr_div.Insert_Type, .default :global .KB_Editor_menus .KB_Editor_MultiTools .KB_Editor_PlainText, .default :global .KB_Editor_menus .KB_Editor_MultiTools .KB_Editor_Richtext {
227
- padding: var(--zd_size3) var(--zd_size6) ;
215
+ padding-block:var(--zd_size3) ;
216
+ padding-inline: var(--zd_size6) ;
228
217
  }
229
218
 
230
219
  .large :global .KB_Editor_menus .ze_spell,
@@ -241,12 +230,9 @@
241
230
  left: 0 ;
242
231
  }
243
232
 
244
- [dir=ltr] .large :global .KB_Editor_menus .KB_Editor_MultiTools>li, [dir=ltr] .default :global .KB_Editor_menus .KB_Editor_MultiTools>li {
245
- margin-right: var(--zd_size2) ;
246
- }
247
-
248
- [dir=rtl] .large :global .KB_Editor_menus .KB_Editor_MultiTools>li, [dir=rtl] .default :global .KB_Editor_menus .KB_Editor_MultiTools>li {
249
- margin-left: var(--zd_size2) ;
233
+ .large :global .KB_Editor_menus .KB_Editor_MultiTools>li,
234
+ .default :global .KB_Editor_menus .KB_Editor_MultiTools>li {
235
+ margin-inline-end: var(--zd_size2) ;
250
236
  }
251
237
 
252
238
  /* xlarge type editor - reply area, blue print cases - full height hover style */
@@ -298,18 +284,11 @@
298
284
  -webkit-box-align: center;
299
285
  -ms-flex-align: center;
300
286
  align-items: center;
287
+ margin-inline-end: 0 ;
301
288
  padding: 0 ;
302
289
  float: unset;
303
290
  }
304
291
 
305
- [dir=ltr] .xlarge :global .KB_Editor_menus .KB_Editor_MultiTools>li {
306
- margin-right: 0 ;
307
- }
308
-
309
- [dir=rtl] .xlarge :global .KB_Editor_menus .KB_Editor_MultiTools>li {
310
- margin-left: 0 ;
311
- }
312
-
313
292
  .xlarge :global .KB_Editor_menus .KB_Editor_MultiTools li span {
314
293
  line-height: 0;
315
294
  }
@@ -321,7 +300,7 @@
321
300
  }
322
301
 
323
302
  .xlarge :global .KB_Editor_menus .KB_Editor_MultiTools .KB_Editor_Bdr_div, .xlarge :global .KB_Editor_menus .KB_Editor_MultiTools .KB_Editor_PlainText, .xlarge :global .KB_Editor_menus .KB_Editor_MultiTools .KB_Editor_Richtext {
324
- padding: var(--zd_size6) ;
303
+ padding:var(--zd_size6) ;
325
304
  }
326
305
 
327
306
  .xlarge :global .KB_Editor_menus>ul>li>span>svg {
@@ -336,8 +315,9 @@
336
315
 
337
316
  .xlarge :global .KB_Editor_MultiTools .KBEditortools-Block-down-arrow svg {
338
317
  height: var(--zd_size9) ;
318
+ padding-block: var(--zd_size7) ;
319
+ padding-inline: var(--zd_size5) ;
339
320
  width: var(--zd_size17) ;
340
- padding: var(--zd_size7) var(--zd_size5) ;
341
321
  }
342
322
 
343
323
  .xlarge :global .KB_Editor_menus .ze_spell {
@@ -356,14 +336,16 @@
356
336
 
357
337
  .xlarge :global .KB_Editor_menus>ul>li>span.SnippetIcon svg {
358
338
  width: var(--zd_size17) ;
339
+ padding-block:0 ;
340
+ padding-inline: var(--zd_size7) ;
359
341
  height: var(--zd_size21) ;
360
- padding: 0 var(--zd_size7) ;
361
342
  }
362
343
 
363
344
  .xlarge :global .KB_Editor_menus>ul>li>span.TemplateIcon svg {
364
345
  width: var(--zd_size16) ;
346
+ padding-block:0 ;
347
+ padding-inline: var(--zd_size9) ;
365
348
  height: var(--zd_size16) ;
366
- padding: 0 var(--zd_size9) ;
367
349
  }
368
350
 
369
351
  .xlarge :global .KB_Editor_menus .KB_Editor_MultiTools .SnippetIcon {
@@ -390,7 +372,8 @@
390
372
 
391
373
  .xlarge :global .KB_Editor_MultiTools li .Kbeditor_more_icon {
392
374
  top: initial ;
393
- padding: 0 var(--zd_size7) ;
375
+ padding-inline: var(--zd_size7) ;
376
+ padding-block:0 ;
394
377
  }
395
378
 
396
379
  .xlarge :global .KB_Editor_MultiTools li .Kbeditor_more_icon>svg {
@@ -405,23 +388,18 @@
405
388
  .xlarge :global .KB_Editor_menus>ul>li>span:not(.KB_Editor_Bdr_div):not(.KBEditortools-Block-down-arrow):not(.Kbeditor_more_icon):not(.SnippetIcon):not(.TemplateIcon)>svg {
406
389
  width: var(--zd_size21) ;
407
390
  height: var(--zd_size21) ;
408
- padding: 0 var(--zd_size4) ;
409
- }
410
-
411
- [dir=ltr] .xlarge :global .KB_Editor_menus .KB_Editor_MultiTools .KB_Editor_PlainText {
412
- padding: var(--zd_size8) var(--zd_size8) var(--zd_size7) var(--zd_size4) ;
413
- }
414
-
415
- [dir=rtl] .xlarge :global .KB_Editor_menus .KB_Editor_MultiTools .KB_Editor_PlainText {
416
- padding: var(--zd_size8) var(--zd_size4) var(--zd_size7) var(--zd_size8) ;
391
+ padding-inline: var(--zd_size4) ;
392
+ padding-block:0 ;
417
393
  }
418
394
 
419
- [dir=ltr] .xlarge :global .KB_Editor_menus .KB_Editor_MultiTools .KB_Editor_Richtext {
420
- padding: var(--zd_size8) var(--zd_size4) var(--zd_size7) var(--zd_size8) ;
395
+ .xlarge :global .KB_Editor_menus .KB_Editor_MultiTools .KB_Editor_PlainText {
396
+ padding-inline: var(--zd_size4) var(--zd_size8) ;
397
+ padding-block:var(--zd_size8) var(--zd_size7) ;
421
398
  }
422
399
 
423
- [dir=rtl] .xlarge :global .KB_Editor_menus .KB_Editor_MultiTools .KB_Editor_Richtext {
424
- padding: var(--zd_size8) var(--zd_size8) var(--zd_size7) var(--zd_size4) ;
400
+ .xlarge :global .KB_Editor_menus .KB_Editor_MultiTools .KB_Editor_Richtext {
401
+ padding-inline: var(--zd_size8) var(--zd_size4) ;
402
+ padding-block:var(--zd_size8) var(--zd_size7) ;
425
403
  }
426
404
 
427
405
  /* medium type editor - snippet, bug tracker cases */
@@ -469,11 +447,12 @@
469
447
  }
470
448
 
471
449
  .medium :global .KB_Editor_menus .KB_Editor_MultiTools>li {
450
+ padding-inline: var(--zd_size1) ;
451
+ padding-block:var(--zd_size3) ;
472
452
  height: unset;
473
453
  -webkit-box-align: center;
474
454
  -ms-flex-align: center;
475
455
  align-items: center;
476
- padding: var(--zd_size3) var(--zd_size1) ;
477
456
  float: unset;
478
457
  }
479
458
 
@@ -489,20 +468,15 @@
489
468
  .medium :global .KB_Editor_menus>ul>li>span.KB_Editor_Bdr_div>svg {
490
469
  width: var(--zd_size8) ;
491
470
  height: var(--zd_size8) ;
492
- }
493
-
494
- [dir=ltr] .medium :global .KB_Editor_menus>ul>li>span.KB_Editor_Bdr_div>svg {
495
- padding: 0 0 0 var(--zd_size2) ;
496
- }
497
-
498
- [dir=rtl] .medium :global .KB_Editor_menus>ul>li>span.KB_Editor_Bdr_div>svg {
499
- padding: 0 var(--zd_size2) 0 0 ;
471
+ padding-inline: var(--zd_size2) 0 ;
472
+ padding-block:0 ;
500
473
  }
501
474
 
502
475
  .medium :global .KB_Editor_MultiTools .KBEditortools-Block-down-arrow svg {
503
476
  height: var(--zd_size10) ;
504
477
  width: var(--zd_size17) ;
505
- padding: var(--zd_size7) var(--zd_size2) ;
478
+ padding-inline: var(--zd_size2) ;
479
+ padding-block:var(--zd_size7) ;
506
480
  }
507
481
 
508
482
  .medium :global .KB_Editor_MultiTools .KB_Editor_Bdr_div,
@@ -529,7 +503,8 @@
529
503
 
530
504
  .medium :global .KB_Editor_MultiTools li .Kbeditor_more_icon {
531
505
  top: initial ;
532
- padding: 0 var(--zd_size3) ;
506
+ padding-inline: var(--zd_size3) ;
507
+ padding-block:0 ;
533
508
  }
534
509
 
535
510
  .medium :global .KB_Editor_MultiTools li .Kbeditor_more_icon>svg {
@@ -616,10 +591,8 @@
616
591
  .mini :global .KB_Editor_menus>ul>li>span>svg {
617
592
  width: var(--zd_size25) ;
618
593
  height: var(--zd_size25) ;
619
- }
620
-
621
- .small :global .KB_Editor_menus>ul>li>span>svg, .mini :global .KB_Editor_menus>ul>li>span>svg {
622
- padding: 0 var(--zd_size6) ;
594
+ padding-inline: var(--zd_size6) ;
595
+ padding-block:0 ;
623
596
  }
624
597
 
625
598
  .mini :global .KB_Editor_menus:after {
@@ -719,7 +692,8 @@
719
692
  :global .KB_Editor textarea.ze_area {
720
693
  font-weight: var(--zd-fw-normal) !important;
721
694
  font-size: var(--zd_font_size14) !important;
722
- padding: var(--zd_size15) var(--zd_size20) !important;
695
+ padding-block: var(--zd_size15) !important;
696
+ padding-inline:var(--zd_size20) !important;
723
697
  }
724
698
 
725
699
  .textEditor :global .KB_Editor li[editor-command='styletext'] {
@@ -796,4 +770,4 @@
796
770
 
797
771
  [dir=rtl] .editorHide :global .KB_Editor {
798
772
  right: 0 ;
799
- }
773
+ }
@@ -21,12 +21,7 @@
21
21
  position: relative;
22
22
  z-index: 1;
23
23
  /* Variable:Ignore */
24
- }
25
- [dir=ltr] .textEditor {
26
- padding-right: var(--zd_size1) ;
27
- }
28
- [dir=rtl] .textEditor {
29
- padding-left: var(--zd_size1) ;
24
+ padding-inline-end: 1px;
30
25
  }
31
26
  @keyframes fadeIn {
32
27
  0% {
@@ -35,4 +30,4 @@
35
30
  100% {
36
31
  opacity: 1;
37
32
  }
38
- }
33
+ }
@@ -5,16 +5,17 @@
5
5
  display: inline;
6
6
  }
7
7
  .icon{
8
+ margin-block:0 ;
9
+ margin-inline: var(--zd_size5) ;
8
10
  /*css:theme-validation:ignore*/
9
11
  color:var(--label_text_color);
10
12
  display: inline-block;
11
- margin: 0 var(--zd_size5) ;
12
13
  }
13
14
  .primary {
14
15
  position: absolute;
15
16
  top: 100% ;
17
+ margin-block-start: var(--zd_size5) ;
16
18
  composes:basic;
17
- margin-top: var(--zd_size5) ;
18
19
  }
19
20
  [dir=ltr] .primary {
20
21
  left: 0 ;
@@ -23,6 +24,6 @@
23
24
  right: 0 ;
24
25
  }
25
26
  .secondary {
27
+ margin-block-start: var(--zd_size5) ;
26
28
  composes:basic;
27
- margin-top: var(--zd_size5) ;
28
29
  }