@zohodesk/components 1.6.25 → 1.6.27

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 (218) hide show
  1. package/CHANGELOG.md +2046 -0
  2. package/README.md +16 -2031
  3. package/assets/Appearance/dark/mode/Component_v1_DarkMode.module.css +5 -20
  4. package/assets/Appearance/light/mode/Component_v1_LightMode.module.css +5 -20
  5. package/assets/Appearance/pureDark/mode/Component_v1_PureDarkMode.module.css +5 -20
  6. package/es/Accordion/Accordion.js +1 -6
  7. package/es/Accordion/AccordionItem.js +1 -6
  8. package/es/Animation/Animation.js +1 -8
  9. package/es/AppContainer/AppContainer.js +1 -6
  10. package/es/AppContainer/__tests__/__snapshots__/AppContainer.spec.js.snap +16 -16
  11. package/es/Avatar/Avatar.js +1 -6
  12. package/es/AvatarTeam/AvatarTeam.js +1 -7
  13. package/es/Button/Button.js +1 -6
  14. package/es/Buttongroup/Buttongroup.js +1 -14
  15. package/es/Card/Card.js +1 -9
  16. package/es/Card/__tests__/__snapshots__/Card.spec.js.snap +17 -17
  17. package/es/Card/__tests__/__snapshots__/CardContent.spec.js.snap +12 -12
  18. package/es/Card/__tests__/__snapshots__/CardHeader.spec.js.snap +4 -4
  19. package/es/CheckBox/CheckBox.js +1 -6
  20. package/es/CheckBox/__tests__/__snapshots__/CheckBox.spec.js.snap +88 -88
  21. package/es/ColorSelect/__tests__/__snapshots__/ColorMultiSelect.spec.js.snap +48 -48
  22. package/es/ColorSelect/__tests__/__snapshots__/ColorSingleSelect.spec.js.snap +30 -30
  23. package/es/DateTime/DateWidget.js +1 -11
  24. package/es/DateTime/DateWidget.module.css +3 -0
  25. package/es/DateTime/__tests__/__snapshots__/CalendarView.spec.js.snap +49 -49
  26. package/es/DateTime/__tests__/__snapshots__/DateTime.spec.js.snap +93 -93
  27. package/es/DateTime/__tests__/__snapshots__/DateTimePopupFooter.spec.js.snap +1 -1
  28. package/es/DateTime/__tests__/__snapshots__/DateTimePopupHeader.spec.js.snap +8 -8
  29. package/es/DateTime/__tests__/__snapshots__/DateWidget.spec.js.snap +7 -7
  30. package/es/DateTime/__tests__/__snapshots__/DaysRow.spec.js.snap +1 -1
  31. package/es/DateTime/__tests__/__snapshots__/Time.spec.js.snap +28 -28
  32. package/es/DropDown/DropDownHeading.js +1 -6
  33. package/es/DropDown/__tests__/__snapshots__/DropDown.spec.js.snap +2 -2
  34. package/es/Heading/Heading.js +1 -6
  35. package/es/Label/Label.js +1 -6
  36. package/es/Label/__tests__/__snapshots__/Label.spec.js.snap +4 -4
  37. package/es/ListItem/ListContainer.js +1 -6
  38. package/es/ListItem/ListItem.js +1 -6
  39. package/es/ListItem/ListItemWithAvatar.js +1 -6
  40. package/es/ListItem/ListItemWithCheckBox.js +1 -6
  41. package/es/ListItem/ListItemWithIcon.js +1 -6
  42. package/es/ListItem/ListItemWithRadio.js +1 -6
  43. package/es/ListItem/__tests__/__snapshots__/ListContainer.spec.js.snap +2 -2
  44. package/es/ListItem/__tests__/__snapshots__/ListItem.spec.js.snap +16 -16
  45. package/es/ListItem/__tests__/__snapshots__/ListItemWithAvatar.spec.js.snap +41 -41
  46. package/es/ListItem/__tests__/__snapshots__/ListItemWithCheckBox.spec.js.snap +62 -62
  47. package/es/ListItem/__tests__/__snapshots__/ListItemWithIcon.spec.js.snap +41 -41
  48. package/es/ListItem/__tests__/__snapshots__/ListItemWithRadio.spec.js.snap +62 -62
  49. package/es/Modal/Modal.js +1 -8
  50. package/es/MultiSelect/AdvancedGroupMultiSelect.js +1 -7
  51. package/es/MultiSelect/AdvancedMultiSelect.js +1 -9
  52. package/es/MultiSelect/MobileHeader/__tests__/__snapshots__/MobileHeader.spec.js.snap +3 -3
  53. package/es/MultiSelect/__tests__/__snapshots__/AdvancedGroupMultiSelect.spec.js.snap +6 -6
  54. package/es/MultiSelect/__tests__/__snapshots__/AdvancedMultiSelect.spec.js.snap +50 -50
  55. package/es/MultiSelect/__tests__/__snapshots__/MultiSelect.spec.js.snap +35 -35
  56. package/es/MultiSelect/__tests__/__snapshots__/MultiSelectHeader.spec.js.snap +7 -7
  57. package/es/MultiSelect/__tests__/__snapshots__/MultiSelectWithAvatar.spec.js.snap +8 -8
  58. package/es/MultiSelect/__tests__/__snapshots__/SelectedOptions.spec.js.snap +4 -4
  59. package/es/MultiSelect/__tests__/__snapshots__/Suggestions.spec.js.snap +47 -47
  60. package/es/Radio/__tests__/__snapshots__/Radio.spec.js.snap +94 -94
  61. package/es/ResponsiveDropBox/__tests__/__snapshots__/ResponsiveDropBox.spec.js.snap +1 -1
  62. package/es/RippleEffect/RippleEffect.js +1 -6
  63. package/es/Select/GroupSelect.js +1 -8
  64. package/es/Select/Select.js +1 -10
  65. package/es/Select/SelectWithAvatar.js +1 -9
  66. package/es/Select/SelectWithIcon.js +1 -7
  67. package/es/Select/__tests__/__snapshots__/GroupSelect.spec.js.snap +7 -7
  68. package/es/Select/__tests__/__snapshots__/Select.spec.js.snap +831 -831
  69. package/es/Select/__tests__/__snapshots__/SelectWithAvatar.spec.js.snap +2 -2
  70. package/es/Select/__tests__/__snapshots__/SelectWithIcon.spec.js.snap +10 -10
  71. package/es/Switch/Switch.js +1 -6
  72. package/es/Switch/__tests__/__snapshots__/Switch.spec.js.snap +44 -44
  73. package/es/Tab/Tab.js +1 -6
  74. package/es/Tab/__tests__/__snapshots__/Tab.spec.js.snap +2 -2
  75. package/es/Tab/__tests__/__snapshots__/TabContent.spec.js.snap +1 -1
  76. package/es/Tab/__tests__/__snapshots__/TabContentWrapper.spec.js.snap +1 -1
  77. package/es/Tab/__tests__/__snapshots__/TabLayout.spec.js.snap +40 -40
  78. package/es/Tab/__tests__/__snapshots__/TabWrapper.spec.js.snap +1 -1
  79. package/es/Tab/__tests__/__snapshots__/Tabs.spec.js.snap +4 -4
  80. package/es/Tag/Tag.js +1 -6
  81. package/es/Tag/__tests__/__snapshots__/Tag.spec.js.snap +94 -94
  82. package/es/TextBox/TextBox.js +1 -8
  83. package/es/TextBoxIcon/TextBoxIcon.js +1 -8
  84. package/es/TextBoxIcon/__tests__/__snapshots__/TextBoxIcon.spec.js.snap +167 -167
  85. package/es/Textarea/Textarea.js +1 -8
  86. package/es/Tooltip/Tooltip.js +1 -8
  87. package/es/VelocityAnimation/VelocityAnimation/VelocityAnimation.js +1 -5
  88. package/es/VelocityAnimation/VelocityAnimationGroup/VelocityAnimationGroup.js +1 -5
  89. package/es/semantic/Button/Button.js +1 -6
  90. package/es/shared/ArrowIcon/__tests__/__snapshots__/ArrowIcon.spec.js.snap +20 -20
  91. package/es/shared/InputFieldLine/__tests__/__snapshots__/InputFieldLine.spec.js.snap +19 -19
  92. package/es/v1/Button/Button.js +197 -113
  93. package/es/v1/Button/README.md +110 -44
  94. package/es/v1/Button/__tests__/Button.spec.js +139 -48
  95. package/es/v1/Button/__tests__/__snapshots__/Button.spec.js.snap +1236 -340
  96. package/es/v1/Button/constants/index.js +29 -23
  97. package/es/v1/Button/constants/presets.js +160 -0
  98. package/es/v1/Button/css/Button_v1.module.css +33 -16
  99. package/es/v1/Button/css/cssJSLogic.js +56 -29
  100. package/es/v1/Button/props/defaultProps.js +5 -6
  101. package/es/v1/Button/props/propTypes.js +26 -8
  102. package/es/v1/Label/__tests__/__snapshots__/Label.spec.js.snap +24 -24
  103. package/es/v1/Switch/__tests__/__snapshots__/Switch.spec.js.snap +14 -14
  104. package/es/v1/helpers/colorHelpers/__tests__/colorHelper.spec.js +357 -0
  105. package/es/v1/helpers/colorHelpers/background/backgroundColor.module.css +38 -534
  106. package/es/v1/helpers/colorHelpers/border/borderColor.module.css +28 -412
  107. package/es/v1/helpers/colorHelpers/colorHelper.js +120 -139
  108. package/es/v1/helpers/colorHelpers/constants/index.js +45 -4
  109. package/es/v1/helpers/colorHelpers/index.js +0 -1
  110. package/es/v1/helpers/colorHelpers/paletteUtilities.README.md +141 -336
  111. package/es/v1/helpers/colorHelpers/text/textColor.module.css +79 -295
  112. package/lib/Accordion/Accordion.js +1 -6
  113. package/lib/Accordion/AccordionItem.js +1 -6
  114. package/lib/Animation/Animation.js +1 -8
  115. package/lib/AppContainer/AppContainer.js +1 -6
  116. package/lib/AppContainer/__tests__/__snapshots__/AppContainer.spec.js.snap +16 -16
  117. package/lib/Avatar/Avatar.js +1 -6
  118. package/lib/AvatarTeam/AvatarTeam.js +1 -7
  119. package/lib/Button/Button.js +1 -7
  120. package/lib/Buttongroup/Buttongroup.js +1 -14
  121. package/lib/Card/Card.js +1 -8
  122. package/lib/Card/__tests__/__snapshots__/Card.spec.js.snap +17 -17
  123. package/lib/Card/__tests__/__snapshots__/CardContent.spec.js.snap +12 -12
  124. package/lib/Card/__tests__/__snapshots__/CardHeader.spec.js.snap +4 -4
  125. package/lib/CheckBox/CheckBox.js +1 -6
  126. package/lib/CheckBox/__tests__/__snapshots__/CheckBox.spec.js.snap +88 -88
  127. package/lib/ColorSelect/__tests__/__snapshots__/ColorMultiSelect.spec.js.snap +48 -48
  128. package/lib/ColorSelect/__tests__/__snapshots__/ColorSingleSelect.spec.js.snap +30 -30
  129. package/lib/DateTime/DateWidget.js +1 -11
  130. package/lib/DateTime/DateWidget.module.css +3 -0
  131. package/lib/DateTime/__tests__/__snapshots__/CalendarView.spec.js.snap +49 -49
  132. package/lib/DateTime/__tests__/__snapshots__/DateTime.spec.js.snap +93 -93
  133. package/lib/DateTime/__tests__/__snapshots__/DateTimePopupFooter.spec.js.snap +1 -1
  134. package/lib/DateTime/__tests__/__snapshots__/DateTimePopupHeader.spec.js.snap +8 -8
  135. package/lib/DateTime/__tests__/__snapshots__/DateWidget.spec.js.snap +7 -7
  136. package/lib/DateTime/__tests__/__snapshots__/DaysRow.spec.js.snap +1 -1
  137. package/lib/DateTime/__tests__/__snapshots__/Time.spec.js.snap +28 -28
  138. package/lib/DropDown/DropDownHeading.js +1 -6
  139. package/lib/DropDown/__tests__/__snapshots__/DropDown.spec.js.snap +2 -2
  140. package/lib/Heading/Heading.js +1 -6
  141. package/lib/Label/Label.js +1 -6
  142. package/lib/Label/__tests__/__snapshots__/Label.spec.js.snap +4 -4
  143. package/lib/ListItem/ListContainer.js +1 -7
  144. package/lib/ListItem/ListItem.js +1 -6
  145. package/lib/ListItem/ListItemWithAvatar.js +1 -6
  146. package/lib/ListItem/ListItemWithCheckBox.js +1 -6
  147. package/lib/ListItem/ListItemWithIcon.js +1 -6
  148. package/lib/ListItem/ListItemWithRadio.js +1 -6
  149. package/lib/ListItem/__tests__/__snapshots__/ListContainer.spec.js.snap +2 -2
  150. package/lib/ListItem/__tests__/__snapshots__/ListItem.spec.js.snap +16 -16
  151. package/lib/ListItem/__tests__/__snapshots__/ListItemWithAvatar.spec.js.snap +41 -41
  152. package/lib/ListItem/__tests__/__snapshots__/ListItemWithCheckBox.spec.js.snap +62 -62
  153. package/lib/ListItem/__tests__/__snapshots__/ListItemWithIcon.spec.js.snap +41 -41
  154. package/lib/ListItem/__tests__/__snapshots__/ListItemWithRadio.spec.js.snap +62 -62
  155. package/lib/Modal/Modal.js +1 -8
  156. package/lib/MultiSelect/AdvancedGroupMultiSelect.js +1 -7
  157. package/lib/MultiSelect/AdvancedMultiSelect.js +1 -9
  158. package/lib/MultiSelect/MobileHeader/__tests__/__snapshots__/MobileHeader.spec.js.snap +3 -3
  159. package/lib/MultiSelect/__tests__/__snapshots__/AdvancedGroupMultiSelect.spec.js.snap +6 -6
  160. package/lib/MultiSelect/__tests__/__snapshots__/AdvancedMultiSelect.spec.js.snap +50 -50
  161. package/lib/MultiSelect/__tests__/__snapshots__/MultiSelect.spec.js.snap +35 -35
  162. package/lib/MultiSelect/__tests__/__snapshots__/MultiSelectHeader.spec.js.snap +7 -7
  163. package/lib/MultiSelect/__tests__/__snapshots__/MultiSelectWithAvatar.spec.js.snap +8 -8
  164. package/lib/MultiSelect/__tests__/__snapshots__/SelectedOptions.spec.js.snap +4 -4
  165. package/lib/MultiSelect/__tests__/__snapshots__/Suggestions.spec.js.snap +47 -47
  166. package/lib/Radio/__tests__/__snapshots__/Radio.spec.js.snap +94 -94
  167. package/lib/ResponsiveDropBox/__tests__/__snapshots__/ResponsiveDropBox.spec.js.snap +1 -1
  168. package/lib/RippleEffect/RippleEffect.js +1 -6
  169. package/lib/Select/GroupSelect.js +1 -9
  170. package/lib/Select/Select.js +1 -11
  171. package/lib/Select/SelectWithAvatar.js +1 -9
  172. package/lib/Select/SelectWithIcon.js +1 -7
  173. package/lib/Select/__tests__/__snapshots__/GroupSelect.spec.js.snap +7 -7
  174. package/lib/Select/__tests__/__snapshots__/Select.spec.js.snap +831 -831
  175. package/lib/Select/__tests__/__snapshots__/SelectWithAvatar.spec.js.snap +2 -2
  176. package/lib/Select/__tests__/__snapshots__/SelectWithIcon.spec.js.snap +10 -10
  177. package/lib/Switch/Switch.js +1 -6
  178. package/lib/Switch/__tests__/__snapshots__/Switch.spec.js.snap +44 -44
  179. package/lib/Tab/Tab.js +1 -6
  180. package/lib/Tab/__tests__/__snapshots__/Tab.spec.js.snap +2 -2
  181. package/lib/Tab/__tests__/__snapshots__/TabContent.spec.js.snap +1 -1
  182. package/lib/Tab/__tests__/__snapshots__/TabContentWrapper.spec.js.snap +1 -1
  183. package/lib/Tab/__tests__/__snapshots__/TabLayout.spec.js.snap +40 -40
  184. package/lib/Tab/__tests__/__snapshots__/TabWrapper.spec.js.snap +1 -1
  185. package/lib/Tab/__tests__/__snapshots__/Tabs.spec.js.snap +4 -4
  186. package/lib/Tag/Tag.js +1 -6
  187. package/lib/Tag/__tests__/__snapshots__/Tag.spec.js.snap +94 -94
  188. package/lib/TextBox/TextBox.js +1 -8
  189. package/lib/TextBoxIcon/TextBoxIcon.js +1 -8
  190. package/lib/TextBoxIcon/__tests__/__snapshots__/TextBoxIcon.spec.js.snap +167 -167
  191. package/lib/Textarea/Textarea.js +1 -8
  192. package/lib/Tooltip/Tooltip.js +1 -8
  193. package/lib/VelocityAnimation/VelocityAnimation/VelocityAnimation.js +1 -5
  194. package/lib/VelocityAnimation/VelocityAnimationGroup/VelocityAnimationGroup.js +1 -5
  195. package/lib/semantic/Button/Button.js +1 -6
  196. package/lib/shared/ArrowIcon/__tests__/__snapshots__/ArrowIcon.spec.js.snap +20 -20
  197. package/lib/shared/InputFieldLine/__tests__/__snapshots__/InputFieldLine.spec.js.snap +19 -19
  198. package/lib/v1/Button/Button.js +207 -123
  199. package/lib/v1/Button/README.md +110 -44
  200. package/lib/v1/Button/__tests__/Button.spec.js +195 -88
  201. package/lib/v1/Button/__tests__/__snapshots__/Button.spec.js.snap +1236 -340
  202. package/lib/v1/Button/constants/index.js +34 -31
  203. package/lib/v1/Button/constants/presets.js +179 -0
  204. package/lib/v1/Button/css/Button_v1.module.css +33 -16
  205. package/lib/v1/Button/css/cssJSLogic.js +45 -25
  206. package/lib/v1/Button/props/defaultProps.js +4 -5
  207. package/lib/v1/Button/props/propTypes.js +41 -7
  208. package/lib/v1/Label/__tests__/__snapshots__/Label.spec.js.snap +24 -24
  209. package/lib/v1/Switch/__tests__/__snapshots__/Switch.spec.js.snap +14 -14
  210. package/lib/v1/helpers/colorHelpers/__tests__/colorHelper.spec.js +363 -0
  211. package/lib/v1/helpers/colorHelpers/background/backgroundColor.module.css +38 -534
  212. package/lib/v1/helpers/colorHelpers/border/borderColor.module.css +28 -412
  213. package/lib/v1/helpers/colorHelpers/colorHelper.js +130 -153
  214. package/lib/v1/helpers/colorHelpers/constants/index.js +45 -4
  215. package/lib/v1/helpers/colorHelpers/index.js +2 -24
  216. package/lib/v1/helpers/colorHelpers/paletteUtilities.README.md +141 -336
  217. package/lib/v1/helpers/colorHelpers/text/textColor.module.css +79 -295
  218. package/package.json +16 -16
