@dxc-technology/halstack-react 0.0.0-3e141fb → 0.0.0-3ef0b56

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 (473) hide show
  1. package/BackgroundColorContext.d.ts +10 -0
  2. package/BackgroundColorContext.js +47 -0
  3. package/HalstackContext.d.ts +12 -0
  4. package/HalstackContext.js +298 -0
  5. package/accordion/Accordion.d.ts +4 -0
  6. package/accordion/Accordion.js +226 -0
  7. package/accordion/Accordion.stories.tsx +307 -0
  8. package/accordion/Accordion.test.js +72 -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 +168 -0
  13. package/accordion-group/AccordionGroup.stories.tsx +225 -0
  14. package/accordion-group/AccordionGroup.test.js +151 -0
  15. package/accordion-group/types.d.ts +72 -0
  16. package/accordion-group/types.js +5 -0
  17. package/alert/Alert.d.ts +4 -0
  18. package/alert/Alert.js +293 -0
  19. package/alert/Alert.stories.tsx +170 -0
  20. package/alert/Alert.test.js +92 -0
  21. package/alert/types.d.ts +49 -0
  22. package/alert/types.js +5 -0
  23. package/badge/Badge.d.ts +4 -0
  24. package/badge/Badge.js +59 -0
  25. package/badge/types.d.ts +4 -0
  26. package/badge/types.js +5 -0
  27. package/bleed/Bleed.d.ts +3 -0
  28. package/bleed/Bleed.js +84 -0
  29. package/bleed/Bleed.stories.tsx +342 -0
  30. package/bleed/types.d.ts +37 -0
  31. package/bleed/types.js +5 -0
  32. package/box/Box.d.ts +4 -0
  33. package/box/Box.js +126 -0
  34. package/box/Box.stories.tsx +132 -0
  35. package/box/Box.test.js +18 -0
  36. package/box/types.d.ts +43 -0
  37. package/box/types.js +5 -0
  38. package/button/Button.d.ts +4 -0
  39. package/button/Button.js +174 -0
  40. package/button/Button.stories.tsx +274 -0
  41. package/button/Button.test.js +35 -0
  42. package/button/types.d.ts +53 -0
  43. package/button/types.js +5 -0
  44. package/card/Card.d.ts +4 -0
  45. package/card/Card.js +163 -0
  46. package/card/Card.stories.tsx +201 -0
  47. package/card/Card.test.js +50 -0
  48. package/card/ice-cream.jpg +0 -0
  49. package/card/types.d.ts +67 -0
  50. package/card/types.js +5 -0
  51. package/checkbox/Checkbox.d.ts +4 -0
  52. package/checkbox/Checkbox.js +257 -0
  53. package/checkbox/Checkbox.stories.tsx +188 -0
  54. package/checkbox/Checkbox.test.js +78 -0
  55. package/checkbox/types.d.ts +64 -0
  56. package/checkbox/types.js +5 -0
  57. package/chip/Chip.d.ts +4 -0
  58. package/chip/Chip.js +161 -0
  59. package/chip/Chip.stories.tsx +119 -0
  60. package/chip/Chip.test.js +56 -0
  61. package/chip/types.d.ts +45 -0
  62. package/chip/types.js +5 -0
  63. package/{dist/common → common}/OpenSans.css +0 -0
  64. package/{dist/common → common}/RequiredComponent.js +5 -19
  65. package/{dist/common → common}/fonts/OpenSans-Bold.ttf +0 -0
  66. package/{dist/common → common}/fonts/OpenSans-BoldItalic.ttf +0 -0
  67. package/{dist/common → common}/fonts/OpenSans-ExtraBold.ttf +0 -0
  68. package/{dist/common → common}/fonts/OpenSans-ExtraBoldItalic.ttf +0 -0
  69. package/{dist/common → common}/fonts/OpenSans-Italic.ttf +0 -0
  70. package/{dist/common → common}/fonts/OpenSans-Light.ttf +0 -0
  71. package/{dist/common → common}/fonts/OpenSans-LightItalic.ttf +0 -0
  72. package/{dist/common → common}/fonts/OpenSans-Regular.ttf +0 -0
  73. package/{dist/common → common}/fonts/OpenSans-SemiBold.ttf +0 -0
  74. package/{dist/common → common}/fonts/OpenSans-SemiBoldItalic.ttf +0 -0
  75. package/common/utils.js +22 -0
  76. package/common/variables.js +1484 -0
  77. package/date-input/DateInput.d.ts +4 -0
  78. package/date-input/DateInput.js +372 -0
  79. package/date-input/DateInput.stories.tsx +138 -0
  80. package/date-input/DateInput.test.js +479 -0
  81. package/date-input/types.d.ts +107 -0
  82. package/date-input/types.js +5 -0
  83. package/dialog/Dialog.d.ts +4 -0
  84. package/dialog/Dialog.js +138 -0
  85. package/dialog/Dialog.stories.tsx +212 -0
  86. package/dialog/Dialog.test.js +40 -0
  87. package/dialog/types.d.ts +43 -0
  88. package/dialog/types.js +5 -0
  89. package/dropdown/Dropdown.d.ts +4 -0
  90. package/dropdown/Dropdown.js +391 -0
  91. package/dropdown/Dropdown.stories.tsx +249 -0
  92. package/dropdown/Dropdown.test.js +189 -0
  93. package/dropdown/types.d.ts +80 -0
  94. package/dropdown/types.js +5 -0
  95. package/file-input/FileInput.d.ts +4 -0
  96. package/file-input/FileInput.js +593 -0
  97. package/file-input/FileInput.stories.tsx +507 -0
  98. package/file-input/FileInput.test.js +457 -0
  99. package/file-input/FileItem.d.ts +14 -0
  100. package/file-input/FileItem.js +186 -0
  101. package/file-input/types.d.ts +112 -0
  102. package/file-input/types.js +5 -0
  103. package/footer/Footer.d.ts +4 -0
  104. package/footer/Footer.js +185 -0
  105. package/footer/Footer.stories.tsx +130 -0
  106. package/footer/Footer.test.js +109 -0
  107. package/footer/Icons.d.ts +2 -0
  108. package/footer/Icons.js +77 -0
  109. package/footer/types.d.ts +65 -0
  110. package/footer/types.js +5 -0
  111. package/header/Header.d.ts +7 -0
  112. package/header/Header.js +303 -0
  113. package/header/Header.stories.tsx +172 -0
  114. package/header/Header.test.js +79 -0
  115. package/header/Icons.d.ts +2 -0
  116. package/header/Icons.js +34 -0
  117. package/header/types.d.ts +47 -0
  118. package/header/types.js +5 -0
  119. package/heading/Heading.d.ts +4 -0
  120. package/heading/Heading.js +159 -0
  121. package/heading/Heading.stories.tsx +54 -0
  122. package/heading/Heading.test.js +186 -0
  123. package/heading/types.d.ts +33 -0
  124. package/heading/types.js +5 -0
  125. package/inset/Inset.d.ts +3 -0
  126. package/inset/Inset.js +84 -0
  127. package/inset/Inset.stories.tsx +229 -0
  128. package/inset/types.d.ts +37 -0
  129. package/inset/types.js +5 -0
  130. package/layout/ApplicationLayout.d.ts +10 -0
  131. package/layout/ApplicationLayout.js +218 -0
  132. package/layout/ApplicationLayout.stories.tsx +171 -0
  133. package/layout/Icons.js +55 -0
  134. package/layout/types.d.ts +57 -0
  135. package/layout/types.js +5 -0
  136. package/link/Link.d.ts +4 -0
  137. package/link/Link.js +162 -0
  138. package/link/Link.stories.tsx +186 -0
  139. package/link/Link.test.js +83 -0
  140. package/link/types.d.ts +55 -0
  141. package/link/types.js +5 -0
  142. package/list/List.d.ts +4 -0
  143. package/list/List.js +47 -0
  144. package/list/List.stories.tsx +95 -0
  145. package/list/types.d.ts +7 -0
  146. package/list/types.js +5 -0
  147. package/main.d.ts +47 -0
  148. package/{dist/main.js → main.js} +173 -59
  149. package/number-input/NumberInput.d.ts +4 -0
  150. package/number-input/NumberInput.js +76 -0
  151. package/number-input/NumberInput.stories.tsx +115 -0
  152. package/number-input/NumberInput.test.js +506 -0
  153. package/number-input/NumberInputContext.d.ts +4 -0
  154. package/{dist/ThemeContext.js → number-input/NumberInputContext.js} +6 -2
  155. package/number-input/numberInputContextTypes.d.ts +19 -0
  156. package/number-input/numberInputContextTypes.js +5 -0
  157. package/number-input/types.d.ts +124 -0
  158. package/number-input/types.js +5 -0
  159. package/package.json +43 -26
  160. package/paginator/Icons.js +66 -0
  161. package/paginator/Paginator.d.ts +4 -0
  162. package/paginator/Paginator.js +171 -0
  163. package/paginator/Paginator.stories.tsx +63 -0
  164. package/paginator/Paginator.test.js +266 -0
  165. package/paginator/types.d.ts +38 -0
  166. package/paginator/types.js +5 -0
  167. package/password-input/PasswordInput.d.ts +4 -0
  168. package/password-input/PasswordInput.js +166 -0
  169. package/password-input/PasswordInput.stories.tsx +131 -0
  170. package/password-input/PasswordInput.test.js +180 -0
  171. package/password-input/types.d.ts +110 -0
  172. package/password-input/types.js +5 -0
  173. package/progress-bar/ProgressBar.d.ts +4 -0
  174. package/progress-bar/ProgressBar.js +170 -0
  175. package/progress-bar/ProgressBar.stories.jsx +58 -0
  176. package/progress-bar/ProgressBar.test.js +65 -0
  177. package/progress-bar/types.d.ts +37 -0
  178. package/progress-bar/types.js +5 -0
  179. package/quick-nav/QuickNav.d.ts +4 -0
  180. package/quick-nav/QuickNav.js +110 -0
  181. package/quick-nav/QuickNav.stories.tsx +237 -0
  182. package/quick-nav/types.d.ts +21 -0
  183. package/quick-nav/types.js +5 -0
  184. package/radio/Radio.d.ts +4 -0
  185. package/radio/Radio.js +173 -0
  186. package/radio/Radio.stories.tsx +192 -0
  187. package/radio/Radio.test.js +71 -0
  188. package/radio/types.d.ts +54 -0
  189. package/radio/types.js +5 -0
  190. package/radio-group/Radio.d.ts +4 -0
  191. package/radio-group/Radio.js +141 -0
  192. package/radio-group/RadioGroup.d.ts +4 -0
  193. package/radio-group/RadioGroup.js +282 -0
  194. package/radio-group/RadioGroup.stories.tsx +100 -0
  195. package/radio-group/RadioGroup.test.js +695 -0
  196. package/radio-group/types.d.ts +114 -0
  197. package/radio-group/types.js +5 -0
  198. package/resultsetTable/ResultsetTable.d.ts +4 -0
  199. package/resultsetTable/ResultsetTable.js +254 -0
  200. package/resultsetTable/ResultsetTable.stories.tsx +275 -0
  201. package/resultsetTable/ResultsetTable.test.js +306 -0
  202. package/resultsetTable/types.d.ts +67 -0
  203. package/resultsetTable/types.js +5 -0
  204. package/row/Row.d.ts +3 -0
  205. package/row/Row.js +127 -0
  206. package/row/Row.stories.tsx +237 -0
  207. package/row/types.d.ts +28 -0
  208. package/row/types.js +5 -0
  209. package/select/Icons.d.ts +10 -0
  210. package/select/Icons.js +93 -0
  211. package/select/Listbox.d.ts +4 -0
  212. package/select/Listbox.js +152 -0
  213. package/select/Option.d.ts +4 -0
  214. package/select/Option.js +110 -0
  215. package/select/Select.d.ts +4 -0
  216. package/select/Select.js +645 -0
  217. package/select/Select.stories.tsx +594 -0
  218. package/select/Select.test.js +2120 -0
  219. package/select/types.d.ts +213 -0
  220. package/select/types.js +5 -0
  221. package/sidenav/Sidenav.d.ts +9 -0
  222. package/sidenav/Sidenav.js +136 -0
  223. package/sidenav/Sidenav.stories.tsx +182 -0
  224. package/sidenav/Sidenav.test.js +56 -0
  225. package/sidenav/types.d.ts +50 -0
  226. package/sidenav/types.js +5 -0
  227. package/slider/Slider.d.ts +4 -0
  228. package/slider/Slider.js +318 -0
  229. package/slider/Slider.stories.tsx +177 -0
  230. package/slider/Slider.test.js +150 -0
  231. package/slider/types.d.ts +82 -0
  232. package/slider/types.js +5 -0
  233. package/spinner/Spinner.d.ts +4 -0
  234. package/spinner/Spinner.js +250 -0
  235. package/spinner/Spinner.stories.jsx +103 -0
  236. package/spinner/Spinner.test.js +64 -0
  237. package/spinner/types.d.ts +32 -0
  238. package/spinner/types.js +5 -0
  239. package/stack/Stack.d.ts +3 -0
  240. package/stack/Stack.js +97 -0
  241. package/stack/Stack.stories.tsx +164 -0
  242. package/stack/types.d.ts +24 -0
  243. package/stack/types.js +5 -0
  244. package/switch/Switch.d.ts +4 -0
  245. package/switch/Switch.js +195 -0
  246. package/switch/Switch.stories.tsx +160 -0
  247. package/switch/Switch.test.js +98 -0
  248. package/switch/types.d.ts +62 -0
  249. package/switch/types.js +5 -0
  250. package/table/Table.d.ts +4 -0
  251. package/table/Table.js +118 -0
  252. package/table/Table.stories.jsx +277 -0
  253. package/table/Table.test.js +26 -0
  254. package/table/types.d.ts +21 -0
  255. package/table/types.js +5 -0
  256. package/tabs/Tabs.d.ts +4 -0
  257. package/tabs/Tabs.js +211 -0
  258. package/tabs/Tabs.stories.tsx +112 -0
  259. package/tabs/Tabs.test.js +140 -0
  260. package/tabs/types.d.ts +82 -0
  261. package/tabs/types.js +5 -0
  262. package/tag/Tag.d.ts +4 -0
  263. package/tag/Tag.js +183 -0
  264. package/tag/Tag.stories.tsx +142 -0
  265. package/tag/Tag.test.js +60 -0
  266. package/tag/types.d.ts +69 -0
  267. package/tag/types.js +5 -0
  268. package/text/Text.d.ts +7 -0
  269. package/text/Text.js +30 -0
  270. package/text/Text.stories.tsx +19 -0
  271. package/text-input/Suggestion.d.ts +4 -0
  272. package/text-input/Suggestion.js +55 -0
  273. package/text-input/TextInput.d.ts +4 -0
  274. package/text-input/TextInput.js +770 -0
  275. package/text-input/TextInput.stories.tsx +474 -0
  276. package/text-input/TextInput.test.js +1712 -0
  277. package/text-input/types.d.ts +178 -0
  278. package/text-input/types.js +5 -0
  279. package/textarea/Textarea.d.ts +4 -0
  280. package/textarea/Textarea.js +277 -0
  281. package/textarea/Textarea.stories.jsx +157 -0
  282. package/textarea/Textarea.test.js +437 -0
  283. package/textarea/types.d.ts +137 -0
  284. package/textarea/types.js +5 -0
  285. package/toggle-group/ToggleGroup.d.ts +4 -0
  286. package/toggle-group/ToggleGroup.js +215 -0
  287. package/toggle-group/ToggleGroup.stories.tsx +173 -0
  288. package/toggle-group/ToggleGroup.test.js +156 -0
  289. package/toggle-group/types.d.ts +105 -0
  290. package/toggle-group/types.js +5 -0
  291. package/useTheme.d.ts +2 -0
  292. package/useTheme.js +22 -0
  293. package/useTranslatedLabels.d.ts +2 -0
  294. package/useTranslatedLabels.js +20 -0
  295. package/wizard/Wizard.d.ts +4 -0
  296. package/wizard/Wizard.js +292 -0
  297. package/wizard/Wizard.stories.tsx +214 -0
  298. package/wizard/Wizard.test.js +141 -0
  299. package/wizard/types.d.ts +64 -0
  300. package/wizard/types.js +5 -0
  301. package/README.md +0 -66
  302. package/babel.config.js +0 -4
  303. package/dist/accordion/Accordion.js +0 -248
  304. package/dist/accordion/Accordion.stories.js +0 -207
  305. package/dist/accordion/readme.md +0 -96
  306. package/dist/alert/Alert.js +0 -304
  307. package/dist/alert/Alert.stories.js +0 -158
  308. package/dist/alert/close.svg +0 -4
  309. package/dist/alert/error.svg +0 -4
  310. package/dist/alert/info.svg +0 -4
  311. package/dist/alert/readme.md +0 -43
  312. package/dist/alert/success.svg +0 -4
  313. package/dist/alert/warning.svg +0 -4
  314. package/dist/box/Box.js +0 -148
  315. package/dist/button/Button.js +0 -181
  316. package/dist/button/Button.stories.js +0 -224
  317. package/dist/button/readme.md +0 -93
  318. package/dist/card/Card.js +0 -217
  319. package/dist/checkbox/Checkbox.js +0 -240
  320. package/dist/checkbox/Checkbox.stories.js +0 -144
  321. package/dist/checkbox/readme.md +0 -116
  322. package/dist/chip/Chip.js +0 -173
  323. package/dist/common/services/example-service.js +0 -10
  324. package/dist/common/services/example-service.test.js +0 -12
  325. package/dist/common/utils.js +0 -42
  326. package/dist/common/variables.js +0 -434
  327. package/dist/date/Date.js +0 -356
  328. package/dist/date/Date.stories.js +0 -205
  329. package/dist/date/calendar.svg +0 -1
  330. package/dist/date/calendar_dark.svg +0 -1
  331. package/dist/date/readme.md +0 -73
  332. package/dist/dialog/Dialog.js +0 -197
  333. package/dist/dialog/Dialog.stories.js +0 -217
  334. package/dist/dialog/readme.md +0 -32
  335. package/dist/dropdown/Dropdown.js +0 -416
  336. package/dist/dropdown/Dropdown.stories.js +0 -249
  337. package/dist/dropdown/baseline-arrow_drop_down.svg +0 -1
  338. package/dist/dropdown/baseline-arrow_drop_down_wh.svg +0 -4
  339. package/dist/dropdown/baseline-arrow_drop_up.svg +0 -1
  340. package/dist/dropdown/baseline-arrow_drop_up_wh.svg +0 -4
  341. package/dist/dropdown/readme.md +0 -69
  342. package/dist/footer/Footer.js +0 -346
  343. package/dist/footer/Footer.stories.js +0 -94
  344. package/dist/footer/dxc_logo_wht.png +0 -0
  345. package/dist/footer/readme.md +0 -41
  346. package/dist/header/Header.js +0 -360
  347. package/dist/header/Header.stories.js +0 -176
  348. package/dist/header/close_icon.svg +0 -1
  349. package/dist/header/dxc_logo_black.png +0 -0
  350. package/dist/header/dxc_logo_blk_rgb.svg +0 -6
  351. package/dist/header/dxc_logo_white.png +0 -0
  352. package/dist/header/hamb_menu_black.svg +0 -1
  353. package/dist/header/hamb_menu_white.svg +0 -1
  354. package/dist/header/readme.md +0 -33
  355. package/dist/heading/Heading.js +0 -153
  356. package/dist/input-text/InputText.js +0 -519
  357. package/dist/input-text/InputText.stories.js +0 -209
  358. package/dist/input-text/error.svg +0 -1
  359. package/dist/input-text/readme.md +0 -91
  360. package/dist/layout/ApplicationLayout.js +0 -333
  361. package/dist/layout/facebook.svg +0 -45
  362. package/dist/layout/linkedin.svg +0 -50
  363. package/dist/layout/twitter.svg +0 -53
  364. package/dist/link/Link.js +0 -168
  365. package/dist/link/readme.md +0 -51
  366. package/dist/paginator/Paginator.js +0 -196
  367. package/dist/paginator/images/next.svg +0 -3
  368. package/dist/paginator/images/nextPage.svg +0 -3
  369. package/dist/paginator/images/previous.svg +0 -3
  370. package/dist/paginator/images/previousPage.svg +0 -3
  371. package/dist/paginator/readme.md +0 -50
  372. package/dist/progress-bar/ProgressBar.js +0 -185
  373. package/dist/progress-bar/ProgressBar.stories.js +0 -280
  374. package/dist/progress-bar/readme.md +0 -63
  375. package/dist/radio/Radio.js +0 -195
  376. package/dist/radio/Radio.stories.js +0 -166
  377. package/dist/radio/readme.md +0 -70
  378. package/dist/resultsetTable/ResultsetTable.js +0 -333
  379. package/dist/resultsetTable/arrow_downward-24px_wht.svg +0 -1
  380. package/dist/resultsetTable/arrow_upward-24px_wht.svg +0 -1
  381. package/dist/resultsetTable/unfold_more-24px_wht.svg +0 -1
  382. package/dist/select/Select.js +0 -453
  383. package/dist/select/Select.stories.js +0 -235
  384. package/dist/select/readme.md +0 -72
  385. package/dist/sidenav/Sidenav.js +0 -69
  386. package/dist/slider/Slider.js +0 -266
  387. package/dist/slider/Slider.stories.js +0 -241
  388. package/dist/slider/readme.md +0 -64
  389. package/dist/spinner/Spinner.js +0 -193
  390. package/dist/spinner/Spinner.stories.js +0 -183
  391. package/dist/spinner/readme.md +0 -65
  392. package/dist/switch/Switch.js +0 -199
  393. package/dist/switch/Switch.stories.js +0 -134
  394. package/dist/switch/readme.md +0 -133
  395. package/dist/table/Table.js +0 -105
  396. package/dist/tabs/Tabs.js +0 -172
  397. package/dist/tabs/Tabs.stories.js +0 -130
  398. package/dist/tabs/readme.md +0 -78
  399. package/dist/tabs-for-sections/TabsForSections.js +0 -92
  400. package/dist/tabs-for-sections/readme.md +0 -78
  401. package/dist/tag/Tag.js +0 -234
  402. package/dist/textarea/Textarea.js +0 -227
  403. package/dist/toggle/Toggle.js +0 -223
  404. package/dist/toggle/Toggle.stories.js +0 -297
  405. package/dist/toggle/readme.md +0 -80
  406. package/dist/toggle-group/ToggleGroup.js +0 -214
  407. package/dist/toggle-group/readme.md +0 -82
  408. package/dist/upload/Upload.js +0 -200
  409. package/dist/upload/Upload.stories.js +0 -72
  410. package/dist/upload/buttons-upload/ButtonsUpload.js +0 -122
  411. package/dist/upload/buttons-upload/drag-drop-icon.svg +0 -4
  412. package/dist/upload/buttons-upload/upload-button.svg +0 -1
  413. package/dist/upload/dragAndDropArea/DragAndDropArea.js +0 -279
  414. package/dist/upload/dragAndDropArea/upload_drop.svg +0 -4
  415. package/dist/upload/dragAndDropArea/upload_file.svg +0 -4
  416. package/dist/upload/file-upload/FileToUpload.js +0 -158
  417. package/dist/upload/file-upload/audio-icon.svg +0 -4
  418. package/dist/upload/file-upload/close.svg +0 -4
  419. package/dist/upload/file-upload/file-icon.svg +0 -4
  420. package/dist/upload/file-upload/video-icon.svg +0 -4
  421. package/dist/upload/files-upload/FilesToUpload.js +0 -123
  422. package/dist/upload/readme.md +0 -37
  423. package/dist/upload/transaction/Transaction.js +0 -155
  424. package/dist/upload/transaction/audio-icon-err.svg +0 -4
  425. package/dist/upload/transaction/audio-icon.svg +0 -4
  426. package/dist/upload/transaction/error-icon.svg +0 -4
  427. package/dist/upload/transaction/file-icon-err.svg +0 -4
  428. package/dist/upload/transaction/file-icon.svg +0 -4
  429. package/dist/upload/transaction/image-icon-err.svg +0 -4
  430. package/dist/upload/transaction/image-icon.svg +0 -4
  431. package/dist/upload/transaction/success-icon.svg +0 -4
  432. package/dist/upload/transaction/video-icon-err.svg +0 -4
  433. package/dist/upload/transaction/video-icon.svg +0 -4
  434. package/dist/upload/transactions/Transactions.js +0 -120
  435. package/dist/wizard/Wizard.js +0 -327
  436. package/dist/wizard/invalid_icon.svg +0 -6
  437. package/dist/wizard/valid_icon.svg +0 -6
  438. package/dist/wizard/validation-wrong.svg +0 -6
  439. package/test/Accordion.test.js +0 -33
  440. package/test/Alert.test.js +0 -53
  441. package/test/Box.test.js +0 -10
  442. package/test/Button.test.js +0 -18
  443. package/test/Card.test.js +0 -30
  444. package/test/Checkbox.test.js +0 -45
  445. package/test/Chip.test.js +0 -25
  446. package/test/Date.test.js +0 -393
  447. package/test/Dialog.test.js +0 -23
  448. package/test/Dropdown.test.js +0 -130
  449. package/test/Footer.test.js +0 -99
  450. package/test/Header.test.js +0 -39
  451. package/test/Heading.test.js +0 -35
  452. package/test/InputText.test.js +0 -236
  453. package/test/Link.test.js +0 -33
  454. package/test/Paginator.test.js +0 -165
  455. package/test/ProgressBar.test.js +0 -35
  456. package/test/Radio.test.js +0 -37
  457. package/test/ResultsetTable.test.js +0 -282
  458. package/test/Select.test.js +0 -191
  459. package/test/Sidenav.test.js +0 -19
  460. package/test/Slider.test.js +0 -82
  461. package/test/Spinner.test.js +0 -27
  462. package/test/Switch.test.js +0 -45
  463. package/test/Table.test.js +0 -36
  464. package/test/Tabs.test.js +0 -88
  465. package/test/TabsForSections.test.js +0 -34
  466. package/test/Tag.test.js +0 -32
  467. package/test/TextArea.test.js +0 -52
  468. package/test/Toggle.test.js +0 -43
  469. package/test/ToggleGroup.test.js +0 -81
  470. package/test/Upload.test.js +0 -60
  471. package/test/Wizard.test.js +0 -130
  472. package/test/mocks/pngMock.js +0 -1
  473. package/test/mocks/svgMock.js +0 -1
