@zohodesk/components 1.0.0-temp-227 → 1.0.0-temp-228

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 (357) hide show
  1. package/.cli/propValidation_report.html +1 -1
  2. package/README.md +31 -20
  3. package/assets/Appearance/dark/mode/Component_v2_DarkMode.module.css +11 -0
  4. package/assets/Appearance/light/mode/Component_v2_LightMode.module.css +11 -0
  5. package/assets/Appearance/pureDark/mode/Component_v2_PureDarkMode.module.css +11 -0
  6. package/es/Accordion/Accordion.js +2 -2
  7. package/es/Accordion/AccordionItem.js +4 -4
  8. package/es/Accordion/__tests__/Accordion.spec.js +1 -1
  9. package/es/Accordion/__tests__/AccordionItem.spec.js +1 -1
  10. package/es/Accordion/index.js +2 -2
  11. package/es/Animation/Animation.js +3 -3
  12. package/es/Animation/__tests__/Animation.spec.js +1 -1
  13. package/es/Animation/utils.js +1 -1
  14. package/es/AppContainer/AppContainer.js +13 -14
  15. package/es/AppContainer/__tests__/AppContainer.spec.js +1 -1
  16. package/es/Avatar/Avatar.js +5 -5
  17. package/es/Avatar/__tests__/Avatar.spec.js +1 -1
  18. package/es/AvatarTeam/AvatarTeam.js +4 -4
  19. package/es/AvatarTeam/__tests__/AvatarTeam.spec.js +1 -1
  20. package/es/AvatarTeam/props/propTypes.js +1 -1
  21. package/es/Button/Button.js +4 -4
  22. package/es/Button/__tests__/Button.spec.js +2 -135
  23. package/es/Button/index.js +2 -2
  24. package/es/Button/props/defaultProps.js +1 -1
  25. package/es/Buttongroup/Buttongroup.js +3 -3
  26. package/es/Buttongroup/__tests__/Buttongroup.spec.js +1 -1
  27. package/es/Card/Card.js +5 -5
  28. package/es/Card/__tests__/Card.spec.js +1 -1
  29. package/es/Card/index.js +4 -4
  30. package/es/CheckBox/CheckBox.js +6 -6
  31. package/es/CheckBox/__tests__/CheckBox.spec.js +1 -1
  32. package/es/DateTime/CalendarView.js +6 -6
  33. package/es/DateTime/DateTime.js +15 -15
  34. package/es/DateTime/DateTimePopupFooter.js +5 -5
  35. package/es/DateTime/DateTimePopupHeader.js +4 -4
  36. package/es/DateTime/DateWidget.js +17 -17
  37. package/es/DateTime/DaysRow.js +3 -3
  38. package/es/DateTime/Time.js +5 -5
  39. package/es/DateTime/YearView.js +6 -6
  40. package/es/DateTime/__tests__/CalendarView.spec.js +1 -1
  41. package/es/DateTime/__tests__/DateTime.spec.js +1 -1
  42. package/es/DateTime/__tests__/DateTimePopupFooter.spec.js +1 -1
  43. package/es/DateTime/__tests__/DateTimePopupHeader.spec.js +1 -1
  44. package/es/DateTime/__tests__/DateWidget.spec.js +1 -1
  45. package/es/DateTime/__tests__/DaysRow.spec.js +1 -1
  46. package/es/DateTime/__tests__/Time.spec.js +1 -1
  47. package/es/DateTime/__tests__/YearView.spec.js +3 -2
  48. package/es/DateTime/__tests__/__snapshots__/YearView.spec.js.snap +61 -0
  49. package/es/DateTime/dateFormatUtils/dateFormat.js +4 -4
  50. package/es/DateTime/dateFormatUtils/dayChange.js +2 -2
  51. package/es/DateTime/dateFormatUtils/index.js +3 -3
  52. package/es/DateTime/dateFormatUtils/monthChange.js +2 -2
  53. package/es/DateTime/dateFormatUtils/timeChange.js +2 -2
  54. package/es/DateTime/dateFormatUtils/yearChange.js +2 -2
  55. package/es/DateTime/index.js +1 -1
  56. package/es/DateTime/props/propTypes.js +1 -1
  57. package/es/DateTime/validator.js +2 -2
  58. package/es/DropBox/DropBox.js +9 -9
  59. package/es/DropBox/DropBoxElement/DropBoxElement.js +6 -6
  60. package/es/DropBox/DropBoxElement/__tests__/DropBoxElement.spec.js +1 -1
  61. package/es/DropBox/DropBoxElement/css/cssJSLogic.js +1 -1
  62. package/es/DropBox/DropBoxElement/useDropboxPosCalc.js +1 -1
  63. package/es/DropBox/__tests__/DropBox.spec.js +1 -1
  64. package/es/DropBox/css/cssJSLogic.js +1 -1
  65. package/es/DropBox/props/defaultProps.js +1 -1
  66. package/es/DropBox/props/propTypes.js +1 -1
  67. package/es/DropBox/utils/isMobilePopover.js +1 -1
  68. package/es/DropDown/DropDown.js +4 -4
  69. package/es/DropDown/DropDownHeading.js +3 -3
  70. package/es/DropDown/DropDownItem.js +3 -3
  71. package/es/DropDown/DropDownSearch.js +4 -4
  72. package/es/DropDown/DropDownSeparator.js +2 -2
  73. package/es/DropDown/__tests__/DropDown.spec.js +1 -1
  74. package/es/DropDown/__tests__/DropDownHeading.spec.js +1 -1
  75. package/es/DropDown/__tests__/DropDownItem.spec.js +1 -1
  76. package/es/DropDown/__tests__/DropDownSearch.spec.js +1 -1
  77. package/es/DropDown/__tests__/DropDownSeparator.spec.js +1 -1
  78. package/es/DropDown/index.js +7 -7
  79. package/es/DropDown/props/propTypes.js +1 -1
  80. package/es/Heading/Heading.js +4 -4
  81. package/es/Heading/__tests__/Heading.spec.js +1 -1
  82. package/es/Label/Label.js +4 -4
  83. package/es/Label/__tests__/Label.spec.js +1 -1
  84. package/es/Layout/Box.js +4 -4
  85. package/es/Layout/Container.js +4 -4
  86. package/es/Layout/__tests__/Box.spec.js +1 -1
  87. package/es/Layout/__tests__/Container.spec.js +1 -1
  88. package/es/Layout/index.js +2 -2
  89. package/es/ListItem/ListContainer.js +6 -6
  90. package/es/ListItem/ListItem.js +5 -5
  91. package/es/ListItem/ListItemWithAvatar.js +7 -7
  92. package/es/ListItem/ListItemWithCheckBox.js +6 -6
  93. package/es/ListItem/ListItemWithIcon.js +5 -5
  94. package/es/ListItem/ListItemWithRadio.js +6 -6
  95. package/es/ListItem/__tests__/ListContainer.spec.js +1 -1
  96. package/es/ListItem/__tests__/ListItem.spec.js +1 -1
  97. package/es/ListItem/__tests__/ListItemWithAvatar.spec.js +1 -1
  98. package/es/ListItem/__tests__/ListItemWithCheckBox.spec.js +1 -1
  99. package/es/ListItem/__tests__/ListItemWithIcon.spec.js +1 -1
  100. package/es/ListItem/__tests__/ListItemWithRadio.spec.js +1 -1
  101. package/es/ListItem/index.js +6 -6
  102. package/es/ListItem/props/propTypes.js +2 -2
  103. package/es/Modal/Modal.js +3 -3
  104. package/es/Modal/__tests__/Modal.spec.js +1 -1
  105. package/es/MultiSelect/AdvancedGroupMultiSelect.js +17 -17
  106. package/es/MultiSelect/AdvancedMultiSelect.js +17 -17
  107. package/es/MultiSelect/EmptyState.js +3 -3
  108. package/es/MultiSelect/MobileHeader/MobileHeader.js +5 -5
  109. package/es/MultiSelect/MobileHeader/__tests__/MobileHeader.spec.js +1 -1
  110. package/es/MultiSelect/MultiSelect.js +22 -35
  111. package/es/MultiSelect/MultiSelectHeader.js +4 -4
  112. package/es/MultiSelect/MultiSelectWithAvatar.js +16 -16
  113. package/es/MultiSelect/SelectedOptions.js +5 -5
  114. package/es/MultiSelect/Suggestions.js +6 -6
  115. package/es/MultiSelect/__tests__/AdvancedGroupMultiSelect.spec.js +1 -1
  116. package/es/MultiSelect/__tests__/AdvancedMultiSelect.spec.js +2 -9
  117. package/es/MultiSelect/__tests__/EmptyState.spec.js +1 -1
  118. package/es/MultiSelect/__tests__/MultiSelect.spec.js +1 -1
  119. package/es/MultiSelect/__tests__/MultiSelectHeader.spec.js +1 -1
  120. package/es/MultiSelect/__tests__/MultiSelectWithAvatar.spec.js +1 -1
  121. package/es/MultiSelect/__tests__/SelectedOptions.spec.js +1 -1
  122. package/es/MultiSelect/__tests__/Suggestions.spec.js +1 -1
  123. package/es/MultiSelect/index.js +4 -4
  124. package/es/MultiSelect/props/defaultProps.js +1 -1
  125. package/es/MultiSelect/props/propTypes.js +1 -3
  126. package/es/PopOver/PopOver.js +6 -6
  127. package/es/PopOver/__tests__/PopOver.spec.js +1 -1
  128. package/es/PopOver/index.js +3 -3
  129. package/es/Popup/Popup.js +7 -7
  130. package/es/Provider/AvatarSize.js +1 -1
  131. package/es/Provider/CssProvider.js +1 -1
  132. package/es/Provider/IdProvider.js +3 -3
  133. package/es/Provider/LibraryContext.js +5 -3
  134. package/es/Provider/ZindexProvider.js +2 -2
  135. package/es/Provider/index.js +4 -4
  136. package/es/Radio/Radio.js +6 -6
  137. package/es/Radio/__tests__/Radio.spec.js +1 -1
  138. package/es/Responsive/CustomResponsive.js +7 -7
  139. package/es/Responsive/ResizeComponent.js +2 -2
  140. package/es/Responsive/Responsive.js +6 -6
  141. package/es/Responsive/index.js +3 -3
  142. package/es/Responsive/utils/index.js +1 -1
  143. package/es/Responsive/windowResizeObserver.js +1 -1
  144. package/es/ResponsiveDropBox/ResponsiveDropBox.js +6 -6
  145. package/es/ResponsiveDropBox/__tests__/ResponsiveDropBox.spec.js +1 -1
  146. package/es/ResponsiveDropBox/props/propTypes.js +1 -1
  147. package/es/Ribbon/Ribbon.js +3 -3
  148. package/es/Ribbon/__tests__/Ribbon.spec.js +1 -1
  149. package/es/RippleEffect/RippleEffect.js +4 -4
  150. package/es/RippleEffect/__tests__/RippleEffect.spec.js +1 -1
  151. package/es/Select/GroupSelect.js +16 -16
  152. package/es/Select/Select.js +21 -30
  153. package/es/Select/SelectWithAvatar.js +17 -17
  154. package/es/Select/SelectWithIcon.js +13 -13
  155. package/es/Select/__tests__/GroupSelect.spec.js +1 -1
  156. package/es/Select/__tests__/Select.spec.js +5 -1131
  157. package/es/Select/__tests__/SelectWithAvatar.spec.js +1 -1
  158. package/es/Select/__tests__/SelectWithIcon.spec.js +1 -1
  159. package/es/Select/__tests__/__snapshots__/Select.spec.js.snap +1 -9621
  160. package/es/Select/index.js +4 -4
  161. package/es/Select/props/defaultProps.js +1 -1
  162. package/es/Select/props/propTypes.js +1 -3
  163. package/es/Stencils/Stencils.js +15 -8
  164. package/es/Stencils/Stencils.module.css +7 -11
  165. package/es/Stencils/__tests__/Stencils.spec.js +2 -10
  166. package/es/Stencils/__tests__/__snapshots__/Stencils.spec.js.snap +11 -27
  167. package/es/Stencils/props/defaultProps.js +1 -2
  168. package/es/Stencils/props/propTypes.js +2 -3
  169. package/es/Switch/Switch.js +5 -5
  170. package/es/Switch/__tests__/Switch.spec.js +1 -1
  171. package/es/Tab/Tab.js +6 -7
  172. package/es/Tab/TabContent.js +4 -4
  173. package/es/Tab/TabContentWrapper.js +3 -3
  174. package/es/Tab/TabWrapper.js +4 -5
  175. package/es/Tab/Tabs.js +23 -23
  176. package/es/Tab/__tests__/Tab.spec.js +1 -1
  177. package/es/Tab/__tests__/TabContent.spec.js +1 -1
  178. package/es/Tab/__tests__/TabContentWrapper.spec.js +1 -1
  179. package/es/Tab/__tests__/TabWrapper.spec.js +1 -1
  180. package/es/Tab/__tests__/Tabs.spec.js +1 -1
  181. package/es/Tab/index.js +5 -5
  182. package/es/Tab/props/propTypes.js +2 -2
  183. package/es/Tag/Tag.js +7 -7
  184. package/es/Tag/__tests__/Tag.spec.js +2 -9
  185. package/es/Tag/props/propTypes.js +1 -1
  186. package/es/TextBox/TextBox.js +3 -3
  187. package/es/TextBox/__tests__/TextBox.spec.js +1 -1
  188. package/es/TextBoxIcon/TextBoxIcon.js +8 -12
  189. package/es/TextBoxIcon/__tests__/TextBoxIcon.spec.js +1 -1
  190. package/es/TextBoxIcon/props/propTypes.js +2 -3
  191. package/es/Textarea/Textarea.js +3 -3
  192. package/es/Textarea/__tests__/Textarea.spec.js +1 -1
  193. package/es/Tooltip/Tooltip.js +6 -6
  194. package/es/Typography/Typography.js +4 -4
  195. package/es/Typography/css/cssJSLogic.js +1 -1
  196. package/es/VelocityAnimation/VelocityAnimation/VelocityAnimation.js +3 -3
  197. package/es/VelocityAnimation/VelocityAnimation/__tests__/VelocityAnimation.spec.js +1 -1
  198. package/es/VelocityAnimation/VelocityAnimationGroup/VelocityAnimationGroup.js +6 -43
  199. package/es/VelocityAnimation/VelocityAnimationGroup/__tests__/VelocityAnimationGroup.spec.js +1 -1
  200. package/es/VelocityAnimation/VelocityAnimationGroup/props/propTypes.js +1 -4
  201. package/es/VelocityAnimation/index.js +2 -2
  202. package/es/components-v2/Switch/Switch.js +151 -0
  203. package/es/components-v2/Switch/contants/index.js +12 -0
  204. package/es/components-v2/Switch/css/Switch_v2.module.css +140 -0
  205. package/es/components-v2/Switch/css/cssJSLogic.js +48 -0
  206. package/es/components-v2/Switch/props/defaultProps.js +12 -0
  207. package/es/components-v2/Switch/props/propTypes.js +32 -0
  208. package/es/components-v2/Switch/useSwitch.js +29 -0
  209. package/es/css.js +37 -37
  210. package/es/deprecated/PortalLayer/PortalLayer.js +3 -3
  211. package/es/index.js +39 -39
  212. package/es/semantic/Button/Button.js +3 -3
  213. package/es/semantic/Button/__tests__/Button.spec.js +1 -1
  214. package/es/semantic/index.js +1 -1
  215. package/es/utils/Common.js +2 -2
  216. package/es/utils/ContextOptimizer.js +1 -1
  217. package/es/utils/cssUtils.js +1 -1
  218. package/es/utils/datetime/common.js +1 -1
  219. package/es/utils/dropDownUtils.js +1 -1
  220. package/es/utils/index.js +1 -1
  221. package/es/v1/Accordion/Accordion.js +2 -2
  222. package/es/v1/Accordion/AccordionItem.js +4 -4
  223. package/es/v1/Accordion/index.js +2 -2
  224. package/es/v1/Animation/Animation.js +3 -3
  225. package/es/v1/Animation/utils.js +1 -1
  226. package/es/v1/AppContainer/AppContainer.js +8 -8
  227. package/es/v1/Avatar/Avatar.js +5 -5
  228. package/es/v1/AvatarTeam/AvatarTeam.js +4 -4
  229. package/es/v1/Button/Button.js +4 -4
  230. package/es/v1/Button/props/defaultProps.js +1 -1
  231. package/es/v1/Buttongroup/Buttongroup.js +3 -3
  232. package/es/v1/Card/Card.js +5 -5
  233. package/es/v1/Card/index.js +4 -4
  234. package/es/v1/CheckBox/CheckBox.js +6 -6
  235. package/es/v1/DateTime/CalendarView.js +7 -7
  236. package/es/v1/DateTime/DateTime.js +15 -15
  237. package/es/v1/DateTime/DateTimePopupFooter.js +5 -5
  238. package/es/v1/DateTime/DateTimePopupHeader.js +4 -4
  239. package/es/v1/DateTime/DateWidget.js +17 -17
  240. package/es/v1/DateTime/DaysRow.js +3 -3
  241. package/es/v1/DateTime/Time.js +5 -5
  242. package/es/v1/DateTime/YearView.js +6 -6
  243. package/es/v1/DateTime/index.js +1 -1
  244. package/es/v1/DateTime/props/propTypes.js +1 -1
  245. package/es/v1/DropBox/DropBox.js +9 -9
  246. package/es/v1/DropBox/DropBoxElement/DropBoxElement.js +6 -6
  247. package/es/v1/DropBox/props/defaultProps.js +1 -1
  248. package/es/v1/DropBox/props/propTypes.js +1 -1
  249. package/es/v1/DropBox/utils/isMobilePopover.js +1 -1
  250. package/es/v1/DropDown/DropDown.js +4 -4
  251. package/es/v1/DropDown/DropDownHeading.js +3 -3
  252. package/es/v1/DropDown/DropDownItem.js +3 -3
  253. package/es/v1/DropDown/DropDownSearch.js +4 -4
  254. package/es/v1/DropDown/DropDownSeparator.js +2 -2
  255. package/es/v1/DropDown/props/propTypes.js +1 -1
  256. package/es/v1/Heading/Heading.js +4 -4
  257. package/es/v1/Label/Label.js +4 -4
  258. package/es/v1/Layout/Box.js +4 -4
  259. package/es/v1/Layout/Container.js +4 -4
  260. package/es/v1/Layout/index.js +2 -2
  261. package/es/v1/ListItem/ListContainer.js +6 -6
  262. package/es/v1/ListItem/ListItem.js +5 -5
  263. package/es/v1/ListItem/ListItemWithAvatar.js +7 -7
  264. package/es/v1/ListItem/ListItemWithCheckBox.js +6 -6
  265. package/es/v1/ListItem/ListItemWithIcon.js +5 -5
  266. package/es/v1/ListItem/ListItemWithRadio.js +6 -6
  267. package/es/v1/ListItem/index.js +6 -6
  268. package/es/v1/Modal/Modal.js +3 -3
  269. package/es/v1/MultiSelect/AdvancedGroupMultiSelect.js +17 -17
  270. package/es/v1/MultiSelect/AdvancedMultiSelect.js +17 -17
  271. package/es/v1/MultiSelect/EmptyState.js +3 -3
  272. package/es/v1/MultiSelect/MobileHeader/MobileHeader.js +5 -5
  273. package/es/v1/MultiSelect/MultiSelect.js +19 -19
  274. package/es/v1/MultiSelect/MultiSelectHeader.js +4 -4
  275. package/es/v1/MultiSelect/MultiSelectWithAvatar.js +16 -16
  276. package/es/v1/MultiSelect/SelectedOptions.js +5 -5
  277. package/es/v1/MultiSelect/Suggestions.js +6 -6
  278. package/es/v1/MultiSelect/index.js +4 -4
  279. package/es/v1/MultiSelect/props/defaultProps.js +1 -1
  280. package/es/v1/PopOver/PopOver.js +6 -6
  281. package/es/v1/Popup/Popup.js +3 -3
  282. package/es/v1/Radio/Radio.js +5 -5
  283. package/es/v1/ResponsiveDropBox/ResponsiveDropBox.js +6 -6
  284. package/es/v1/ResponsiveDropBox/props/propTypes.js +1 -1
  285. package/es/v1/Ribbon/Ribbon.js +3 -3
  286. package/es/v1/RippleEffect/RippleEffect.js +4 -4
  287. package/es/v1/Select/GroupSelect.js +16 -16
  288. package/es/v1/Select/Select.js +15 -15
  289. package/es/v1/Select/SelectWithAvatar.js +17 -17
  290. package/es/v1/Select/SelectWithIcon.js +13 -13
  291. package/es/v1/Select/index.js +4 -4
  292. package/es/v1/Select/props/defaultProps.js +1 -1
  293. package/es/v1/Stencils/Stencils.js +3 -3
  294. package/es/v1/Switch/Switch.js +5 -5
  295. package/es/v1/Tab/Tab.js +5 -5
  296. package/es/v1/Tab/TabContent.js +4 -4
  297. package/es/v1/Tab/TabContentWrapper.js +3 -3
  298. package/es/v1/Tab/TabWrapper.js +3 -3
  299. package/es/v1/Tab/Tabs.js +13 -13
  300. package/es/v1/Tab/index.js +5 -5
  301. package/es/v1/Tag/Tag.js +7 -7
  302. package/es/v1/TextBox/TextBox.js +3 -3
  303. package/es/v1/TextBoxIcon/TextBoxIcon.js +6 -6
  304. package/es/v1/TextBoxIcon/props/propTypes.js +1 -1
  305. package/es/v1/Textarea/Textarea.js +3 -3
  306. package/es/v1/Tooltip/Tooltip.js +6 -6
  307. package/es/v1/Typography/Typography.js +4 -4
  308. package/es/v1/Typography/css/cssJSLogic.js +1 -1
  309. package/es/v1/VelocityAnimation/VelocityAnimation/VelocityAnimation.js +3 -3
  310. package/es/v1/VelocityAnimation/VelocityAnimationGroup/VelocityAnimationGroup.js +3 -3
  311. package/es/v1/semantic/Button/Button.js +3 -3
  312. package/es/v1/semantic/index.js +1 -1
  313. package/lib/AppContainer/AppContainer.js +6 -7
  314. package/lib/Button/__tests__/Button.spec.js +0 -140
  315. package/lib/DateTime/__tests__/YearView.spec.js +2 -1
  316. package/lib/DateTime/__tests__/__snapshots__/YearView.spec.js.snap +61 -0
  317. package/lib/MultiSelect/MultiSelect.js +3 -16
  318. package/lib/MultiSelect/__tests__/AdvancedMultiSelect.spec.js +0 -8
  319. package/lib/MultiSelect/props/propTypes.js +1 -3
  320. package/lib/Provider/IdProvider.js +0 -1
  321. package/lib/Provider/LibraryContext.js +3 -1
  322. package/lib/Select/Select.js +7 -16
  323. package/lib/Select/__tests__/Select.spec.js +3 -1364
  324. package/lib/Select/__tests__/__snapshots__/Select.spec.js.snap +1 -9621
  325. package/lib/Select/props/propTypes.js +1 -3
  326. package/lib/Stencils/Stencils.js +12 -5
  327. package/lib/Stencils/Stencils.module.css +7 -11
  328. package/lib/Stencils/__tests__/Stencils.spec.js +3 -11
  329. package/lib/Stencils/__tests__/__snapshots__/Stencils.spec.js.snap +11 -27
  330. package/lib/Stencils/props/defaultProps.js +1 -2
  331. package/lib/Stencils/props/propTypes.js +2 -3
  332. package/lib/Tab/Tab.js +1 -3
  333. package/lib/Tab/TabWrapper.js +1 -3
  334. package/lib/Tab/Tabs.js +10 -11
  335. package/lib/Tab/props/propTypes.js +2 -2
  336. package/lib/Tag/__tests__/Tag.spec.js +2 -10
  337. package/lib/TextBoxIcon/TextBoxIcon.js +2 -6
  338. package/lib/TextBoxIcon/props/propTypes.js +1 -2
  339. package/lib/VelocityAnimation/VelocityAnimationGroup/VelocityAnimationGroup.js +26 -80
  340. package/lib/VelocityAnimation/VelocityAnimationGroup/props/propTypes.js +1 -4
  341. package/lib/components-v2/Switch/Switch.js +169 -0
  342. package/lib/components-v2/Switch/contants/index.js +20 -0
  343. package/lib/components-v2/Switch/css/Switch_v2.module.css +140 -0
  344. package/lib/components-v2/Switch/css/cssJSLogic.js +37 -0
  345. package/lib/components-v2/Switch/props/defaultProps.js +19 -0
  346. package/lib/components-v2/Switch/props/propTypes.js +43 -0
  347. package/lib/components-v2/Switch/useSwitch.js +52 -0
  348. package/lib/utils/Common.js +1 -1
  349. package/package.json +4 -3
  350. package/react-cli.config.js +2 -2
  351. package/result.json +1 -0
  352. package/es/Tab/__tests__/TabLayout.spec.js +0 -34
  353. package/es/Tab/__tests__/__snapshots__/TabLayout.spec.js.snap +0 -341
  354. package/es/Tab/utils/tabConfigs.js +0 -18
  355. package/lib/Tab/__tests__/TabLayout.spec.js +0 -41
  356. package/lib/Tab/__tests__/__snapshots__/TabLayout.spec.js.snap +0 -341
  357. package/lib/Tab/utils/tabConfigs.js +0 -27