package/lib/ColorSelect/__tests__/__snapshots__/ColorMultiSelect.spec.js.snap CHANGED
@@ -9,13 +9,13 @@ exports[`ColorMultiSelect Should render the default selected value 1`] = `
9
9
  data-test-id="multiSelect"
10
10
  >
11
11
  <div
12
- class="flex fullSize row wrap alignItems_center container medium borderColor_default hasBorder"
12
+ class="d-flex d-h-full d-w-full d-flex-row d-flex-wrap d-items-center container medium borderColor_default hasBorder"
13
13
  data-id="containerComponent"
14
14
  data-selector-id="container"
15
15
  data-test-id="containerComponent"
16
16
  >
17
17
  <div
18
- class="flexible basis_auto shrink wrapper"
18
+ class="d-min-h-0 d-flex-grow d-basis-auto d-min-w-0 d-flex-shrink wrapper"
19
19
  data-id="boxComponent"
20
20
  data-selector-id="box"
21
21
  data-test-id="boxComponent"
@@ -24,11 +24,11 @@ exports[`ColorMultiSelect Should render the default selected value 1`] = `
24
24
  class="custmSpan custmSpanMedium"
25
25
  />
26
26
  <div
27
- class="flex row varClass customContainer effect container custmInputWrapper"
27
+ class="d-flex d-flex-row varClass customContainer effect container custmInputWrapper"
28
28
  data-selector-id="textBoxIcon"