@@ -1,240 +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 _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
15
-
16
- var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
17
-
18
- var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
19
-
20
- var _react = _interopRequireWildcard(require("react"));
21
-
22
- var _styledComponents = _interopRequireWildcard(require("styled-components"));
23
-
24
- var _Checkbox = _interopRequireDefault(require("@material-ui/core/Checkbox"));
25
-
26
- var _propTypes = _interopRequireDefault(require("prop-types"));
27
-
28
- var _RequiredComponent = _interopRequireDefault(require("../common/RequiredComponent"));
29
-
30
- require("../common/OpenSans.css");
31
-
32
- var _variables = require("../common/variables.js");
33
-
34
- var _utils = require("../common/utils.js");
35
-
36
- var _ThemeContext = _interopRequireDefault(require("../ThemeContext.js"));
37
-
38
- function _templateObject3() {
39
- var data = (0, _taggedTemplateLiteral2["default"])(["\n background-color: ", ";\n width: 17px;\n height: 17px;\n position: absolute;\n left: ", ";\n right: ", ";\n z-index: 0;\n opacity: ", ";\n padding-left: ", ";\n padding-right: ", ";\n margin-left: ", ";\n margin-right: ", ";\n"]);
40
-
41
- _templateObject3 = function _templateObject3() {
42
- return data;
43
- };
44
-
45
- return data;
46
- }
47
-
48
- function _templateObject2() {
49
- var data = (0, _taggedTemplateLiteral2["default"])(["\n margin: ", ";\n margin-top: ", ";\n margin-right: ", ";\n margin-bottom: ", ";\n margin-left: ", ";\n\n width: ", ";\n\n opacity: ", ";\n display: inline-flex;\n align-items: center;\n cursor: ", ";\n position: relative;\n flex-direction: ", ";\n .MuiCheckbox-colorSecondary {\n &.Mui-checked {\n color: ", ";\n &.Mui-disabled {\n color: ", ";\n }\n &:hover {\n background-color: transparent;\n }\n }\n &.Mui-disabled {\n color: ", ";\n }\n }\n .MuiIconButton-colorSecondary {\n &:hover {\n background-color: transparent;\n }\n }\n .MuiButtonBase-root {\n &.Mui-focusVisible {\n .MuiIconButton-label {\n outline: ", " auto 1px;\n }\n }\n z-index: 1;\n padding: 10px;\n padding-left: ", ";\n padding-right: ", ";\n margin: 2px;\n margin-left: ", ";\n margin-right: ", ";\n color: ", ";\n }\n &.Mui-checked {\n color: ", ";\n &:hover {\n background-color: transparent;\n }\n }\n &.Mui-disabled {\n opacity: ", ";\n }\n .MuiSvgIcon-root {\n width: 26.6px;\n height: 26.6px;\n }\n"]);
50
-
51
- _templateObject2 = function _templateObject2() {
52
- return data;
53
- };
54
-
55
- return data;
56
- }
57
-
58
- function _templateObject() {
59
- var data = (0, _taggedTemplateLiteral2["default"])(["\n color: black;\n cursor: ", ";\n font-family: \"Open Sans\", sans-serif;\n"]);
60
-
61
- _templateObject = function _templateObject() {
62
- return data;
63
- };
64
-
65
- return data;
66
- }
67
-
68
- var DxcCheckbox = function DxcCheckbox(_ref) {
69
- var checked = _ref.checked,
70
- value = _ref.value,
71
- _ref$label = _ref.label,
72
- label = _ref$label === void 0 ? "" : _ref$label,
73
- _ref$labelPosition = _ref.labelPosition,
74
- labelPosition = _ref$labelPosition === void 0 ? "before" : _ref$labelPosition,
75
- _ref$name = _ref.name,
76
- name = _ref$name === void 0 ? "" : _ref$name,
77
- _ref$disabled = _ref.disabled,
78
- disabled = _ref$disabled === void 0 ? false : _ref$disabled,
79
- onChange = _ref.onChange,
80
- _ref$required = _ref.required,
81
- required = _ref$required === void 0 ? false : _ref$required,
82
- margin = _ref.margin,
83
- _ref$size = _ref.size,
84
- size = _ref$size === void 0 ? "fitContent" : _ref$size;
85
-
86
- var _useState = (0, _react.useState)(false),
87
- _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
88
- innerChecked = _useState2[0],
89
- setInnerChecked = _useState2[1];
90
-
91
- var customTheme = (0, _react.useContext)(_ThemeContext["default"]);
92
- var colorsTheme = (0, _react.useMemo)(function () {
93
- return (0, _utils.getCustomTheme)(_variables.theme, (0, _utils.getCustomTheme)(_variables.defaultTheme, customTheme));
94
- }, [customTheme]);
95
-
96
- var handlerCheckboxChange = function handlerCheckboxChange(checkboxValue) {
97
- if (checked === undefined) {
98
- var isChecked = checkboxValue.target.checked === undefined ? !innerChecked : checkboxValue.target.checked;
99
- setInnerChecked(isChecked);
100
-
101
- if (typeof onChange === "function") {
102
- onChange(isChecked);
103
- }
104
- } else {
105
- if (typeof onChange === "function") {
106
- onChange(!checked);
107
- }
108
- }
109
- };
110
-
111
- return _react["default"].createElement(_styledComponents.ThemeProvider, {
112
- theme: colorsTheme.checkbox
113
- }, _react["default"].createElement(CheckboxContainer, {
114
- id: name,
115
- brightness: _variables.theme,
116
- labelPosition: labelPosition,
117
- disabled: disabled,
118
- margin: margin,
119
- size: size
120
- }, _react["default"].createElement(_Checkbox["default"], {
121
- checked: checked != undefined ? checked : innerChecked,
122
- inputProps: name = {
123
- name: name
124
- },
125
- onChange: handlerCheckboxChange,
126
- value: value,
127
- disabled: disabled,
128
- disableRipple: true,
129
- className: "test"
130
- }), _react["default"].createElement(CheckboxBlackBack, {
131
- labelPosition: labelPosition,
132
- disabled: disabled,
133
- checked: checked != undefined ? checked : innerChecked
134
- }), required && _react["default"].createElement(_RequiredComponent["default"], null), label && _react["default"].createElement(LabelContainer, {
135
- labelPosition: labelPosition,
136
- onClick: disabled === true ? function (e) {} : handlerCheckboxChange,
137
- disabled: disabled,
138
- className: "labelContainer"
139
- }, label)));
140
- };
141
-
142
- var sizes = {
143
- small: "120px",
144
- medium: "240px",
145
- large: "480px",
146
- fillParent: "100%",
147
- fitContent: "unset"
148
- };
149
-
150
- var calculateWidth = function calculateWidth(margin, size) {
151
- if (size === "fillParent") {
152
- return "calc(".concat(sizes[size], " - ").concat((0, _utils.getMargin)(margin, "left"), " - ").concat((0, _utils.getMargin)(margin, "right"), ")");
153
- }
154
-
155
- return sizes[size];
156
- };
157
-
158
- var LabelContainer = _styledComponents["default"].span(_templateObject(), function (props) {
159
- return props.disabled ? "not-allowed" : "pointer";
160
- });
161
-
162
- var CheckboxContainer = _styledComponents["default"].span(_templateObject2(), function (props) {
163
- return props.margin && (0, _typeof2["default"])(props.margin) !== "object" ? _variables.spaces[props.margin] : "0px";
164
- }, function (props) {
165
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.top ? _variables.spaces[props.margin.top] : "";
166
- }, function (props) {
167
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.right ? _variables.spaces[props.margin.right] : "";
168
- }, function (props) {
169
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.bottom ? _variables.spaces[props.margin.bottom] : "";
170
- }, function (props) {
171
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.left ? _variables.spaces[props.margin.left] : "";
172
- }, function (props) {
173
- return calculateWidth(props.margin, props.size);
174
- }, function (props) {
175
- return props.disabled ? props.theme.disabled : "1";
176
- }, function (props) {
177
- return props.disabled ? "not-allowed" : "pointer";
178
- }, function (props) {
179
- return props.labelPosition === "before" ? "row-reverse" : "row";
180
- }, function (props) {
181
- return props.theme.color;
182
- }, function (props) {
183
- return props.theme.color;
184
- }, function (props) {
185
- return props.theme.color;
186
- }, function (props) {
187
- return props.theme.focusColor;
188
- }, function (props) {
189
- return props.labelPosition === "after" ? "0px" : "";
190
- }, function (props) {
191
- return props.labelPosition === "before" ? "0px" : "";
192
- }, function (props) {
193
- return props.labelPosition === "after" ? "0px" : "";
194
- }, function (props) {
195
- return props.labelPosition === "before" ? "0px" : "";
196
- }, function (props) {
197
- return props.theme.color;
198
- }, function (props) {
199
- return props.theme.color;
200
- }, function (props) {
201
- return props.theme.disabled;
202
- });
203
-
204
- var CheckboxBlackBack = _styledComponents["default"].span(_templateObject3(), function (props) {
205
- return props.checked !== true ? "transparent" : props.theme.checkColor;
206
- }, function (props) {
207
- return props.labelPosition === "before" ? "unset" : "5px";
208
- }, function (props) {
209
- return props.labelPosition === "before" ? "5px" : "unset";
210
- }, function (props) {
211
- return props.disabled ? props.theme.disabled : "1";
212
- }, function (props) {
213
- return props.labelPosition === "after" ? "0px" : "";
214
- }, function (props) {
215
- return props.labelPosition === "before" ? "0px" : "";
216
- }, function (props) {
217
- return props.labelPosition === "after" ? "0px" : "";
218
- }, function (props) {
219
- return props.labelPosition === "before" ? "0px" : "";
220
- });
221
-
222
- DxcCheckbox.propTypes = {
223
- checked: _propTypes["default"].bool,
224
- value: _propTypes["default"].any,
225
- label: _propTypes["default"].string,
226
- labelPosition: _propTypes["default"].oneOf(["after", "before", ""]),
227
- name: _propTypes["default"].string,
228
- disabled: _propTypes["default"].bool,
229
- onChange: _propTypes["default"].func,
230
- required: _propTypes["default"].bool,
231
- size: _propTypes["default"].oneOf((0, _toConsumableArray2["default"])(Object.keys(sizes))),
232
- margin: _propTypes["default"].oneOfType([_propTypes["default"].shape({
233
- top: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
234
- bottom: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
235
- left: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
236
- right: _propTypes["default"].oneOf(Object.keys(_variables.spaces))
237
- }), _propTypes["default"].oneOf((0, _toConsumableArray2["default"])(Object.keys(_variables.spaces)))])
238
- };
239
- var _default = DxcCheckbox;
240
- exports["default"] = _default;
@@ -1,144 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
-
5
- var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
6
-
7
- var _react = _interopRequireDefault(require("react"));
8
-
9
- var _react2 = require("@storybook/react");
10
-
11
- var _addonActions = require("@storybook/addon-actions");
12
-
13
- var _addonKnobs = require("@storybook/addon-knobs");
14
-
15
- var _readme = _interopRequireDefault(require("./readme.md"));
16
-
17
- var _Checkbox = _interopRequireDefault(require("./Checkbox"));
18
-
19
- var onChange = (0, _addonActions.action)("onChange");
20
-
21
- onChange.toString = function () {
22
- return "onChangeHandler";
23
- };
24
-
25
- (0, _react2.storiesOf)("Form Components|Checkbox", module).add("Component", function () {
26
- return _react["default"].createElement("div", null, _react["default"].createElement("h3", null, "Light"), _react["default"].createElement("div", null, _react["default"].createElement(_Checkbox["default"], {
27
- checked: false,
28
- theme: "light",
29
- value: "TestValue",
30
- label: "Checkbox",
31
- labelPosition: "after",
32
- onChange: onChange
33
- }), _react["default"].createElement(_Checkbox["default"], {
34
- checked: false,
35
- theme: "light",
36
- value: "TestValue",
37
- label: "Label before",
38
- labelPosition: "before",
39
- onChange: onChange
40
- }), _react["default"].createElement(_Checkbox["default"], {
41
- checked: false,
42
- theme: "light",
43
- value: "TestValue",
44
- label: "Label after",
45
- labelPosition: "after",
46
- onChange: onChange,
47
- required: true
48
- }), _react["default"].createElement(_Checkbox["default"], {
49
- checked: false,
50
- disabled: true,
51
- theme: "light",
52
- value: "TestValue",
53
- label: "Disabled unchecked",
54
- labelPosition: "after",
55
- onChange: onChange
56
- }), _react["default"].createElement(_Checkbox["default"], {
57
- checked: true,
58
- disabled: true,
59
- theme: "light",
60
- value: "TestValue",
61
- label: "Disabled checked",
62
- labelPosition: "after",
63
- onChange: onChange
64
- })), _react["default"].createElement("h3", null, "Dark"), _react["default"].createElement("div", {
65
- style: {
66
- background: "black"
67
- }
68
- }, _react["default"].createElement("div", null, _react["default"].createElement(_Checkbox["default"], {
69
- checked: false,
70
- theme: "dark",
71
- value: "TestValue",
72
- label: "Checkbox",
73
- labelPosition: "after",
74
- onChange: onChange,
75
- required: true
76
- }), _react["default"].createElement(_Checkbox["default"], {
77
- checked: false,
78
- theme: "dark",
79
- value: "TestValue",
80
- label: "Label before",
81
- labelPosition: "before",
82
- onChange: onChange
83
- }), _react["default"].createElement(_Checkbox["default"], {
84
- checked: false,
85
- theme: "dark",
86
- value: "TestValue",
87
- label: "Label after",
88
- labelPosition: "after",
89
- onChange: onChange
90
- }), _react["default"].createElement(_Checkbox["default"], {
91
- checked: false,
92
- disabled: true,
93
- theme: "dark",
94
- value: "TestValue",
95
- label: "Disabled unchecked",
96
- labelPosition: "after",
97
- onChange: onChange
98
- }), _react["default"].createElement(_Checkbox["default"], {
99
- checked: true,
100
- disabled: true,
101
- theme: "dark",
102
- value: "TestValue",
103
- label: "Disabled checked",
104
- labelPosition: "after",
105
- onChange: onChange
106
- }))));
107
- }, {
108
- notes: {
109
- markdown: _readme["default"]
110
- }
111
- });
112
-
113
- var knobProps = function knobProps() {
114
- return {
115
- label: (0, _addonKnobs.text)("Label", "Test Checkbox"),
116
- disabled: (0, _addonKnobs["boolean"])("Disabled", false),
117
- labelPosition: (0, _addonKnobs.select)("Label position", {
118
- before: "before",
119
- after: "after"
120
- }, "before"),
121
- theme: (0, _addonKnobs.select)("Theme", {
122
- light: "light",
123
- dark: "dark"
124
- }, "light"),
125
- disableRipple: (0, _addonKnobs["boolean"])("disableRipple", false),
126
- required: (0, _addonKnobs["boolean"])("Required", false)
127
- };
128
- };
129
-
130
- (0, _react2.storiesOf)("Form Components|Checkbox", module).add("Knobs example", function () {
131
- var props = knobProps();
132
- return _react["default"].createElement("div", {
133
- style: {
134
- background: props.theme === "dark" && "black" || "transparent"
135
- }
136
- }, _react["default"].createElement(_Checkbox["default"], (0, _extends2["default"])({}, props, {
137
- value: "TestValue",
138
- onChange: onChange
139
- })));
140
- }, {
141
- notes: {
142
- markdown: _readme["default"]
143
- }
144
- });
@@ -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,173 +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 _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
15
-
16
- var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
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 _templateObject4() {
33
- var data = (0, _taggedTemplateLiteral2["default"])(["\n cursor: ", ";\n margin-right: ", ";\n max-width: 24px;\n max-height: 24px;\n"]);
34
-
35
- _templateObject4 = function _templateObject4() {
36
- return data;
37
- };
38
-
39
- return data;
40
- }
41
-
42
- function _templateObject3() {
43
- var data = (0, _taggedTemplateLiteral2["default"])(["\n cursor: ", ";\n margin-left: ", ";\n max-width: 24px;\n max-height: 24px;\n"]);
44
-
45
- _templateObject3 = function _templateObject3() {
46
- return data;
47
- };
48
-
49
- return data;
50
- }
51
-
52
- function _templateObject2() {
53
- 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"]);
54
-
55
- _templateObject2 = function _templateObject2() {
56
- return data;
57
- };
58
-
59
- return data;
60
- }
61
-
62
- function _templateObject() {
63
- 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"]);
64
-
65
- _templateObject = function _templateObject() {
66
- return data;
67
- };
68
-
69
- return data;
70
- }
71
-
72
- var DxcChip = function DxcChip(_ref) {
73
- var label = _ref.label,
74
- suffixIconSrc = _ref.suffixIconSrc,
75
- onClickSuffix = _ref.onClickSuffix,
76
- prefixIconSrc = _ref.prefixIconSrc,
77
- onClickPrefix = _ref.onClickPrefix,
78
- disabled = _ref.disabled,
79
- margin = _ref.margin;
80
- var customTheme = (0, _react.useContext)(_ThemeContext["default"]);
81
- var colorsTheme = (0, _react.useMemo)(function () {
82
- return (0, _utils.getCustomTheme)(_variables.theme, (0, _utils.getCustomTheme)(_variables.defaultTheme, customTheme));
83
- }, [customTheme]);
84
- return _react["default"].createElement(_styledComponents.ThemeProvider, {
85
- theme: colorsTheme.chip
86
- }, _react["default"].createElement(StyledDxcChip, {
87
- disabled: disabled,
88
- margin: margin
89
- }, prefixIconSrc && _react["default"].createElement(PrefixIconContainer, {
90
- disabled: disabled,
91
- src: prefixIconSrc,
92
- label: label,
93
- onClick: function onClick() {
94
- return onClickPrefix && !disabled && onClickPrefix(label);
95
- }
96
- }), label && _react["default"].createElement(ChipTextContainer, {
97
- disabled: disabled,
98
- prefixIconSrc: prefixIconSrc,
99
- suffixIconSrc: suffixIconSrc
100
- }, label), suffixIconSrc && _react["default"].createElement(SuffixIconContainer, {
101
- disabled: disabled,
102
- src: suffixIconSrc,
103
- label: label,
104
- onClick: function onClick() {
105
- return onClickSuffix && !disabled && onClickSuffix(label);
106
- }
107
- })));
108
- };
109
-
110
- var StyledDxcChip = _styledComponents["default"].div(_templateObject(), function (_ref2) {
111
- var margin = _ref2.margin;
112
- return "calc(100% - 40px - ".concat((0, _utils.getMargin)(margin, "left"), " - ").concat((0, _utils.getMargin)(margin, "right"), ")");
113
- }, function (props) {
114
- return props.theme.backgroundColor;
115
- }, function (props) {
116
- return props.theme.outlinedColor !== "" ? "border: 2px solid ".concat(props.theme.outlinedColor) : "";
117
- }, function (props) {
118
- return props.theme.outlinedColor !== "" ? "18px" : "22px";
119
- }, function (_ref3) {
120
- var disabled = _ref3.disabled;
121
- return disabled && "not-allowed";
122
- }, function (props) {
123
- return props.disabled && props.theme.disabled || "initial";
124
- }, function (props) {
125
- return props.margin && (0, _typeof2["default"])(props.margin) !== "object" ? _variables.spaces[props.margin] : "0px";
126
- }, function (props) {
127
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.top ? _variables.spaces[props.margin.top] : "";
128
- }, function (props) {
129
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.right ? _variables.spaces[props.margin.right] : "";
130
- }, function (props) {
131
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.bottom ? _variables.spaces[props.margin.bottom] : "";
132
- }, function (props) {
133
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.left ? _variables.spaces[props.margin.left] : "";
134
- });
135
-
136
- var ChipTextContainer = _styledComponents["default"].span(_templateObject2(), function (props) {
137
- return props.theme.fontColor;
138
- }, function (_ref4) {
139
- var disabled = _ref4.disabled;
140
- return disabled && "not-allowed" || "default";
141
- });
142
-
143
- var SuffixIconContainer = _styledComponents["default"].img(_templateObject3(), function (_ref5) {
144
- var disabled = _ref5.disabled;
145
- return disabled && "not-allowed" || "pointer";
146
- }, function (props) {
147
- return (props.label || props.suffixIconSrc) && "10px" || props.prefixIconSrc && "5px";
148
- });
149
-
150
- var PrefixIconContainer = _styledComponents["default"].img(_templateObject4(), function (_ref6) {
151
- var disabled = _ref6.disabled;
152
- return disabled && "not-allowed" || "pointer";
153
- }, function (props) {
154
- return (props.label || props.suffixIconSrc) && "10px" || props.prefixIconSrc && "5px";
155
- });
156
-
157
- DxcChip.propTypes = {
158
- label: _propTypes["default"].string,
159
- disabled: _propTypes["default"].bool,
160
- theme: _propTypes["default"].oneOf(["dark", "light"]),
161
- suffixIconSrc: _propTypes["default"].string,
162
- prefixIconSrc: _propTypes["default"].string,
163
- onClickSuffix: _propTypes["default"].func,
164
- onClickPrefix: _propTypes["default"].func,
165
- margin: _propTypes["default"].oneOfType([_propTypes["default"].shape({
166
- top: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
167
- bottom: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
168
- left: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
169
- right: _propTypes["default"].oneOf(Object.keys(_variables.spaces))
170
- }), _propTypes["default"].oneOf((0, _toConsumableArray2["default"])(Object.keys(_variables.spaces)))])
171
- };
172
- var _default = DxcChip;
173
- 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
- }