@zohodesk/components 1.0.0-temp-46 → 1.0.0-temp-47

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 (430) hide show
  1. package/README.md +8 -0
  2. package/{es → assets}/Appearance/dark/mode/darkMode.module.css +2 -2
  3. package/assets/Appearance/dark/themes/blue/blueDarkCTATheme.module.css +34 -0
  4. package/assets/Appearance/dark/themes/blue/blueDarkComponentTheme.module.css +42 -0
  5. package/{es → assets}/Appearance/dark/themes/green/greenDarkCTATheme.module.css +10 -10
  6. package/assets/Appearance/dark/themes/green/greenDarkComponentTheme.module.css +42 -0
  7. package/{es → assets}/Appearance/dark/themes/orange/orangeDarkCTATheme.module.css +10 -10
  8. package/assets/Appearance/dark/themes/orange/orangeDarkComponentTheme.module.css +42 -0
  9. package/{es → assets}/Appearance/dark/themes/red/redDarkCTATheme.module.css +10 -10
  10. package/assets/Appearance/dark/themes/red/redDarkComponentTheme.module.css +42 -0
  11. package/{es → assets}/Appearance/dark/themes/yellow/yellowDarkCTATheme.module.css +10 -10
  12. package/assets/Appearance/dark/themes/yellow/yellowDarkComponentTheme.module.css +42 -0
  13. package/{es → assets}/Appearance/default/mode/defaultMode.module.css +2 -2
  14. package/{es → assets}/Appearance/default/themes/blue/blueDefaultCTATheme.module.css +0 -0
  15. package/{es → assets}/Appearance/default/themes/blue/blueDefaultComponentTheme.module.css +7 -7
  16. package/{es → assets}/Appearance/default/themes/green/greenDefaultCTATheme.module.css +2 -2
  17. package/{es → assets}/Appearance/default/themes/green/greenDefaultComponentTheme.module.css +4 -4
  18. package/{es → assets}/Appearance/default/themes/orange/orangeDefaultCTATheme.module.css +0 -0
  19. package/{es → assets}/Appearance/default/themes/orange/orangeDefaultComponentTheme.module.css +3 -3
  20. package/{es → assets}/Appearance/default/themes/red/redDefaultCTATheme.module.css +7 -7
  21. package/{es → assets}/Appearance/default/themes/red/redDefaultComponentTheme.module.css +3 -3
  22. package/{es → assets}/Appearance/default/themes/yellow/yellowDefaultCTATheme.module.css +0 -0
  23. package/{es → assets}/Appearance/default/themes/yellow/yellowDefaultComponentTheme.module.css +3 -3
  24. package/es/AppContainer/AppContainer.js +6 -6
  25. package/es/Avatar/Avatar.module.css +11 -9
  26. package/es/AvatarTeam/AvatarTeam.module.css +21 -7
  27. package/es/Button/Button.module.css +96 -23
  28. package/es/Buttongroup/Buttongroup.module.css +37 -8
  29. package/es/CheckBox/CheckBox.module.css +17 -11
  30. package/es/DateTime/DateTime.module.css +41 -14
  31. package/es/DateTime/DateWidget.module.css +9 -9
  32. package/es/DateTime/YearView.module.css +16 -6
  33. package/es/DropBox/DropBox.module.css +47 -11
  34. package/es/DropDown/DropDownHeading.module.css +7 -3
  35. package/es/DropDown/DropDownItem.module.css +32 -6
  36. package/es/Label/Label.module.css +1 -4
  37. package/es/ListItem/ListContainer.js +123 -0
  38. package/es/ListItem/ListItem.js +23 -31
  39. package/es/ListItem/ListItem.module.css +56 -24
  40. package/es/ListItem/ListItemWithAvatar.js +21 -27
  41. package/es/ListItem/ListItemWithCheckBox.js +23 -29
  42. package/es/ListItem/ListItemWithIcon.js +26 -26
  43. package/es/ListItem/ListItemWithRadio.js +24 -31
  44. package/es/MultiSelect/AdvancedGroupMultiSelect.js +7 -4
  45. package/es/MultiSelect/AdvancedMultiSelect.js +6 -3
  46. package/es/MultiSelect/AdvancedMultiSelect.module.css +29 -14
  47. package/es/MultiSelect/MultiSelect.js +7 -4
  48. package/es/MultiSelect/MultiSelect.module.css +34 -21
  49. package/es/MultiSelect/MultiSelectWithAvatar.js +6 -3
  50. package/es/MultiSelect/SelectedOptions.js +3 -2
  51. package/es/MultiSelect/SelectedOptions.module.css +8 -2
  52. package/es/PopOver/PopOver.module.css +1 -1
  53. package/es/Provider.js +22 -22
  54. package/es/Radio/Radio.js +1 -2
  55. package/es/Radio/Radio.module.css +11 -5
  56. package/es/Ribbon/Ribbon.module.css +93 -28
  57. package/es/RippleEffect/RippleEffect.js +7 -4
  58. package/es/RippleEffect/RippleEffect.module.css +18 -44
  59. package/es/Select/Select.module.css +14 -4
  60. package/es/Select/SelectWithAvatar.js +7 -4
  61. package/es/Stencils/Stencils.module.css +21 -8
  62. package/es/Switch/Switch.module.css +6 -7
  63. package/es/Tab/Tab.module.css +19 -10
  64. package/es/Tab/Tabs.module.css +41 -8
  65. package/es/Tag/Tag.js +10 -4
  66. package/es/Tag/Tag.module.css +50 -25
  67. package/es/TextBox/TextBox.module.css +12 -16
  68. package/es/TextBoxIcon/TextBoxIcon.js +1 -1
  69. package/es/TextBoxIcon/TextBoxIcon.module.css +15 -7
  70. package/es/Textarea/Textarea.module.css +9 -10
  71. package/es/Tooltip/Tooltip.module.css +10 -9
  72. package/es/beta/FocusRing/FocusRing.module.css +51 -26
  73. package/es/common/animation.module.css +219 -21
  74. package/es/common/basicReset.module.css +2 -12
  75. package/es/common/common.module.css +62 -18
  76. package/es/common/customscroll.module.css +17 -21
  77. package/es/common/docStyle.module.css +78 -31
  78. package/es/common/transition.module.css +50 -10
  79. package/es/semantic/Button/semanticButton.module.css +3 -3
  80. package/lib/Accordion/Accordion.js +146 -0
  81. package/lib/Accordion/AccordionItem.js +124 -0
  82. package/lib/Accordion/__tests__/Accordion.spec.js +85 -0
  83. package/lib/Accordion/index.js +23 -0
  84. package/lib/Animation/Animation.js +207 -0
  85. package/lib/Animation/__tests__/Animation.spec.js +23 -0
  86. package/lib/AppContainer/AppContainer.js +205 -0
  87. package/lib/AppContainer/AppContainer.module.css +18 -0
  88. package/lib/Avatar/Avatar.js +280 -0
  89. package/lib/Avatar/Avatar.module.css +117 -0
  90. package/lib/Avatar/__tests__/Avatar.spec.js +208 -0
  91. package/lib/Avatar/__tests__/__snapshots__/Avatar.spec.js.snap +288 -0
  92. package/lib/AvatarTeam/AvatarTeam.js +157 -0
  93. package/lib/AvatarTeam/AvatarTeam.module.css +161 -0
  94. package/lib/AvatarTeam/__tests__/AvatarTeam.spec.js +92 -0
  95. package/lib/AvatarTeam/__tests__/__snapshots__/AvatarTeam.spec.js.snap +226 -0
  96. package/lib/Button/Button.js +159 -0
  97. package/lib/Button/Button.module.css +518 -0
  98. package/lib/Button/__tests__/Button.spec.js +233 -0
  99. package/lib/Button/__tests__/__snapshots__/Button.spec.js.snap +191 -0
  100. package/lib/Buttongroup/Buttongroup.js +101 -0
  101. package/lib/Buttongroup/Buttongroup.module.css +89 -0
  102. package/lib/Buttongroup/__test__/Buttongroup.spec.js +86 -0
  103. package/lib/Buttongroup/__test__/__snapshots__/Buttongroup.spec.js.snap +146 -0
  104. package/lib/Card/Card.js +410 -0
  105. package/lib/Card/Card.module.css +20 -0
  106. package/lib/Card/__tests__/Card.spec.js +56 -0
  107. package/lib/Card/index.js +37 -0
  108. package/lib/CheckBox/CheckBox.js +265 -0
  109. package/lib/CheckBox/CheckBox.module.css +153 -0
  110. package/lib/CheckBox/__tests__/CheckBox.spec.js +18 -0
  111. package/lib/DateTime/CalendarView.js +285 -0
  112. package/lib/DateTime/DateTime.js +889 -0
  113. package/lib/DateTime/DateTime.module.css +188 -0
  114. package/lib/DateTime/DateTimePopupFooter.js +90 -0
  115. package/lib/DateTime/DateTimePopupHeader.js +149 -0
  116. package/lib/DateTime/DateWidget.js +1189 -0
  117. package/lib/DateTime/DateWidget.module.css +42 -0
  118. package/lib/DateTime/DaysRow.js +76 -0
  119. package/lib/DateTime/Time.js +248 -0
  120. package/lib/DateTime/YearView.js +324 -0
  121. package/lib/DateTime/YearView.module.css +80 -0
  122. package/lib/DateTime/__tests__/CalendarView.spec.js +45 -0
  123. package/lib/DateTime/__tests__/DateTime.spec.js +127 -0
  124. package/lib/DateTime/__tests__/DateWidget.spec.js +81 -0
  125. package/lib/DateTime/common.js +36 -0
  126. package/lib/DateTime/constants.js +77 -0
  127. package/lib/DateTime/dateFormatUtils/dateFormat.js +613 -0
  128. package/lib/DateTime/dateFormatUtils/dayChange.js +81 -0
  129. package/lib/DateTime/dateFormatUtils/index.js +274 -0
  130. package/lib/DateTime/dateFormatUtils/monthChange.js +94 -0
  131. package/lib/DateTime/dateFormatUtils/timeChange.js +240 -0
  132. package/lib/DateTime/dateFormatUtils/yearChange.js +119 -0
  133. package/lib/DateTime/index.js +15 -0
  134. package/lib/DateTime/objectUtils.js +76 -0
  135. package/lib/DateTime/typeChecker.js +26 -0
  136. package/lib/DateTime/validator.js +353 -0
  137. package/lib/DropBox/DropBox.js +389 -0
  138. package/lib/DropBox/DropBox.module.css +406 -0
  139. package/lib/DropBox/DropBoxPositionMapping.json +145 -0
  140. package/lib/DropBox/__tests__/DropBox.spec.js +87 -0
  141. package/lib/DropDown/DropDown.js +203 -0
  142. package/lib/DropDown/DropDown.module.css +5 -0
  143. package/lib/DropDown/DropDownHeading.js +102 -0
  144. package/lib/DropDown/DropDownHeading.module.css +53 -0
  145. package/lib/DropDown/DropDownItem.js +139 -0
  146. package/lib/DropDown/DropDownItem.module.css +94 -0
  147. package/lib/DropDown/DropDownSearch.js +132 -0
  148. package/lib/DropDown/DropDownSearch.module.css +14 -0
  149. package/lib/DropDown/DropDownSeparator.js +66 -0
  150. package/lib/DropDown/DropDownSeparator.module.css +7 -0
  151. package/lib/DropDown/__tests__/DropDown.spec.js +50 -0
  152. package/lib/DropDown/__tests__/DropDownItem.spec.js +51 -0
  153. package/lib/DropDown/__tests__/DropDownSearch.spec.js +17 -0
  154. package/lib/Label/Label.js +109 -0
  155. package/lib/Label/Label.module.css +52 -0
  156. package/lib/Label/LabelColors.module.css +21 -0
  157. package/lib/Label/__tests__/Label.spec.js +137 -0
  158. package/lib/Label/__tests__/__snapshots__/Label.spec.js.snap +101 -0
  159. package/lib/Layout/Box.js +138 -0
  160. package/lib/Layout/Container.js +152 -0
  161. package/lib/Layout/Layout.module.css +324 -0
  162. package/lib/Layout/__tests__/Box.spec.js +121 -0
  163. package/lib/Layout/__tests__/Container.spec.js +127 -0
  164. package/lib/Layout/index.js +34 -0
  165. package/lib/Layout/utils.js +55 -0
  166. package/lib/LightNightMode/Colors.json +398 -0
  167. package/lib/ListItem/ListContainer.js +132 -0
  168. package/lib/ListItem/ListItem.js +227 -0
  169. package/lib/ListItem/ListItem.module.css +200 -0
  170. package/lib/ListItem/ListItemWithAvatar.js +237 -0
  171. package/lib/ListItem/ListItemWithCheckBox.js +205 -0
  172. package/lib/ListItem/ListItemWithIcon.js +229 -0
  173. package/lib/ListItem/ListItemWithRadio.js +208 -0
  174. package/lib/Modal/Modal.js +218 -0
  175. package/lib/Modal/__docs__/Modal__default.docs.js +88 -0
  176. package/lib/MultiSelect/AdvancedGroupMultiSelect.js +1218 -0
  177. package/lib/MultiSelect/AdvancedMultiSelect.js +684 -0
  178. package/lib/MultiSelect/AdvancedMultiSelect.module.css +127 -0
  179. package/lib/MultiSelect/EmptyState.js +132 -0
  180. package/lib/MultiSelect/MultiSelect.js +1226 -0
  181. package/lib/MultiSelect/MultiSelect.module.css +193 -0
  182. package/lib/MultiSelect/MultiSelectHeader.js +86 -0
  183. package/lib/MultiSelect/MultiSelectWithAvatar.js +410 -0
  184. package/lib/MultiSelect/SelectedOptions.js +140 -0
  185. package/lib/MultiSelect/SelectedOptions.module.css +15 -0
  186. package/lib/MultiSelect/Suggestions.js +219 -0
  187. package/lib/MultiSelect/__tests__/MultiSelect.spec.js +170 -0
  188. package/lib/PopOver/PopOver.js +366 -0
  189. package/lib/PopOver/PopOver.module.css +8 -0
  190. package/lib/PopOver/__tests__/PopOver.spec.js +20 -0
  191. package/lib/Popup/Popup.js +716 -0
  192. package/lib/Popup/PositionMapping.json +74 -0
  193. package/lib/Popup/__tests__/Popup.spec.js +192 -0
  194. package/lib/Popup/viewPort.js +368 -0
  195. package/lib/Provider/AvatarSize.js +23 -0
  196. package/lib/Provider/Config.js +25 -0
  197. package/lib/Provider/CssProvider.js +27 -0
  198. package/lib/Provider/IdProvider.js +82 -0
  199. package/lib/Provider/LibraryContext.js +76 -0
  200. package/lib/Provider/LibraryContextInit.js +15 -0
  201. package/lib/Provider/NumberGenerator/NumberGenerator.js +174 -0
  202. package/lib/Provider/ZindexProvider.js +69 -0
  203. package/lib/Provider.js +241 -0
  204. package/lib/Radio/Radio.js +214 -0
  205. package/lib/Radio/Radio.module.css +110 -0
  206. package/lib/Radio/__tests__/Radiospec.js +29 -0
  207. package/lib/Responsive/CustomResponsive.js +246 -0
  208. package/lib/Responsive/RefWrapper.js +55 -0
  209. package/lib/Responsive/ResizeComponent.js +268 -0
  210. package/lib/Responsive/ResizeObserver.js +168 -0
  211. package/lib/Responsive/Responsive.js +280 -0
  212. package/lib/Responsive/index.js +30 -0
  213. package/lib/Responsive/sizeObservers.js +206 -0
  214. package/lib/Responsive/utils/index.js +69 -0
  215. package/lib/Responsive/utils/shallowCompare.js +38 -0
  216. package/lib/Responsive/windowResizeObserver.js +63 -0
  217. package/lib/Ribbon/Ribbon.js +115 -0
  218. package/lib/Ribbon/Ribbon.module.css +377 -0
  219. package/lib/Ribbon/__tests__/Ribbon.spec.js +193 -0
  220. package/lib/Ribbon/__tests__/__snapshots__/Ribbon.spec.js.snap +163 -0
  221. package/lib/RippleEffect/RippleEffect.js +61 -0
  222. package/lib/RippleEffect/RippleEffect.module.css +70 -0
  223. package/lib/Select/GroupSelect.js +944 -0
  224. package/lib/Select/Select.js +1078 -0
  225. package/lib/Select/Select.module.css +100 -0
  226. package/lib/Select/SelectWithAvatar.js +433 -0
  227. package/lib/Select/SelectWithIcon.js +556 -0
  228. package/lib/Select/__tests__/Select.spec.js +383 -0
  229. package/lib/Stencils/Stencils.js +94 -0
  230. package/lib/Stencils/Stencils.module.css +96 -0
  231. package/lib/Stencils/__tests__/Stencils.spec.js +84 -0
  232. package/lib/Stencils/__tests__/__snapshots__/Stencils.spec.js.snap +49 -0
  233. package/lib/Switch/Switch.js +183 -0
  234. package/lib/Switch/Switch.module.css +110 -0
  235. package/lib/Tab/Tab.js +158 -0
  236. package/lib/Tab/Tab.module.css +101 -0
  237. package/lib/Tab/TabContent.js +45 -0
  238. package/lib/Tab/TabContent.module.css +4 -0
  239. package/lib/Tab/TabContentWrapper.js +47 -0
  240. package/lib/Tab/TabWrapper.js +109 -0
  241. package/lib/Tab/Tabs.js +696 -0
  242. package/lib/Tab/Tabs.module.css +140 -0
  243. package/lib/Tab/__tests__/Tab.spec.js +130 -0
  244. package/lib/Tab/__tests__/TabContent.spec.js +22 -0
  245. package/lib/Tab/__tests__/TabContentWrapper.spec.js +59 -0
  246. package/lib/Tab/__tests__/TabWrapper.spec.js +100 -0
  247. package/lib/Tab/__tests__/Tabs.spec.js +123 -0
  248. package/lib/Tab/index.js +47 -0
  249. package/lib/Tag/Tag.js +252 -0
  250. package/lib/Tag/Tag.module.css +251 -0
  251. package/lib/Tag/__tests__/Tag.spec.js +35 -0
  252. package/lib/TextBox/TextBox.js +289 -0
  253. package/lib/TextBox/TextBox.module.css +157 -0
  254. package/lib/TextBox/__tests__/TextBox.spec.js +205 -0
  255. package/lib/TextBox/__tests__/__snapshots__/TextBox.spec.js.snap +127 -0
  256. package/lib/TextBoxIcon/TextBoxIcon.js +284 -0
  257. package/lib/TextBoxIcon/TextBoxIcon.module.css +78 -0
  258. package/lib/TextBoxIcon/__tests__/TextBoxIcon.spec.js +228 -0
  259. package/lib/TextBoxIcon/__tests__/__snapshots__/TextBoxIcon.spec.js.snap +334 -0
  260. package/lib/Textarea/Textarea.js +202 -0
  261. package/lib/Textarea/Textarea.module.css +139 -0
  262. package/lib/Textarea/__tests__/Textarea.spec.js +186 -0
  263. package/lib/Textarea/__tests__/__snapshots__/Textarea.spec.js.snap +97 -0
  264. package/lib/Tooltip/Tooltip.js +538 -0
  265. package/lib/Tooltip/Tooltip.module.css +104 -0
  266. package/lib/Tooltip/__tests__/Tooltip.spec.js +98 -0
  267. package/lib/VelocityAnimation/VelocityAnimation/VelocityAnimation.js +144 -0
  268. package/lib/VelocityAnimation/VelocityAnimationGroup/VelocityAnimationGroup.js +188 -0
  269. package/lib/a11y/FocusScope/FocusScope.js +443 -0
  270. package/lib/beta/FocusRing/FocusRing.js +338 -0
  271. package/lib/beta/FocusRing/FocusRing.module.css +152 -0
  272. package/lib/common/animation.module.css +624 -0
  273. package/lib/common/avatarsizes.module.css +45 -0
  274. package/lib/common/basic.module.css +33 -0
  275. package/lib/common/basicReset.module.css +40 -0
  276. package/lib/common/common.module.css +502 -0
  277. package/lib/common/customscroll.module.css +89 -0
  278. package/lib/common/docStyle.module.css +762 -0
  279. package/lib/common/reset.module.css +12 -0
  280. package/lib/common/transition.module.css +146 -0
  281. package/lib/css.js +83 -0
  282. package/lib/deprecated/PortalLayer/PortalLayer.js +165 -0
  283. package/lib/index.js +1412 -0
  284. package/lib/semantic/Button/Button.js +138 -0
  285. package/lib/semantic/Button/semanticButton.module.css +9 -0
  286. package/lib/utils/Common.js +453 -0
  287. package/lib/utils/ContextOptimizer.js +49 -0
  288. package/lib/utils/__tests__/constructFullName.spec.js +12 -0
  289. package/lib/utils/__tests__/debounce.spec.js +40 -0
  290. package/lib/utils/__tests__/getInitial.spec.js +26 -0
  291. package/lib/utils/constant.js +10 -0
  292. package/lib/utils/constructFullName.js +34 -0
  293. package/lib/utils/datetime/common.js +233 -0
  294. package/lib/utils/debounce.js +30 -0
  295. package/lib/utils/dropDownUtils.js +565 -0
  296. package/lib/utils/dummyFunction.js +10 -0
  297. package/lib/utils/getHTMLFontSize.js +11 -0
  298. package/lib/utils/getInitial.js +33 -0
  299. package/lib/utils/scrollTo.js +22 -0
  300. package/lib/utils/shallowEqual.js +41 -0
  301. package/package.json +7 -7
  302. package/README_Beta.md +0 -2
  303. package/__testUtils__/globals.js +0 -46
  304. package/__testUtils__/moduleMapKey.json +0 -138
  305. package/dubFinder.js +0 -96
  306. package/es/Accordion/docs/Accordion__Demo.docs.js +0 -80
  307. package/es/Animation/docs/Animation__default.docs.js +0 -34
  308. package/es/Animation/docs/Animation__fadeIn.docs.js +0 -34
  309. package/es/Animation/docs/Animation__scaleIn.docs.js +0 -34
  310. package/es/Animation/docs/Animation__skewIn.docs.js +0 -34
  311. package/es/Animation/docs/Animation__slideDown.docs.js +0 -34
  312. package/es/Animation/docs/Animation__slideLeft.docs.js +0 -34
  313. package/es/Animation/docs/Animation__zoomIn.docs.js +0 -34
  314. package/es/AppContainer/docs/AppContainer__default.docs.js +0 -20
  315. package/es/Appearance/dark/themes/blue/blueDarkCTATheme.module.css +0 -34
  316. package/es/Appearance/dark/themes/blue/blueDarkComponentTheme.module.css +0 -42
  317. package/es/Appearance/dark/themes/green/greenDarkComponentTheme.module.css +0 -42
  318. package/es/Appearance/dark/themes/orange/orangeDarkComponentTheme.module.css +0 -42
  319. package/es/Appearance/dark/themes/red/redDarkComponentTheme.module.css +0 -42
  320. package/es/Appearance/dark/themes/yellow/yellowDarkComponentTheme.module.css +0 -42
  321. package/es/Avatar/docs/Avatar__custom.docs.js +0 -29
  322. package/es/Avatar/docs/Avatar__default.docs.js +0 -29
  323. package/es/Avatar/docs/Avatar__palette.docs.js +0 -49
  324. package/es/Avatar/docs/Avatar__text.docs.js +0 -28
  325. package/es/AvatarTeam/docs/AvatarTeam__custom.docs.js +0 -73
  326. package/es/AvatarTeam/docs/AvatarTeam__default.docs.js +0 -31
  327. package/es/AvatarTeam/docs/AvatarTeam__palette.docs.js +0 -50
  328. package/es/AvatarTeam/docs/AvatarTeam__size.docs.js +0 -49
  329. package/es/Button/docs/Button__custom.docs.js +0 -771
  330. package/es/Button/docs/Button__default.docs.js +0 -536
  331. package/es/Buttongroup/docs/Buttongroup__custom.docs.js +0 -37
  332. package/es/Buttongroup/docs/Buttongroup__footer.docs.js +0 -33
  333. package/es/Buttongroup/docs/Buttongroup__header.docs.js +0 -42
  334. package/es/Card/docs/Card__Custom.docs.js +0 -34
  335. package/es/Card/docs/Card__Default.docs.js +0 -37
  336. package/es/Card/docs/Card__Scroll.docs.js +0 -59
  337. package/es/CheckBox/docs/CheckBox__custom.docs.js +0 -293
  338. package/es/CheckBox/docs/CheckBox__default.docs.js +0 -219
  339. package/es/DateTime/docs/DateTime__default.docs.js +0 -91
  340. package/es/DateTime/docs/DateWidget__default.docs.js +0 -183
  341. package/es/DateTime/docs/timezonedata.json +0 -1
  342. package/es/DropBox/docs/DropBox__custom.docs.js +0 -66
  343. package/es/DropBox/docs/DropBox__customOrder.docs.js +0 -92
  344. package/es/DropBox/docs/DropBox__fixedPosition.docs.js +0 -91
  345. package/es/DropBox/docs/DropBox__position.docs.js +0 -87
  346. package/es/DropBox/docs/DropBox__size.docs.js +0 -61
  347. package/es/DropDown/docs/DropDownHeading__custom.docs.js +0 -23
  348. package/es/DropDown/docs/DropDownHeading__default.docs.js +0 -21
  349. package/es/Label/docs/Label__clipped.docs.js +0 -27
  350. package/es/Label/docs/Label__custom.docs.js +0 -30
  351. package/es/Label/docs/Label__palette.docs.js +0 -42
  352. package/es/Label/docs/Label__size.docs.js +0 -29
  353. package/es/Label/docs/Label__type.docs.js +0 -37
  354. package/es/Layout/docs/Layout__Hidden.docs.js +0 -77
  355. package/es/Layout/docs/Layout__default.docs.js +0 -49
  356. package/es/Layout/docs/Layout__four_Column.docs.js +0 -85
  357. package/es/Layout/docs/Layout__three_Column.docs.js +0 -76
  358. package/es/Layout/docs/Layout__two_Column.docs.js +0 -69
  359. package/es/LightNightMode/docs/AlternativeColors.docs.js +0 -74
  360. package/es/ListItem/docs/ListItemWithAvatar__custom.docs.js +0 -155
  361. package/es/ListItem/docs/ListItemWithAvatar__default.docs.js +0 -112
  362. package/es/ListItem/docs/ListItemWithCheckBox__custom.docs.js +0 -91
  363. package/es/ListItem/docs/ListItemWithCheckBox__default.docs.js +0 -65
  364. package/es/ListItem/docs/ListItemWithIcon__custom.docs.js +0 -68
  365. package/es/ListItem/docs/ListItemWithIcon__default.docs.js +0 -62
  366. package/es/ListItem/docs/ListItemWithRadio__custom.docs.js +0 -91
  367. package/es/ListItem/docs/ListItemWithRadio__default.docs.js +0 -65
  368. package/es/ListItem/docs/ListItem__custom.docs.js +0 -114
  369. package/es/ListItem/docs/ListItem__default.docs.js +0 -82
  370. package/es/MultiSelect/docs/AdvancedGroupMultiSelect__default.docs.js +0 -124
  371. package/es/MultiSelect/docs/AdvancedMultiSelect__default.docs.js +0 -114
  372. package/es/MultiSelect/docs/MultiSelectWithAvatar__default.docs.js +0 -141
  373. package/es/MultiSelect/docs/MultiSelect__default.docs.js +0 -161
  374. package/es/PopOver/docs/PopOver__default.docs.js +0 -32
  375. package/es/Provider/docs/Provider_Id__Class.docs.js +0 -29
  376. package/es/Provider/docs/Provider_Id__Function.docs.js +0 -18
  377. package/es/Provider/docs/Provider_Zindex__Class.docs.js +0 -32
  378. package/es/Provider/docs/Provider_Zindex__Function.docs.js +0 -23
  379. package/es/Radio/docs/Radio__custom.docs.js +0 -245
  380. package/es/Radio/docs/Radio__default.docs.js +0 -169
  381. package/es/Responsive/docs/Responsive__Custom.docs.js +0 -201
  382. package/es/Responsive/docs/Responsive__default.docs.js +0 -94
  383. package/es/Responsive/docs/style.module.css +0 -47
  384. package/es/Ribbon/docs/Ribbon__custom.docs.js +0 -386
  385. package/es/Ribbon/docs/Ribbon__default.docs.js +0 -342
  386. package/es/RippleEffect/docs/RippleEffect__default.docs.js +0 -435
  387. package/es/Select/docs/GroupSelect__default.docs.js +0 -149
  388. package/es/Select/docs/SelectWithAvatar__default.docs.js +0 -97
  389. package/es/Select/docs/SelectWithIcon__default.docs.js +0 -138
  390. package/es/Select/docs/Select__default.docs.js +0 -287
  391. package/es/Stencils/docs/Stencils__custom.docs.js +0 -45
  392. package/es/Stencils/docs/Stencils__default.docs.js +0 -50
  393. package/es/Switch/docs/Switch__custom.docs.js +0 -153
  394. package/es/Switch/docs/Switch__default.docs.js +0 -107
  395. package/es/Tab/docs/Tab__default.docs.js +0 -259
  396. package/es/Tab/docs/tabdocs.module.css +0 -29
  397. package/es/Tag/docs/Tag__custom.docs.js +0 -368
  398. package/es/Tag/docs/Tag__default.docs.js +0 -253
  399. package/es/TextBox/docs/TextBox__custom.docs.js +0 -43
  400. package/es/TextBox/docs/TextBox__default.docs.js +0 -40
  401. package/es/TextBox/docs/TextBox__size.docs.js +0 -38
  402. package/es/TextBox/docs/TextBox__variant.docs.js +0 -38
  403. package/es/TextBoxIcon/docs/TextBoxIcon__custom.docs.js +0 -89
  404. package/es/TextBoxIcon/docs/TextBoxIcon__default.docs.js +0 -61
  405. package/es/Textarea/docs/Textarea__animated.docs.js +0 -41
  406. package/es/Textarea/docs/Textarea__custom.docs.js +0 -82
  407. package/es/Textarea/docs/Textarea__default.docs.js +0 -76
  408. package/es/Textarea/docs/Textarea__disabled.docs.js +0 -29
  409. package/es/Tooltip/docs/Tooltip__default.docs.js +0 -332
  410. package/es/VelocityAnimation/VelocityAnimation/docs/VelocityAnimation__demo.docs.js +0 -97
  411. package/es/VelocityAnimation/VelocityAnimationGroup/docs/VelocityAnimationGroup__demo.docs.js +0 -150
  412. package/es/a11y/FocusScope/docs/FocusScope__default.docs.js +0 -139
  413. package/es/beta/FocusRing/docs/FocusRing__default.docs.js +0 -48
  414. package/es/deprecated/PortalLayer/docs/PortalLayer__default.docs.js +0 -72
  415. package/es/deprecated/Theme/darkTheme.module.css +0 -393
  416. package/es/deprecated/Theme/defaultTheme.module.css +0 -393
  417. package/es/deprecated/Theme/palette/darkCTAPalette.module.css +0 -116
  418. package/es/deprecated/Theme/palette/darkPalette.module.css +0 -155
  419. package/es/deprecated/Theme/palette/defaultCTAPalette.module.css +0 -116
  420. package/es/deprecated/Theme/palette/defaultPalette.module.css +0 -155
  421. package/es/deprecated/customscroll_Old.module.css +0 -46
  422. package/es/semantic/Button/docs/Button__default.docs.js +0 -20
  423. package/externalDocsBuild.js +0 -21
  424. package/preprocess/componentAppearanceColors.js +0 -65
  425. package/preprocess/componentThemeColors.js +0 -119
  426. package/preprocess/ctaThemeColors.js +0 -95
  427. package/preprocess/index.js +0 -3
  428. package/preprocess/json/componentAppearanceVariableJson.js +0 -1515
  429. package/preprocess/json/componentThemeVariableJson.js +0 -259
  430. package/preprocess/json/ctaThemeVariableJson.js +0 -337