29
29
  >
30
30
  <div
31
- class="flexible basis_zero noShrink"
31
+ class="d-min-h-0 d-min-w-0 d-flex-grow d-basis-0 d-flex-shrink-0"
32
32
  data-id="boxComponent"
33
33
  data-selector-id="box"
34
34
  data-test-id="boxComponent"
@@ -49,25 +49,25 @@ exports[`ColorMultiSelect Should render the default selected value 1`] = `
49
49
  />
50
50
  </div>
51
51
  <div
52
- class="noShrink iconContainer"
52
+ class="d-flex-shrink-0 iconContainer"
53
53
  data-id="boxComponent"
54
54
  data-selector-id="box"
55
55
  data-test-id="boxComponent"
56
56
  >
57
57
  <div
58
- class="flex fullSize row"
58
+ class="d-flex d-h-full d-w-full d-flex-row"
59
59
  data-id="containerComponent"
60
60
  data-selector-id="container"
61
61
  data-test-id="containerComponent"
62
62
  >
63
63
  <div
64
- class="noShrink icon"
64
+ class="d-flex-shrink-0 icon"
65
65
  data-id="boxComponent"
66
66
  data-selector-id="box"
67
67
  data-test-id="boxComponent"
68
68
  >
69
69
  <div
70
- class="inlineFlex row alignItems_center rightPlaceholder"
70
+ class="d-inline-flex d-flex-row d-items-center rightPlaceholder"
71
71
  data-id="containerComponent"
72
72
  data-selector-id="container"
73
73
  data-test-id="containerComponent"
@@ -91,13 +91,13 @@ exports[`ColorMultiSelect Should render the selected value 1`] = `
91
91
  data-test-id="multiSelect"
