@dxc-technology/halstack-react 0.0.0-f2bc144 → 0.0.0-f4755a1

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 (429) hide show
  1. package/BackgroundColorContext.d.ts +10 -0
  2. package/BackgroundColorContext.js +47 -0
  3. package/ThemeContext.d.ts +15 -0
  4. package/ThemeContext.js +243 -0
  5. package/V3Select/V3Select.js +455 -0
  6. package/V3Select/index.d.ts +27 -0
  7. package/V3Textarea/V3Textarea.js +260 -0
  8. package/V3Textarea/index.d.ts +27 -0
  9. package/accordion/Accordion.d.ts +4 -0
  10. package/accordion/Accordion.js +258 -0
  11. package/accordion/Accordion.stories.tsx +300 -0
  12. package/accordion/types.d.ts +68 -0
  13. package/accordion/types.js +5 -0
  14. package/accordion-group/AccordionGroup.d.ts +7 -0
  15. package/accordion-group/AccordionGroup.js +170 -0
  16. package/accordion-group/AccordionGroup.stories.tsx +225 -0
  17. package/accordion-group/types.d.ts +72 -0
  18. package/accordion-group/types.js +5 -0
  19. package/alert/Alert.d.ts +4 -0
  20. package/alert/Alert.js +290 -0
  21. package/alert/Alert.stories.tsx +170 -0
  22. package/alert/types.d.ts +49 -0
  23. package/alert/types.js +5 -0
  24. package/badge/Badge.js +59 -0
  25. package/box/Box.d.ts +4 -0
  26. package/box/Box.js +126 -0
  27. package/box/Box.stories.tsx +132 -0
  28. package/box/types.d.ts +43 -0
  29. package/box/types.js +5 -0
  30. package/button/Button.d.ts +4 -0
  31. package/button/Button.js +179 -0
  32. package/button/Button.stories.tsx +276 -0
  33. package/button/types.d.ts +57 -0
  34. package/button/types.js +5 -0
  35. package/card/Card.d.ts +4 -0
  36. package/card/Card.js +164 -0
  37. package/card/Card.stories.tsx +201 -0
  38. package/card/ice-cream.jpg +0 -0
  39. package/card/types.d.ts +67 -0
  40. package/card/types.js +5 -0
  41. package/checkbox/Checkbox.d.ts +4 -0
  42. package/checkbox/Checkbox.js +253 -0
  43. package/checkbox/Checkbox.stories.tsx +192 -0
  44. package/checkbox/types.d.ts +60 -0
  45. package/checkbox/types.js +5 -0
  46. package/chip/Chip.d.ts +4 -0
  47. package/chip/Chip.js +199 -0
  48. package/chip/Chip.stories.tsx +121 -0
  49. package/chip/types.d.ts +53 -0
  50. package/chip/types.js +5 -0
  51. package/{dist/common → common}/OpenSans.css +0 -0
  52. package/{dist/common → common}/RequiredComponent.js +3 -11
  53. package/{dist/common → common}/fonts/OpenSans-Bold.ttf +0 -0
  54. package/{dist/common → common}/fonts/OpenSans-BoldItalic.ttf +0 -0
  55. package/{dist/common → common}/fonts/OpenSans-ExtraBold.ttf +0 -0
  56. package/{dist/common → common}/fonts/OpenSans-ExtraBoldItalic.ttf +0 -0
  57. package/{dist/common → common}/fonts/OpenSans-Italic.ttf +0 -0
  58. package/{dist/common → common}/fonts/OpenSans-Light.ttf +0 -0
  59. package/{dist/common → common}/fonts/OpenSans-LightItalic.ttf +0 -0
  60. package/{dist/common → common}/fonts/OpenSans-Regular.ttf +0 -0
  61. package/{dist/common → common}/fonts/OpenSans-SemiBold.ttf +0 -0
  62. package/{dist/common → common}/fonts/OpenSans-SemiBoldItalic.ttf +0 -0
  63. package/common/utils.js +22 -0
  64. package/common/variables.js +1605 -0
  65. package/{dist/date → date}/Date.js +78 -57
  66. package/date/index.d.ts +27 -0
  67. package/date-input/DateInput.d.ts +4 -0
  68. package/date-input/DateInput.js +358 -0
  69. package/date-input/DateInput.stories.tsx +138 -0
  70. package/date-input/types.d.ts +100 -0
  71. package/date-input/types.js +5 -0
  72. package/dialog/Dialog.d.ts +4 -0
  73. package/dialog/Dialog.js +166 -0
  74. package/dialog/Dialog.stories.tsx +212 -0
  75. package/dialog/types.d.ts +43 -0
  76. package/dialog/types.js +5 -0
  77. package/dropdown/Dropdown.d.ts +4 -0
  78. package/dropdown/Dropdown.js +417 -0
  79. package/dropdown/Dropdown.stories.tsx +247 -0
  80. package/dropdown/types.d.ts +89 -0
  81. package/dropdown/types.js +5 -0
  82. package/file-input/FileInput.d.ts +4 -0
  83. package/file-input/FileInput.js +590 -0
  84. package/file-input/FileInput.stories.tsx +506 -0
  85. package/file-input/FileItem.d.ts +14 -0
  86. package/file-input/FileItem.js +184 -0
  87. package/file-input/types.d.ts +112 -0
  88. package/file-input/types.js +5 -0
  89. package/footer/Footer.d.ts +4 -0
  90. package/footer/Footer.js +260 -0
  91. package/footer/Footer.stories.tsx +130 -0
  92. package/footer/Icons.d.ts +2 -0
  93. package/footer/Icons.js +77 -0
  94. package/footer/types.d.ts +65 -0
  95. package/footer/types.js +5 -0
  96. package/header/Header.d.ts +7 -0
  97. package/header/Header.js +324 -0
  98. package/header/Header.stories.tsx +162 -0
  99. package/header/Icons.d.ts +2 -0
  100. package/header/Icons.js +34 -0
  101. package/header/types.d.ts +47 -0
  102. package/header/types.js +5 -0
  103. package/heading/Heading.d.ts +4 -0
  104. package/heading/Heading.js +159 -0
  105. package/heading/Heading.stories.tsx +53 -0
  106. package/heading/types.d.ts +33 -0
  107. package/heading/types.js +5 -0
  108. package/input-text/Icons.js +22 -0
  109. package/input-text/InputText.js +611 -0
  110. package/input-text/index.d.ts +36 -0
  111. package/layout/ApplicationLayout.d.ts +10 -0
  112. package/layout/ApplicationLayout.js +225 -0
  113. package/layout/ApplicationLayout.stories.tsx +171 -0
  114. package/layout/Icons.js +55 -0
  115. package/layout/types.d.ts +57 -0
  116. package/layout/types.js +5 -0
  117. package/link/Link.d.ts +3 -0
  118. package/link/Link.js +161 -0
  119. package/link/Link.stories.tsx +146 -0
  120. package/link/types.d.ts +74 -0
  121. package/link/types.js +5 -0
  122. package/list/List.d.ts +8 -0
  123. package/list/List.js +47 -0
  124. package/list/List.stories.tsx +95 -0
  125. package/main.d.ts +48 -0
  126. package/{dist/main.js → main.js} +147 -55
  127. package/number-input/NumberInput.d.ts +4 -0
  128. package/number-input/NumberInput.js +83 -0
  129. package/number-input/NumberInput.stories.tsx +115 -0
  130. package/number-input/NumberInputContext.d.ts +4 -0
  131. package/number-input/NumberInputContext.js +19 -0
  132. package/number-input/numberInputContextTypes.d.ts +19 -0
  133. package/number-input/numberInputContextTypes.js +5 -0
  134. package/number-input/types.d.ts +117 -0
  135. package/number-input/types.js +5 -0
  136. package/package.json +34 -23
  137. package/paginator/Icons.js +66 -0
  138. package/paginator/Paginator.d.ts +4 -0
  139. package/paginator/Paginator.js +192 -0
  140. package/paginator/Paginator.stories.tsx +63 -0
  141. package/paginator/types.d.ts +38 -0
  142. package/paginator/types.js +5 -0
  143. package/password-input/PasswordInput.d.ts +4 -0
  144. package/password-input/PasswordInput.js +163 -0
  145. package/password-input/PasswordInput.stories.tsx +131 -0
  146. package/password-input/types.d.ts +107 -0
  147. package/password-input/types.js +5 -0
  148. package/progress-bar/ProgressBar.d.ts +4 -0
  149. package/progress-bar/ProgressBar.js +170 -0
  150. package/progress-bar/ProgressBar.stories.jsx +58 -0
  151. package/progress-bar/types.d.ts +37 -0
  152. package/progress-bar/types.js +5 -0
  153. package/radio/Radio.d.ts +4 -0
  154. package/radio/Radio.js +174 -0
  155. package/radio/Radio.stories.tsx +192 -0
  156. package/radio/types.d.ts +54 -0
  157. package/radio/types.js +5 -0
  158. package/radio-group/Radio.d.ts +4 -0
  159. package/radio-group/Radio.js +109 -0
  160. package/radio-group/RadioGroup.d.ts +4 -0
  161. package/radio-group/RadioGroup.js +166 -0
  162. package/radio-group/RadioGroup.stories.tsx +56 -0
  163. package/radio-group/types.d.ts +37 -0
  164. package/radio-group/types.js +5 -0
  165. package/resultsetTable/ResultsetTable.d.ts +4 -0
  166. package/resultsetTable/ResultsetTable.js +251 -0
  167. package/resultsetTable/ResultsetTable.stories.tsx +276 -0
  168. package/resultsetTable/types.d.ts +67 -0
  169. package/resultsetTable/types.js +5 -0
  170. package/row/Row.d.ts +11 -0
  171. package/row/Row.js +127 -0
  172. package/row/Row.stories.tsx +239 -0
  173. package/select/Select.d.ts +4 -0
  174. package/select/Select.js +863 -0
  175. package/select/Select.stories.tsx +572 -0
  176. package/select/types.d.ts +170 -0
  177. package/select/types.js +5 -0
  178. package/sidenav/Sidenav.d.ts +9 -0
  179. package/sidenav/Sidenav.js +136 -0
  180. package/sidenav/Sidenav.stories.tsx +165 -0
  181. package/sidenav/types.d.ts +50 -0
  182. package/sidenav/types.js +5 -0
  183. package/slider/Slider.d.ts +4 -0
  184. package/slider/Slider.js +317 -0
  185. package/slider/Slider.stories.tsx +177 -0
  186. package/slider/types.d.ts +78 -0
  187. package/slider/types.js +5 -0
  188. package/spinner/Spinner.d.ts +4 -0
  189. package/spinner/Spinner.js +250 -0
  190. package/spinner/Spinner.stories.jsx +102 -0
  191. package/spinner/types.d.ts +32 -0
  192. package/spinner/types.js +5 -0
  193. package/stack/Stack.d.ts +10 -0
  194. package/stack/Stack.js +97 -0
  195. package/stack/Stack.stories.tsx +166 -0
  196. package/switch/Switch.d.ts +4 -0
  197. package/switch/Switch.js +179 -0
  198. package/switch/Switch.stories.tsx +160 -0
  199. package/switch/types.d.ts +58 -0
  200. package/switch/types.js +5 -0
  201. package/table/Table.d.ts +4 -0
  202. package/table/Table.js +118 -0
  203. package/table/Table.stories.jsx +276 -0
  204. package/table/types.d.ts +21 -0
  205. package/table/types.js +5 -0
  206. package/tabs/Tabs.d.ts +4 -0
  207. package/tabs/Tabs.js +213 -0
  208. package/tabs/Tabs.stories.tsx +121 -0
  209. package/tabs/types.d.ts +70 -0
  210. package/tabs/types.js +5 -0
  211. package/tag/Tag.d.ts +4 -0
  212. package/tag/Tag.js +193 -0
  213. package/tag/Tag.stories.tsx +145 -0
  214. package/tag/types.d.ts +60 -0
  215. package/tag/types.js +5 -0
  216. package/text/Text.d.ts +7 -0
  217. package/text/Text.js +30 -0
  218. package/text/Text.stories.tsx +19 -0
  219. package/text-input/TextInput.d.ts +4 -0
  220. package/text-input/TextInput.js +786 -0
  221. package/text-input/TextInput.stories.tsx +456 -0
  222. package/text-input/types.d.ts +159 -0
  223. package/text-input/types.js +5 -0
  224. package/textarea/Textarea.d.ts +4 -0
  225. package/textarea/Textarea.js +284 -0
  226. package/textarea/Textarea.stories.jsx +135 -0
  227. package/textarea/types.d.ts +130 -0
  228. package/textarea/types.js +5 -0
  229. package/{dist/toggle → toggle}/Toggle.js +30 -67
  230. package/toggle/index.d.ts +21 -0
  231. package/toggle-group/ToggleGroup.d.ts +4 -0
  232. package/toggle-group/ToggleGroup.js +214 -0
  233. package/toggle-group/ToggleGroup.stories.tsx +173 -0
  234. package/toggle-group/types.d.ts +97 -0
  235. package/toggle-group/types.js +5 -0
  236. package/{dist/upload → upload}/Upload.js +23 -22
  237. package/upload/buttons-upload/ButtonsUpload.js +111 -0
  238. package/upload/buttons-upload/Icons.js +40 -0
  239. package/upload/dragAndDropArea/DragAndDropArea.js +225 -0
  240. package/upload/dragAndDropArea/Icons.js +39 -0
  241. package/upload/file-upload/FileToUpload.js +115 -0
  242. package/upload/file-upload/Icons.js +66 -0
  243. package/upload/files-upload/FilesToUpload.js +109 -0
  244. package/upload/index.d.ts +15 -0
  245. package/upload/transaction/Icons.js +160 -0
  246. package/upload/transaction/Transaction.js +104 -0
  247. package/upload/transactions/Transactions.js +94 -0
  248. package/useTheme.d.ts +2 -0
  249. package/{dist/useTheme.js → useTheme.js} +1 -1
  250. package/wizard/Wizard.d.ts +4 -0
  251. package/wizard/Wizard.js +281 -0
  252. package/wizard/Wizard.stories.tsx +224 -0
  253. package/wizard/types.d.ts +60 -0
  254. package/wizard/types.js +5 -0
  255. package/README.md +0 -66
  256. package/babel.config.js +0 -8
  257. package/dist/ThemeContext.js +0 -180
  258. package/dist/accordion/Accordion.js +0 -268
  259. package/dist/accordion/Accordion.stories.js +0 -207
  260. package/dist/accordion/readme.md +0 -96
  261. package/dist/accordion-group/AccordionGroup.js +0 -156
  262. package/dist/accordion-group/AccordionGroup.stories.js +0 -207
  263. package/dist/accordion-group/readme.md +0 -70
  264. package/dist/alert/Alert.js +0 -303
  265. package/dist/alert/Alert.stories.js +0 -158
  266. package/dist/alert/close.svg +0 -4
  267. package/dist/alert/error.svg +0 -4
  268. package/dist/alert/info.svg +0 -4
  269. package/dist/alert/readme.md +0 -43
  270. package/dist/alert/success.svg +0 -4
  271. package/dist/alert/warning.svg +0 -4
  272. package/dist/badge/Badge.js +0 -42
  273. package/dist/box/Box.js +0 -145
  274. package/dist/button/Button.js +0 -199
  275. package/dist/button/Button.stories.js +0 -224
  276. package/dist/button/readme.md +0 -93
  277. package/dist/card/Card.js +0 -217
  278. package/dist/checkbox/Checkbox.js +0 -229
  279. package/dist/checkbox/Checkbox.stories.js +0 -144
  280. package/dist/checkbox/readme.md +0 -116
  281. package/dist/chip/Chip.js +0 -205
  282. package/dist/common/services/example-service.js +0 -10
  283. package/dist/common/services/example-service.test.js +0 -12
  284. package/dist/common/utils.js +0 -42
  285. package/dist/common/variables.js +0 -349
  286. package/dist/date/Date.stories.js +0 -205
  287. package/dist/date/calendar.svg +0 -1
  288. package/dist/date/calendar_dark.svg +0 -1
  289. package/dist/date/readme.md +0 -73
  290. package/dist/dialog/Dialog.js +0 -195
  291. package/dist/dialog/Dialog.stories.js +0 -217
  292. package/dist/dialog/readme.md +0 -32
  293. package/dist/dropdown/Dropdown.js +0 -446
  294. package/dist/dropdown/Dropdown.stories.js +0 -249
  295. package/dist/dropdown/baseline-arrow_drop_down.svg +0 -1
  296. package/dist/dropdown/baseline-arrow_drop_down_wh.svg +0 -4
  297. package/dist/dropdown/baseline-arrow_drop_up.svg +0 -1
  298. package/dist/dropdown/baseline-arrow_drop_up_wh.svg +0 -4
  299. package/dist/dropdown/readme.md +0 -69
  300. package/dist/footer/Footer.js +0 -366
  301. package/dist/footer/Footer.stories.js +0 -94
  302. package/dist/footer/dxc_logo_wht.png +0 -0
  303. package/dist/footer/readme.md +0 -41
  304. package/dist/header/Header.js +0 -368
  305. package/dist/header/Header.stories.js +0 -176
  306. package/dist/header/close_icon.svg +0 -1
  307. package/dist/header/dxc_logo_black.png +0 -0
  308. package/dist/header/dxc_logo_blk_rgb.svg +0 -6
  309. package/dist/header/dxc_logo_white.png +0 -0
  310. package/dist/header/hamb_menu_black.svg +0 -1
  311. package/dist/header/hamb_menu_white.svg +0 -1
  312. package/dist/header/readme.md +0 -33
  313. package/dist/heading/Heading.js +0 -153
  314. package/dist/input-text/InputText.js +0 -561
  315. package/dist/input-text/InputText.stories.js +0 -209
  316. package/dist/input-text/error.svg +0 -1
  317. package/dist/input-text/readme.md +0 -91
  318. package/dist/layout/ApplicationLayout.js +0 -330
  319. package/dist/layout/facebook.svg +0 -45
  320. package/dist/layout/linkedin.svg +0 -50
  321. package/dist/layout/twitter.svg +0 -53
  322. package/dist/link/Link.js +0 -187
  323. package/dist/link/readme.md +0 -51
  324. package/dist/paginator/Paginator.js +0 -247
  325. package/dist/paginator/images/next.svg +0 -3
  326. package/dist/paginator/images/nextPage.svg +0 -3
  327. package/dist/paginator/images/previous.svg +0 -3
  328. package/dist/paginator/images/previousPage.svg +0 -3
  329. package/dist/paginator/readme.md +0 -50
  330. package/dist/progress-bar/ProgressBar.js +0 -184
  331. package/dist/progress-bar/ProgressBar.stories.js +0 -280
  332. package/dist/progress-bar/readme.md +0 -63
  333. package/dist/radio/Radio.js +0 -190
  334. package/dist/radio/Radio.stories.js +0 -166
  335. package/dist/radio/readme.md +0 -70
  336. package/dist/resultsetTable/ResultsetTable.js +0 -327
  337. package/dist/resultsetTable/arrow_downward-24px_wht.svg +0 -1
  338. package/dist/resultsetTable/arrow_upward-24px_wht.svg +0 -1
  339. package/dist/resultsetTable/unfold_more-24px_wht.svg +0 -1
  340. package/dist/select/Select.js +0 -475
  341. package/dist/select/Select.stories.js +0 -235
  342. package/dist/select/readme.md +0 -72
  343. package/dist/sidenav/Sidenav.js +0 -123
  344. package/dist/slider/Slider.js +0 -257
  345. package/dist/slider/Slider.stories.js +0 -241
  346. package/dist/slider/readme.md +0 -64
  347. package/dist/spinner/Spinner.js +0 -190
  348. package/dist/spinner/Spinner.stories.js +0 -183
  349. package/dist/spinner/readme.md +0 -65
  350. package/dist/switch/Switch.js +0 -190
  351. package/dist/switch/Switch.stories.js +0 -134
  352. package/dist/switch/readme.md +0 -133
  353. package/dist/table/Table.js +0 -102
  354. package/dist/tabs/Tabs.js +0 -302
  355. package/dist/tabs/Tabs.stories.js +0 -130
  356. package/dist/tabs/readme.md +0 -78
  357. package/dist/tabs-for-sections/TabsForSections.js +0 -92
  358. package/dist/tabs-for-sections/readme.md +0 -78
  359. package/dist/tag/Tag.js +0 -249
  360. package/dist/textarea/Textarea.js +0 -220
  361. package/dist/toggle/Toggle.stories.js +0 -297
  362. package/dist/toggle/readme.md +0 -80
  363. package/dist/toggle-group/ToggleGroup.js +0 -209
  364. package/dist/toggle-group/readme.md +0 -82
  365. package/dist/upload/Upload.stories.js +0 -72
  366. package/dist/upload/buttons-upload/ButtonsUpload.js +0 -122
  367. package/dist/upload/buttons-upload/drag-drop-icon.svg +0 -4
  368. package/dist/upload/buttons-upload/upload-button.svg +0 -1
  369. package/dist/upload/dragAndDropArea/DragAndDropArea.js +0 -279
  370. package/dist/upload/dragAndDropArea/upload_drop.svg +0 -4
  371. package/dist/upload/dragAndDropArea/upload_file.svg +0 -4
  372. package/dist/upload/file-upload/FileToUpload.js +0 -158
  373. package/dist/upload/file-upload/audio-icon.svg +0 -4
  374. package/dist/upload/file-upload/close.svg +0 -4
  375. package/dist/upload/file-upload/file-icon.svg +0 -4
  376. package/dist/upload/file-upload/video-icon.svg +0 -4
  377. package/dist/upload/files-upload/FilesToUpload.js +0 -123
  378. package/dist/upload/readme.md +0 -37
  379. package/dist/upload/transaction/Transaction.js +0 -155
  380. package/dist/upload/transaction/audio-icon-err.svg +0 -4
  381. package/dist/upload/transaction/audio-icon.svg +0 -4
  382. package/dist/upload/transaction/error-icon.svg +0 -4
  383. package/dist/upload/transaction/file-icon-err.svg +0 -4
  384. package/dist/upload/transaction/file-icon.svg +0 -4
  385. package/dist/upload/transaction/image-icon-err.svg +0 -4
  386. package/dist/upload/transaction/image-icon.svg +0 -4
  387. package/dist/upload/transaction/success-icon.svg +0 -4
  388. package/dist/upload/transaction/video-icon-err.svg +0 -4
  389. package/dist/upload/transaction/video-icon.svg +0 -4
  390. package/dist/upload/transactions/Transactions.js +0 -120
  391. package/dist/wizard/Wizard.js +0 -325
  392. package/dist/wizard/invalid_icon.svg +0 -6
  393. package/dist/wizard/valid_icon.svg +0 -6
  394. package/dist/wizard/validation-wrong.svg +0 -6
  395. package/test/Accordion.test.js +0 -33
  396. package/test/AccordionGroup.test.js +0 -109
  397. package/test/Alert.test.js +0 -53
  398. package/test/Box.test.js +0 -10
  399. package/test/Button.test.js +0 -18
  400. package/test/Card.test.js +0 -30
  401. package/test/Checkbox.test.js +0 -45
  402. package/test/Chip.test.js +0 -25
  403. package/test/Date.test.js +0 -393
  404. package/test/Dialog.test.js +0 -23
  405. package/test/Dropdown.test.js +0 -130
  406. package/test/Footer.test.js +0 -99
  407. package/test/Header.test.js +0 -39
  408. package/test/Heading.test.js +0 -35
  409. package/test/InputText.test.js +0 -240
  410. package/test/Link.test.js +0 -42
  411. package/test/Paginator.test.js +0 -177
  412. package/test/ProgressBar.test.js +0 -35
  413. package/test/Radio.test.js +0 -37
  414. package/test/ResultsetTable.test.js +0 -330
  415. package/test/Select.test.js +0 -192
  416. package/test/Sidenav.test.js +0 -45
  417. package/test/Slider.test.js +0 -82
  418. package/test/Spinner.test.js +0 -27
  419. package/test/Switch.test.js +0 -45
  420. package/test/Table.test.js +0 -36
  421. package/test/Tabs.test.js +0 -109
  422. package/test/TabsForSections.test.js +0 -34
  423. package/test/Tag.test.js +0 -32
  424. package/test/TextArea.test.js +0 -52
  425. package/test/ToggleGroup.test.js +0 -81
  426. package/test/Upload.test.js +0 -60
  427. package/test/Wizard.test.js +0 -130
  428. package/test/mocks/pngMock.js +0 -1
  429. package/test/mocks/svgMock.js +0 -1
