@zohodesk/components 1.0.0-alpha-268 → 1.0.0-alpha-269

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 (477) hide show
  1. package/README.md +1208 -1204
  2. package/es/Accordion/Accordion.js +7 -3
  3. package/es/Accordion/AccordionItem.js +4 -2
  4. package/es/Animation/Animation.js +3 -3
  5. package/es/AppContainer/AppContainer.js +13 -5
  6. package/es/AppContainer/AppContainer.module.css +18 -18
  7. package/es/Avatar/Avatar.js +32 -20
  8. package/es/Avatar/Avatar.module.css +175 -175
  9. package/es/Avatar/__tests__/__snapshots__/Avatar.spec.js.snap +288 -288
  10. package/es/AvatarTeam/AvatarTeam.js +10 -10
  11. package/es/AvatarTeam/AvatarTeam.module.css +189 -188
  12. package/es/AvatarTeam/__tests__/__snapshots__/AvatarTeam.spec.js.snap +226 -226
  13. package/es/Button/Button.js +8 -7
  14. package/es/Button/css/Button.module.css +525 -524
  15. package/es/Buttongroup/Buttongroup.js +4 -4
  16. package/es/Buttongroup/Buttongroup.module.css +105 -106
  17. package/es/Buttongroup/__test__/__snapshots__/Buttongroup.spec.js.snap +146 -146
  18. package/es/Card/Card.js +25 -14
  19. package/es/Card/Card.module.css +20 -20
  20. package/es/CheckBox/CheckBox.js +5 -3
  21. package/es/CheckBox/CheckBox.module.css +157 -157
  22. package/es/DateTime/CalendarView.js +32 -20
  23. package/es/DateTime/DateTime.js +68 -7
  24. package/es/DateTime/DateTime.module.css +235 -235
  25. package/es/DateTime/DateTimePopupFooter.js +4 -2
  26. package/es/DateTime/DateTimePopupHeader.js +8 -2
  27. package/es/DateTime/DateWidget.js +98 -35
  28. package/es/DateTime/DateWidget.module.css +38 -38
  29. package/es/DateTime/DaysRow.js +4 -2
  30. package/es/DateTime/Time.js +10 -2
  31. package/es/DateTime/YearView.js +28 -4
  32. package/es/DateTime/YearView.module.css +98 -98
  33. package/es/DateTime/__tests__/CalendarView.spec.js +1 -0
  34. package/es/DateTime/__tests__/DateTime.spec.js +1 -0
  35. package/es/DateTime/__tests__/DateWidget.spec.js +2 -3
  36. package/es/DateTime/common.js +3 -0
  37. package/es/DateTime/constants.js +1 -0
  38. package/es/DateTime/dateFormatUtils/dateFormat.js +63 -30
  39. package/es/DateTime/dateFormatUtils/dateFormats.js +0 -1
  40. package/es/DateTime/dateFormatUtils/dayChange.js +13 -4
  41. package/es/DateTime/dateFormatUtils/index.js +32 -2
  42. package/es/DateTime/dateFormatUtils/monthChange.js +8 -0
  43. package/es/DateTime/dateFormatUtils/timeChange.js +22 -6
  44. package/es/DateTime/dateFormatUtils/yearChange.js +11 -2
  45. package/es/DateTime/index.js +0 -0
  46. package/es/DateTime/objectUtils.js +14 -20
  47. package/es/DateTime/typeChecker.js +3 -0
  48. package/es/DateTime/validator.js +58 -6
  49. package/es/DropBox/DropBox.js +6 -2
  50. package/es/DropBox/DropBoxElement/DropBoxElement.js +7 -0
  51. package/es/DropBox/DropBoxElement/css/DropBoxElement.module.css +428 -427
  52. package/es/DropBox/DropBoxElement/css/cssJSLogic.js +5 -3
  53. package/es/DropBox/DropBoxElement/useDropboxPosCalc.js +3 -0
  54. package/es/DropBox/DropBoxPositionMapping.json +144 -144
  55. package/es/DropBox/css/DropBox.module.css +58 -58
  56. package/es/DropBox/props/defaultProps.js +1 -2
  57. package/es/DropBox/props/propTypes.js +1 -2
  58. package/es/DropDown/DropDown.js +8 -4
  59. package/es/DropDown/DropDown.module.css +5 -5
  60. package/es/DropDown/DropDownHeading.js +4 -5
  61. package/es/DropDown/DropDownHeading.module.css +53 -53
  62. package/es/DropDown/DropDownItem.js +6 -0
  63. package/es/DropDown/DropDownItem.module.css +94 -94
  64. package/es/DropDown/DropDownSearch.js +4 -0
  65. package/es/DropDown/DropDownSearch.module.css +14 -14
  66. package/es/DropDown/DropDownSeparator.js +1 -0
  67. package/es/DropDown/DropDownSeparator.module.css +7 -7
  68. package/es/DropDown/__tests__/DropDown.spec.js +1 -2
  69. package/es/Heading/Heading.js +2 -3
  70. package/es/Heading/Heading.module.css +4 -4
  71. package/es/Label/Label.js +4 -5
  72. package/es/Label/Label.module.css +52 -52
  73. package/es/Label/LabelColors.module.css +20 -20
  74. package/es/Label/__tests__/__snapshots__/Label.spec.js.snap +101 -101
  75. package/es/Layout/Box.js +13 -0
  76. package/es/Layout/Container.js +12 -1
  77. package/es/Layout/Layout.module.css +335 -335
  78. package/es/Layout/index.js +1 -2
  79. package/es/Layout/utils.js +0 -0
  80. package/es/ListItem/ListContainer.js +8 -3
  81. package/es/ListItem/ListItem.js +9 -3
  82. package/es/ListItem/ListItem.module.css +216 -216
  83. package/es/ListItem/ListItemWithAvatar.js +9 -3
  84. package/es/ListItem/ListItemWithCheckBox.js +7 -2
  85. package/es/ListItem/ListItemWithIcon.js +8 -3
  86. package/es/ListItem/ListItemWithRadio.js +7 -3
  87. package/es/Modal/Modal.js +28 -11
  88. package/es/MultiSelect/AdvancedGroupMultiSelect.js +94 -18
  89. package/es/MultiSelect/AdvancedMultiSelect.js +32 -9
  90. package/es/MultiSelect/EmptyState.js +2 -0
  91. package/es/MultiSelect/MultiSelect.js +104 -37
  92. package/es/MultiSelect/MultiSelect.module.css +206 -205
  93. package/es/MultiSelect/MultiSelectHeader.js +3 -0
  94. package/es/MultiSelect/MultiSelectWithAvatar.js +12 -6
  95. package/es/MultiSelect/SelectedOptions.js +6 -3
  96. package/es/MultiSelect/SelectedOptions.module.css +15 -15
  97. package/es/MultiSelect/Suggestions.js +7 -3
  98. package/es/MultiSelect/__tests__/MultiSelect.spec.js +4 -6
  99. package/es/MultiSelect/props/propTypes.js +2 -0
  100. package/es/PopOver/PopOver.js +18 -2
  101. package/es/PopOver/PopOver.module.css +8 -8
  102. package/es/PopOver/__tests__/PopOver.spec.js +2 -1
  103. package/es/Popup/Popup.js +77 -24
  104. package/es/Popup/PositionMapping.json +73 -73
  105. package/es/Popup/__tests__/Popup.spec.js +17 -5
  106. package/es/Popup/viewPort.js +16 -4
  107. package/es/Provider/IdProvider.js +10 -5
  108. package/es/Provider/LibraryContext.js +6 -4
  109. package/es/Provider/NumberGenerator/NumberGenerator.js +21 -7
  110. package/es/Provider/ZindexProvider.js +9 -2
  111. package/es/Radio/Radio.js +4 -2
  112. package/es/Radio/Radio.module.css +112 -112
  113. package/es/Responsive/CustomResponsive.js +30 -18
  114. package/es/Responsive/RefWrapper.js +6 -7
  115. package/es/Responsive/ResizeComponent.js +35 -25
  116. package/es/Responsive/ResizeObserver.js +26 -6
  117. package/es/Responsive/Responsive.js +34 -20
  118. package/es/Responsive/index.js +1 -3
  119. package/es/Responsive/sizeObservers.js +28 -7
  120. package/es/Responsive/utils/index.js +7 -5
  121. package/es/Responsive/utils/shallowCompare.js +7 -2
  122. package/es/Responsive/windowResizeObserver.js +7 -0
  123. package/es/ResponsiveDropBox/ResponsiveDropBox.js +4 -0
  124. package/es/ResponsiveDropBox/ResponsiveDropBox.module.css +6 -6
  125. package/es/Ribbon/Ribbon.js +3 -2
  126. package/es/Ribbon/Ribbon.module.css +454 -454
  127. package/es/Ribbon/__tests__/__snapshots__/Ribbon.spec.js.snap +163 -163
  128. package/es/RippleEffect/RippleEffect.js +1 -3
  129. package/es/RippleEffect/RippleEffect.module.css +92 -92
  130. package/es/Select/GroupSelect.js +58 -14
  131. package/es/Select/Select.js +79 -33
  132. package/es/Select/Select.module.css +108 -108
  133. package/es/Select/SelectWithAvatar.js +17 -4
  134. package/es/Select/SelectWithIcon.js +46 -5
  135. package/es/Select/__tests__/Select.spec.js +6 -8
  136. package/es/Select/props/propTypes.js +1 -0
  137. package/es/Stencils/Stencils.js +3 -3
  138. package/es/Stencils/Stencils.module.css +96 -96
  139. package/es/Stencils/__tests__/__snapshots__/Stencils.spec.js.snap +49 -49
  140. package/es/Switch/Switch.js +5 -3
  141. package/es/Switch/Switch.module.css +127 -127
  142. package/es/Tab/Tab.js +4 -4
  143. package/es/Tab/Tab.module.css +100 -100
  144. package/es/Tab/TabContent.js +1 -0
  145. package/es/Tab/TabContent.module.css +4 -4
  146. package/es/Tab/TabContentWrapper.js +2 -0
  147. package/es/Tab/TabWrapper.js +5 -2
  148. package/es/Tab/Tabs.js +71 -24
  149. package/es/Tab/Tabs.module.css +143 -143
  150. package/es/Tab/__tests__/Tab.spec.js +1 -3
  151. package/es/Tab/__tests__/TabWrapper.spec.js +1 -0
  152. package/es/Tag/Tag.js +14 -11
  153. package/es/Tag/Tag.module.css +254 -254
  154. package/es/TextBox/TextBox.js +15 -3
  155. package/es/TextBox/TextBox.module.css +158 -157
  156. package/es/TextBox/__tests__/TextBox.spec.js +1 -4
  157. package/es/TextBox/__tests__/__snapshots__/TextBox.spec.js.snap +127 -127
  158. package/es/TextBoxIcon/TextBoxIcon.js +9 -2
  159. package/es/TextBoxIcon/TextBoxIcon.module.css +79 -78
  160. package/es/TextBoxIcon/__tests__/TextBoxIcon.spec.js +2 -7
  161. package/es/TextBoxIcon/__tests__/__snapshots__/TextBoxIcon.spec.js.snap +334 -334
  162. package/es/Textarea/Textarea.js +12 -3
  163. package/es/Textarea/Textarea.module.css +139 -139
  164. package/es/Textarea/__tests__/Textarea.spec.js +2 -2
  165. package/es/Textarea/__tests__/__snapshots__/Textarea.spec.js.snap +97 -97
  166. package/es/Tooltip/Tooltip.js +58 -14
  167. package/es/Tooltip/Tooltip.module.css +140 -133
  168. package/es/Tooltip/__tests__/Tooltip.spec.js +5 -0
  169. package/es/VelocityAnimation/VelocityAnimation/VelocityAnimation.js +3 -2
  170. package/es/VelocityAnimation/VelocityAnimationGroup/VelocityAnimationGroup.js +7 -5
  171. package/es/common/a11y.module.css +3 -3
  172. package/es/common/animation.module.css +624 -624
  173. package/es/common/avatarsizes.module.css +48 -48
  174. package/es/common/basic.module.css +33 -33
  175. package/es/common/basicReset.module.css +40 -40
  176. package/es/common/boxShadow.module.css +33 -33
  177. package/es/common/common.module.css +524 -524
  178. package/es/common/customscroll.module.css +91 -89
  179. package/es/common/reset.module.css +13 -12
  180. package/es/common/transition.module.css +146 -146
  181. package/es/deprecated/AdvancedMultiSelect.module.css +126 -126
  182. package/es/deprecated/PortalLayer/PortalLayer.js +25 -20
  183. package/es/semantic/Button/Button.js +3 -2
  184. package/es/semantic/Button/semanticButton.module.css +9 -9
  185. package/es/utils/Common.js +54 -9
  186. package/es/utils/ContextOptimizer.js +4 -5
  187. package/es/utils/__tests__/debounce.spec.js +2 -2
  188. package/es/utils/constructFullName.js +2 -0
  189. package/es/utils/css/compileClassNames.js +5 -0
  190. package/es/utils/css/mergeStyle.js +7 -6
  191. package/es/utils/css/utils.js +1 -0
  192. package/es/utils/datetime/common.js +16 -5
  193. package/es/utils/debounce.js +5 -1
  194. package/es/utils/dropDownUtils.js +68 -11
  195. package/es/utils/getInitial.js +4 -0
  196. package/es/utils/shallowEqual.js +6 -0
  197. package/install.md +10 -10
  198. package/lib/Accordion/Accordion.js +42 -18
  199. package/lib/Accordion/AccordionItem.js +40 -18
  200. package/lib/Accordion/__tests__/Accordion.spec.js +3 -0
  201. package/lib/Accordion/index.js +3 -0
  202. package/lib/Accordion/props/propTypes.js +3 -0
  203. package/lib/Animation/Animation.js +38 -18
  204. package/lib/Animation/__tests__/Animation.spec.js +11 -7
  205. package/lib/Animation/props/propTypes.js +3 -0
  206. package/lib/AppContainer/AppContainer.js +56 -21
  207. package/lib/AppContainer/AppContainer.module.css +18 -18
  208. package/lib/AppContainer/props/propTypes.js +3 -0
  209. package/lib/Avatar/Avatar.js +87 -47
  210. package/lib/Avatar/Avatar.module.css +175 -175
  211. package/lib/Avatar/__tests__/Avatar.spec.js +44 -0
  212. package/lib/Avatar/__tests__/__snapshots__/Avatar.spec.js.snap +288 -288
  213. package/lib/Avatar/props/propTypes.js +3 -0
  214. package/lib/AvatarTeam/AvatarTeam.js +59 -37
  215. package/lib/AvatarTeam/AvatarTeam.module.css +189 -188
  216. package/lib/AvatarTeam/__tests__/AvatarTeam.spec.js +13 -0
  217. package/lib/AvatarTeam/__tests__/__snapshots__/AvatarTeam.spec.js.snap +226 -226
  218. package/lib/AvatarTeam/props/propTypes.js +3 -0
  219. package/lib/Button/Button.js +35 -24
  220. package/lib/Button/css/Button.module.css +525 -524
  221. package/lib/Button/css/cssJSLogic.js +18 -17
  222. package/lib/Button/index.js +3 -0
  223. package/lib/Button/props/defaultProps.js +2 -0
  224. package/lib/Button/props/propTypes.js +3 -0
  225. package/lib/Buttongroup/Buttongroup.js +33 -13
  226. package/lib/Buttongroup/Buttongroup.module.css +105 -106
  227. package/lib/Buttongroup/__test__/Buttongroup.spec.js +10 -0
  228. package/lib/Buttongroup/__test__/__snapshots__/Buttongroup.spec.js.snap +146 -146
  229. package/lib/Buttongroup/props/propTypes.js +3 -0
  230. package/lib/Card/Card.js +106 -50
  231. package/lib/Card/Card.module.css +20 -20
  232. package/lib/Card/__tests__/Card.spec.js +10 -1
  233. package/lib/Card/index.js +4 -0
  234. package/lib/Card/props/propTypes.js +3 -0
  235. package/lib/CheckBox/CheckBox.js +71 -47
  236. package/lib/CheckBox/CheckBox.module.css +157 -157
  237. package/lib/CheckBox/__tests__/CheckBox.spec.js +3 -0
  238. package/lib/CheckBox/props/propTypes.js +3 -0
  239. package/lib/DateTime/CalendarView.js +82 -42
  240. package/lib/DateTime/DateTime.js +240 -156
  241. package/lib/DateTime/DateTime.module.css +235 -235
  242. package/lib/DateTime/DateTimePopupFooter.js +31 -8
  243. package/lib/DateTime/DateTimePopupHeader.js +48 -17
  244. package/lib/DateTime/DateWidget.js +352 -250
  245. package/lib/DateTime/DateWidget.module.css +38 -38
  246. package/lib/DateTime/DaysRow.js +27 -5
  247. package/lib/DateTime/Time.js +73 -32
  248. package/lib/DateTime/YearView.js +77 -28
  249. package/lib/DateTime/YearView.module.css +98 -98
  250. package/lib/DateTime/__tests__/CalendarView.spec.js +13 -5
  251. package/lib/DateTime/__tests__/DateTime.spec.js +51 -37
  252. package/lib/DateTime/__tests__/DateWidget.spec.js +10 -8
  253. package/lib/DateTime/common.js +6 -0
  254. package/lib/DateTime/constants.js +1 -0
  255. package/lib/DateTime/dateFormatUtils/dateFormat.js +184 -122
  256. package/lib/DateTime/dateFormatUtils/dateFormats.js +0 -1
  257. package/lib/DateTime/dateFormatUtils/dayChange.js +14 -7
  258. package/lib/DateTime/dateFormatUtils/index.js +74 -16
  259. package/lib/DateTime/dateFormatUtils/monthChange.js +19 -9
  260. package/lib/DateTime/dateFormatUtils/timeChange.js +54 -22
  261. package/lib/DateTime/dateFormatUtils/yearChange.js +22 -11
  262. package/lib/DateTime/index.js +2 -0
  263. package/lib/DateTime/objectUtils.js +24 -20
  264. package/lib/DateTime/props/propTypes.js +11 -1
  265. package/lib/DateTime/typeChecker.js +4 -0
  266. package/lib/DateTime/validator.js +73 -10
  267. package/lib/DropBox/DropBox.js +34 -10
  268. package/lib/DropBox/DropBoxElement/DropBoxElement.js +58 -37
  269. package/lib/DropBox/DropBoxElement/css/DropBoxElement.module.css +428 -427
  270. package/lib/DropBox/DropBoxElement/css/cssJSLogic.js +41 -33
  271. package/lib/DropBox/DropBoxElement/props/propTypes.js +3 -0
  272. package/lib/DropBox/DropBoxElement/useDropboxPosCalc.js +14 -9
  273. package/lib/DropBox/DropBoxPositionMapping.json +144 -144
  274. package/lib/DropBox/__tests__/DropBox.spec.js +6 -2
  275. package/lib/DropBox/css/DropBox.module.css +58 -58
  276. package/lib/DropBox/css/cssJSLogic.js +3 -1
  277. package/lib/DropBox/props/defaultProps.js +8 -4
  278. package/lib/DropBox/props/propTypes.js +10 -4
  279. package/lib/DropDown/DropDown.js +52 -8
  280. package/lib/DropDown/DropDown.module.css +5 -5
  281. package/lib/DropDown/DropDownHeading.js +39 -20
  282. package/lib/DropDown/DropDownHeading.module.css +53 -53
  283. package/lib/DropDown/DropDownItem.js +42 -20
  284. package/lib/DropDown/DropDownItem.module.css +94 -94
  285. package/lib/DropDown/DropDownSearch.js +40 -17
  286. package/lib/DropDown/DropDownSearch.module.css +14 -14
  287. package/lib/DropDown/DropDownSeparator.js +24 -4
  288. package/lib/DropDown/DropDownSeparator.module.css +7 -7
  289. package/lib/DropDown/__tests__/DropDown.spec.js +15 -9
  290. package/lib/DropDown/__tests__/DropDownItem.spec.js +9 -4
  291. package/lib/DropDown/__tests__/DropDownSearch.spec.js +3 -0
  292. package/lib/DropDown/index.js +9 -0
  293. package/lib/DropDown/props/propTypes.js +6 -4
  294. package/lib/Heading/Heading.js +37 -15
  295. package/lib/Heading/Heading.module.css +4 -4
  296. package/lib/Heading/props/propTypes.js +3 -0
  297. package/lib/Label/Label.js +39 -19
  298. package/lib/Label/Label.module.css +52 -52
  299. package/lib/Label/LabelColors.module.css +20 -20
  300. package/lib/Label/__tests__/Label.spec.js +14 -1
  301. package/lib/Label/__tests__/__snapshots__/Label.spec.js.snap +101 -101
  302. package/lib/Label/props/propTypes.js +3 -0
  303. package/lib/Layout/Box.js +31 -11
  304. package/lib/Layout/Container.js +29 -10
  305. package/lib/Layout/Layout.module.css +335 -335
  306. package/lib/Layout/__tests__/Box.spec.js +65 -49
  307. package/lib/Layout/__tests__/Container.spec.js +67 -50
  308. package/lib/Layout/index.js +3 -0
  309. package/lib/Layout/props/propTypes.js +3 -0
  310. package/lib/Layout/utils.js +10 -0
  311. package/lib/ListItem/ListContainer.js +48 -27
  312. package/lib/ListItem/ListItem.js +69 -45
  313. package/lib/ListItem/ListItem.module.css +216 -216
  314. package/lib/ListItem/ListItemWithAvatar.js +75 -48
  315. package/lib/ListItem/ListItemWithCheckBox.js +64 -39
  316. package/lib/ListItem/ListItemWithIcon.js +68 -44
  317. package/lib/ListItem/ListItemWithRadio.js +65 -41
  318. package/lib/ListItem/index.js +7 -0
  319. package/lib/ListItem/props/propTypes.js +6 -4
  320. package/lib/Modal/Modal.js +45 -10
  321. package/lib/Modal/props/propTypes.js +3 -0
  322. package/lib/MultiSelect/AdvancedGroupMultiSelect.js +299 -171
  323. package/lib/MultiSelect/AdvancedMultiSelect.js +202 -125
  324. package/lib/MultiSelect/EmptyState.js +45 -24
  325. package/lib/MultiSelect/MultiSelect.js +328 -211
  326. package/lib/MultiSelect/MultiSelect.module.css +206 -205
  327. package/lib/MultiSelect/MultiSelectHeader.js +30 -8
  328. package/lib/MultiSelect/MultiSelectWithAvatar.js +105 -63
  329. package/lib/MultiSelect/SelectedOptions.js +43 -17
  330. package/lib/MultiSelect/SelectedOptions.module.css +15 -15
  331. package/lib/MultiSelect/Suggestions.js +64 -32
  332. package/lib/MultiSelect/__tests__/MultiSelect.spec.js +86 -75
  333. package/lib/MultiSelect/index.js +5 -0
  334. package/lib/MultiSelect/props/defaultProps.js +2 -0
  335. package/lib/MultiSelect/props/propTypes.js +5 -0
  336. package/lib/PopOver/PopOver.js +95 -49
  337. package/lib/PopOver/PopOver.module.css +8 -8
  338. package/lib/PopOver/__tests__/PopOver.spec.js +4 -1
  339. package/lib/PopOver/index.js +4 -0
  340. package/lib/PopOver/props/propTypes.js +3 -0
  341. package/lib/Popup/Popup.js +158 -81
  342. package/lib/Popup/PositionMapping.json +73 -73
  343. package/lib/Popup/__tests__/Popup.spec.js +43 -8
  344. package/lib/Popup/viewPort.js +28 -14
  345. package/lib/Provider/AvatarSize.js +4 -0
  346. package/lib/Provider/Config.js +2 -0
  347. package/lib/Provider/CssProvider.js +4 -0
  348. package/lib/Provider/IdProvider.js +17 -6
  349. package/lib/Provider/LibraryContext.js +35 -15
  350. package/lib/Provider/LibraryContextInit.js +4 -0
  351. package/lib/Provider/NumberGenerator/NumberGenerator.js +44 -15
  352. package/lib/Provider/ZindexProvider.js +15 -3
  353. package/lib/Provider/index.js +5 -0
  354. package/lib/Radio/Radio.js +61 -38
  355. package/lib/Radio/Radio.module.css +112 -112
  356. package/lib/Radio/__tests__/Radiospec.js +9 -5
  357. package/lib/Radio/props/propTypes.js +3 -0
  358. package/lib/Responsive/CustomResponsive.js +73 -29
  359. package/lib/Responsive/RefWrapper.js +17 -11
  360. package/lib/Responsive/ResizeComponent.js +62 -36
  361. package/lib/Responsive/ResizeObserver.js +24 -10
  362. package/lib/Responsive/Responsive.js +80 -30
  363. package/lib/Responsive/index.js +4 -0
  364. package/lib/Responsive/props/propTypes.js +3 -0
  365. package/lib/Responsive/sizeObservers.js +53 -17
  366. package/lib/Responsive/utils/index.js +11 -3
  367. package/lib/Responsive/utils/shallowCompare.js +11 -2
  368. package/lib/Responsive/windowResizeObserver.js +8 -0
  369. package/lib/ResponsiveDropBox/ResponsiveDropBox.js +45 -17
  370. package/lib/ResponsiveDropBox/ResponsiveDropBox.module.css +6 -6
  371. package/lib/ResponsiveDropBox/props/propTypes.js +3 -0
  372. package/lib/Ribbon/Ribbon.js +33 -13
  373. package/lib/Ribbon/Ribbon.module.css +454 -454
  374. package/lib/Ribbon/__tests__/Ribbon.spec.js +22 -0
  375. package/lib/Ribbon/__tests__/__snapshots__/Ribbon.spec.js.snap +163 -163
  376. package/lib/Ribbon/props/propTypes.js +3 -0
  377. package/lib/RippleEffect/RippleEffect.js +18 -10
  378. package/lib/RippleEffect/RippleEffect.module.css +92 -92
  379. package/lib/RippleEffect/props/propTypes.js +3 -0
  380. package/lib/Select/GroupSelect.js +229 -130
  381. package/lib/Select/Select.js +290 -209
  382. package/lib/Select/Select.module.css +108 -108
  383. package/lib/Select/SelectWithAvatar.js +102 -56
  384. package/lib/Select/SelectWithIcon.js +132 -76
  385. package/lib/Select/__tests__/Select.spec.js +133 -91
  386. package/lib/Select/index.js +5 -0
  387. package/lib/Select/props/defaultProps.js +5 -4
  388. package/lib/Select/props/propTypes.js +4 -0
  389. package/lib/Stencils/Stencils.js +29 -10
  390. package/lib/Stencils/Stencils.module.css +96 -96
  391. package/lib/Stencils/__tests__/Stencils.spec.js +12 -0
  392. package/lib/Stencils/__tests__/__snapshots__/Stencils.spec.js.snap +49 -49
  393. package/lib/Stencils/props/propTypes.js +3 -0
  394. package/lib/Switch/Switch.js +57 -34
  395. package/lib/Switch/Switch.module.css +127 -127
  396. package/lib/Switch/props/propTypes.js +3 -0
  397. package/lib/Tab/Tab.js +40 -27
  398. package/lib/Tab/Tab.module.css +100 -100
  399. package/lib/Tab/TabContent.js +12 -5
  400. package/lib/Tab/TabContent.module.css +4 -4
  401. package/lib/Tab/TabContentWrapper.js +13 -6
  402. package/lib/Tab/TabWrapper.js +37 -19
  403. package/lib/Tab/Tabs.js +182 -102
  404. package/lib/Tab/Tabs.module.css +143 -143
  405. package/lib/Tab/__tests__/Tab.spec.js +67 -58
  406. package/lib/Tab/__tests__/TabContent.spec.js +10 -6
  407. package/lib/Tab/__tests__/TabContentWrapper.spec.js +28 -20
  408. package/lib/Tab/__tests__/TabWrapper.spec.js +12 -0
  409. package/lib/Tab/__tests__/Tabs.spec.js +53 -39
  410. package/lib/Tab/index.js +6 -0
  411. package/lib/Tab/props/propTypes.js +3 -0
  412. package/lib/Tag/Tag.js +80 -51
  413. package/lib/Tag/Tag.module.css +254 -254
  414. package/lib/Tag/__tests__/Tag.spec.js +14 -8
  415. package/lib/Tag/props/propTypes.js +3 -0
  416. package/lib/TextBox/TextBox.js +85 -59
  417. package/lib/TextBox/TextBox.module.css +158 -157
  418. package/lib/TextBox/__tests__/TextBox.spec.js +14 -4
  419. package/lib/TextBox/__tests__/__snapshots__/TextBox.spec.js.snap +127 -127
  420. package/lib/TextBox/props/propTypes.js +6 -4
  421. package/lib/TextBoxIcon/TextBoxIcon.js +79 -52
  422. package/lib/TextBoxIcon/TextBoxIcon.module.css +79 -78
  423. package/lib/TextBoxIcon/__tests__/TextBoxIcon.spec.js +14 -5
  424. package/lib/TextBoxIcon/__tests__/__snapshots__/TextBoxIcon.spec.js.snap +334 -334
  425. package/lib/TextBoxIcon/props/propTypes.js +3 -0
  426. package/lib/Textarea/Textarea.js +54 -29
  427. package/lib/Textarea/Textarea.module.css +139 -139
  428. package/lib/Textarea/__tests__/Textarea.spec.js +14 -2
  429. package/lib/Textarea/__tests__/__snapshots__/Textarea.spec.js.snap +97 -97
  430. package/lib/Textarea/props/propTypes.js +3 -0
  431. package/lib/Tooltip/Tooltip.js +94 -31
  432. package/lib/Tooltip/Tooltip.module.css +140 -133
  433. package/lib/Tooltip/__tests__/Tooltip.spec.js +24 -3
  434. package/lib/Tooltip/props/propTypes.js +3 -0
  435. package/lib/VelocityAnimation/VelocityAnimation/VelocityAnimation.js +40 -16
  436. package/lib/VelocityAnimation/VelocityAnimation/props/propTypes.js +3 -0
  437. package/lib/VelocityAnimation/VelocityAnimationGroup/VelocityAnimationGroup.js +53 -25
  438. package/lib/VelocityAnimation/VelocityAnimationGroup/props/propTypes.js +3 -0
  439. package/lib/VelocityAnimation/index.js +3 -0
  440. package/lib/common/a11y.module.css +3 -3
  441. package/lib/common/animation.module.css +624 -624
  442. package/lib/common/avatarsizes.module.css +48 -48
  443. package/lib/common/basic.module.css +33 -33
  444. package/lib/common/basicReset.module.css +40 -40
  445. package/lib/common/boxShadow.module.css +33 -33
  446. package/lib/common/common.module.css +524 -524
  447. package/lib/common/customscroll.module.css +91 -89
  448. package/lib/common/reset.module.css +13 -12
  449. package/lib/common/transition.module.css +146 -146
  450. package/lib/css.js +40 -0
  451. package/lib/deprecated/AdvancedMultiSelect.module.css +126 -126
  452. package/lib/deprecated/PortalLayer/PortalLayer.js +46 -23
  453. package/lib/deprecated/PortalLayer/props/propTypes.js +3 -0
  454. package/lib/index.js +57 -0
  455. package/lib/semantic/Button/Button.js +42 -22
  456. package/lib/semantic/Button/props/propTypes.js +3 -0
  457. package/lib/semantic/Button/semanticButton.module.css +9 -9
  458. package/lib/semantic/index.js +2 -0
  459. package/lib/utils/Common.js +108 -18
  460. package/lib/utils/ContextOptimizer.js +16 -10
  461. package/lib/utils/__tests__/constructFullName.spec.js +1 -0
  462. package/lib/utils/__tests__/debounce.spec.js +3 -2
  463. package/lib/utils/__tests__/getInitial.spec.js +1 -0
  464. package/lib/utils/constructFullName.js +13 -4
  465. package/lib/utils/css/compileClassNames.js +6 -0
  466. package/lib/utils/css/mergeStyle.js +10 -7
  467. package/lib/utils/css/utils.js +8 -0
  468. package/lib/utils/datetime/common.js +32 -5
  469. package/lib/utils/debounce.js +6 -1
  470. package/lib/utils/dropDownUtils.js +175 -59
  471. package/lib/utils/dummyFunction.js +2 -0
  472. package/lib/utils/getHTMLFontSize.js +1 -0
  473. package/lib/utils/getInitial.js +6 -0
  474. package/lib/utils/index.js +4 -0
  475. package/lib/utils/scrollTo.js +2 -0
  476. package/lib/utils/shallowEqual.js +8 -0
  477. package/package.json +123 -116