92
92
  >
93
93
  <div
94
- class="flex fullSize row wrap alignItems_center container medium borderColor_default hasBorder"
94
+ class="d-flex d-h-full d-w-full d-flex-row d-flex-wrap d-items-center container medium borderColor_default hasBorder"
95
95
  data-id="containerComponent"
96
96
  data-selector-id="container"
97
97
  data-test-id="containerComponent"
98
98
  >
99
99
  <div
100
- class="noShrink tag medium"
100
+ class="d-flex-shrink-0 tag medium"
101
101
  data-id="multiSelect_selectedOptions"
102
102
  data-selector-id="box"
103
103
  data-test-id="multiSelect_selectedOptions"
@@ -128,14 +128,14 @@ exports[`ColorMultiSelect Should render the selected value 1`] = `
128
128
  value="text"
129
129
  >
130
130
  <div
131
- class="flex fullSize column alignItems_center justifyContent_center"
131
+ class="d-flex d-h-full d-w-full d-flex-col d-items-center d-justify-center"
132
132
  data-id="containerComponent"
133
133
  data-selector-id="container"
134
134
  data-test-id="containerComponent"
135
135
  >
136
136
  <i
137
137
  aria-hidden="true"
138
- class="zd_font_icons basic icon-close2 fbold"
138
+ class="zd_font_icons ff icon-close2 basic d-inline-block d-align-middle d-font-bold"
139
139
  data-id="fontIcon"
140
140
  data-selector-id="fontIcon"
141
141
  data-test-id="fontIcon"
@@ -146,7 +146,7 @@ exports[`ColorMultiSelect Should render the selected value 1`] = `
146
146
  </div>
147
147
  </div>
148
148
  <div
149
- class="noShrink tag medium"
149
+ class="d-flex-shrink-0 tag medium"
150
150
  data-id="multiSelect_selectedOptions"
151
151
  data-selector-id="box"
152
152
  data-test-id="multiSelect_selectedOptions"
@@ -177,14 +177,14 @@ exports[`ColorMultiSelect Should render the selected value 1`] = `
177
177
  value="text"
178
178
  >
179
179
  <div
180
- class="flex fullSize column alignItems_center justifyContent_center"
180
+ class="d-flex d-h-full d-w-full d-flex-col d-items-center d-justify-center"
181
181
  data-id="containerComponent"
182
182
  data-selector-id="container"
183
183
  data-test-id="containerComponent"
184
184
  >
185
185
  <i
186
186
  aria-hidden="true"
187
- class="zd_font_icons basic icon-close2 fbold"
187
+ class="zd_font_icons ff icon-close2 basic d-inline-block d-align-middle d-font-bold"
188
188
  data-id="fontIcon"
189
189
  data-selector-id="fontIcon"
190
190
  data-test-id="fontIcon"
@@ -195,7 +195,7 @@ exports[`ColorMultiSelect Should render the selected value 1`] = `
195
195
  </div>
196
196
  </div>
197
197
  <div
198
- class="flexible basis_auto shrink wrapper"
198
+ class="d-min-h-0 d-flex-grow d-basis-auto d-min-w-0 d-flex-shrink wrapper"
199
199
  data-id="boxComponent"
200
200
  data-selector-id="box"
201
201
  data-test-id="boxComponent"