@@ -1,34 +0,0 @@
1
- import React, { Component } from 'react';
2
- import Card, { CardHeader, CardFooter, CardContent } from '../Card';
3
- import { Box } from '../../Layout';
4
- import CodeExtract from '@zohodesk/docstool/lib/CodeExtractor/CodeExtractor';
5
- import style from '../../common/docStyle.module.css';
6
- export default class Card__Custom extends Component {
7
- render() {
8
- return /*#__PURE__*/React.createElement("div", {
9
- style: {
10
- height: '50vh'
11
- }
12
- }, /*#__PURE__*/React.createElement(CodeExtract, null, /*#__PURE__*/React.createElement(Card, {
13
- isScrollAttribute: true,
14
- customClass: style.customCard
15
- }, /*#__PURE__*/React.createElement(CardHeader, {
16
- customClass: style.customCardHeader
17
- }, /*#__PURE__*/React.createElement(Box, null, "Header")), /*#__PURE__*/React.createElement(CardContent, {
18
- customClass: style.customCardContent,
19
- isScrollAttribute: true
20
- }, /*#__PURE__*/React.createElement(Box, null, "What is Lorem Ipsum? Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum. Why do we use it? It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here, content here', making it look like readable English. Many desktop publishing packages and web page editors now use Lorem Ipsum as their default model text, and a search for 'lorem ipsum' will uncover many web sites still in their infancy. Various versions have evolved over the years, sometimes by accident, sometimes on purpose (injected humour and the like). Where does it come from? Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC, making it over 2000 years old. Richard McClintock, a Latin professor at Hampden-Sydney College in Virginia, looked up one of the more obscure Latin words, consectetur, from a Lorem Ipsum passage, and going through the cites of the word in classical literature, discovered the undoubtable source. Lorem Ipsum comes from sections 1.10.32 and 1.10.33 of \"de Finibus Bonorum et Malorum\" (The Extremes of Good and Evil) by Cicero, written in 45 BC. This book is a treatise on the theory of ethics, very popular during the Renaissance. The first line of Lorem Ipsum, \"Lorem ipsum dolor sit amet..\", comes from a line in section 1.10.32. What is Lorem Ipsum? Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum. Why do we use it? It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here, content here', making it look like readable English. Many desktop publishing packages and web page editors now use Lorem Ipsum as their default model text, and a search for 'lorem ipsum' will uncover many web sites still in their infancy. Various versions have evolved over the years, sometimes by accident, sometimes on purpose (injected humour and the like). Where does it come from? Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC, making it over 2000 years old. Richard McClintock, a Latin professor at Hampden-Sydney College in Virginia, looked up one of the more obscure Latin words, consectetur, from a Lorem Ipsum passage, and going through the cites of the word in classical literature, discovered the undoubtable source. Lorem Ipsum comes from sections 1.10.32 and 1.10.33 of \"de Finibus Bonorum et Malorum\" (The Extremes of Good and Evil) by Cicero, written in 45 BC. This book is a treatise on the theory of ethics, very popular during the Renaissance. The first line of Lorem Ipsum, \"Lorem ipsum dolor sit amet..\", comes from a line in section 1.10.32. What is Lorem Ipsum? Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum. Why do we use it? It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here, content here', making it look like readable English. Many desktop publishing packages and web page editors now use Lorem Ipsum as their default model text, and a search for 'lorem ipsum' will uncover many web sites still in their infancy. Various versions have evolved over the years, sometimes by accident, sometimes on purpose (injected humour and the like). Where does it come from? Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC, making it over 2000 years old. Richard McClintock, a Latin professor at Hampden-Sydney College in Virginia, looked up one of the more obscure Latin words, consectetur, from a Lorem Ipsum passage, and going through the cites of the word in classical literature, discovered the undoubtable source. Lorem Ipsum comes from sections 1.10.32 and 1.10.33 of \"de Finibus Bonorum et Malorum\" (The Extremes of Good and Evil) by Cicero, written in 45 BC. This book is a treatise on the theory of ethics, very popular during the Renaissance. The first line of Lorem Ipsum, \"Lorem ipsum dolor sit amet..\", comes from a line in section 1.10.32.")), /*#__PURE__*/React.createElement(CardFooter, {
21
- customClass: style.customCardFooter
22
- }, /*#__PURE__*/React.createElement(Box, null, "Footer")))));
23
- }
24
-
25
- }
26
-
27
- if (false) {
28
- Card__Custom.docs = {
29
- componentGroup: 'Template',
30
- folderName: 'Style Guide',
31
- external: true,
32
- description: ' '
33
- };
34
- }
@@ -1,37 +0,0 @@
1
- import React, { Component } from 'react';
2
- import Card, { CardHeader, CardFooter, CardContent } from '../Card';
3
- import { Box } from '../../Layout';
4
- import CodeExtract from '@zohodesk/docstool/lib/CodeExtractor/CodeExtractor';
5
- export default class Card__Default extends Component {
6
- render() {
7
- return /*#__PURE__*/React.createElement("div", {
8
- style: {
9
- height: '50vh'
10
- }
11
- }, /*#__PURE__*/React.createElement(CodeExtract, null, /*#__PURE__*/React.createElement(Card, {
12
- isScrollAttribute: true
13
- }, /*#__PURE__*/React.createElement(CardHeader, null, /*#__PURE__*/React.createElement(Box, {
14
- style: {
15
- color: 'var(--dot_white)',
16
- background: 'var(--dot_black)'
17
- }
18
- }, "Header")), /*#__PURE__*/React.createElement(CardContent, {
19
- isScrollAttribute: true
20
- }, /*#__PURE__*/React.createElement(Box, null, "What is Lorem Ipsum? Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum. Why do we use it? It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here, content here', making it look like readable English. Many desktop publishing packages and web page editors now use Lorem Ipsum as their default model text, and a search for 'lorem ipsum' will uncover many web sites still in their infancy. Various versions have evolved over the years, sometimes by accident, sometimes on purpose (injected humour and the like). Where does it come from? Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC, making it over 2000 years old. Richard McClintock, a Latin professor at Hampden-Sydney College in Virginia, looked up one of the more obscure Latin words, consectetur, from a Lorem Ipsum passage, and going through the cites of the word in classical literature, discovered the undoubtable source. Lorem Ipsum comes from sections 1.10.32 and 1.10.33 of \"de Finibus Bonorum et Malorum\" (The Extremes of Good and Evil) by Cicero, written in 45 BC. This book is a treatise on the theory of ethics, very popular during the Renaissance. The first line of Lorem Ipsum, \"Lorem ipsum dolor sit amet..\", comes from a line in section 1.10.32. What is Lorem Ipsum? Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum. Why do we use it? It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here, content here', making it look like readable English. Many desktop publishing packages and web page editors now use Lorem Ipsum as their default model text, and a search for 'lorem ipsum' will uncover many web sites still in their infancy. Various versions have evolved over the years, sometimes by accident, sometimes on purpose (injected humour and the like). Where does it come from? Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC, making it over 2000 years old. Richard McClintock, a Latin professor at Hampden-Sydney College in Virginia, looked up one of the more obscure Latin words, consectetur, from a Lorem Ipsum passage, and going through the cites of the word in classical literature, discovered the undoubtable source. Lorem Ipsum comes from sections 1.10.32 and 1.10.33 of \"de Finibus Bonorum et Malorum\" (The Extremes of Good and Evil) by Cicero, written in 45 BC. This book is a treatise on the theory of ethics, very popular during the Renaissance. The first line of Lorem Ipsum, \"Lorem ipsum dolor sit amet..\", comes from a line in section 1.10.32. What is Lorem Ipsum? Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum. Why do we use it? It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here, content here', making it look like readable English. Many desktop publishing packages and web page editors now use Lorem Ipsum as their default model text, and a search for 'lorem ipsum' will uncover many web sites still in their infancy. Various versions have evolved over the years, sometimes by accident, sometimes on purpose (injected humour and the like). Where does it come from? Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin literature from 45 BC, making it over 2000 years old. Richard McClintock, a Latin professor at Hampden-Sydney College in Virginia, looked up one of the more obscure Latin words, consectetur, from a Lorem Ipsum passage, and going through the cites of the word in classical literature, discovered the undoubtable source. Lorem Ipsum comes from sections 1.10.32 and 1.10.33 of \"de Finibus Bonorum et Malorum\" (The Extremes of Good and Evil) by Cicero, written in 45 BC. This book is a treatise on the theory of ethics, very popular during the Renaissance. The first line of Lorem Ipsum, \"Lorem ipsum dolor sit amet..\", comes from a line in section 1.10.32.")), /*#__PURE__*/React.createElement(CardFooter, null, /*#__PURE__*/React.createElement(Box, {
21
- style: {
22
- color: 'var(--dot_white)',
23
- background: 'var(--dot_black)'
24
- }
25
- }, "Footer")))));
26
- }
27
-
28
- }
29
-
30
- if (false) {
31
- Card__Default.docs = {
32
- componentGroup: 'Template',
33
- folderName: 'Style Guide',
34
- external: true,
35
- description: ' '
36
- };
37
- }
@@ -1,59 +0,0 @@
1
- import React, { Component } from 'react';
2
- import Card, { CardHeader, CardFooter, CardContent } from '../Card';
3
- import { Box } from '../../Layout';
4
- import CodeExtract from '@zohodesk/docstool/lib/CodeExtractor/CodeExtractor';
5
- export default class Card__Scroll extends Component {
6
- constructor(props) {
7
- super(props);
8
- this.state = {
9
- from: 0,
10
- limit: 10,
11
- noMoreData: false,
12
- isApiSend: false,
13
- data: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29]
14
- };
15
- }
16
-
17
- render() {
18
- let {
19
- from,
20
- limit,
21
- data
22
- } = this.state;
23
- return /*#__PURE__*/React.createElement("div", {
24
- style: {
25
- height: '400px'
26
- }
27
- }, /*#__PURE__*/React.createElement(Card, {
28
- from: from,
29
- limit: limit,
30
- fetchData: this.fetchData
31
- }, /*#__PURE__*/React.createElement(CardHeader, null, /*#__PURE__*/React.createElement(Box, {
32
- style: {
33
- color: 'var(--dot_white)',
34
- background: 'var(--dot_black)'
35
- }
36
- }, "Header")), /*#__PURE__*/React.createElement(CardContent, null, data.map((val, index) => /*#__PURE__*/React.createElement("div", {
37
- key: index,
38
- style: {
39
- padding: '10px 0px',
40
- borderBottom: '1px solid #ddd'
41
- }
42
- }, val))), /*#__PURE__*/React.createElement(CardFooter, null, /*#__PURE__*/React.createElement(Box, {
43
- style: {
44
- color: 'var(--dot_white)',
45
- background: 'var(--dot_black)'
46
- }
47
- }, "Footer"))));
48
- }
49
-
50
- }
51
-
52
- if (false) {
53
- Card__Scroll.docs = {
54
- componentGroup: 'Template',
55
- folderName: 'Style Guide',
56
- external: true,
57
- description: ' '
58
- };
59
- }
@@ -1,293 +0,0 @@
1
- import React, { Component } from 'react';
2
- import CheckBox from '../CheckBox';
3
- import styles from '../../common/docStyle.module.css';
4
- export default class CheckBox__custom extends Component {
5
- constructor(props) {
6
- super(props);
7
- this.onChange = this.onChange.bind(this);
8
- this.onSelect = this.onSelect.bind(this);
9
- this.state = {
10
- checked: false,
11
- selected: true
12
- };
13
- }
14
-
15
- onChange() {
16
- this.setState({
17
- checked: !this.state.checked
18
- });
19
- }
20
-
21
- onSelect() {
22
- this.setState({
23
- selected: !this.state.selected
24
- });
25
- }
26
-
27
- render() {
28
- let style = {
29
- margin: '10px'
30
- },
31
- titleStyle = {
32
- fontSize: '13px',
33
- padding: '15px 0',
34
- textTransform: 'upperCase',
35
- borderTop: '1px solid #e3e6eb'
36
- },
37
- spanStyle = {
38
- display: 'inline-block',
39
- margin: '10px 10px 10px 0'
40
- };
41
- return /*#__PURE__*/React.createElement("div", {
42
- style: style
43
- }, /*#__PURE__*/React.createElement("div", {
44
- style: {
45
- margin: '10px 0'
46
- }
47
- }, /*#__PURE__*/React.createElement("div", {
48
- style: {
49
- marginBottom: '10px'
50
- }
51
- }, /*#__PURE__*/React.createElement("div", {
52
- style: titleStyle
53
- }, "Default CheckBox"), /*#__PURE__*/React.createElement("span", null, /*#__PURE__*/React.createElement(CheckBox, {
54
- customClass: {
55
- customCheckBox: styles.customCbox
56
- },
57
- onChange: this.onChange,
58
- checked: this.state.checked
59
- })))), /*#__PURE__*/React.createElement("div", {
60
- style: {
61
- margin: '10px 0'
62
- }
63
- }, /*#__PURE__*/React.createElement("div", {
64
- style: {
65
- marginBottom: '10px'
66
- }
67
- }, /*#__PURE__*/React.createElement("div", {
68
- style: titleStyle
69
- }, "CheckBox Size"), /*#__PURE__*/React.createElement(CheckBox, {
70
- customClass: {
71
- customCheckBox: styles.customCbox
72
- },
73
- onChange: this.onChange,
74
- checked: this.state.checked,
75
- size: "small"
76
- }), /*#__PURE__*/React.createElement("span", {
77
- style: {
78
- marginLeft: '10px'
79
- }
80
- }, /*#__PURE__*/React.createElement(CheckBox, {
81
- customClass: {
82
- customCheckBox: styles.customCbox,
83
- customLabel: styles.customLbl
84
- },
85
- onChange: this.onChange,
86
- checked: this.state.checked,
87
- size: "medium"
88
- })))), /*#__PURE__*/React.createElement("div", {
89
- style: {
90
- margin: '10px 0'
91
- }
92
- }, /*#__PURE__*/React.createElement("div", {
93
- style: {
94
- marginBottom: '10px'
95
- }
96
- }, /*#__PURE__*/React.createElement("div", {
97
- style: titleStyle
98
- }, "Select State CheckBox"), /*#__PURE__*/React.createElement("span", {
99
- style: {
100
- marginRight: '10px'
101
- }
102
- }, /*#__PURE__*/React.createElement(CheckBox, {
103
- customClass: {
104
- customCheckBox: styles.customCbox
105
- },
106
- onChange: this.onSelect,
107
- checked: this.state.selected,
108
- activeStyle: "minus"
109
- })), /*#__PURE__*/React.createElement("span", {
110
- style: {
111
- marginRight: '10px'
112
- }
113
- }, /*#__PURE__*/React.createElement(CheckBox, {
114
- customClass: {
115
- customCheckBox: styles.customCbox
116
- },
117
- palette: "danger",
118
- onChange: this.onSelect,
119
- checked: this.state.selected,
120
- activeStyle: "minus"
121
- })))), /*#__PURE__*/React.createElement("div", {
122
- style: {
123
- marginBottom: '10px'
124
- }
125
- }, /*#__PURE__*/React.createElement("div", {
126
- style: titleStyle
127
- }, "Disabled Type CheckBox"), /*#__PURE__*/React.createElement("span", {
128
- style: {
129
- marginRight: '10px'
130
- }
131
- }, /*#__PURE__*/React.createElement(CheckBox, {
132
- customClass: {
133
- customCheckBox: styles.customCbox
134
- },
135
- checked: true,
136
- disabled: true
137
- })), /*#__PURE__*/React.createElement("span", null, /*#__PURE__*/React.createElement(CheckBox, {
138
- customClass: {
139
- customCheckBox: styles.disabledCbox
140
- },
141
- disabled: true
142
- }))), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
143
- style: titleStyle
144
- }, "Label With CheckBox"), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("span", {
145
- style: spanStyle
146
- }, /*#__PURE__*/React.createElement(CheckBox, {
147
- customClass: {
148
- customCheckBox: styles.customCbox,
149
- customLabel: styles.customLbl
150
- },
151
- title: "Title",
152
- checked: this.state.checked,
153
- text: "Check With Label",
154
- onChange: this.onChange
155
- })), /*#__PURE__*/React.createElement("span", {
156
- style: spanStyle
157
- }, /*#__PURE__*/React.createElement(CheckBox, {
158
- customClass: {
159
- customCheckBox: styles.customCbox,
160
- customLabel: styles.customLbl,
161
- customCBoxSize: styles.largeCbox,
162
- customTickSize: styles.largeCboxTick
163
- },
164
- active: true,
165
- checked: this.state.checked,
166
- text: "Checked Active With Label",
167
- onChange: this.onChange
168
- })), /*#__PURE__*/React.createElement("span", {
169
- style: spanStyle
170
- }, /*#__PURE__*/React.createElement(CheckBox, {
171
- customClass: {
172
- customCheckBox: styles.disabledCbox,
173
- customLabel: styles.disabledLabel
174
- },
175
- checked: this.state.checked,
176
- disabled: true,
177
- text: "Disabled With Label",
178
- onChange: this.onChange
179
- })), /*#__PURE__*/React.createElement("span", {
180
- style: spanStyle
181
- }, /*#__PURE__*/React.createElement(CheckBox, {
182
- customClass: {
183
- customCheckBox: styles.readOnlyCbox,
184
- customLabel: styles.readOnlyLbl
185
- },
186
- isReadOnly: true,
187
- text: "ReadOnly With Label",
188
- onChange: this.onChange,
189
- checked: this.state.checked
190
- }))), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("span", {
191
- style: spanStyle
192
- }, /*#__PURE__*/React.createElement(CheckBox, {
193
- customClass: {
194
- customCheckBox: styles.customCbox,
195
- customLabel: styles.customLbl
196
- },
197
- palette: "danger",
198
- checked: this.state.checked,
199
- text: "Check With Label",
200
- onChange: this.onChange,
201
- activeStyle: "minus"
202
- })), /*#__PURE__*/React.createElement("span", {
203
- style: spanStyle
204
- }, /*#__PURE__*/React.createElement(CheckBox, {
205
- customClass: {
206
- customCheckBox: styles.customCbox,
207
- customLabel: styles.customLbl,
208
- customCBoxSize: styles.largeCbox
209
- },
210
- palette: "danger",
211
- active: true,
212
- checked: this.state.checked,
213
- text: "Checked Active With Label",
214
- onChange: this.onChange,
215
- activeStyle: "minus"
216
- })), /*#__PURE__*/React.createElement("span", {
217
- style: spanStyle
218
- }, /*#__PURE__*/React.createElement(CheckBox, {
219
- customClass: {
220
- customCheckBox: styles.disabledCbox,
221
- customLabel: styles.disabledLabel
222
- },
223
- palette: "danger",
224
- checked: this.state.checked,
225
- disabled: true,
226
- text: "Disabled With Label",
227
- onChange: this.onChange,
228
- activeStyle: "minus"
229
- })), /*#__PURE__*/React.createElement("span", {
230
- style: spanStyle
231
- }, /*#__PURE__*/React.createElement(CheckBox, {
232
- customClass: {
233
- customCheckBox: styles.readOnlyCbox,
234
- customLabel: styles.readOnlyLbl
235
- },
236
- palette: "danger",
237
- isReadOnly: true,
238
- text: "ReadOnly With Label",
239
- onChange: this.onChange,
240
- checked: this.state.checked,
241
- activeStyle: "minus"
242
- })))), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
243
- style: titleStyle
244
- }, "Size"), /*#__PURE__*/React.createElement("span", {
245
- style: spanStyle
246
- }, /*#__PURE__*/React.createElement(CheckBox, {
247
- customClass: {
248
- customCheckBox: styles.customCbox,
249
- customLabel: styles.customLbl
250
- },
251
- checked: true,
252
- size: "small",
253
- text: "Small",
254
- labelSize: "small"
255
- })), /*#__PURE__*/React.createElement("span", {
256
- style: spanStyle
257
- }, /*#__PURE__*/React.createElement(CheckBox, {
258
- customClass: {
259
- customCheckBox: styles.customCbox,
260
- customLabel: styles.customLbl
261
- },
262
- checked: true,
263
- text: "Medium"
264
- }))), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
265
- style: titleStyle
266
- }, "Palette"), /*#__PURE__*/React.createElement("span", {
267
- style: spanStyle
268
- }, /*#__PURE__*/React.createElement(CheckBox, {
269
- customClass: {
270
- customCheckBox: styles.customCbox,
271
- customLabel: styles.customLbl
272
- },
273
- checked: true,
274
- text: "Primary"
275
- })), /*#__PURE__*/React.createElement("span", {
276
- style: spanStyle
277
- }, /*#__PURE__*/React.createElement(CheckBox, {
278
- customClass: {
279
- customCheckBox: styles.customCbox,
280
- customLabel: styles.customLbl
281
- },
282
- checked: true,
283
- palette: "danger",
284
- text: "Danger"
285
- }))));
286
- }
287
-
288
- }
289
- CheckBox__custom.docs = {
290
- componentGroup: 'Form Elements',
291
- folderName: 'Style Guide',
292
- description: ' '
293
- };
@@ -1,219 +0,0 @@
1
- import React, { Component } from 'react';
2
- import CheckBox from '../CheckBox';
3
- export default class CheckBox__default extends Component {
4
- constructor(props) {
5
- super(props);
6
- this.onChange = this.onChange.bind(this);
7
- this.onSelect = this.onSelect.bind(this);
8
- this.state = {
9
- checked: false,
10
- selected: true
11
- };
12
- }
13
-
14
- onChange() {
15
- this.setState({
16
- checked: !this.state.checked
17
- });
18
- }
19
-
20
- onSelect() {
21
- this.setState({
22
- selected: !this.state.selected
23
- });
24
- }
25
-
26
- render() {
27
- let style = {
28
- margin: '10px'
29
- },
30
- titleStyle = {
31
- fontSize: '13px',
32
- padding: '15px 0',
33
- textTransform: 'upperCase',
34
- borderTop: '1px solid #e3e6eb'
35
- },
36
- spanStyle = {
37
- display: 'inline-block',
38
- margin: '10px 10px 10px 0'
39
- };
40
- return /*#__PURE__*/React.createElement("div", {
41
- style: style
42
- }, /*#__PURE__*/React.createElement("div", {
43
- style: {
44
- margin: '10px 0'
45
- }
46
- }, /*#__PURE__*/React.createElement("div", {
47
- style: {
48
- marginBottom: '10px'
49
- }
50
- }, /*#__PURE__*/React.createElement("div", {
51
- style: titleStyle
52
- }, "Default CheckBox"), /*#__PURE__*/React.createElement("span", null, /*#__PURE__*/React.createElement(CheckBox, {
53
- onChange: this.onChange,
54
- checked: this.state.checked
55
- })))), /*#__PURE__*/React.createElement("div", {
56
- style: {
57
- margin: '10px 0'
58
- }
59
- }, /*#__PURE__*/React.createElement("div", {
60
- style: {
61
- marginBottom: '10px'
62
- }
63
- }, /*#__PURE__*/React.createElement("div", {
64
- style: titleStyle
65
- }, "CheckBox Size"), /*#__PURE__*/React.createElement(CheckBox, {
66
- onChange: this.onChange,
67
- checked: this.state.checked,
68
- size: "small"
69
- }), /*#__PURE__*/React.createElement("span", {
70
- style: {
71
- marginLeft: '10px'
72
- }
73
- }, /*#__PURE__*/React.createElement(CheckBox, {
74
- onChange: this.onChange,
75
- checked: this.state.checked,
76
- size: "medium"
77
- })))), /*#__PURE__*/React.createElement("div", {
78
- style: {
79
- margin: '10px 0'
80
- }
81
- }, /*#__PURE__*/React.createElement("div", {
82
- style: {
83
- marginBottom: '10px'
84
- }
85
- }, /*#__PURE__*/React.createElement("div", {
86
- style: titleStyle
87
- }, "Select State CheckBox"), /*#__PURE__*/React.createElement("span", {
88
- style: {
89
- marginRight: '10px'
90
- }
91
- }, /*#__PURE__*/React.createElement(CheckBox, {
92
- onChange: this.onSelect,
93
- checked: this.state.selected,
94
- activeStyle: "minus"
95
- })), /*#__PURE__*/React.createElement("span", {
96
- style: {
97
- marginRight: '10px'
98
- }
99
- }, /*#__PURE__*/React.createElement(CheckBox, {
100
- palette: "danger",
101
- onChange: this.onSelect,
102
- checked: this.state.selected,
103
- activeStyle: "minus"
104
- })))), /*#__PURE__*/React.createElement("div", {
105
- style: {
106
- marginBottom: '10px'
107
- }
108
- }, /*#__PURE__*/React.createElement("div", {
109
- style: titleStyle
110
- }, "Disabled Type CheckBox"), /*#__PURE__*/React.createElement("span", {
111
- style: {
112
- marginRight: '10px'
113
- }
114
- }, /*#__PURE__*/React.createElement(CheckBox, {
115
- checked: true,
116
- disabled: true
117
- })), /*#__PURE__*/React.createElement("span", null, /*#__PURE__*/React.createElement(CheckBox, {
118
- disabled: true
119
- }))), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
120
- style: titleStyle
121
- }, "Label With CheckBox"), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("span", {
122
- style: spanStyle
123
- }, /*#__PURE__*/React.createElement(CheckBox, {
124
- title: "Title",
125
- checked: this.state.checked,
126
- text: "Check With Label",
127
- onChange: this.onChange
128
- })), /*#__PURE__*/React.createElement("span", {
129
- style: spanStyle
130
- }, /*#__PURE__*/React.createElement(CheckBox, {
131
- active: true,
132
- checked: this.state.checked,
133
- text: "Checked Active With Label",
134
- onChange: this.onChange
135
- })), /*#__PURE__*/React.createElement("span", {
136
- style: spanStyle
137
- }, /*#__PURE__*/React.createElement(CheckBox, {
138
- checked: this.state.checked,
139
- disabled: true,
140
- text: "Disabled With Label",
141
- onChange: this.onChange
142
- })), /*#__PURE__*/React.createElement("span", {
143
- style: spanStyle
144
- }, /*#__PURE__*/React.createElement(CheckBox, {
145
- isReadOnly: true,
146
- text: "ReadOnly With Label",
147
- onChange: this.onChange,
148
- checked: this.state.checked
149
- }))), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("span", {
150
- style: spanStyle
151
- }, /*#__PURE__*/React.createElement(CheckBox, {
152
- palette: "danger",
153
- checked: this.state.checked,
154
- text: "Check With Label",
155
- onChange: this.onChange,
156
- activeStyle: "minus"
157
- })), /*#__PURE__*/React.createElement("span", {
158
- style: spanStyle
159
- }, /*#__PURE__*/React.createElement(CheckBox, {
160
- palette: "danger",
161
- active: true,
162
- checked: this.state.checked,
163
- text: "Checked Active With Label",
164
- onChange: this.onChange,
165
- activeStyle: "minus"
166
- })), /*#__PURE__*/React.createElement("span", {
167
- style: spanStyle
168
- }, /*#__PURE__*/React.createElement(CheckBox, {
169
- palette: "danger",
170
- checked: this.state.checked,
171
- disabled: true,
172
- text: "Disabled With Label",
173
- onChange: this.onChange,
174
- activeStyle: "minus"
175
- })), /*#__PURE__*/React.createElement("span", {
176
- style: spanStyle
177
- }, /*#__PURE__*/React.createElement(CheckBox, {
178
- palette: "danger",
179
- isReadOnly: true,
180
- text: "ReadOnly With Label",
181
- onChange: this.onChange,
182
- checked: this.state.checked,
183
- activeStyle: "minus"
184
- })))), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
185
- style: titleStyle
186
- }, "Size"), /*#__PURE__*/React.createElement("span", {
187
- style: spanStyle
188
- }, /*#__PURE__*/React.createElement(CheckBox, {
189
- checked: true,
190
- size: "small",
191
- text: "Small",
192
- labelSize: "small"
193
- })), /*#__PURE__*/React.createElement("span", {
194
- style: spanStyle
195
- }, /*#__PURE__*/React.createElement(CheckBox, {
196
- checked: true,
197
- text: "Medium"
198
- }))), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
199
- style: titleStyle
200
- }, "Palette"), /*#__PURE__*/React.createElement("span", {
201
- style: spanStyle
202
- }, /*#__PURE__*/React.createElement(CheckBox, {
203
- checked: true,
204
- text: "Primary"
205
- })), /*#__PURE__*/React.createElement("span", {
206
- style: spanStyle
207
- }, /*#__PURE__*/React.createElement(CheckBox, {
208
- checked: true,
209
- palette: "danger",
210
- text: "Danger"
211
- }))));
212
- }
213
-
214
- }
215
- CheckBox__default.docs = {
216
- componentGroup: 'Form Elements',
217
- folderName: 'Style Guide',
218
- description: ' '
219
- };