@@ -1,226 +1,226 @@
1
- // Jest Snapshot v1, https://goo.gl/fbAQLP
2
-
3
- exports[`AvatarTeam component should display initial 1`] = `
4
- <span
5
- className="container medium primary"
6
- data-id="avatarTeamComp"
7
- >
8
- <div
9
- className="avatar medium medium circle primary text_black
10
- border"
11
- data-id="Avatar"
12
- data-title="vimalesan a"
13
- onClick={[Function]}
14
- >
15
- <span
16
- className="initial initialTxt"
17
- data-id="Avatar_AvatarInitial"
18
- >
19
- VA
20
- </span>
21
- </div>
22
- <span
23
- className="team nofill"
24
- />
25
- </span>
26
- `;
27
-
28
- exports[`AvatarTeam component should is filled 1`] = `
29
- <span
30
- className="container medium primary"
31
- data-id="avatarTeamComp"
32
- >
33
- <div
34
- className="avatar medium medium circle primary text_black
35
- border"
36
- data-id="Avatar"
37
- data-title="vimalesan a"
38
- onClick={[Function]}
39
- >
40
- <span
41
- className="initial initialTxt"
42
- data-id="Avatar_AvatarInitial"
43
- >
44
- VA
45
- </span>
46
- </div>
47
- <span
48
- className="team filled"
49
- />
50
- </span>
51
- `;
52
-
53
- exports[`AvatarTeam component should the palette is info 1`] = `
54
- <span
55
- className="container medium info"
56
- data-id="avatarTeamComp"
57
- >
58
- <div
59
- className="avatar medium medium circle info text_black
60
- border"
61
- data-id="Avatar"
62
- data-title="vimalesan a"
63
- onClick={[Function]}
64
- >
65
- <span
66
- className="initial initialTxt"
67
- data-id="Avatar_AvatarInitial"
68
- >
69
- VA
70
- </span>
71
- </div>
72
- <span
73
- className="team nofill"
74
- />
75
- </span>
76
- `;
77
-
78
- exports[`AvatarTeam component should the palette is secondary 1`] = `
79
- <span
80
- className="container medium secondary"
81
- data-id="avatarTeamComp"
82
- >
83
- <div
84
- className="avatar medium medium circle secondary text_white
85
- border"
86
- data-id="Avatar"
87
- data-title="vimalesan a"
88
- onClick={[Function]}
89
- >
90
- <span
91
- className="initial initialTxt"
92
- data-id="Avatar_AvatarInitial"
93
- >
94
- VA
95
- </span>
96
- </div>
97
- <span
98
- className="team nofill"
99
- />
100
- </span>
101
- `;
102
-
103
- exports[`AvatarTeam component should the size is large 1`] = `
104
- <span
105
- className="container large primary"
106
- data-id="avatarTeamComp"
107
- >
108
- <div
109
- className="avatar large large circle primary text_black
110
- border"
111
- data-id="Avatar"
112
- data-title="vimalesan a"
113
- onClick={[Function]}
114
- >
115
- <span
116
- className="initial initialTxt"
117
- data-id="Avatar_AvatarInitial"
118
- >
119
- VA
120
- </span>
121
- </div>
122
- <span
123
- className="team nofill"
124
- />
125
- </span>
126
- `;
127
-
128
- exports[`AvatarTeam component should the size is small 1`] = `
129
- <span
130
- className="container small primary"
131
- data-id="avatarTeamComp"
132
- >
133
- <div
134
- className="avatar small small circle primary text_black
135
- border"
136
- data-id="Avatar"
137
- data-title="vimalesan a"
138
- onClick={[Function]}
139
- >
140
- <span
141
- className="initial initialTxt"
142
- data-id="Avatar_AvatarInitial"
143
- >
144
- VA
145
- </span>
146
- </div>
147
- <span
148
- className="team nofill"
149
- />
150
- </span>
151
- `;
152
-
153
- exports[`AvatarTeam component should the size is xlarge 1`] = `
154
- <span
155
- className="container xlarge primary"
156
- data-id="avatarTeamComp"
157
- >
158
- <div
159
- className="avatar xlarge xlarge circle primary text_black
160
- border"
161
- data-id="Avatar"
162
- data-title="vimalesan a"
163
- onClick={[Function]}
164
- >
165
- <span
166
- className="initial initialTxt"
167
- data-id="Avatar_AvatarInitial"
168
- >
169
- VA
170
- </span>
171
- </div>
172
- <span
173
- className="team nofill"
174
- />
175
- </span>
176
- `;
177
-
178
- exports[`AvatarTeam component should the size is xmedium 1`] = `
179
- <span
180
- className="container xmedium primary"
181
- data-id="avatarTeamComp"
182
- >
183
- <div
184
- className="avatar xmedium xmedium circle primary text_black
185
- border"
186
- data-id="Avatar"
187
- data-title="vimalesan a"
188
- onClick={[Function]}
189
- >
190
- <span
191
- className="initial initialTxt"
192
- data-id="Avatar_AvatarInitial"
193
- >
194
- VA
195
- </span>
196
- </div>
197
- <span
198
- className="team nofill"
199
- />
200
- </span>
201
- `;
202
-
203
- exports[`AvatarTeam component should the size is xsmall 1`] = `
204
- <span
205
- className="container xsmall primary"
206
- data-id="avatarTeamComp"
207
- >
208
- <div
209
- className="avatar xsmall xsmall circle primary text_black
210
- border"
211
- data-id="Avatar"
212
- data-title="vimalesan a"
213
- onClick={[Function]}
214
- >
215
- <span
216
- className="initial initialTxt"
217
- data-id="Avatar_AvatarInitial"
218
- >
219
- VA
220
- </span>
221
- </div>
222
- <span
223
- className="team nofill"
224
- />
225
- </span>
226
- `;
1
+ // Jest Snapshot v1, https://goo.gl/fbAQLP
2
+
3
+ exports[`AvatarTeam component should display initial 1`] = `
4
+ <span
5
+ className="container medium primary"
6
+ data-id="avatarTeamComp"
7
+ >
8
+ <div
9
+ className="avatar medium medium circle primary text_black
10
+ border"
11
+ data-id="Avatar"
12
+ data-title="vimalesan a"
13
+ onClick={[Function]}
14
+ >
15
+ <span
16
+ className="initial initialTxt"
17
+ data-id="Avatar_AvatarInitial"
18
+ >
19
+ VA
20
+ </span>
21
+ </div>
22
+ <span
23
+ className="team nofill"
24
+ />
25
+ </span>
26
+ `;
27
+
28
+ exports[`AvatarTeam component should is filled 1`] = `
29
+ <span
30
+ className="container medium primary"
31
+ data-id="avatarTeamComp"
32
+ >
33
+ <div
34
+ className="avatar medium medium circle primary text_black
35
+ border"
36
+ data-id="Avatar"
37
+ data-title="vimalesan a"
38
+ onClick={[Function]}
39
+ >
40
+ <span
41
+ className="initial initialTxt"
42
+ data-id="Avatar_AvatarInitial"
43
+ >
44
+ VA
45
+ </span>
46
+ </div>
47
+ <span
48
+ className="team filled"
49
+ />
50
+ </span>
51
+ `;
52
+
53
+ exports[`AvatarTeam component should the palette is info 1`] = `
54
+ <span
55
+ className="container medium info"
56
+ data-id="avatarTeamComp"
57
+ >
58
+ <div
59
+ className="avatar medium medium circle info text_black
60
+ border"
61
+ data-id="Avatar"
62
+ data-title="vimalesan a"
63
+ onClick={[Function]}
64
+ >
65
+ <span
66
+ className="initial initialTxt"
67
+ data-id="Avatar_AvatarInitial"
68
+ >
69
+ VA
70
+ </span>
71
+ </div>
72
+ <span
73
+ className="team nofill"
74
+ />
75
+ </span>
76
+ `;
77
+
78
+ exports[`AvatarTeam component should the palette is secondary 1`] = `
79
+ <span
80
+ className="container medium secondary"
81
+ data-id="avatarTeamComp"
82
+ >
83
+ <div
84
+ className="avatar medium medium circle secondary text_white
85
+ border"
86
+ data-id="Avatar"
87
+ data-title="vimalesan a"
88
+ onClick={[Function]}
89
+ >
90
+ <span
91
+ className="initial initialTxt"
92
+ data-id="Avatar_AvatarInitial"
93
+ >
94
+ VA
95
+ </span>
96
+ </div>
97
+ <span
98
+ className="team nofill"
99
+ />
100
+ </span>
101
+ `;
102
+
103
+ exports[`AvatarTeam component should the size is large 1`] = `
104
+ <span
105
+ className="container large primary"
106
+ data-id="avatarTeamComp"
107
+ >
108
+ <div
109
+ className="avatar large large circle primary text_black
110
+ border"
111
+ data-id="Avatar"
112
+ data-title="vimalesan a"
113
+ onClick={[Function]}
114
+ >
115
+ <span
116
+ className="initial initialTxt"
117
+ data-id="Avatar_AvatarInitial"
118
+ >
119
+ VA
120
+ </span>
121
+ </div>
122
+ <span
123
+ className="team nofill"
124
+ />
125
+ </span>
126
+ `;
127
+
128
+ exports[`AvatarTeam component should the size is small 1`] = `
129
+ <span
130
+ className="container small primary"
131
+ data-id="avatarTeamComp"
132
+ >
133
+ <div
134
+ className="avatar small small circle primary text_black
135
+ border"
136
+ data-id="Avatar"
137
+ data-title="vimalesan a"
138
+ onClick={[Function]}
139
+ >
140
+ <span
141
+ className="initial initialTxt"
142
+ data-id="Avatar_AvatarInitial"
143
+ >
144
+ VA
145
+ </span>
146
+ </div>
147
+ <span
148
+ className="team nofill"
149
+ />
150
+ </span>
151
+ `;
152
+
153
+ exports[`AvatarTeam component should the size is xlarge 1`] = `
154
+ <span
155
+ className="container xlarge primary"
156
+ data-id="avatarTeamComp"
157
+ >
158
+ <div
159
+ className="avatar xlarge xlarge circle primary text_black
160
+ border"
161
+ data-id="Avatar"
162
+ data-title="vimalesan a"
163
+ onClick={[Function]}
164
+ >
165
+ <span
166
+ className="initial initialTxt"
167
+ data-id="Avatar_AvatarInitial"
168
+ >
169
+ VA
170
+ </span>
171
+ </div>
172
+ <span
173
+ className="team nofill"
174
+ />
175
+ </span>
176
+ `;
177
+
178
+ exports[`AvatarTeam component should the size is xmedium 1`] = `
179
+ <span
180
+ className="container xmedium primary"
181
+ data-id="avatarTeamComp"
182
+ >
183
+ <div
184
+ className="avatar xmedium xmedium circle primary text_black
185
+ border"
186
+ data-id="Avatar"
187
+ data-title="vimalesan a"
188
+ onClick={[Function]}
189
+ >
190
+ <span
191
+ className="initial initialTxt"
192
+ data-id="Avatar_AvatarInitial"
193
+ >
194
+ VA
195
+ </span>
196
+ </div>
197
+ <span
198
+ className="team nofill"
199
+ />
200
+ </span>
201
+ `;
202
+
203
+ exports[`AvatarTeam component should the size is xsmall 1`] = `
204
+ <span
205
+ className="container xsmall primary"
206
+ data-id="avatarTeamComp"
207
+ >
208
+ <div
209
+ className="avatar xsmall xsmall circle primary text_black
210
+ border"
211
+ data-id="Avatar"
212
+ data-title="vimalesan a"
213
+ onClick={[Function]}
214
+ >
215
+ <span
216
+ className="initial initialTxt"
217
+ data-id="Avatar_AvatarInitial"
218
+ >
219
+ VA
220
+ </span>
221
+ </div>
222
+ <span
223
+ className="team nofill"
224
+ />
225
+ </span>
226
+ `;
@@ -1,16 +1,19 @@
1
1
  function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