@@ -204,11 +204,11 @@ exports[`ColorMultiSelect Should render the selected value 1`] = `
204
204
  class="custmSpan custmSpanMedium clearIconSpace"
205
205
  />
206
206
  <div
207
- class="flex row varClass customContainer effect container custmInputWrapper"
207
+ class="d-flex d-flex-row varClass customContainer effect container custmInputWrapper"
208
208
  data-selector-id="textBoxIcon"
209
209
  >
210
210
  <div
211
- class="flexible basis_zero noShrink"
211
+ class="d-min-h-0 d-min-w-0 d-flex-grow d-basis-0 d-flex-shrink-0"
212
212
  data-id="boxComponent"
213
213
  data-selector-id="box"
214
214
  data-test-id="boxComponent"
@@ -230,31 +230,31 @@ exports[`ColorMultiSelect Should render the selected value 1`] = `
230
230
  />
231
231
  </div>
232
232
  <div
233
- class="noShrink iconContainer"
233
+ class="d-flex-shrink-0 iconContainer"
234
234
  data-id="boxComponent"
235
235
  data-selector-id="box"
236
236
  data-test-id="boxComponent"
237
237
  >
238
238
  <div
239
- class="flex fullSize row"
239
+ class="d-flex d-h-full d-w-full d-flex-row"
240
240
  data-id="containerComponent"
241
241
  data-selector-id="container"
242
242
  data-test-id="containerComponent"
243
243
  >
244
244
  <div
245
- class="noShrink icon"
245
+ class="d-flex-shrink-0 icon"
246
246
  data-id="boxComponent"
247
247
  data-selector-id="box"
248
248
  data-test-id="boxComponent"
249
249
  >
250
250
  <div
251
- class="inlineFlex row alignItems_center rightPlaceholder"
251
+ class="d-inline-flex d-flex-row d-items-center rightPlaceholder"
252
252
  data-id="containerComponent"
253
253
  data-selector-id="container"
254
254
  data-test-id="containerComponent"
255
255
  >
256
256
  <button
257
- class="noShrink delete defaultDelete"
257
+ class="d-flex-shrink-0 delete defaultDelete"
258
258
  data-id="multiSelect_clearIcon"
259
259
  data-selector-id="box"
260
260
  data-test-id="multiSelect_clearIcon"
@@ -262,7 +262,7 @@ exports[`ColorMultiSelect Should render the selected value 1`] = `
262
262
  >
263
263
  <i
264
264
  aria-hidden="true"
265
- class="zd_font_icons rtl basic icon-delete"
265
+ class="zd_font_icons ff icon-delete basic d-inline-block d-align-middle rtl"
266
266
  data-id="fontIcon"
267
267
  data-selector-id="fontIcon"
268
268
  data-test-id="fontIcon"
@@ -289,13 +289,13 @@ exports[`ColorMultiSelect rendering the defult props 1`] = `
289
289
  data-test-id="multiSelect"
290
290
  >
291
291
  <div
292
- class="flex fullSize row wrap alignItems_center container medium borderColor_default hasBorder"
292
+ class="d-flex d-h-full d-w-full d-flex-row d-flex-wrap d-items-center container medium borderColor_default hasBorder"
293
293
  data-id="containerComponent"
294
294
  data-selector-id="container"
295
295
  data-test-id="containerComponent"
296
296
  >
297
297
  <div
298
- class="flexible basis_auto shrink wrapper"
298
+ class="d-min-h-0 d-flex-grow d-basis-auto d-min-w-0 d-flex-shrink wrapper"
299
299
  data-id="boxComponent"
300
300
  data-selector-id="box"
301
301
  data-test-id="boxComponent"
@@ -304,11 +304,11 @@ exports[`ColorMultiSelect rendering the defult props 1`] = `
304
304
  class="custmSpan custmSpanMedium"
305
305
  />
306
306
  <div
307
- class="flex row varClass customContainer effect container custmInputWrapper"
307
+ class="d-flex d-flex-row varClass customContainer effect container custmInputWrapper"
308
308
  data-selector-id="textBoxIcon"
309
309
  >
310
310
  <div
311
- class="flexible basis_zero noShrink"
311
+ class="d-min-h-0 d-min-w-0 d-flex-grow d-basis-0 d-flex-shrink-0"
312
312
  data-id="boxComponent"
313
313
  data-selector-id="box"
314
314
  data-test-id="boxComponent"
@@ -329,25 +329,25 @@ exports[`ColorMultiSelect rendering the defult props 1`] = `
329
329
  />
330
330
  </div>
331
331
  <div
332
- class="noShrink iconContainer"
332
+ class="d-flex-shrink-0 iconContainer"
333
333
  data-id="boxComponent"
334
334
  data-selector-id="box"
335
335
  data-test-id="boxComponent"
336
336
  >
337
337
  <div
338
- class="flex fullSize row"
338
+ class="d-flex d-h-full d-w-full d-flex-row"
339
339
  data-id="containerComponent"
340
340
  data-selector-id="container"
341
341
  data-test-id="containerComponent"
342
342
  >
343
343
  <div
344
- class="noShrink icon"
344
+ class="d-flex-shrink-0 icon"
345
345
  data-id="boxComponent"
346
346
  data-selector-id="box"
347
347
  data-test-id="boxComponent"
348
348
  >
349
349
  <div
350
- class="inlineFlex row alignItems_center rightPlaceholder"
350
+ class="d-inline-flex d-flex-row d-items-center rightPlaceholder"
351
351
  data-id="containerComponent"
352
352
  data-selector-id="container"
353
353
  data-test-id="containerComponent"
@@ -371,13 +371,13 @@ exports[`ColorMultiSelect renders with renderCustomColorIndicator 1`] = `
371
371
  data-test-id="multiSelect"
372
372
  >
373
373
  <div
374
- class="flex fullSize row wrap alignItems_center container medium borderColor_default hasBorder"
374
+ class="d-flex d-h-full d-w-full d-flex-row d-flex-wrap d-items-center container medium borderColor_default hasBorder"
375
375
  data-id="containerComponent"
376
376
  data-selector-id="container"
377
377
  data-test-id="containerComponent"
378
378
  >
379
379
  <div
380
- class="flexible basis_auto shrink wrapper"
380
+ class="d-min-h-0 d-flex-grow d-basis-auto d-min-w-0 d-flex-shrink wrapper"
381
381
  data-id="boxComponent"
382
382
  data-selector-id="box"
383
383
  data-test-id="boxComponent"
@@ -386,11 +386,11 @@ exports[`ColorMultiSelect renders with renderCustomColorIndicator 1`] = `
386
386
  class="custmSpan custmSpanMedium"
