@dxc-technology/halstack-react 0.0.0-4b1188a → 0.0.0-4b95ba0

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 (424) 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 +235 -0
  5. package/accordion/Accordion.d.ts +4 -0
  6. package/accordion/Accordion.js +247 -0
  7. package/accordion/Accordion.stories.tsx +307 -0
  8. package/accordion/types.d.ts +64 -0
  9. package/accordion/types.js +5 -0
  10. package/accordion-group/AccordionGroup.d.ts +7 -0
  11. package/accordion-group/AccordionGroup.js +170 -0
  12. package/accordion-group/AccordionGroup.stories.tsx +225 -0
  13. package/accordion-group/types.d.ts +68 -0
  14. package/accordion-group/types.js +5 -0
  15. package/alert/Alert.d.ts +4 -0
  16. package/alert/Alert.js +290 -0
  17. package/alert/Alert.stories.tsx +170 -0
  18. package/alert/types.d.ts +49 -0
  19. package/alert/types.js +5 -0
  20. package/badge/Badge.d.ts +4 -0
  21. package/badge/Badge.js +59 -0
  22. package/badge/types.d.ts +4 -0
  23. package/badge/types.js +5 -0
  24. package/bleed/Bleed.d.ts +3 -0
  25. package/bleed/Bleed.js +84 -0
  26. package/bleed/Bleed.stories.tsx +342 -0
  27. package/bleed/types.d.ts +13 -0
  28. package/bleed/types.js +5 -0
  29. package/box/Box.d.ts +4 -0
  30. package/box/Box.js +126 -0
  31. package/box/Box.stories.tsx +132 -0
  32. package/box/types.d.ts +43 -0
  33. package/box/types.js +5 -0
  34. package/button/Button.d.ts +4 -0
  35. package/button/Button.js +171 -0
  36. package/button/Button.stories.tsx +274 -0
  37. package/button/types.d.ts +53 -0
  38. package/button/types.js +5 -0
  39. package/card/Card.d.ts +4 -0
  40. package/card/Card.js +164 -0
  41. package/card/Card.stories.tsx +201 -0
  42. package/card/ice-cream.jpg +0 -0
  43. package/card/types.d.ts +67 -0
  44. package/card/types.js +5 -0
  45. package/checkbox/Checkbox.d.ts +4 -0
  46. package/checkbox/Checkbox.js +253 -0
  47. package/checkbox/Checkbox.stories.tsx +192 -0
  48. package/checkbox/types.d.ts +60 -0
  49. package/checkbox/types.js +5 -0
  50. package/chip/Chip.d.ts +4 -0
  51. package/chip/Chip.js +161 -0
  52. package/chip/Chip.stories.tsx +119 -0
  53. package/chip/types.d.ts +45 -0
  54. package/chip/types.js +5 -0
  55. package/{dist/common → common}/OpenSans.css +0 -0
  56. package/{dist/common → common}/RequiredComponent.js +5 -19
  57. package/{dist/common → common}/fonts/OpenSans-Bold.ttf +0 -0
  58. package/{dist/common → common}/fonts/OpenSans-BoldItalic.ttf +0 -0
  59. package/{dist/common → common}/fonts/OpenSans-ExtraBold.ttf +0 -0
  60. package/{dist/common → common}/fonts/OpenSans-ExtraBoldItalic.ttf +0 -0
  61. package/{dist/common → common}/fonts/OpenSans-Italic.ttf +0 -0
  62. package/{dist/common → common}/fonts/OpenSans-Light.ttf +0 -0
  63. package/{dist/common → common}/fonts/OpenSans-LightItalic.ttf +0 -0
  64. package/{dist/common → common}/fonts/OpenSans-Regular.ttf +0 -0
  65. package/{dist/common → common}/fonts/OpenSans-SemiBold.ttf +0 -0
  66. package/{dist/common → common}/fonts/OpenSans-SemiBoldItalic.ttf +0 -0
  67. package/common/utils.js +22 -0
  68. package/common/variables.js +1378 -0
  69. package/date-input/DateInput.d.ts +4 -0
  70. package/date-input/DateInput.js +358 -0
  71. package/date-input/DateInput.stories.tsx +138 -0
  72. package/date-input/types.d.ts +100 -0
  73. package/date-input/types.js +5 -0
  74. package/dialog/Dialog.d.ts +4 -0
  75. package/dialog/Dialog.js +166 -0
  76. package/dialog/Dialog.stories.tsx +212 -0
  77. package/dialog/types.d.ts +43 -0
  78. package/dialog/types.js +5 -0
  79. package/dropdown/Dropdown.d.ts +4 -0
  80. package/dropdown/Dropdown.js +395 -0
  81. package/dropdown/Dropdown.stories.tsx +249 -0
  82. package/dropdown/types.d.ts +80 -0
  83. package/dropdown/types.js +5 -0
  84. package/file-input/FileInput.d.ts +4 -0
  85. package/file-input/FileInput.js +590 -0
  86. package/file-input/FileInput.stories.tsx +507 -0
  87. package/file-input/FileItem.d.ts +14 -0
  88. package/file-input/FileItem.js +184 -0
  89. package/file-input/types.d.ts +112 -0
  90. package/file-input/types.js +5 -0
  91. package/footer/Footer.d.ts +4 -0
  92. package/footer/Footer.js +258 -0
  93. package/footer/Footer.stories.tsx +130 -0
  94. package/footer/Icons.d.ts +2 -0
  95. package/footer/Icons.js +77 -0
  96. package/footer/types.d.ts +65 -0
  97. package/footer/types.js +5 -0
  98. package/header/Header.d.ts +7 -0
  99. package/header/Header.js +324 -0
  100. package/header/Header.stories.tsx +162 -0
  101. package/header/Icons.d.ts +2 -0
  102. package/header/Icons.js +34 -0
  103. package/header/types.d.ts +47 -0
  104. package/header/types.js +5 -0
  105. package/heading/Heading.d.ts +4 -0
  106. package/heading/Heading.js +159 -0
  107. package/heading/Heading.stories.tsx +54 -0
  108. package/heading/types.d.ts +33 -0
  109. package/heading/types.js +5 -0
  110. package/inset/Inset.d.ts +3 -0
  111. package/inset/Inset.js +84 -0
  112. package/inset/Inset.stories.tsx +229 -0
  113. package/inset/types.d.ts +13 -0
  114. package/inset/types.js +5 -0
  115. package/layout/ApplicationLayout.d.ts +10 -0
  116. package/layout/ApplicationLayout.js +231 -0
  117. package/layout/ApplicationLayout.stories.tsx +171 -0
  118. package/layout/Icons.js +55 -0
  119. package/layout/types.d.ts +57 -0
  120. package/layout/types.js +5 -0
  121. package/link/Link.d.ts +3 -0
  122. package/link/Link.js +153 -0
  123. package/link/Link.stories.tsx +151 -0
  124. package/link/types.d.ts +70 -0
  125. package/link/types.js +5 -0
  126. package/list/List.d.ts +4 -0
  127. package/list/List.js +47 -0
  128. package/list/List.stories.tsx +95 -0
  129. package/list/types.d.ts +7 -0
  130. package/list/types.js +5 -0
  131. package/main.d.ts +46 -0
  132. package/{dist/main.js → main.js} +159 -59
  133. package/number-input/NumberInput.d.ts +4 -0
  134. package/number-input/NumberInput.js +83 -0
  135. package/number-input/NumberInput.stories.tsx +115 -0
  136. package/number-input/NumberInputContext.d.ts +4 -0
  137. package/{dist/ThemeContext.js → number-input/NumberInputContext.js} +6 -2
  138. package/number-input/numberInputContextTypes.d.ts +19 -0
  139. package/number-input/numberInputContextTypes.js +5 -0
  140. package/number-input/types.d.ts +117 -0
  141. package/number-input/types.js +5 -0
  142. package/package.json +39 -23
  143. package/paginator/Icons.js +66 -0
  144. package/paginator/Paginator.d.ts +4 -0
  145. package/paginator/Paginator.js +192 -0
  146. package/paginator/Paginator.stories.tsx +63 -0
  147. package/paginator/types.d.ts +38 -0
  148. package/paginator/types.js +5 -0
  149. package/password-input/PasswordInput.d.ts +4 -0
  150. package/password-input/PasswordInput.js +163 -0
  151. package/password-input/PasswordInput.stories.tsx +131 -0
  152. package/password-input/types.d.ts +107 -0
  153. package/password-input/types.js +5 -0
  154. package/progress-bar/ProgressBar.d.ts +4 -0
  155. package/progress-bar/ProgressBar.js +170 -0
  156. package/progress-bar/ProgressBar.stories.jsx +58 -0
  157. package/progress-bar/types.d.ts +37 -0
  158. package/progress-bar/types.js +5 -0
  159. package/radio/Radio.d.ts +4 -0
  160. package/radio/Radio.js +174 -0
  161. package/radio/Radio.stories.tsx +192 -0
  162. package/radio/types.d.ts +54 -0
  163. package/radio/types.js +5 -0
  164. package/radio-group/Radio.d.ts +4 -0
  165. package/radio-group/Radio.js +140 -0
  166. package/radio-group/RadioGroup.d.ts +4 -0
  167. package/radio-group/RadioGroup.js +273 -0
  168. package/radio-group/RadioGroup.stories.tsx +79 -0
  169. package/radio-group/RadioGroup.test.js +248 -0
  170. package/radio-group/types.d.ts +36 -0
  171. package/radio-group/types.js +5 -0
  172. package/resultsetTable/ResultsetTable.d.ts +4 -0
  173. package/resultsetTable/ResultsetTable.js +254 -0
  174. package/resultsetTable/ResultsetTable.stories.tsx +275 -0
  175. package/resultsetTable/types.d.ts +67 -0
  176. package/resultsetTable/types.js +5 -0
  177. package/row/Row.d.ts +3 -0
  178. package/row/Row.js +127 -0
  179. package/row/Row.stories.tsx +237 -0
  180. package/row/types.d.ts +10 -0
  181. package/row/types.js +5 -0
  182. package/select/Select.d.ts +4 -0
  183. package/select/Select.js +869 -0
  184. package/select/Select.stories.tsx +572 -0
  185. package/select/types.d.ts +170 -0
  186. package/select/types.js +5 -0
  187. package/sidenav/Sidenav.d.ts +9 -0
  188. package/sidenav/Sidenav.js +136 -0
  189. package/sidenav/Sidenav.stories.tsx +182 -0
  190. package/sidenav/types.d.ts +50 -0
  191. package/sidenav/types.js +5 -0
  192. package/slider/Slider.d.ts +4 -0
  193. package/slider/Slider.js +317 -0
  194. package/slider/Slider.stories.tsx +177 -0
  195. package/slider/types.d.ts +78 -0
  196. package/slider/types.js +5 -0
  197. package/spinner/Spinner.d.ts +4 -0
  198. package/spinner/Spinner.js +250 -0
  199. package/spinner/Spinner.stories.jsx +103 -0
  200. package/spinner/types.d.ts +32 -0
  201. package/spinner/types.js +5 -0
  202. package/stack/Stack.d.ts +3 -0
  203. package/stack/Stack.js +97 -0
  204. package/stack/Stack.stories.tsx +164 -0
  205. package/stack/types.d.ts +9 -0
  206. package/stack/types.js +5 -0
  207. package/switch/Switch.d.ts +4 -0
  208. package/switch/Switch.js +179 -0
  209. package/switch/Switch.stories.tsx +160 -0
  210. package/switch/types.d.ts +58 -0
  211. package/switch/types.js +5 -0
  212. package/table/Table.d.ts +4 -0
  213. package/table/Table.js +118 -0
  214. package/table/Table.stories.jsx +277 -0
  215. package/table/types.d.ts +21 -0
  216. package/table/types.js +5 -0
  217. package/tabs/Tabs.d.ts +4 -0
  218. package/tabs/Tabs.js +213 -0
  219. package/tabs/Tabs.stories.tsx +120 -0
  220. package/tabs/types.d.ts +78 -0
  221. package/tabs/types.js +5 -0
  222. package/tag/Tag.d.ts +4 -0
  223. package/tag/Tag.js +188 -0
  224. package/tag/Tag.stories.tsx +138 -0
  225. package/tag/types.d.ts +69 -0
  226. package/tag/types.js +5 -0
  227. package/text/Text.d.ts +7 -0
  228. package/text/Text.js +30 -0
  229. package/text/Text.stories.tsx +19 -0
  230. package/text-input/TextInput.d.ts +4 -0
  231. package/text-input/TextInput.js +796 -0
  232. package/text-input/TextInput.stories.tsx +456 -0
  233. package/text-input/types.d.ts +159 -0
  234. package/text-input/types.js +5 -0
  235. package/textarea/Textarea.d.ts +4 -0
  236. package/textarea/Textarea.js +286 -0
  237. package/textarea/Textarea.stories.jsx +136 -0
  238. package/textarea/types.d.ts +130 -0
  239. package/textarea/types.js +5 -0
  240. package/toggle-group/ToggleGroup.d.ts +4 -0
  241. package/toggle-group/ToggleGroup.js +214 -0
  242. package/toggle-group/ToggleGroup.stories.tsx +173 -0
  243. package/toggle-group/types.d.ts +97 -0
  244. package/toggle-group/types.js +5 -0
  245. package/useTheme.d.ts +2 -0
  246. package/useTheme.js +22 -0
  247. package/wizard/Wizard.d.ts +4 -0
  248. package/wizard/Wizard.js +281 -0
  249. package/wizard/Wizard.stories.tsx +224 -0
  250. package/wizard/types.d.ts +60 -0
  251. package/wizard/types.js +5 -0
  252. package/README.md +0 -66
  253. package/babel.config.js +0 -4
  254. package/dist/accordion/Accordion.js +0 -268
  255. package/dist/accordion/Accordion.stories.js +0 -207
  256. package/dist/accordion/readme.md +0 -96
  257. package/dist/alert/Alert.js +0 -304
  258. package/dist/alert/Alert.stories.js +0 -158
  259. package/dist/alert/close.svg +0 -4
  260. package/dist/alert/error.svg +0 -4
  261. package/dist/alert/info.svg +0 -4
  262. package/dist/alert/readme.md +0 -43
  263. package/dist/alert/success.svg +0 -4
  264. package/dist/alert/warning.svg +0 -4
  265. package/dist/box/Box.js +0 -148
  266. package/dist/button/Button.js +0 -202
  267. package/dist/button/Button.stories.js +0 -224
  268. package/dist/button/readme.md +0 -93
  269. package/dist/card/Card.js +0 -217
  270. package/dist/checkbox/Checkbox.js +0 -240
  271. package/dist/checkbox/Checkbox.stories.js +0 -144
  272. package/dist/checkbox/readme.md +0 -116
  273. package/dist/chip/Chip.js +0 -208
  274. package/dist/common/services/example-service.js +0 -10
  275. package/dist/common/services/example-service.test.js +0 -12
  276. package/dist/common/utils.js +0 -42
  277. package/dist/common/variables.js +0 -434
  278. package/dist/date/Date.js +0 -356
  279. package/dist/date/Date.stories.js +0 -205
  280. package/dist/date/calendar.svg +0 -1
  281. package/dist/date/calendar_dark.svg +0 -1
  282. package/dist/date/readme.md +0 -73
  283. package/dist/dialog/Dialog.js +0 -197
  284. package/dist/dialog/Dialog.stories.js +0 -217
  285. package/dist/dialog/readme.md +0 -32
  286. package/dist/dropdown/Dropdown.js +0 -449
  287. package/dist/dropdown/Dropdown.stories.js +0 -249
  288. package/dist/dropdown/baseline-arrow_drop_down.svg +0 -1
  289. package/dist/dropdown/baseline-arrow_drop_down_wh.svg +0 -4
  290. package/dist/dropdown/baseline-arrow_drop_up.svg +0 -1
  291. package/dist/dropdown/baseline-arrow_drop_up_wh.svg +0 -4
  292. package/dist/dropdown/readme.md +0 -69
  293. package/dist/footer/Footer.js +0 -371
  294. package/dist/footer/Footer.stories.js +0 -94
  295. package/dist/footer/dxc_logo_wht.png +0 -0
  296. package/dist/footer/readme.md +0 -41
  297. package/dist/header/Header.js +0 -373
  298. package/dist/header/Header.stories.js +0 -176
  299. package/dist/header/close_icon.svg +0 -1
  300. package/dist/header/dxc_logo_black.png +0 -0
  301. package/dist/header/dxc_logo_blk_rgb.svg +0 -6
  302. package/dist/header/dxc_logo_white.png +0 -0
  303. package/dist/header/hamb_menu_black.svg +0 -1
  304. package/dist/header/hamb_menu_white.svg +0 -1
  305. package/dist/header/readme.md +0 -33
  306. package/dist/heading/Heading.js +0 -153
  307. package/dist/input-text/InputText.js +0 -570
  308. package/dist/input-text/InputText.stories.js +0 -209
  309. package/dist/input-text/error.svg +0 -1
  310. package/dist/input-text/readme.md +0 -91
  311. package/dist/layout/ApplicationLayout.js +0 -335
  312. package/dist/layout/facebook.svg +0 -45
  313. package/dist/layout/linkedin.svg +0 -50
  314. package/dist/layout/twitter.svg +0 -53
  315. package/dist/link/Link.js +0 -189
  316. package/dist/link/readme.md +0 -51
  317. package/dist/paginator/Paginator.js +0 -196
  318. package/dist/paginator/images/next.svg +0 -3
  319. package/dist/paginator/images/nextPage.svg +0 -3
  320. package/dist/paginator/images/previous.svg +0 -3
  321. package/dist/paginator/images/previousPage.svg +0 -3
  322. package/dist/paginator/readme.md +0 -50
  323. package/dist/progress-bar/ProgressBar.js +0 -185
  324. package/dist/progress-bar/ProgressBar.stories.js +0 -280
  325. package/dist/progress-bar/readme.md +0 -63
  326. package/dist/radio/Radio.js +0 -195
  327. package/dist/radio/Radio.stories.js +0 -166
  328. package/dist/radio/readme.md +0 -70
  329. package/dist/resultsetTable/ResultsetTable.js +0 -333
  330. package/dist/resultsetTable/arrow_downward-24px_wht.svg +0 -1
  331. package/dist/resultsetTable/arrow_upward-24px_wht.svg +0 -1
  332. package/dist/resultsetTable/unfold_more-24px_wht.svg +0 -1
  333. package/dist/select/Select.js +0 -473
  334. package/dist/select/Select.stories.js +0 -235
  335. package/dist/select/readme.md +0 -72
  336. package/dist/sidenav/Sidenav.js +0 -128
  337. package/dist/slider/Slider.js +0 -266
  338. package/dist/slider/Slider.stories.js +0 -241
  339. package/dist/slider/readme.md +0 -64
  340. package/dist/spinner/Spinner.js +0 -193
  341. package/dist/spinner/Spinner.stories.js +0 -183
  342. package/dist/spinner/readme.md +0 -65
  343. package/dist/switch/Switch.js +0 -199
  344. package/dist/switch/Switch.stories.js +0 -134
  345. package/dist/switch/readme.md +0 -133
  346. package/dist/table/Table.js +0 -105
  347. package/dist/tabs/Tabs.js +0 -185
  348. package/dist/tabs/Tabs.stories.js +0 -130
  349. package/dist/tabs/readme.md +0 -78
  350. package/dist/tabs-for-sections/TabsForSections.js +0 -92
  351. package/dist/tabs-for-sections/readme.md +0 -78
  352. package/dist/tag/Tag.js +0 -249
  353. package/dist/textarea/Textarea.js +0 -227
  354. package/dist/toggle/Toggle.js +0 -223
  355. package/dist/toggle/Toggle.stories.js +0 -297
  356. package/dist/toggle/readme.md +0 -80
  357. package/dist/toggle-group/ToggleGroup.js +0 -214
  358. package/dist/toggle-group/readme.md +0 -82
  359. package/dist/upload/Upload.js +0 -200
  360. package/dist/upload/Upload.stories.js +0 -72
  361. package/dist/upload/buttons-upload/ButtonsUpload.js +0 -122
  362. package/dist/upload/buttons-upload/drag-drop-icon.svg +0 -4
  363. package/dist/upload/buttons-upload/upload-button.svg +0 -1
  364. package/dist/upload/dragAndDropArea/DragAndDropArea.js +0 -279
  365. package/dist/upload/dragAndDropArea/upload_drop.svg +0 -4
  366. package/dist/upload/dragAndDropArea/upload_file.svg +0 -4
  367. package/dist/upload/file-upload/FileToUpload.js +0 -158
  368. package/dist/upload/file-upload/audio-icon.svg +0 -4
  369. package/dist/upload/file-upload/close.svg +0 -4
  370. package/dist/upload/file-upload/file-icon.svg +0 -4
  371. package/dist/upload/file-upload/video-icon.svg +0 -4
  372. package/dist/upload/files-upload/FilesToUpload.js +0 -123
  373. package/dist/upload/readme.md +0 -37
  374. package/dist/upload/transaction/Transaction.js +0 -155
  375. package/dist/upload/transaction/audio-icon-err.svg +0 -4
  376. package/dist/upload/transaction/audio-icon.svg +0 -4
  377. package/dist/upload/transaction/error-icon.svg +0 -4
  378. package/dist/upload/transaction/file-icon-err.svg +0 -4
  379. package/dist/upload/transaction/file-icon.svg +0 -4
  380. package/dist/upload/transaction/image-icon-err.svg +0 -4
  381. package/dist/upload/transaction/image-icon.svg +0 -4
  382. package/dist/upload/transaction/success-icon.svg +0 -4
  383. package/dist/upload/transaction/video-icon-err.svg +0 -4
  384. package/dist/upload/transaction/video-icon.svg +0 -4
  385. package/dist/upload/transactions/Transactions.js +0 -120
  386. package/dist/wizard/Wizard.js +0 -327
  387. package/dist/wizard/invalid_icon.svg +0 -6
  388. package/dist/wizard/valid_icon.svg +0 -6
  389. package/dist/wizard/validation-wrong.svg +0 -6
  390. package/test/Accordion.test.js +0 -33
  391. package/test/Alert.test.js +0 -53
  392. package/test/Box.test.js +0 -10
  393. package/test/Button.test.js +0 -18
  394. package/test/Card.test.js +0 -30
  395. package/test/Checkbox.test.js +0 -45
  396. package/test/Chip.test.js +0 -25
  397. package/test/Date.test.js +0 -393
  398. package/test/Dialog.test.js +0 -23
  399. package/test/Dropdown.test.js +0 -130
  400. package/test/Footer.test.js +0 -99
  401. package/test/Header.test.js +0 -39
  402. package/test/Heading.test.js +0 -35
  403. package/test/InputText.test.js +0 -236
  404. package/test/Link.test.js +0 -33
  405. package/test/Paginator.test.js +0 -165
  406. package/test/ProgressBar.test.js +0 -35
  407. package/test/Radio.test.js +0 -37
  408. package/test/ResultsetTable.test.js +0 -282
  409. package/test/Select.test.js +0 -191
  410. package/test/Sidenav.test.js +0 -45
  411. package/test/Slider.test.js +0 -82
  412. package/test/Spinner.test.js +0 -27
  413. package/test/Switch.test.js +0 -45
  414. package/test/Table.test.js +0 -36
  415. package/test/Tabs.test.js +0 -88
  416. package/test/TabsForSections.test.js +0 -34
  417. package/test/Tag.test.js +0 -32
  418. package/test/TextArea.test.js +0 -52
  419. package/test/Toggle.test.js +0 -43
  420. package/test/ToggleGroup.test.js +0 -81
  421. package/test/Upload.test.js +0 -60
  422. package/test/Wizard.test.js +0 -130
  423. package/test/mocks/pngMock.js +0 -1
  424. 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,208 +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 = _interopRequireWildcard(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
- var _ThemeContext = _interopRequireDefault(require("../ThemeContext.js"));
27
-
28
- require("../common/OpenSans.css");
29
-
30
- var _utils = require("../common/utils.js");
31
-
32
- function _templateObject5() {
33
- var data = (0, _taggedTemplateLiteral2["default"])(["\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\n padding: 10px 20px;\n cursor: ", ";\n opacity: ", ";\n\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 customTheme = (0, _react.useContext)(_ThemeContext["default"]);
93
- var colorsTheme = (0, _react.useMemo)(function () {
94
- return (0, _utils.getCustomTheme)(_variables.theme, (0, _utils.getCustomTheme)(_variables.defaultTheme, customTheme));
95
- }, [customTheme]);
96
- return _react["default"].createElement(_styledComponents.ThemeProvider, {
97
- theme: colorsTheme.chip
98
- }, _react["default"].createElement(StyledDxcChip, {
99
- disabled: disabled,
100
- margin: margin
101
- }, prefixIcon ? _react["default"].createElement(IconContainer, {
102
- disabled: disabled,
103
- prefixIcon: true,
104
- label: label,
105
- onClick: function onClick() {
106
- return onClickPrefix && !disabled && onClickPrefix(label);
107
- }
108
- }, (0, _typeof2["default"])(prefixIcon) === "object" ? prefixIcon : _react["default"].createElement(prefixIcon)) : prefixIconSrc && _react["default"].createElement(PrefixIconContainer, {
109
- disabled: disabled,
110
- src: prefixIconSrc,
111
- label: label,
112
- onClick: function onClick() {
113
- return onClickPrefix && !disabled && onClickPrefix(label);
114
- }
115
- }), label && _react["default"].createElement(ChipTextContainer, {
116
- disabled: disabled,
117
- prefixIconSrc: prefixIconSrc,
118
- suffixIconSrc: suffixIconSrc
119
- }, label), suffixIcon ? _react["default"].createElement(IconContainer, {
120
- disabled: disabled,
121
- suffixIcon: true,
122
- label: label,
123
- onClick: function onClick() {
124
- return onClickSuffix && !disabled && onClickSuffix(label);
125
- }
126
- }, (0, _typeof2["default"])(suffixIcon) === "object" ? suffixIcon : _react["default"].createElement(suffixIcon)) : suffixIconSrc && _react["default"].createElement(SuffixIconContainer, {
127
- disabled: disabled,
128
- src: suffixIconSrc,
129
- label: label,
130
- onClick: function onClick() {
131
- return onClickSuffix && !disabled && onClickSuffix(label);
132
- }
133
- })));
134
- };
135
-
136
- var StyledDxcChip = _styledComponents["default"].div(_templateObject(), function (_ref2) {
137
- var margin = _ref2.margin;
138
- return "calc(100% - 40px - ".concat((0, _utils.getMargin)(margin, "left"), " - ").concat((0, _utils.getMargin)(margin, "right"), ")");
139
- }, function (props) {
140
- return props.theme.backgroundColor;
141
- }, function (props) {
142
- return props.theme.outlinedColor !== "" ? "border: 2px solid ".concat(props.theme.outlinedColor) : "";
143
- }, function (props) {
144
- return props.theme.outlinedColor !== "" ? "18px" : "22px";
145
- }, function (_ref3) {
146
- var disabled = _ref3.disabled;
147
- return disabled && "not-allowed";
148
- }, function (props) {
149
- return props.disabled && props.theme.disabled || "initial";
150
- }, function (props) {
151
- return props.margin && (0, _typeof2["default"])(props.margin) !== "object" ? _variables.spaces[props.margin] : "0px";
152
- }, function (props) {
153
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.top ? _variables.spaces[props.margin.top] : "";
154
- }, function (props) {
155
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.right ? _variables.spaces[props.margin.right] : "";
156
- }, function (props) {
157
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.bottom ? _variables.spaces[props.margin.bottom] : "";
158
- }, function (props) {
159
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.left ? _variables.spaces[props.margin.left] : "";
160
- });
161
-
162
- var ChipTextContainer = _styledComponents["default"].span(_templateObject2(), function (props) {
163
- return props.theme.fontColor;
164
- }, function (_ref4) {
165
- var disabled = _ref4.disabled;
166
- return disabled && "not-allowed" || "default";
167
- });
168
-
169
- var SuffixIconContainer = _styledComponents["default"].img(_templateObject3(), function (_ref5) {
170
- var disabled = _ref5.disabled;
171
- return disabled && "not-allowed" || "pointer";
172
- }, function (props) {
173
- return (props.label || props.suffixIconSrc) && "10px" || props.prefixIconSrc && "5px";
174
- });
175
-
176
- var PrefixIconContainer = _styledComponents["default"].img(_templateObject4(), function (_ref6) {
177
- var disabled = _ref6.disabled;
178
- return disabled && "not-allowed" || "pointer";
179
- }, function (props) {
180
- return (props.label || props.suffixIconSrc) && "10px" || props.prefixIconSrc && "5px";
181
- });
182
-
183
- var IconContainer = _styledComponents["default"].div(_templateObject5(), function (_ref7) {
184
- var disabled = _ref7.disabled;
185
- return disabled && "not-allowed" || "pointer";
186
- }, function (props) {
187
- 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", ";");
188
- });
189
-
190
- DxcChip.propTypes = {
191
- label: _propTypes["default"].string,
192
- disabled: _propTypes["default"].bool,
193
- theme: _propTypes["default"].oneOf(["dark", "light"]),
194
- suffixIcon: _propTypes["default"].oneOfType([_propTypes["default"].element, _propTypes["default"].func]),
195
- prefixIcon: _propTypes["default"].oneOfType([_propTypes["default"].element, _propTypes["default"].func]),
196
- suffixIconSrc: _propTypes["default"].string,
197
- prefixIconSrc: _propTypes["default"].string,
198
- onClickSuffix: _propTypes["default"].func,
199
- onClickPrefix: _propTypes["default"].func,
200
- margin: _propTypes["default"].oneOfType([_propTypes["default"].shape({
201
- top: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
202
- bottom: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
203
- left: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
204
- right: _propTypes["default"].oneOf(Object.keys(_variables.spaces))
205
- }), _propTypes["default"].oneOf((0, _toConsumableArray2["default"])(Object.keys(_variables.spaces)))])
206
- };
207
- var _default = DxcChip;
208
- 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;