@dxc-technology/halstack-react 0.0.0-ec3ed57 → 0.0.0-eca8a89

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 (416) hide show
  1. package/BackgroundColorContext.d.ts +10 -0
  2. package/BackgroundColorContext.js +48 -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 +1574 -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 +165 -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/types.d.ts +89 -0
  80. package/dropdown/types.js +5 -0
  81. package/file-input/FileInput.d.ts +4 -0
  82. package/file-input/FileInput.js +521 -0
  83. package/file-input/FileItem.d.ts +14 -0
  84. package/file-input/FileItem.js +184 -0
  85. package/file-input/types.d.ts +112 -0
  86. package/file-input/types.js +5 -0
  87. package/footer/Footer.d.ts +4 -0
  88. package/footer/Footer.js +260 -0
  89. package/footer/Footer.stories.tsx +130 -0
  90. package/footer/Icons.d.ts +2 -0
  91. package/footer/Icons.js +77 -0
  92. package/footer/types.d.ts +65 -0
  93. package/footer/types.js +5 -0
  94. package/header/Header.d.ts +7 -0
  95. package/header/Header.js +324 -0
  96. package/header/Header.stories.tsx +162 -0
  97. package/header/Icons.d.ts +2 -0
  98. package/header/Icons.js +34 -0
  99. package/header/types.d.ts +47 -0
  100. package/header/types.js +5 -0
  101. package/heading/Heading.d.ts +4 -0
  102. package/heading/Heading.js +159 -0
  103. package/heading/Heading.stories.tsx +53 -0
  104. package/heading/types.d.ts +33 -0
  105. package/heading/types.js +5 -0
  106. package/input-text/Icons.js +22 -0
  107. package/input-text/InputText.js +611 -0
  108. package/input-text/index.d.ts +36 -0
  109. package/layout/ApplicationLayout.d.ts +10 -0
  110. package/layout/ApplicationLayout.js +225 -0
  111. package/layout/ApplicationLayout.stories.tsx +171 -0
  112. package/layout/Icons.js +55 -0
  113. package/layout/types.d.ts +57 -0
  114. package/layout/types.js +5 -0
  115. package/link/Link.d.ts +3 -0
  116. package/link/Link.js +161 -0
  117. package/link/Link.stories.tsx +146 -0
  118. package/link/types.d.ts +74 -0
  119. package/link/types.js +5 -0
  120. package/list/List.d.ts +7 -0
  121. package/list/List.js +37 -0
  122. package/list/List.stories.tsx +70 -0
  123. package/main.d.ts +48 -0
  124. package/{dist/main.js → main.js} +147 -55
  125. package/number-input/NumberInput.d.ts +4 -0
  126. package/number-input/NumberInput.js +83 -0
  127. package/number-input/NumberInput.stories.tsx +115 -0
  128. package/number-input/NumberInputContext.d.ts +4 -0
  129. package/number-input/NumberInputContext.js +19 -0
  130. package/number-input/numberInputContextTypes.d.ts +19 -0
  131. package/number-input/numberInputContextTypes.js +5 -0
  132. package/number-input/types.d.ts +117 -0
  133. package/number-input/types.js +5 -0
  134. package/package.json +32 -23
  135. package/paginator/Icons.js +66 -0
  136. package/paginator/Paginator.d.ts +4 -0
  137. package/paginator/Paginator.js +192 -0
  138. package/paginator/Paginator.stories.tsx +63 -0
  139. package/paginator/types.d.ts +38 -0
  140. package/paginator/types.js +5 -0
  141. package/password-input/PasswordInput.d.ts +4 -0
  142. package/password-input/PasswordInput.js +163 -0
  143. package/password-input/PasswordInput.stories.tsx +131 -0
  144. package/password-input/types.d.ts +107 -0
  145. package/password-input/types.js +5 -0
  146. package/progress-bar/ProgressBar.d.ts +4 -0
  147. package/progress-bar/ProgressBar.js +170 -0
  148. package/progress-bar/ProgressBar.stories.jsx +58 -0
  149. package/progress-bar/types.d.ts +37 -0
  150. package/progress-bar/types.js +5 -0
  151. package/radio/Radio.d.ts +4 -0
  152. package/radio/Radio.js +174 -0
  153. package/radio/Radio.stories.tsx +192 -0
  154. package/radio/types.d.ts +54 -0
  155. package/radio/types.js +5 -0
  156. package/resultsetTable/ResultsetTable.d.ts +4 -0
  157. package/{dist/resultsetTable → resultsetTable}/ResultsetTable.js +90 -165
  158. package/resultsetTable/ResultsetTable.stories.tsx +276 -0
  159. package/resultsetTable/types.d.ts +67 -0
  160. package/resultsetTable/types.js +5 -0
  161. package/row/Row.d.ts +11 -0
  162. package/row/Row.js +124 -0
  163. package/row/Row.stories.tsx +223 -0
  164. package/select/Select.js +863 -0
  165. package/select/Select.stories.tsx +572 -0
  166. package/select/index.d.ts +131 -0
  167. package/sidenav/Sidenav.d.ts +9 -0
  168. package/sidenav/Sidenav.js +136 -0
  169. package/sidenav/Sidenav.stories.tsx +165 -0
  170. package/sidenav/types.d.ts +50 -0
  171. package/sidenav/types.js +5 -0
  172. package/slider/Slider.d.ts +4 -0
  173. package/slider/Slider.js +317 -0
  174. package/slider/Slider.stories.tsx +177 -0
  175. package/slider/types.d.ts +78 -0
  176. package/slider/types.js +5 -0
  177. package/spinner/Spinner.d.ts +4 -0
  178. package/spinner/Spinner.js +250 -0
  179. package/spinner/Spinner.stories.jsx +102 -0
  180. package/spinner/types.d.ts +32 -0
  181. package/spinner/types.js +5 -0
  182. package/stack/Stack.d.ts +10 -0
  183. package/stack/Stack.js +94 -0
  184. package/stack/Stack.stories.tsx +150 -0
  185. package/switch/Switch.d.ts +4 -0
  186. package/switch/Switch.js +179 -0
  187. package/switch/Switch.stories.tsx +160 -0
  188. package/switch/types.d.ts +58 -0
  189. package/switch/types.js +5 -0
  190. package/table/Table.d.ts +4 -0
  191. package/table/Table.js +118 -0
  192. package/table/Table.stories.jsx +276 -0
  193. package/table/types.d.ts +21 -0
  194. package/table/types.js +5 -0
  195. package/tabs/Tabs.d.ts +4 -0
  196. package/tabs/Tabs.js +213 -0
  197. package/tabs/Tabs.stories.tsx +121 -0
  198. package/tabs/types.d.ts +70 -0
  199. package/tabs/types.js +5 -0
  200. package/tag/Tag.d.ts +4 -0
  201. package/tag/Tag.js +193 -0
  202. package/tag/Tag.stories.tsx +145 -0
  203. package/tag/types.d.ts +60 -0
  204. package/tag/types.js +5 -0
  205. package/text/Text.d.ts +7 -0
  206. package/text/Text.js +30 -0
  207. package/text/Text.stories.tsx +19 -0
  208. package/text-input/TextInput.d.ts +4 -0
  209. package/text-input/TextInput.js +786 -0
  210. package/text-input/TextInput.stories.tsx +456 -0
  211. package/text-input/types.d.ts +159 -0
  212. package/text-input/types.js +5 -0
  213. package/textarea/Textarea.js +314 -0
  214. package/textarea/Textarea.stories.jsx +135 -0
  215. package/textarea/index.d.ts +127 -0
  216. package/{dist/toggle → toggle}/Toggle.js +18 -52
  217. package/toggle/index.d.ts +21 -0
  218. package/toggle-group/ToggleGroup.d.ts +4 -0
  219. package/toggle-group/ToggleGroup.js +217 -0
  220. package/toggle-group/ToggleGroup.stories.tsx +178 -0
  221. package/toggle-group/types.d.ts +84 -0
  222. package/toggle-group/types.js +5 -0
  223. package/{dist/upload → upload}/Upload.js +23 -22
  224. package/upload/buttons-upload/ButtonsUpload.js +111 -0
  225. package/upload/buttons-upload/Icons.js +40 -0
  226. package/upload/dragAndDropArea/DragAndDropArea.js +225 -0
  227. package/upload/dragAndDropArea/Icons.js +39 -0
  228. package/upload/file-upload/FileToUpload.js +115 -0
  229. package/upload/file-upload/Icons.js +66 -0
  230. package/upload/files-upload/FilesToUpload.js +109 -0
  231. package/upload/index.d.ts +15 -0
  232. package/upload/transaction/Icons.js +160 -0
  233. package/upload/transaction/Transaction.js +104 -0
  234. package/upload/transactions/Transactions.js +94 -0
  235. package/useTheme.d.ts +2 -0
  236. package/{dist/useTheme.js → useTheme.js} +1 -1
  237. package/wizard/Icons.js +65 -0
  238. package/wizard/Wizard.d.ts +4 -0
  239. package/wizard/Wizard.js +231 -0
  240. package/wizard/Wizard.stories.jsx +224 -0
  241. package/wizard/types.d.ts +64 -0
  242. package/wizard/types.js +5 -0
  243. package/README.md +0 -66
  244. package/babel.config.js +0 -8
  245. package/dist/ThemeContext.js +0 -181
  246. package/dist/accordion/Accordion.js +0 -268
  247. package/dist/accordion/Accordion.stories.js +0 -207
  248. package/dist/accordion/readme.md +0 -96
  249. package/dist/accordion-group/AccordionGroup.js +0 -156
  250. package/dist/accordion-group/AccordionGroup.stories.js +0 -207
  251. package/dist/accordion-group/readme.md +0 -70
  252. package/dist/alert/Alert.js +0 -303
  253. package/dist/alert/Alert.stories.js +0 -158
  254. package/dist/alert/close.svg +0 -4
  255. package/dist/alert/error.svg +0 -4
  256. package/dist/alert/info.svg +0 -4
  257. package/dist/alert/readme.md +0 -43
  258. package/dist/alert/success.svg +0 -4
  259. package/dist/alert/warning.svg +0 -4
  260. package/dist/badge/Badge.js +0 -42
  261. package/dist/box/Box.js +0 -145
  262. package/dist/button/Button.js +0 -203
  263. package/dist/button/Button.stories.js +0 -224
  264. package/dist/button/readme.md +0 -93
  265. package/dist/card/Card.js +0 -217
  266. package/dist/checkbox/Checkbox.js +0 -229
  267. package/dist/checkbox/Checkbox.stories.js +0 -144
  268. package/dist/checkbox/readme.md +0 -116
  269. package/dist/chip/Chip.js +0 -205
  270. package/dist/common/services/example-service.js +0 -10
  271. package/dist/common/services/example-service.test.js +0 -12
  272. package/dist/common/utils.js +0 -42
  273. package/dist/common/variables.js +0 -361
  274. package/dist/date/Date.stories.js +0 -205
  275. package/dist/date/calendar.svg +0 -1
  276. package/dist/date/calendar_dark.svg +0 -1
  277. package/dist/date/readme.md +0 -73
  278. package/dist/dialog/Dialog.js +0 -195
  279. package/dist/dialog/Dialog.stories.js +0 -217
  280. package/dist/dialog/readme.md +0 -32
  281. package/dist/dropdown/Dropdown.js +0 -446
  282. package/dist/dropdown/Dropdown.stories.js +0 -249
  283. package/dist/dropdown/baseline-arrow_drop_down.svg +0 -1
  284. package/dist/dropdown/baseline-arrow_drop_down_wh.svg +0 -4
  285. package/dist/dropdown/baseline-arrow_drop_up.svg +0 -1
  286. package/dist/dropdown/baseline-arrow_drop_up_wh.svg +0 -4
  287. package/dist/dropdown/readme.md +0 -69
  288. package/dist/footer/Footer.js +0 -366
  289. package/dist/footer/Footer.stories.js +0 -94
  290. package/dist/footer/dxc_logo_wht.png +0 -0
  291. package/dist/footer/readme.md +0 -41
  292. package/dist/header/Header.js +0 -368
  293. package/dist/header/Header.stories.js +0 -176
  294. package/dist/header/close_icon.svg +0 -1
  295. package/dist/header/dxc_logo_black.png +0 -0
  296. package/dist/header/dxc_logo_blk_rgb.svg +0 -6
  297. package/dist/header/dxc_logo_white.png +0 -0
  298. package/dist/header/hamb_menu_black.svg +0 -1
  299. package/dist/header/hamb_menu_white.svg +0 -1
  300. package/dist/header/readme.md +0 -33
  301. package/dist/heading/Heading.js +0 -153
  302. package/dist/input-text/InputText.js +0 -561
  303. package/dist/input-text/InputText.stories.js +0 -209
  304. package/dist/input-text/error.svg +0 -1
  305. package/dist/input-text/readme.md +0 -91
  306. package/dist/layout/ApplicationLayout.js +0 -330
  307. package/dist/layout/facebook.svg +0 -45
  308. package/dist/layout/linkedin.svg +0 -50
  309. package/dist/layout/twitter.svg +0 -53
  310. package/dist/link/Link.js +0 -187
  311. package/dist/link/readme.md +0 -51
  312. package/dist/paginator/Paginator.js +0 -247
  313. package/dist/paginator/images/next.svg +0 -3
  314. package/dist/paginator/images/nextPage.svg +0 -3
  315. package/dist/paginator/images/previous.svg +0 -3
  316. package/dist/paginator/images/previousPage.svg +0 -3
  317. package/dist/paginator/readme.md +0 -50
  318. package/dist/progress-bar/ProgressBar.js +0 -184
  319. package/dist/progress-bar/ProgressBar.stories.js +0 -280
  320. package/dist/progress-bar/readme.md +0 -63
  321. package/dist/radio/Radio.js +0 -190
  322. package/dist/radio/Radio.stories.js +0 -166
  323. package/dist/radio/readme.md +0 -70
  324. package/dist/resultsetTable/arrow_downward-24px_wht.svg +0 -1
  325. package/dist/resultsetTable/arrow_upward-24px_wht.svg +0 -1
  326. package/dist/resultsetTable/unfold_more-24px_wht.svg +0 -1
  327. package/dist/select/Select.js +0 -475
  328. package/dist/select/Select.stories.js +0 -235
  329. package/dist/select/readme.md +0 -72
  330. package/dist/sidenav/Sidenav.js +0 -123
  331. package/dist/slider/Slider.js +0 -257
  332. package/dist/slider/Slider.stories.js +0 -241
  333. package/dist/slider/readme.md +0 -64
  334. package/dist/spinner/Spinner.js +0 -190
  335. package/dist/spinner/Spinner.stories.js +0 -183
  336. package/dist/spinner/readme.md +0 -65
  337. package/dist/switch/Switch.js +0 -190
  338. package/dist/switch/Switch.stories.js +0 -134
  339. package/dist/switch/readme.md +0 -133
  340. package/dist/table/Table.js +0 -90
  341. package/dist/tabs/Tabs.js +0 -307
  342. package/dist/tabs/Tabs.stories.js +0 -130
  343. package/dist/tabs/readme.md +0 -78
  344. package/dist/tabs-for-sections/TabsForSections.js +0 -92
  345. package/dist/tabs-for-sections/readme.md +0 -78
  346. package/dist/tag/Tag.js +0 -249
  347. package/dist/textarea/Textarea.js +0 -220
  348. package/dist/toggle/Toggle.stories.js +0 -297
  349. package/dist/toggle/readme.md +0 -80
  350. package/dist/toggle-group/ToggleGroup.js +0 -209
  351. package/dist/toggle-group/readme.md +0 -82
  352. package/dist/upload/Upload.stories.js +0 -72
  353. package/dist/upload/buttons-upload/ButtonsUpload.js +0 -119
  354. package/dist/upload/buttons-upload/drag-drop-icon.svg +0 -4
  355. package/dist/upload/buttons-upload/upload-button.svg +0 -1
  356. package/dist/upload/dragAndDropArea/DragAndDropArea.js +0 -278
  357. package/dist/upload/dragAndDropArea/upload_drop.svg +0 -4
  358. package/dist/upload/dragAndDropArea/upload_file.svg +0 -4
  359. package/dist/upload/file-upload/FileToUpload.js +0 -154
  360. package/dist/upload/file-upload/audio-icon.svg +0 -4
  361. package/dist/upload/file-upload/close.svg +0 -4
  362. package/dist/upload/file-upload/file-icon.svg +0 -4
  363. package/dist/upload/file-upload/video-icon.svg +0 -4
  364. package/dist/upload/files-upload/FilesToUpload.js +0 -120
  365. package/dist/upload/readme.md +0 -37
  366. package/dist/upload/transaction/Transaction.js +0 -152
  367. package/dist/upload/transaction/audio-icon-err.svg +0 -4
  368. package/dist/upload/transaction/audio-icon.svg +0 -4
  369. package/dist/upload/transaction/error-icon.svg +0 -4
  370. package/dist/upload/transaction/file-icon-err.svg +0 -4
  371. package/dist/upload/transaction/file-icon.svg +0 -4
  372. package/dist/upload/transaction/image-icon-err.svg +0 -4
  373. package/dist/upload/transaction/image-icon.svg +0 -4
  374. package/dist/upload/transaction/success-icon.svg +0 -4
  375. package/dist/upload/transaction/video-icon-err.svg +0 -4
  376. package/dist/upload/transaction/video-icon.svg +0 -4
  377. package/dist/upload/transactions/Transactions.js +0 -116
  378. package/dist/wizard/Wizard.js +0 -325
  379. package/dist/wizard/invalid_icon.svg +0 -6
  380. package/dist/wizard/valid_icon.svg +0 -6
  381. package/dist/wizard/validation-wrong.svg +0 -6
  382. package/test/Accordion.test.js +0 -33
  383. package/test/AccordionGroup.test.js +0 -109
  384. package/test/Alert.test.js +0 -53
  385. package/test/Box.test.js +0 -10
  386. package/test/Button.test.js +0 -18
  387. package/test/Card.test.js +0 -30
  388. package/test/Checkbox.test.js +0 -45
  389. package/test/Chip.test.js +0 -25
  390. package/test/Date.test.js +0 -393
  391. package/test/Dialog.test.js +0 -23
  392. package/test/Dropdown.test.js +0 -130
  393. package/test/Footer.test.js +0 -99
  394. package/test/Header.test.js +0 -39
  395. package/test/Heading.test.js +0 -35
  396. package/test/InputText.test.js +0 -240
  397. package/test/Link.test.js +0 -42
  398. package/test/Paginator.test.js +0 -177
  399. package/test/ProgressBar.test.js +0 -35
  400. package/test/Radio.test.js +0 -37
  401. package/test/ResultsetTable.test.js +0 -330
  402. package/test/Select.test.js +0 -192
  403. package/test/Sidenav.test.js +0 -45
  404. package/test/Slider.test.js +0 -82
  405. package/test/Spinner.test.js +0 -27
  406. package/test/Switch.test.js +0 -45
  407. package/test/Table.test.js +0 -36
  408. package/test/Tabs.test.js +0 -109
  409. package/test/TabsForSections.test.js +0 -34
  410. package/test/Tag.test.js +0 -32
  411. package/test/TextArea.test.js +0 -52
  412. package/test/ToggleGroup.test.js +0 -81
  413. package/test/Upload.test.js +0 -60
  414. package/test/Wizard.test.js +0 -130
  415. package/test/mocks/pngMock.js +0 -1
  416. 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;