@dxc-technology/halstack-react 0.0.0-dedf1af → 0.0.0-dfcca07

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