387
387
  />
388
388
  <div
389
- class="flex row varClass customContainer effect container custmInputWrapper"
389
+ class="d-flex d-flex-row varClass customContainer effect container custmInputWrapper"
390
390
  data-selector-id="textBoxIcon"
391
391
  >
392
392
  <div
393
- class="flexible basis_zero noShrink"
393
+ class="d-min-h-0 d-min-w-0 d-flex-grow d-basis-0 d-flex-shrink-0"
394
394
  data-id="boxComponent"
395
395
  data-selector-id="box"
396
396
  data-test-id="boxComponent"
@@ -411,25 +411,25 @@ exports[`ColorMultiSelect renders with renderCustomColorIndicator 1`] = `
411
411
  />
412
412
  </div>
413
413
  <div
414
- class="noShrink iconContainer"
414
+ class="d-flex-shrink-0 iconContainer"
415
415
  data-id="boxComponent"
416
416
  data-selector-id="box"
417
417
  data-test-id="boxComponent"
418
418
  >
419
419
  <div
420
- class="flex fullSize row"
420
+ class="d-flex d-h-full d-w-full d-flex-row"
421
421
  data-id="containerComponent"
422
422
  data-selector-id="container"
423
423
  data-test-id="containerComponent"
424
424
  >
425
425
  <div
426
- class="noShrink icon"
426
+ class="d-flex-shrink-0 icon"
427
427
  data-id="boxComponent"
428
428
  data-selector-id="box"
429
429
  data-test-id="boxComponent"
430
430
  >
431
431
  <div
432
- class="inlineFlex row alignItems_center rightPlaceholder"
432
+ class="d-inline-flex d-flex-row d-items-center rightPlaceholder"
433
433
  data-id="containerComponent"
434
434
  data-selector-id="container"
435
435
  data-test-id="containerComponent"
@@ -453,13 +453,13 @@ exports[`ColorMultiSelect renders with renderCustomSelectedValue 1`] = `
453
453
  data-test-id="multiSelect"
454
454
  >
455
455
  <div
456
- class="flex fullSize row wrap alignItems_center container medium borderColor_default hasBorder"
456
+ class="d-flex d-h-full d-w-full d-flex-row d-flex-wrap d-items-center container medium borderColor_default hasBorder"
457
457
  data-id="containerComponent"
458
458
  data-selector-id="container"
459
459
  data-test-id="containerComponent"
460
460
  >
461
461
  <div
462
- class="flexible basis_auto shrink wrapper"
462
+ class="d-min-h-0 d-flex-grow d-basis-auto d-min-w-0 d-flex-shrink wrapper"
463
463
  data-id="boxComponent"
464
464
  data-selector-id="box"
465
465
  data-test-id="boxComponent"
@@ -468,11 +468,11 @@ exports[`ColorMultiSelect renders with renderCustomSelectedValue 1`] = `
468
468
  class="custmSpan custmSpanMedium"
469
469
  />
470
470
  <div
471
- class="flex row varClass customContainer effect container custmInputWrapper"
471
+ class="d-flex d-flex-row varClass customContainer effect container custmInputWrapper"
472
472
  data-selector-id="textBoxIcon"
473
473
  >
474
474
  <div
475
- class="flexible basis_zero noShrink"
475
+ class="d-min-h-0 d-min-w-0 d-flex-grow d-basis-0 d-flex-shrink-0"
476
476
  data-id="boxComponent"
477
477
  data-selector-id="box"
478
478
  data-test-id="boxComponent"
@@ -493,25 +493,25 @@ exports[`ColorMultiSelect renders with renderCustomSelectedValue 1`] = `
493
493
  />
494
494
  </div>
495
495
  <div
496
- class="noShrink iconContainer"
496
+ class="d-flex-shrink-0 iconContainer"
497
497
  data-id="boxComponent"
498
498
  data-selector-id="box"
499
499
  data-test-id="boxComponent"
500
500
  >
501
501
  <div
502
- class="flex fullSize row"
502
+ class="d-flex d-h-full d-w-full d-flex-row"
503
503
  data-id="containerComponent"
504
504
  data-selector-id="container"
505
505
  data-test-id="containerComponent"
506
506
  >
507
507
  <div
508
- class="noShrink icon"
508
+ class="d-flex-shrink-0 icon"
509
509
  data-id="boxComponent"
510
510
  data-selector-id="box"
511
511
  data-test-id="boxComponent"
512
512
  >
513
513
  <div
514
- class="inlineFlex row alignItems_center rightPlaceholder"
514
+ class="d-inline-flex d-flex-row d-items-center rightPlaceholder"
515
515
  data-id="containerComponent"
516
516
  data-selector-id="container"
517
517
  data-test-id="containerComponent"
package/lib/ColorSelect/__tests__/__snapshots__/ColorSingleSelect.spec.js.snap CHANGED
@@ -18,20 +18,20 @@ exports[`ColorSingleSelect Should render the default selected value 1`] = `
18
18
  aria-haspopup="listbox"
19
19
  aria-owns="1"
20
20
  aria-readonly="false"
21
- class="flex row scroll_vertical varClass customContainer medium padding_medium border_bottom effect borderColor_default hasBorder"
21
+ class="d-flex d-flex-row d-overflow-y-auto d-overflow-x-hidden varClass customContainer medium padding_medium border_bottom effect borderColor_default hasBorder"
22
22
  data-selector-id="container"
23
23
  data-title=""
24
24
  role="button"
25
25
  tabindex="0"
26
26
  >
27
27
  <div
28
- class="flex fullSize row"
28
+ class="d-flex d-h-full d-w-full d-flex-row"
29
29
  data-id="containerComponent"
30
30
  data-selector-id="container"
31
31
  data-test-id="containerComponent"
32
32
  >
33
33
  <div
34
- class="flexible basis_zero noShrink"
34
+ class="d-min-h-0 d-min-w-0 d-flex-grow d-basis-0 d-flex-shrink-0"
35
35
  data-id="boxComponent"
36
36
  data-selector-id="box"
37
37
  data-test-id="boxComponent"
@@ -57,14 +57,14 @@ exports[`ColorSingleSelect Should render the default selected value 1`] = `
57
57
  </div>
58
58
  <div
59
59
  aria-hidden="true"
60
- class="inlineFlex column alignItems_center justifyContent_center arrowIcon"
60
+ class="d-inline-flex d-flex-col d-items-center d-justify-center arrowIcon"
61
61
  data-id="undefined_downIcon"