@@ -1,34 +0,0 @@
1
- import React from 'react';
2
- import { render } from '@testing-library/react';
3
- import { TabWrapper, Tabs, Tab, TabContentWrapper, TabContent } from "../index";
4
- describe('TabWrapper', () => {
5
- const alignments = ['vertical', 'horizontal', 'vertical-reverse', 'horizontal-reverse'];
6
- test.each(alignments)('rendering the align prop of - %s', alignments => {
7
- const {
8
- asFragment
9
- } = render( /*#__PURE__*/React.createElement(TabWrapper, {
10
- type: "alpha",
11
- align: alignments,
12
- defaultTab: "page1"
13
- }, /*#__PURE__*/React.createElement(Tabs, null, /*#__PURE__*/React.createElement(Tab, {
14
- id: "page1",
15
- text: "Page 1"
16
- }), /*#__PURE__*/React.createElement(Tab, {
17
- id: "page2",
18
- text: "Page 2"
19
- }), /*#__PURE__*/React.createElement(Tab, {
20
- id: "page3",
21
- text: "Page 3"
22
- })), /*#__PURE__*/React.createElement(TabContentWrapper, null, /*#__PURE__*/React.createElement(TabContent, {
23
- id: "page1",
24
- text: "Page 1"
25
- }, /*#__PURE__*/React.createElement("div", null, "Page 1 Content")), /*#__PURE__*/React.createElement(TabContent, {
26
- id: "page2",
27
- text: "Page 2"
28
- }, /*#__PURE__*/React.createElement("div", null, "Page 2 Content")), /*#__PURE__*/React.createElement(TabContent, {
29
- id: "page3",
30
- text: "Page 3"
31
- }, /*#__PURE__*/React.createElement("div", null, "Page 3 Content")))));
32
- expect(asFragment()).toMatchSnapshot();
33
- });
34
- });
@@ -1,341 +0,0 @@
1
- // Jest Snapshot v1, https://goo.gl/fbAQLP
2
-
3
- exports[`TabWrapper rendering the align prop of - horizontal 1`] = `
4
- <DocumentFragment>
5
- <div
6
- class="flex cover rowdir"
7
- data-id="containerComponent"
8
- data-selector-id="tabWrapper"
9
- data-test-id="containerComponent"
10
- >
11
- <div
12
- class="shrinkOff"
13
- data-id="boxComponent"
14
- data-selector-id="tabs"
15
- data-test-id="boxComponent"
16
- >
17
- <div
18
- class="tab alpha alpha_border alpha_padding flex cover coldir"
19
- data-id="containerComponent"
20
- data-selector-id="container"
21
- data-test-id="containerComponent"
22
- >
23
- <div
24
- class="grow basis shrinkOff"
25
- data-id="boxComponent"
26
- data-selector-id="box"
27
- data-test-id="boxComponent"
28
- >
29
- <div
30
- class="flex cover coldir"
31
- data-id="containerComponent"
32
- data-selector-id="container"
33
- data-test-id="containerComponent"
34
- >
35
- <div
36
- class="menu shrinkOff"
37
- data-id="boxComponent"
38
- data-selector-id="tabs_moreIcon"
39
- data-test-id="boxComponent"
40
- >
41
- <button
42
- aria-label="MoreTabs"
43
- class="buttonReset flex cover coldir both"
44
- data-id="moreTabs"
45
- data-selector-id="container"
46
- data-test-id="moreTabs"
47
- role="link"
48
- >
49
- <i
50
- aria-hidden="true"
51
- class="zd_font_icons basic icon-menu rtl "
52
- data-id="fontIcon"
53
- data-selector-id="fontIcon"
54
- data-test-id="fontIcon"
55
- style="--zd-iconfont-size: var(--zd_font_size7);"
56
- />
57
- </button>
58
- </div>
59
- </div>
60
- </div>
61
- </div>
62
- </div>
63
- <div
64
- class="grow basis shrinkOff"
65
- data-id="boxComponent"
66
- data-selector-id="tabContentWrapper"
67
- data-test-id="boxComponent"
68
- >
69
- <div
70
- aria-labelledby="page1"
71
- class="container flex cover coldir"
72
- data-id="tabContent_TabContent"
73
- data-scroll="true"
74
- data-selector-id="tabContent"
75
- data-test-id="tabContent_TabContent"
76
- role="tabpanel"
77
- tabindex="-1"
78
- >
79
- <div>
80
- Page 1 Content
81
- </div>
82
- </div>
83
- </div>
84
- </div>
85
- </DocumentFragment>
86
- `;
87
-
88
- exports[`TabWrapper rendering the align prop of - horizontal-reverse 1`] = `
89
- <DocumentFragment>
90
- <div
91
- class="flex cover rowReverse"
92
- data-id="containerComponent"
93
- data-selector-id="tabWrapper"
94
- data-test-id="containerComponent"
95
- >
96
- <div
97
- class="shrinkOff"
98
- data-id="boxComponent"
99
- data-selector-id="tabs"
100
- data-test-id="boxComponent"
101
- >
102
- <div
103
- class="tab alpha alpha_border alpha_padding flex cover coldir"
104
- data-id="containerComponent"
105
- data-selector-id="container"
106
- data-test-id="containerComponent"
107
- >
108
- <div
109
- class="grow basis shrinkOff"
110
- data-id="boxComponent"
111
- data-selector-id="box"
112
- data-test-id="boxComponent"
113
- >
114
- <div
115
- class="flex cover coldir"
116
- data-id="containerComponent"
117
- data-selector-id="container"
118
- data-test-id="containerComponent"
119
- >
120
- <div
121
- class="menu shrinkOff"
122
- data-id="boxComponent"
123
- data-selector-id="tabs_moreIcon"
124
- data-test-id="boxComponent"
125
- >
126
- <button
127
- aria-label="MoreTabs"
128
- class="buttonReset flex cover coldir both"
129
- data-id="moreTabs"
130
- data-selector-id="container"
131
- data-test-id="moreTabs"
132
- role="link"
133
- >
134
- <i
135
- aria-hidden="true"
136
- class="zd_font_icons basic icon-menu rtl "
137
- data-id="fontIcon"
138
- data-selector-id="fontIcon"
139
- data-test-id="fontIcon"
140
- style="--zd-iconfont-size: var(--zd_font_size7);"
141
- />
142
- </button>
143
- </div>
144
- </div>
145
- </div>
146
- </div>
147
- </div>
148
- <div
149
- class="grow basis shrinkOff"
150
- data-id="boxComponent"
151
- data-selector-id="tabContentWrapper"
152
- data-test-id="boxComponent"
153
- >
154
- <div
155
- aria-labelledby="page1"
156
- class="container flex cover coldir"
157
- data-id="tabContent_TabContent"
158
- data-scroll="true"
159
- data-selector-id="tabContent"
160
- data-test-id="tabContent_TabContent"
161
- role="tabpanel"
162
- tabindex="-1"
163
- >
164
- <div>
165
- Page 1 Content
166
- </div>
167
- </div>
168
- </div>
169
- </div>
170
- </DocumentFragment>
171
- `;
172
-
173
- exports[`TabWrapper rendering the align prop of - vertical 1`] = `
174
- <DocumentFragment>
175
- <div
176
- class="flex cover coldir"
177
- data-id="containerComponent"
178
- data-selector-id="tabWrapper"
179
- data-test-id="containerComponent"
180
- >
181
- <div
182
- class="shrinkOff"
183
- data-id="boxComponent"
184
- data-selector-id="tabs"
185
- data-test-id="boxComponent"
186
- >
187
- <div
188
- class="tab alpha alpha_border alpha_padding flex cover rowdir"
189
- data-id="containerComponent"
190
- data-selector-id="container"
191
- data-test-id="containerComponent"
192
- >
193
- <div
194
- class="grow basis shrinkOff"
195
- data-id="boxComponent"
196
- data-selector-id="box"
197
- data-test-id="boxComponent"
198
- >
199
- <div
200
- class="flex cover rowdir"
201
- data-id="containerComponent"
202
- data-selector-id="container"
203
- data-test-id="containerComponent"
204
- >
205
- <div
206
- class="menu shrinkOff"
207
- data-id="boxComponent"
208
- data-selector-id="tabs_moreIcon"
209
- data-test-id="boxComponent"
210
- >
211
- <button
212
- aria-label="MoreTabs"
213
- class="buttonReset flex cover coldir both"
214
- data-id="moreTabs"
215
- data-selector-id="container"
216
- data-test-id="moreTabs"
217
- role="link"
218
- >
219
- <i
220
- aria-hidden="true"
221
- class="zd_font_icons basic icon-menu rtl "
222
- data-id="fontIcon"
223
- data-selector-id="fontIcon"
224
- data-test-id="fontIcon"
225
- style="--zd-iconfont-size: var(--zd_font_size7);"
226
- />
227
- </button>
228
- </div>
229
- </div>
230
- </div>
231
- </div>
232
- </div>
233
- <div
234
- class="grow basis shrinkOff"
235
- data-id="boxComponent"
236
- data-selector-id="tabContentWrapper"
237
- data-test-id="boxComponent"
238
- >
239
- <div
240
- aria-labelledby="page1"
241
- class="container flex cover coldir"
242
- data-id="tabContent_TabContent"
243
- data-scroll="true"
244
- data-selector-id="tabContent"
245
- data-test-id="tabContent_TabContent"
246
- role="tabpanel"
247
- tabindex="-1"
248
- >
249
- <div>
250
- Page 1 Content
251
- </div>
252
- </div>
253
- </div>
254
- </div>
255
- </DocumentFragment>
256
- `;
257
-
258
- exports[`TabWrapper rendering the align prop of - vertical-reverse 1`] = `
259
- <DocumentFragment>
260
- <div
261
- class="flex cover colReverse"
262
- data-id="containerComponent"
263
- data-selector-id="tabWrapper"
264
- data-test-id="containerComponent"
265
- >
266
- <div
267
- class="shrinkOff"
268
- data-id="boxComponent"
269
- data-selector-id="tabs"
270
- data-test-id="boxComponent"
271
- >
272
- <div
273
- class="tab alpha alpha_border alpha_padding flex cover rowdir"
274
- data-id="containerComponent"
275
- data-selector-id="container"
276
- data-test-id="containerComponent"
277
- >
278
- <div
279
- class="grow basis shrinkOff"
280
- data-id="boxComponent"
281
- data-selector-id="box"
282
- data-test-id="boxComponent"
283
- >
284
- <div
285
- class="flex cover rowdir"
286
- data-id="containerComponent"
287
- data-selector-id="container"
288
- data-test-id="containerComponent"
289
- >
290
- <div
291
- class="menu shrinkOff"
292
- data-id="boxComponent"
293
- data-selector-id="tabs_moreIcon"
294
- data-test-id="boxComponent"
295
- >
296
- <button
297
- aria-label="MoreTabs"
298
- class="buttonReset flex cover coldir both"
299
- data-id="moreTabs"
300
- data-selector-id="container"
301
- data-test-id="moreTabs"
302
- role="link"
303
- >
304
- <i
305
- aria-hidden="true"
306
- class="zd_font_icons basic icon-menu rtl "
307
- data-id="fontIcon"
308
- data-selector-id="fontIcon"
309
- data-test-id="fontIcon"
310
- style="--zd-iconfont-size: var(--zd_font_size7);"
311
- />
312
- </button>
313
- </div>
314
- </div>
315
- </div>
316
- </div>
317
- </div>
318
- <div
319
- class="grow basis shrinkOff"
320
- data-id="boxComponent"
321
- data-selector-id="tabContentWrapper"
322
- data-test-id="boxComponent"
323
- >
324
- <div
325
- aria-labelledby="page1"
326
- class="container flex cover coldir"
327
- data-id="tabContent_TabContent"
328
- data-scroll="true"
329
- data-selector-id="tabContent"
330
- data-test-id="tabContent_TabContent"
331
- role="tabpanel"
332
- tabindex="-1"
333
- >
334
- <div>
335
- Page 1 Content
336
- </div>
337
- </div>
338
- </div>
339
- </div>
340
- </DocumentFragment>
341
- `;
@@ -1,18 +0,0 @@
1
- export const TAB_ALIGN_MAPPING = {
2
- vertical: 'column',
3
- horizontal: 'row',
4
- 'vertical-reverse': 'column-reverse',
5
- 'horizontal-reverse': 'row-reverse'
6
- };
7
- export const TAB_DIRECTION_MAPPING = {
8
- vertical: 'column',
9
- horizontal: 'row',
10
- 'vertical-reverse': 'column',
11
- 'horizontal-reverse': 'row'
12
- };
13
- export const TAB_POPUP_POSITION_MAPPING = {
14
- vertical: 'bottomLeft',
15
- horizontal: 'rightTop',
16
- 'vertical-reverse': 'topLeft',
17
- 'horizontal-reverse': 'leftTop'
18
- };
@@ -1,41 +0,0 @@
1
- "use strict";
2
-
3
- var _react = _interopRequireDefault(require("react"));
4
-
5
- var _react2 = require("@testing-library/react");
6
-
7
- var _index = require("../index");
8
-
9
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
10
-
11
- describe('TabWrapper', function () {
12
- var alignments = ['vertical', 'horizontal', 'vertical-reverse', 'horizontal-reverse'];
13
- test.each(alignments)('rendering the align prop of - %s', function (alignments) {
14
- var _render = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_index.TabWrapper, {
15
- type: "alpha",
16
- align: alignments,
17
- defaultTab: "page1"
18
- }, /*#__PURE__*/_react["default"].createElement(_index.Tabs, null, /*#__PURE__*/_react["default"].createElement(_index.Tab, {
19
- id: "page1",
20
- text: "Page 1"
21
- }), /*#__PURE__*/_react["default"].createElement(_index.Tab, {
22
- id: "page2",
23
- text: "Page 2"
24
- }), /*#__PURE__*/_react["default"].createElement(_index.Tab, {
25
- id: "page3",
26
- text: "Page 3"
27
- })), /*#__PURE__*/_react["default"].createElement(_index.TabContentWrapper, null, /*#__PURE__*/_react["default"].createElement(_index.TabContent, {
28
- id: "page1",
29
- text: "Page 1"
30
- }, /*#__PURE__*/_react["default"].createElement("div", null, "Page 1 Content")), /*#__PURE__*/_react["default"].createElement(_index.TabContent, {
31
- id: "page2",
32
- text: "Page 2"
33
- }, /*#__PURE__*/_react["default"].createElement("div", null, "Page 2 Content")), /*#__PURE__*/_react["default"].createElement(_index.TabContent, {
34
- id: "page3",
35
- text: "Page 3"
36
- }, /*#__PURE__*/_react["default"].createElement("div", null, "Page 3 Content"))))),
37
- asFragment = _render.asFragment;
38
-
39
- expect(asFragment()).toMatchSnapshot();
40
- });
41
- });