2
+
2
3
  import React from 'react';
3
4
  import { defaultProps } from './props/defaultProps';
4
5
  import { propTypes } from './props/propTypes';
5
6
  import cssJSLogic from './css/cssJSLogic';
6
7
  import { mergeStyle } from './../utils/';
7
8
  import style from './css/Button.module.css';
8
- /*
9
- Button text and children props?
10
- use children for both cases
11
- toLowerCase check needed?
9
+ /*
10
+ Button text and children props?
11
+ use children for both cases
12
+ toLowerCase check needed?
12
13
  */
14
+
13
15
  /* eslint css-modules/no-unused-class: [2, { markAsUsed: ['small','medium','large','xlarge','button_medium','button_small','primary','primaryfilled','danger','dangerfilled','plainprimary', 'plainsecondary', 'secondary', 'secondaryfilled', 'successFilled','tertiaryFilled'] }] */
16
+
14
17
  export default function Button(props) {
15
18
  let {
16
19
  text,
@@ -54,9 +57,7 @@ export default function Button(props) {
54
57
  }))));
55
58
  }
56
59
  Button.defaultProps = defaultProps;
57
- Button.propTypes = propTypes;
58
-
59
- // if (__DOCS__) {
60
+ Button.propTypes = propTypes; // if (__DOCS__) {
60
61
  // Button.docs = {
61
62
  // componentGroup: 'Form Elements',
62
63
  // folderName: 'Style Guide'