62
62
  data-selector-id="container"
63
63
  data-test-id="undefined_downIcon"
64
64
  >
65
65
  <i
66
66
  aria-hidden="true"
67
- class="zd_font_icons basic icon-down"
67
+ class="zd_font_icons ff icon-down basic d-inline-block d-align-middle"
68
68
  data-id="fontIcon"
69
69
  data-selector-id="fontIcon"
70
70
  data-test-id="fontIcon"
@@ -96,20 +96,20 @@ exports[`ColorSingleSelect Should render the selected value 1`] = `
96
96
  aria-haspopup="listbox"
97
97
  aria-owns="1"
98
98
  aria-readonly="false"
99
- class="flex row scroll_vertical varClass customContainer medium padding_medium border_bottom effect borderColor_default hasBorder"
99
+ class="d-flex d-flex-row d-overflow-y-auto d-overflow-x-hidden varClass customContainer medium padding_medium border_bottom effect borderColor_default hasBorder"
100
100
  data-selector-id="container"
101
101
  data-title=""
102
102
  role="button"
103
103
  tabindex="0"
104
104
  >
105
105
  <div
106
- class="flex fullSize row"
106
+ class="d-flex d-h-full d-w-full d-flex-row"
107
107
  data-id="containerComponent"
108
108
  data-selector-id="container"
109
109
  data-test-id="containerComponent"
110
110
  >
111
111
  <div
112
- class="flexible basis_zero noShrink"
112
+ class="d-min-h-0 d-min-w-0 d-flex-grow d-basis-0 d-flex-shrink-0"
113
113
  data-id="boxComponent"
114
114
  data-selector-id="box"
115
115
  data-test-id="boxComponent"
@@ -131,14 +131,14 @@ exports[`ColorSingleSelect Should render the selected value 1`] = `
131
131
  </div>
132
132
  <div
133
133
  aria-hidden="true"
134
- class="inlineFlex column alignItems_center justifyContent_center arrowIcon"
134
+ class="d-inline-flex d-flex-col d-items-center d-justify-center arrowIcon"
135
135
  data-id="undefined_downIcon"
136
136
  data-selector-id="container"
137
137
  data-test-id="undefined_downIcon"
138
138
  >
139
139
  <i
140
140
  aria-hidden="true"
141
- class="zd_font_icons basic icon-down"
141
+ class="zd_font_icons ff icon-down basic d-inline-block d-align-middle"
142
142
  data-id="fontIcon"
143
143
  data-selector-id="fontIcon"
144
144
  data-test-id="fontIcon"
@@ -170,20 +170,20 @@ exports[`ColorSingleSelect rendering the defult props 1`] = `
170
170
  aria-haspopup="listbox"
171
171
  aria-owns="1"
172
172
  aria-readonly="false"
173
- class="flex row scroll_vertical varClass customContainer medium padding_medium border_bottom effect borderColor_default hasBorder"
173
+ class="d-flex d-flex-row d-overflow-y-auto d-overflow-x-hidden varClass customContainer medium padding_medium border_bottom effect borderColor_default hasBorder"
174
174
  data-selector-id="container"
175
175
  data-title=""
176
176
  role="button"
177
177
  tabindex="0"
178
178
  >
179
179
  <div
180
- class="flex fullSize row"
180
+ class="d-flex d-h-full d-w-full d-flex-row"
181
181
  data-id="containerComponent"
182
182
  data-selector-id="container"
183
183
  data-test-id="containerComponent"
184
184
  >
185
185
  <div
186
- class="flexible basis_zero noShrink"
186
+ class="d-min-h-0 d-min-w-0 d-flex-grow d-basis-0 d-flex-shrink-0"
187
187
  data-id="boxComponent"
188
188
  data-selector-id="box"
189
189
  data-test-id="boxComponent"
@@ -194,14 +194,14 @@ exports[`ColorSingleSelect rendering the defult props 1`] = `
194
194
  </div>
195
195
  <div
196
196
  aria-hidden="true"
197
- class="inlineFlex column alignItems_center justifyContent_center arrowIcon"
197
+ class="d-inline-flex d-flex-col d-items-center d-justify-center arrowIcon"
198
198
  data-id="undefined_downIcon"
199
199
  data-selector-id="container"
200
200
  data-test-id="undefined_downIcon"
201
201
  >
202
202
  <i
203
203
  aria-hidden="true"
204
- class="zd_font_icons basic icon-down"
204
+ class="zd_font_icons ff icon-down basic d-inline-block d-align-middle"
205
205
  data-id="fontIcon"
206
206
  data-selector-id="fontIcon"
207
207
  data-test-id="fontIcon"
@@ -233,20 +233,20 @@ exports[`ColorSingleSelect rendering with isDefaultSelectValue is false 1`] = `
233
233
  aria-haspopup="listbox"
234
234
  aria-owns="1"
235
235
  aria-readonly="false"
236
- class="flex row scroll_vertical varClass customContainer medium padding_medium border_bottom effect borderColor_default hasBorder"
236
+ class="d-flex d-flex-row d-overflow-y-auto d-overflow-x-hidden varClass customContainer medium padding_medium border_bottom effect borderColor_default hasBorder"
237
237
  data-selector-id="container"
238
238
  data-title=""
239
239
  role="button"
240
240
  tabindex="0"
241
241
  >
242
242
  <div
243
- class="flex fullSize row"
243
+ class="d-flex d-h-full d-w-full d-flex-row"
244
244
  data-id="containerComponent"
245
245
  data-selector-id="container"
246
246
  data-test-id="containerComponent"
247
247
  >
248
248
  <div
249
- class="flexible basis_zero noShrink"
249
+ class="d-min-h-0 d-min-w-0 d-flex-grow d-basis-0 d-flex-shrink-0"
250
250
  data-id="boxComponent"
251
251
  data-selector-id="box"
252
252
  data-test-id="boxComponent"
@@ -259,14 +259,14 @@ exports[`ColorSingleSelect rendering with isDefaultSelectValue is false 1`] = `
259
259
  </div>
260
260
  <div
261
261
  aria-hidden="true"
262
- class="inlineFlex column alignItems_center justifyContent_center arrowIcon"
262
+ class="d-inline-flex d-flex-col d-items-center d-justify-center arrowIcon"
263
263
  data-id="undefined_downIcon"
264
264
  data-selector-id="container"
265
265
  data-test-id="undefined_downIcon"
266
266
  >
267
267
  <i
268
268
  aria-hidden="true"