@@ -1,116 +0,0 @@
1
- # DXC Checkbox Component
2
-
3
- ## Usage
4
-
5
- ```js
6
- import { DxcCheckbox } from "@dxc-technology/halstack-react";
7
-
8
- <DxcCheckbox onChange={handleNewValue} label="Test Checkbox" checked={checked} />;
9
- ```
10
-
11
- ## Props
12
-
13
- <table>
14
- <tr style="background-color: grey">
15
- <td>Name</td>
16
- <td>Default</td>
17
- <td>Description</td>
18
- </tr>
19
- <tr>
20
- <td>checked: boolean</td>
21
- <td><code>false</code></td>
22
- <td>If true, the component is checked.</td>
23
- </tr>
24
- <tr>
25
- <td>value: any</td>
26
- <td></td>
27
- <td>Will be passed to the value attribute of the html input element. When inside a form, this value will be only submitted if the checkbox is checked </td>
28
- </tr>
29
- <tr>
30
- <td>label: string</td>
31
- <td></td>
32
- <td>Text to be placed next to the checkbox.</td>
33
- </tr>
34
- <tr>
35
- <td>labelPosition: 'before' | 'after'</td>
36
- <td><code>'before'</code></td>
37
- <td>Whether the label should appear after or before the checkbox.</td>
38
- </tr>
39
- <tr>
40
- <td>theme: 'light' | 'dark'</td>
41
- <td><code>'light'</code></td>
42
- <td>Uses one of the available component themes.</td>
43
- </tr>
44
- <tr>
45
- <td>name: string</td>
46
- <td></td>
47
- <td>Name attribute of the input element.</td>
48
- </tr>
49
- <tr>
50
- <td>disabled: boolean</td>
51
- <td><code>false</code></td>
52
- <td>If true, the component will be disabled.</td>
53
- </tr>
54
- <tr>
55
- <td>required: boolean</td>
56
- <td><code>false</code></td>
57
- <td>If true, a red asterisk will appear before the label to indicate to the user that the field is required.</td>
58
- </tr>
59
- <tr>
60
- <td>disableRipple: boolean</td>
61
- <td><code>false</code></td>
62
- <td>If true, the ripple effect will be disabled.</td>
63
- </tr>
64
- <tr>
65
- <td>onChange: function</td>
66
- <td></td>
67
- <td>This function will be called when the user clicks the checkbox. The new value will be passed as a parameter.<br>
68
- </td>
69
- </tr>
70
- </table>
71
-
72
- ## Examples
73
-
74
- - Basic checkbox - Light theme - Enabled - Label after checkbox - With ripple
75
-
76
- ```js
77
- import React from "react";
78
- import { DxcCheckbox } from "@dxc-technology/halstack-react";
79
-
80
- class App extends React.Component {
81
- state = {
82
- isChecked: true
83
- };
84
- constructor() {
85
- super();
86
- this.handleChange = this.handleChange.bind(this);
87
- }
88
-
89
- handleChange(checked) {
90
- this.setState({
91
- isChecked: checked
92
- });
93
- }
94
-
95
- render() {
96
- return (
97
- <div>
98
- <DxcCheckbox
99
- checked={this.state.isChecked}
100
- value="Checkbox1"
101
- label="Checkbox 1"
102
- labelPosition="after"
103
- theme="light"
104
- name="Checkbox"
105
- disabled={false}
106
- disableRipple={false}
107
- onChange={event => this.handleChange(event)}
108
- />
109
- </div>
110
- );
111
- }
112
- }
113
- export default App;
114
-
115
-
116
- ```
package/dist/chip/Chip.js DELETED
@@ -1,205 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
4
-
5
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
6
-
7
- Object.defineProperty(exports, "__esModule", {
8
- value: true
9
- });
10
- exports["default"] = void 0;
11
-
12
- var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
13
-
14
- var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
15
-
16
- var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
17
-
18
- var _react = _interopRequireDefault(require("react"));
19
-
20
- var _styledComponents = _interopRequireWildcard(require("styled-components"));
21
-
22
- var _propTypes = _interopRequireDefault(require("prop-types"));
23
-
24
- var _variables = require("../common/variables.js");
25
-
26
- require("../common/OpenSans.css");
27
-
28
- var _utils = require("../common/utils.js");
29
-
30
- var _useTheme = _interopRequireDefault(require("../useTheme.js"));
31
-
32
- function _templateObject5() {
33
- var data = (0, _taggedTemplateLiteral2["default"])(["\n opacity: ", ";\n cursor: ", ";\n ", "\n max-width: 24px;\n max-height: 24px;\n overflow: hidden;\n"]);
34
-
35
- _templateObject5 = function _templateObject5() {
36
- return data;
37
- };
38
-
39
- return data;
40
- }
41
-
42
- function _templateObject4() {
43
- var data = (0, _taggedTemplateLiteral2["default"])(["\n cursor: ", ";\n margin-right: ", ";\n max-width: 24px;\n max-height: 24px;\n"]);
44
-
45
- _templateObject4 = function _templateObject4() {
46
- return data;
47
- };
48
-
49
- return data;
50
- }
51
-
52
- function _templateObject3() {
53
- var data = (0, _taggedTemplateLiteral2["default"])(["\n cursor: ", ";\n margin-left: ", ";\n max-width: 24px;\n max-height: 24px;\n"]);
54
-
55
- _templateObject3 = function _templateObject3() {
56
- return data;
57
- };
58
-
59
- return data;
60
- }
61
-
62
- function _templateObject2() {
63
- var data = (0, _taggedTemplateLiteral2["default"])(["\n font-size: 16px;\n font-family: \"Open Sans\";\n line-height: 24px;\n color: ", ";\n cursor: ", ";\n text-overflow: ellipsis;\n white-space: nowrap;\n overflow: hidden;\n"]);
64
-
65
- _templateObject2 = function _templateObject2() {
66
- return data;
67
- };
68
-
69
- return data;
70
- }
71
-
72
- function _templateObject() {
73
- var data = (0, _taggedTemplateLiteral2["default"])(["\n display: inline-flex;\n align-items: center;\n border-radius: 50px;\n margin: 2px;\n max-width: ", ";\n background-color: ", ";\n ", ";\n height: ", ";\n padding: 10px 20px;\n cursor: ", ";\n margin: ", ";\n margin-top: ", ";\n margin-right: ", ";\n margin-bottom: ", ";\n margin-left: ", ";\n"]);
74
-
75
- _templateObject = function _templateObject() {
76
- return data;
77
- };
78
-
79
- return data;
80
- }
81
-
82
- var DxcChip = function DxcChip(_ref) {
83
- var label = _ref.label,
84
- suffixIcon = _ref.suffixIcon,
85
- prefixIcon = _ref.prefixIcon,
86
- suffixIconSrc = _ref.suffixIconSrc,
87
- onClickSuffix = _ref.onClickSuffix,
88
- prefixIconSrc = _ref.prefixIconSrc,
89
- onClickPrefix = _ref.onClickPrefix,
90
- disabled = _ref.disabled,
91
- margin = _ref.margin;
92
- var colorsTheme = (0, _useTheme["default"])();
93
- return _react["default"].createElement(_styledComponents.ThemeProvider, {
94
- theme: colorsTheme.chip
95
- }, _react["default"].createElement(StyledDxcChip, {
96
- disabled: disabled,
97
- margin: margin
98
- }, prefixIcon ? _react["default"].createElement(IconContainer, {
99
- disabled: disabled,
100
- prefixIcon: true,
101
- label: label,
102
- onClick: function onClick() {
103
- return onClickPrefix && !disabled && onClickPrefix(label);
104
- }
105
- }, (0, _typeof2["default"])(prefixIcon) === "object" ? prefixIcon : _react["default"].createElement(prefixIcon)) : prefixIconSrc && _react["default"].createElement(PrefixIconContainer, {
106
- disabled: disabled,
107
- src: prefixIconSrc,
108
- label: label,
109
- onClick: function onClick() {
110
- return onClickPrefix && !disabled && onClickPrefix(label);
111
- }
112
- }), label && _react["default"].createElement(ChipTextContainer, {
113
- disabled: disabled,
114
- prefixIconSrc: prefixIconSrc,
115
- suffixIconSrc: suffixIconSrc
116
- }, label), suffixIcon ? _react["default"].createElement(IconContainer, {
117
- disabled: disabled,
118
- suffixIcon: true,
119
- label: label,
120
- onClick: function onClick() {
121
- return onClickSuffix && !disabled && onClickSuffix(label);
122
- }
123
- }, (0, _typeof2["default"])(suffixIcon) === "object" ? suffixIcon : _react["default"].createElement(suffixIcon)) : suffixIconSrc && _react["default"].createElement(SuffixIconContainer, {
124
- disabled: disabled,
125
- src: suffixIconSrc,
126
- label: label,
127
- onClick: function onClick() {
128
- return onClickSuffix && !disabled && onClickSuffix(label);
129
- }
130
- })));
131
- };
132
-
133
- var StyledDxcChip = _styledComponents["default"].div(_templateObject(), function (_ref2) {
134
- var margin = _ref2.margin;
135
- return "calc(100% - 40px - ".concat((0, _utils.getMargin)(margin, "left"), " - ").concat((0, _utils.getMargin)(margin, "right"), ")");
136
- }, function (props) {
137
- return props.disabled && props.theme.disabledBackgroundColor || props.theme.backgroundColor;
138
- }, function (props) {
139
- return props.theme.outlinedColor !== "" ? "border: 2px solid ".concat(props.theme.outlinedColor) : "";
140
- }, function (props) {
141
- return props.theme.outlinedColor !== "" ? "18px" : "22px";
142
- }, function (_ref3) {
143
- var disabled = _ref3.disabled;
144
- return disabled && "not-allowed";
145
- }, function (props) {
146
- return props.margin && (0, _typeof2["default"])(props.margin) !== "object" ? _variables.spaces[props.margin] : "0px";
147
- }, function (props) {
148
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.top ? _variables.spaces[props.margin.top] : "";
149
- }, function (props) {
150
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.right ? _variables.spaces[props.margin.right] : "";
151
- }, function (props) {
152
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.bottom ? _variables.spaces[props.margin.bottom] : "";
153
- }, function (props) {
154
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.left ? _variables.spaces[props.margin.left] : "";
155
- });
156
-
157
- var ChipTextContainer = _styledComponents["default"].span(_templateObject2(), function (props) {
158
- return props.disabled && props.theme.disabledFontColor || props.theme.fontColor;
159
- }, function (_ref4) {
160
- var disabled = _ref4.disabled;
161
- return disabled && "not-allowed" || "default";
162
- });
163
-
164
- var SuffixIconContainer = _styledComponents["default"].img(_templateObject3(), function (_ref5) {
165
- var disabled = _ref5.disabled;
166
- return disabled && "not-allowed" || "pointer";
167
- }, function (props) {
168
- return (props.label || props.suffixIconSrc) && "10px" || props.prefixIconSrc && "5px";
169
- });
170
-
171
- var PrefixIconContainer = _styledComponents["default"].img(_templateObject4(), function (_ref6) {
172
- var disabled = _ref6.disabled;
173
- return disabled && "not-allowed" || "pointer";
174
- }, function (props) {
175
- return (props.label || props.suffixIconSrc) && "10px" || props.prefixIconSrc && "5px";
176
- });
177
-
178
- var IconContainer = _styledComponents["default"].div(_templateObject5(), function (props) {
179
- return props.disabled && 0.34;
180
- }, function (_ref7) {
181
- var disabled = _ref7.disabled;
182
- return disabled && "not-allowed" || "pointer";
183
- }, function (props) {
184
- return props.prefixIcon ? "margin-right: ".concat((props.label || props.suffixIcon || props.suffixIconSrc) && "10px" || (props.prefixIcon || props.prefixIconSrc) && "0", ";") : "margin-left: ".concat((props.label || props.prefixIcon || props.prefixIconSrc) && "10px" || (props.prefixIcon || props.prefixIconSrc) && "0", ";");
185
- });
186
-
187
- DxcChip.propTypes = {
188
- label: _propTypes["default"].string,
189
- disabled: _propTypes["default"].bool,
190
- theme: _propTypes["default"].oneOf(["dark", "light"]),
191
- suffixIcon: _propTypes["default"].oneOfType([_propTypes["default"].element, _propTypes["default"].func]),
192
- prefixIcon: _propTypes["default"].oneOfType([_propTypes["default"].element, _propTypes["default"].func]),
193
- suffixIconSrc: _propTypes["default"].string,
194
- prefixIconSrc: _propTypes["default"].string,
195
- onClickSuffix: _propTypes["default"].func,
196
- onClickPrefix: _propTypes["default"].func,
197
- margin: _propTypes["default"].oneOfType([_propTypes["default"].shape({
198
- top: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
199
- bottom: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
200
- left: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
201
- right: _propTypes["default"].oneOf(Object.keys(_variables.spaces))
202
- }), _propTypes["default"].oneOf((0, _toConsumableArray2["default"])(Object.keys(_variables.spaces)))])
203
- };
204
- var _default = DxcChip;
205
- exports["default"] = _default;
@@ -1,10 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports["default"] = testFunction;
7
-
8
- function testFunction(num1, num2) {
9
- return num1 + num2;
10
- }
@@ -1,12 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
-
5
- var _exampleService = _interopRequireDefault(require("./example-service"));
6
-
7
- describe("warnings array creation", function () {
8
- it("Function sums values", function () {
9
- var result = (0, _exampleService["default"])(2, 3);
10
- expect(result).toEqual(5);
11
- });
12
- });
@@ -1,42 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
-
5
- Object.defineProperty(exports, "__esModule", {
6
- value: true
7
- });
8
- exports.getCustomTheme = exports.getMargin = void 0;
9
-
10
- var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
11
-
12
- var _variables = require("./variables.js");
13
-
14
- var getMargin = function getMargin(marginProp, side) {
15
- if (marginProp && (0, _typeof2["default"])(marginProp) === "object") {
16
- return marginProp[side] && _variables.spaces[marginProp[side]] || "0px";
17
- } else {
18
- return marginProp && _variables.spaces[marginProp] || "0px";
19
- }
20
- };
21
-
22
- exports.getMargin = getMargin;
23
-
24
- var getCustomTheme = function getCustomTheme(defaultTheme, customTheme) {
25
- var newTheme = JSON.parse(JSON.stringify(defaultTheme));
26
-
27
- if (customTheme) {
28
- Object.keys(newTheme).map(function (component) {
29
- if (customTheme[component]) {
30
- Object.keys(newTheme[component]).map(function (objectKey) {
31
- if (customTheme[component][objectKey]) {
32
- newTheme[component][objectKey] = customTheme[component][objectKey];
33
- }
34
- });
35
- }
36
- });
37
- }
38
-
39
- return newTheme;
40
- };
41
-
42
- exports.getCustomTheme = getCustomTheme;