269
- class="zd_font_icons basic icon-down"
269
+ class="zd_font_icons ff icon-down basic d-inline-block d-align-middle"
270
270
  data-id="fontIcon"
271
271
  data-selector-id="fontIcon"
272
272
  data-test-id="fontIcon"
@@ -298,20 +298,20 @@ exports[`ColorSingleSelect renders with renderCustomColorIndicator 1`] = `
298
298
  aria-haspopup="listbox"
299
299
  aria-owns="1"
300
300
  aria-readonly="false"
301
- class="flex row scroll_vertical varClass customContainer medium padding_medium border_bottom effect borderColor_default hasBorder"
301
+ class="d-flex d-flex-row d-overflow-y-auto d-overflow-x-hidden varClass customContainer medium padding_medium border_bottom effect borderColor_default hasBorder"
302
302
  data-selector-id="container"
303
303
  data-title=""
304
304
  role="button"
305
305
  tabindex="0"
306
306
  >
307
307
  <div
308
- class="flex fullSize row"
308
+ class="d-flex d-h-full d-w-full d-flex-row"
309
309
  data-id="containerComponent"
310
310
  data-selector-id="container"
311
311
  data-test-id="containerComponent"
312
312
  >
313
313
  <div
314
- class="flexible basis_zero noShrink"
314
+ class="d-min-h-0 d-min-w-0 d-flex-grow d-basis-0 d-flex-shrink-0"
315
315
  data-id="boxComponent"
316
316
  data-selector-id="box"
317
317
  data-test-id="boxComponent"
@@ -337,14 +337,14 @@ exports[`ColorSingleSelect renders with renderCustomColorIndicator 1`] = `
337
337
  </div>
338
338
  <div
339
339
  aria-hidden="true"
340
- class="inlineFlex column alignItems_center justifyContent_center arrowIcon"
340
+ class="d-inline-flex d-flex-col d-items-center d-justify-center arrowIcon"
341
341
  data-id="undefined_downIcon"
342
342
  data-selector-id="container"
343
343
  data-test-id="undefined_downIcon"
344
344
  >
345
345
  <i
346
346
  aria-hidden="true"
347
- class="zd_font_icons basic icon-down"
347
+ class="zd_font_icons ff icon-down basic d-inline-block d-align-middle"
348
348
  data-id="fontIcon"
349
349
  data-selector-id="fontIcon"
350
350
  data-test-id="fontIcon"
@@ -376,20 +376,20 @@ exports[`ColorSingleSelect renders with renderCustomSelectedValue 1`] = `
376
376
  aria-haspopup="listbox"
377
377
  aria-owns="1"
378
378
  aria-readonly="false"
379
- class="flex row scroll_vertical varClass customContainer medium padding_medium border_bottom effect borderColor_default hasBorder"
379
+ class="d-flex d-flex-row d-overflow-y-auto d-overflow-x-hidden varClass customContainer medium padding_medium border_bottom effect borderColor_default hasBorder"
380
380
  data-selector-id="container"
381
381
  data-title=""
382
382
  role="button"
383
383
  tabindex="0"
384
384
  >
385
385
  <div
386
- class="flex fullSize row"
386
+ class="d-flex d-h-full d-w-full d-flex-row"
387
387
  data-id="containerComponent"
388
388
  data-selector-id="container"
389
389
  data-test-id="containerComponent"
390
390
  >
391
391
  <div
392
- class="flexible basis_zero noShrink"
392
+ class="d-min-h-0 d-min-w-0 d-flex-grow d-basis-0 d-flex-shrink-0"
393
393
  data-id="boxComponent"
394
394
  data-selector-id="box"
395
395
  data-test-id="boxComponent"
@@ -400,14 +400,14 @@ exports[`ColorSingleSelect renders with renderCustomSelectedValue 1`] = `
400
400
  </div>
401
401
  <div
402
402
  aria-hidden="true"
403
- class="inlineFlex column alignItems_center justifyContent_center arrowIcon"
403
+ class="d-inline-flex d-flex-col d-items-center d-justify-center arrowIcon"
404
404
  data-id="undefined_downIcon"
405
405
  data-selector-id="container"
406
406
  data-test-id="undefined_downIcon"
407
407
  >
408
408
  <i
409
409
  aria-hidden="true"
410
- class="zd_font_icons basic icon-down"
410
+ class="zd_font_icons ff icon-down basic d-inline-block d-align-middle"
411
411
  data-id="fontIcon"
412
412
  data-selector-id="fontIcon"
413
413
  data-test-id="fontIcon"
package/lib/DateTime/DateWidget.js CHANGED
@@ -1122,7 +1122,7 @@ var DateWidgetComponent = /*#__PURE__*/function (_React$Component) {
1122
1122
  onMouseDown: this.handleMouseDown,
1123
1123
  showClearIcon: showClear,
1124
1124
  customClass: {
1125
- customTBoxWrap: isDateEdited || value ? '' : _DateWidgetModule["default"].placeHolder
1125
+ customTBoxWrap: "".concat(isDateEdited || value ? '' : _DateWidgetModule["default"].placeHolder, " ").concat(_DateWidgetModule["default"].dateDisplayValue)
1126
1126
  },
1127
1127
  iconOnHover: iconOnHover,
1128
1128
  isFocus: isPopupReady,
@@ -1187,16 +1187,6 @@ DateWidgetComponent.propTypes = _propTypes.DateWidget_propTypes;
1187
1187
  var DateWidget = (0, _Popup["default"])(DateWidgetComponent);
1188
1188
  DateWidget.defaultProps = DateWidgetComponent.defaultProps;
1189
1189
  DateWidget.propTypes = DateWidgetComponent.propTypes; // eslint-disable-next-line no-undef
1190
- // if (__DOCS__) {
1191
- // DateWidgetComponent.docs = {
1192
- // componentGroup: 'Form Elements',
1193
- // folderName: 'Style Guide',
1194
- // external: true,
1195
- // description: ' '
1196
- // };
1197
- // // eslint-disable-next-line react/forbid-foreign-prop-types
1198
- // DateWidget.propTypes = DateWidgetComponent.propTypes;
1199
- // }
1200
1190
 
1201
1191
  var _default = DateWidget;
1202
1192
  exports["default"] = _default;
package/lib/DateTime/DateWidget.module.css CHANGED
@@ -37,3 +37,6 @@
37
37
  .placeHolder input {
38
38
  color: var(--zdt_datewidget_placeholder_text);
39
39
  }
40
+ .dateDisplayValue {
41
+ composes: ltr-zone from '../common/common.module.css';
42
+ }