@dxc-technology/halstack-react 0.0.0-b061aa1 → 0.0.0-b063530

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 (549) hide show
  1. package/BackgroundColorContext.d.ts +1 -0
  2. package/BackgroundColorContext.js +6 -26
  3. package/HalstackContext.d.ts +1280 -0
  4. package/HalstackContext.js +320 -0
  5. package/README.md +47 -0
  6. package/accordion/Accordion.accessibility.test.d.ts +1 -0
  7. package/accordion/Accordion.accessibility.test.js +71 -0
  8. package/accordion/Accordion.d.ts +1 -1
  9. package/accordion/Accordion.js +103 -193
  10. package/accordion/Accordion.stories.tsx +241 -0
  11. package/accordion/Accordion.test.d.ts +1 -0
  12. package/accordion/Accordion.test.js +56 -0
  13. package/accordion/types.d.ts +12 -23
  14. package/accordion-group/AccordionGroup.accessibility.test.d.ts +1 -0
  15. package/accordion-group/AccordionGroup.accessibility.test.js +82 -0
  16. package/accordion-group/AccordionGroup.d.ts +3 -3
  17. package/accordion-group/AccordionGroup.js +39 -108
  18. package/accordion-group/AccordionGroup.stories.tsx +95 -68
  19. package/accordion-group/AccordionGroup.test.d.ts +1 -0
  20. package/accordion-group/AccordionGroup.test.js +94 -0
  21. package/accordion-group/AccordionGroupAccordion.d.ts +4 -0
  22. package/accordion-group/AccordionGroupAccordion.js +31 -0
  23. package/accordion-group/AccordionGroupContext.d.ts +3 -0
  24. package/accordion-group/AccordionGroupContext.js +8 -0
  25. package/accordion-group/types.d.ts +18 -23
  26. package/action-icon/ActionIcon.accessibility.test.d.ts +1 -0
  27. package/action-icon/ActionIcon.accessibility.test.js +63 -0
  28. package/action-icon/ActionIcon.d.ts +4 -0
  29. package/action-icon/ActionIcon.js +48 -0
  30. package/action-icon/ActionIcon.stories.tsx +41 -0
  31. package/action-icon/ActionIcon.test.d.ts +1 -0
  32. package/action-icon/ActionIcon.test.js +64 -0
  33. package/action-icon/types.d.ts +26 -0
  34. package/alert/Alert.accessibility.test.d.ts +1 -0
  35. package/alert/Alert.accessibility.test.js +95 -0
  36. package/alert/Alert.js +41 -128
  37. package/alert/Alert.stories.tsx +28 -0
  38. package/alert/Alert.test.d.ts +1 -0
  39. package/alert/Alert.test.js +75 -0
  40. package/alert/types.d.ts +5 -5
  41. package/badge/Badge.accessibility.test.d.ts +1 -0
  42. package/badge/Badge.accessibility.test.js +129 -0
  43. package/badge/Badge.d.ts +4 -0
  44. package/badge/Badge.js +142 -40
  45. package/badge/Badge.stories.tsx +210 -0
  46. package/badge/Badge.test.d.ts +1 -0
  47. package/badge/Badge.test.js +30 -0
  48. package/badge/types.d.ts +54 -0
  49. package/bar-chart/BarChart.d.ts +4 -0
  50. package/bar-chart/BarChart.js +152 -0
  51. package/bar-chart/BarChart.stories.tsx +281 -0
  52. package/bar-chart/BarChart.test.d.ts +1 -0
  53. package/bar-chart/BarChart.test.js +194 -0
  54. package/bar-chart/theme.d.ts +3 -0
  55. package/bar-chart/theme.js +31 -0
  56. package/bar-chart/types.d.ts +118 -0
  57. package/bleed/Bleed.d.ts +3 -0
  58. package/bleed/Bleed.js +43 -0
  59. package/bleed/Bleed.stories.tsx +341 -0
  60. package/bleed/types.d.ts +37 -0
  61. package/bleed/types.js +5 -0
  62. package/box/Box.accessibility.test.d.ts +1 -0
  63. package/box/Box.accessibility.test.js +33 -0
  64. package/box/Box.d.ts +1 -1
  65. package/box/Box.js +31 -82
  66. package/box/Box.stories.tsx +38 -51
  67. package/box/Box.test.d.ts +1 -0
  68. package/box/Box.test.js +13 -0
  69. package/box/types.d.ts +3 -14
  70. package/breadcrumbs/Breadcrumbs.accessibility.test.d.ts +1 -0
  71. package/breadcrumbs/Breadcrumbs.accessibility.test.js +96 -0
  72. package/breadcrumbs/Breadcrumbs.d.ts +4 -0
  73. package/breadcrumbs/Breadcrumbs.js +79 -0
  74. package/breadcrumbs/Breadcrumbs.stories.tsx +194 -0
  75. package/breadcrumbs/Breadcrumbs.test.d.ts +1 -0
  76. package/breadcrumbs/Breadcrumbs.test.js +168 -0
  77. package/breadcrumbs/Item.d.ts +4 -0
  78. package/breadcrumbs/Item.js +52 -0
  79. package/breadcrumbs/dropdownTheme.d.ts +53 -0
  80. package/breadcrumbs/dropdownTheme.js +62 -0
  81. package/breadcrumbs/types.d.ts +40 -0
  82. package/breadcrumbs/types.js +5 -0
  83. package/bulleted-list/BulletedList.accessibility.test.d.ts +1 -0
  84. package/bulleted-list/BulletedList.accessibility.test.js +119 -0
  85. package/bulleted-list/BulletedList.d.ts +7 -0
  86. package/bulleted-list/BulletedList.js +92 -0
  87. package/bulleted-list/BulletedList.stories.tsx +115 -0
  88. package/bulleted-list/types.d.ts +38 -0
  89. package/bulleted-list/types.js +5 -0
  90. package/button/Button.accessibility.test.d.ts +1 -0
  91. package/button/Button.accessibility.test.js +127 -0
  92. package/button/Button.d.ts +1 -1
  93. package/button/Button.js +65 -123
  94. package/button/Button.stories.tsx +155 -106
  95. package/button/Button.test.d.ts +1 -0
  96. package/button/Button.test.js +38 -0
  97. package/button/types.d.ts +12 -12
  98. package/card/Card.accessibility.test.d.ts +1 -0
  99. package/card/Card.accessibility.test.js +36 -0
  100. package/card/Card.d.ts +1 -1
  101. package/card/Card.js +60 -103
  102. package/card/Card.stories.tsx +14 -44
  103. package/card/Card.test.d.ts +1 -0
  104. package/card/Card.test.js +39 -0
  105. package/card/types.d.ts +6 -11
  106. package/checkbox/Checkbox.accessibility.test.d.ts +1 -0
  107. package/checkbox/Checkbox.accessibility.test.js +87 -0
  108. package/checkbox/Checkbox.d.ts +2 -2
  109. package/checkbox/Checkbox.js +141 -182
  110. package/checkbox/Checkbox.stories.tsx +166 -136
  111. package/checkbox/Checkbox.test.d.ts +1 -0
  112. package/checkbox/Checkbox.test.js +199 -0
  113. package/checkbox/types.d.ts +19 -7
  114. package/chip/Chip.accessibility.test.d.ts +1 -0
  115. package/chip/Chip.accessibility.test.js +67 -0
  116. package/chip/Chip.d.ts +1 -1
  117. package/chip/Chip.js +51 -124
  118. package/chip/Chip.stories.tsx +105 -31
  119. package/chip/Chip.test.d.ts +1 -0
  120. package/chip/Chip.test.js +41 -0
  121. package/chip/types.d.ts +10 -18
  122. package/common/coreTokens.d.ts +236 -0
  123. package/common/coreTokens.js +183 -0
  124. package/common/utils.d.ts +1 -0
  125. package/common/utils.js +6 -12
  126. package/common/variables.d.ts +1432 -0
  127. package/common/variables.js +1117 -1397
  128. package/container/Container.d.ts +4 -0
  129. package/container/Container.js +194 -0
  130. package/container/Container.stories.tsx +214 -0
  131. package/container/types.d.ts +176 -0
  132. package/container/types.js +5 -0
  133. package/contextual-menu/ContextualMenu.accessibility.test.d.ts +1 -0
  134. package/contextual-menu/ContextualMenu.accessibility.test.js +98 -0
  135. package/contextual-menu/ContextualMenu.d.ts +5 -0
  136. package/contextual-menu/ContextualMenu.js +136 -0
  137. package/contextual-menu/ContextualMenu.stories.tsx +231 -0
  138. package/contextual-menu/ContextualMenu.test.d.ts +1 -0
  139. package/contextual-menu/ContextualMenu.test.js +247 -0
  140. package/contextual-menu/GroupItem.d.ts +4 -0
  141. package/contextual-menu/GroupItem.js +67 -0
  142. package/contextual-menu/ItemAction.d.ts +4 -0
  143. package/contextual-menu/ItemAction.js +88 -0
  144. package/contextual-menu/MenuItem.d.ts +4 -0
  145. package/contextual-menu/MenuItem.js +29 -0
  146. package/contextual-menu/SingleItem.d.ts +4 -0
  147. package/contextual-menu/SingleItem.js +38 -0
  148. package/contextual-menu/types.d.ts +65 -0
  149. package/contextual-menu/types.js +5 -0
  150. package/date-input/Calendar.d.ts +4 -0
  151. package/date-input/Calendar.js +230 -0
  152. package/date-input/DateInput.accessibility.test.d.ts +1 -0
  153. package/date-input/DateInput.accessibility.test.js +229 -0
  154. package/date-input/DateInput.js +181 -314
  155. package/date-input/DateInput.stories.tsx +210 -57
  156. package/date-input/DateInput.test.d.ts +1 -0
  157. package/date-input/DateInput.test.js +808 -0
  158. package/date-input/DatePicker.d.ts +4 -0
  159. package/date-input/DatePicker.js +121 -0
  160. package/date-input/YearPicker.d.ts +4 -0
  161. package/date-input/YearPicker.js +105 -0
  162. package/date-input/types.d.ts +86 -22
  163. package/dialog/Dialog.accessibility.test.d.ts +1 -0
  164. package/dialog/Dialog.accessibility.test.js +69 -0
  165. package/dialog/Dialog.d.ts +1 -1
  166. package/dialog/Dialog.js +57 -129
  167. package/dialog/Dialog.stories.tsx +324 -167
  168. package/dialog/Dialog.test.d.ts +1 -0
  169. package/dialog/Dialog.test.js +370 -0
  170. package/dialog/types.d.ts +18 -25
  171. package/divider/Divider.accessibility.test.d.ts +1 -0
  172. package/divider/Divider.accessibility.test.js +33 -0
  173. package/divider/Divider.d.ts +4 -0
  174. package/divider/Divider.js +36 -0
  175. package/divider/Divider.stories.tsx +224 -0
  176. package/divider/Divider.test.d.ts +1 -0
  177. package/divider/Divider.test.js +38 -0
  178. package/divider/types.d.ts +21 -0
  179. package/divider/types.js +5 -0
  180. package/dropdown/Dropdown.accessibility.test.d.ts +1 -0
  181. package/dropdown/Dropdown.accessibility.test.js +183 -0
  182. package/dropdown/Dropdown.d.ts +1 -1
  183. package/dropdown/Dropdown.js +233 -330
  184. package/dropdown/Dropdown.stories.tsx +427 -0
  185. package/dropdown/Dropdown.test.d.ts +1 -0
  186. package/dropdown/Dropdown.test.js +628 -0
  187. package/dropdown/DropdownMenu.d.ts +4 -0
  188. package/dropdown/DropdownMenu.js +63 -0
  189. package/dropdown/DropdownMenuItem.d.ts +4 -0
  190. package/dropdown/DropdownMenuItem.js +71 -0
  191. package/dropdown/types.d.ts +37 -30
  192. package/file-input/FileInput.accessibility.test.d.ts +1 -0
  193. package/file-input/FileInput.accessibility.test.js +167 -0
  194. package/file-input/FileInput.d.ts +2 -2
  195. package/file-input/FileInput.js +264 -337
  196. package/file-input/FileInput.stories.tsx +618 -0
  197. package/file-input/FileInput.test.d.ts +1 -0
  198. package/file-input/FileInput.test.js +404 -0
  199. package/file-input/FileItem.d.ts +4 -14
  200. package/file-input/FileItem.js +63 -122
  201. package/file-input/types.d.ts +52 -14
  202. package/flex/Flex.d.ts +4 -0
  203. package/flex/Flex.js +57 -0
  204. package/flex/Flex.stories.tsx +112 -0
  205. package/flex/types.d.ts +97 -0
  206. package/flex/types.js +5 -0
  207. package/footer/Footer.accessibility.test.d.ts +1 -0
  208. package/footer/Footer.accessibility.test.js +125 -0
  209. package/footer/Footer.d.ts +1 -1
  210. package/footer/Footer.js +74 -200
  211. package/footer/{Footer.stories.jsx → Footer.stories.tsx} +96 -39
  212. package/footer/Footer.test.d.ts +1 -0
  213. package/footer/Footer.test.js +85 -0
  214. package/footer/Icons.d.ts +3 -0
  215. package/footer/Icons.js +54 -23
  216. package/footer/types.d.ts +26 -31
  217. package/grid/Grid.d.ts +7 -0
  218. package/grid/Grid.js +76 -0
  219. package/grid/Grid.stories.tsx +221 -0
  220. package/grid/types.d.ts +115 -0
  221. package/grid/types.js +5 -0
  222. package/header/Header.accessibility.test.d.ts +1 -0
  223. package/header/Header.accessibility.test.js +94 -0
  224. package/header/Header.d.ts +4 -3
  225. package/header/Header.js +105 -219
  226. package/header/Header.stories.tsx +169 -64
  227. package/header/Header.test.d.ts +1 -0
  228. package/header/Header.test.js +66 -0
  229. package/header/Icons.d.ts +2 -0
  230. package/header/Icons.js +5 -15
  231. package/header/types.d.ts +7 -21
  232. package/heading/Heading.accessibility.test.d.ts +1 -0
  233. package/heading/Heading.accessibility.test.js +33 -0
  234. package/heading/Heading.js +11 -33
  235. package/heading/Heading.stories.tsx +3 -2
  236. package/heading/Heading.test.d.ts +1 -0
  237. package/heading/Heading.test.js +156 -0
  238. package/heading/types.d.ts +7 -7
  239. package/icon/Icon.accessibility.test.d.ts +1 -0
  240. package/icon/Icon.accessibility.test.js +30 -0
  241. package/icon/Icon.d.ts +4 -0
  242. package/icon/Icon.js +33 -0
  243. package/icon/Icon.stories.tsx +28 -0
  244. package/icon/types.d.ts +4 -0
  245. package/icon/types.js +5 -0
  246. package/image/Image.accessibility.test.d.ts +1 -0
  247. package/image/Image.accessibility.test.js +56 -0
  248. package/image/Image.d.ts +4 -0
  249. package/image/Image.js +70 -0
  250. package/image/Image.stories.tsx +129 -0
  251. package/image/types.d.ts +72 -0
  252. package/image/types.js +5 -0
  253. package/inset/Inset.d.ts +3 -0
  254. package/inset/Inset.js +43 -0
  255. package/inset/Inset.stories.tsx +230 -0
  256. package/inset/types.d.ts +37 -0
  257. package/inset/types.js +5 -0
  258. package/layout/ApplicationLayout.d.ts +16 -6
  259. package/layout/ApplicationLayout.js +88 -175
  260. package/layout/ApplicationLayout.stories.tsx +162 -0
  261. package/layout/Icons.d.ts +7 -0
  262. package/layout/Icons.js +41 -48
  263. package/layout/types.d.ts +19 -35
  264. package/link/Link.accessibility.test.d.ts +1 -0
  265. package/link/Link.accessibility.test.js +108 -0
  266. package/link/Link.d.ts +3 -2
  267. package/link/Link.js +65 -109
  268. package/link/Link.stories.tsx +161 -54
  269. package/link/Link.test.d.ts +1 -0
  270. package/link/Link.test.js +63 -0
  271. package/link/types.d.ts +15 -35
  272. package/main.d.ts +21 -14
  273. package/main.js +106 -98
  274. package/nav-tabs/NavTabs.accessibility.test.d.ts +1 -0
  275. package/nav-tabs/NavTabs.accessibility.test.js +44 -0
  276. package/nav-tabs/NavTabs.d.ts +7 -0
  277. package/nav-tabs/NavTabs.js +108 -0
  278. package/nav-tabs/NavTabs.stories.tsx +294 -0
  279. package/nav-tabs/NavTabs.test.d.ts +1 -0
  280. package/nav-tabs/NavTabs.test.js +77 -0
  281. package/nav-tabs/NavTabsContext.d.ts +3 -0
  282. package/nav-tabs/NavTabsContext.js +8 -0
  283. package/nav-tabs/Tab.d.ts +4 -0
  284. package/nav-tabs/Tab.js +117 -0
  285. package/nav-tabs/types.d.ts +52 -0
  286. package/nav-tabs/types.js +5 -0
  287. package/number-input/NumberInput.accessibility.test.d.ts +1 -0
  288. package/number-input/NumberInput.accessibility.test.js +227 -0
  289. package/number-input/NumberInput.js +52 -49
  290. package/number-input/NumberInput.stories.tsx +39 -28
  291. package/number-input/NumberInput.test.d.ts +1 -0
  292. package/number-input/NumberInput.test.js +988 -0
  293. package/number-input/NumberInputContext.d.ts +3 -4
  294. package/number-input/NumberInputContext.js +3 -14
  295. package/number-input/types.d.ts +34 -15
  296. package/package.json +59 -52
  297. package/paginator/Paginator.accessibility.test.d.ts +1 -0
  298. package/paginator/Paginator.accessibility.test.js +78 -0
  299. package/paginator/Paginator.js +47 -107
  300. package/paginator/Paginator.stories.tsx +24 -0
  301. package/paginator/Paginator.test.d.ts +1 -0
  302. package/paginator/Paginator.test.js +334 -0
  303. package/paginator/types.d.ts +3 -3
  304. package/paragraph/Paragraph.accessibility.test.d.ts +1 -0
  305. package/paragraph/Paragraph.accessibility.test.js +28 -0
  306. package/paragraph/Paragraph.d.ts +5 -0
  307. package/paragraph/Paragraph.js +22 -0
  308. package/paragraph/Paragraph.stories.tsx +27 -0
  309. package/password-input/PasswordInput.accessibility.test.d.ts +1 -0
  310. package/password-input/PasswordInput.accessibility.test.js +152 -0
  311. package/password-input/PasswordInput.js +63 -127
  312. package/password-input/PasswordInput.stories.tsx +13 -36
  313. package/password-input/PasswordInput.test.d.ts +1 -0
  314. package/password-input/PasswordInput.test.js +197 -0
  315. package/password-input/types.d.ts +21 -17
  316. package/progress-bar/ProgressBar.accessibility.test.d.ts +1 -0
  317. package/progress-bar/ProgressBar.accessibility.test.js +35 -0
  318. package/progress-bar/ProgressBar.js +69 -93
  319. package/progress-bar/ProgressBar.stories.tsx +93 -0
  320. package/progress-bar/ProgressBar.test.d.ts +1 -0
  321. package/progress-bar/ProgressBar.test.js +93 -0
  322. package/progress-bar/types.d.ts +3 -3
  323. package/quick-nav/QuickNav.accessibility.test.d.ts +1 -0
  324. package/quick-nav/QuickNav.accessibility.test.js +57 -0
  325. package/quick-nav/QuickNav.d.ts +4 -0
  326. package/quick-nav/QuickNav.js +94 -0
  327. package/quick-nav/QuickNav.stories.tsx +356 -0
  328. package/quick-nav/types.d.ts +21 -0
  329. package/quick-nav/types.js +5 -0
  330. package/radio-group/Radio.d.ts +4 -0
  331. package/radio-group/Radio.js +121 -0
  332. package/radio-group/RadioGroup.accessibility.test.d.ts +1 -0
  333. package/radio-group/RadioGroup.accessibility.test.js +97 -0
  334. package/radio-group/RadioGroup.d.ts +4 -0
  335. package/radio-group/RadioGroup.js +233 -0
  336. package/radio-group/RadioGroup.stories.tsx +214 -0
  337. package/radio-group/RadioGroup.test.d.ts +1 -0
  338. package/radio-group/RadioGroup.test.js +754 -0
  339. package/radio-group/types.d.ts +114 -0
  340. package/radio-group/types.js +5 -0
  341. package/resultset-table/Icons.d.ts +7 -0
  342. package/resultset-table/Icons.js +47 -0
  343. package/resultset-table/ResultsetTable.accessibility.test.d.ts +1 -0
  344. package/resultset-table/ResultsetTable.accessibility.test.js +284 -0
  345. package/resultset-table/ResultsetTable.d.ts +7 -0
  346. package/resultset-table/ResultsetTable.js +195 -0
  347. package/resultset-table/ResultsetTable.stories.tsx +413 -0
  348. package/resultset-table/ResultsetTable.test.d.ts +1 -0
  349. package/resultset-table/ResultsetTable.test.js +450 -0
  350. package/{resultsetTable → resultset-table}/types.d.ts +45 -11
  351. package/resultset-table/types.js +5 -0
  352. package/select/Listbox.d.ts +4 -0
  353. package/select/Listbox.js +151 -0
  354. package/select/Option.d.ts +4 -0
  355. package/select/Option.js +89 -0
  356. package/select/Select.accessibility.test.d.ts +1 -0
  357. package/select/Select.accessibility.test.js +227 -0
  358. package/select/Select.d.ts +4 -0
  359. package/select/Select.js +251 -514
  360. package/select/Select.stories.tsx +611 -255
  361. package/select/Select.test.d.ts +1 -0
  362. package/select/Select.test.js +2168 -0
  363. package/select/types.d.ts +209 -0
  364. package/select/types.js +5 -0
  365. package/sidenav/Sidenav.accessibility.test.d.ts +1 -0
  366. package/sidenav/Sidenav.accessibility.test.js +59 -0
  367. package/sidenav/Sidenav.d.ts +6 -5
  368. package/sidenav/Sidenav.js +137 -72
  369. package/sidenav/Sidenav.stories.tsx +246 -134
  370. package/sidenav/Sidenav.test.d.ts +1 -0
  371. package/sidenav/Sidenav.test.js +37 -0
  372. package/sidenav/SidenavContext.d.ts +5 -0
  373. package/sidenav/SidenavContext.js +13 -0
  374. package/sidenav/types.d.ts +52 -26
  375. package/slider/Slider.accessibility.test.d.ts +1 -0
  376. package/slider/Slider.accessibility.test.js +103 -0
  377. package/slider/Slider.d.ts +2 -2
  378. package/slider/Slider.js +148 -182
  379. package/slider/Slider.stories.tsx +68 -65
  380. package/slider/Slider.test.d.ts +1 -0
  381. package/slider/Slider.test.js +256 -0
  382. package/slider/types.d.ts +11 -3
  383. package/spinner/Spinner.accessibility.test.d.ts +1 -0
  384. package/spinner/Spinner.accessibility.test.js +96 -0
  385. package/spinner/Spinner.d.ts +1 -1
  386. package/spinner/Spinner.js +51 -110
  387. package/spinner/{Spinner.stories.jsx → Spinner.stories.tsx} +53 -26
  388. package/spinner/Spinner.test.d.ts +1 -0
  389. package/spinner/Spinner.test.js +55 -0
  390. package/spinner/types.d.ts +3 -3
  391. package/status-light/StatusLight.accessibility.test.d.ts +1 -0
  392. package/status-light/StatusLight.accessibility.test.js +157 -0
  393. package/status-light/StatusLight.d.ts +4 -0
  394. package/status-light/StatusLight.js +51 -0
  395. package/status-light/StatusLight.stories.tsx +74 -0
  396. package/status-light/StatusLight.test.d.ts +1 -0
  397. package/status-light/StatusLight.test.js +25 -0
  398. package/status-light/types.d.ts +17 -0
  399. package/status-light/types.js +5 -0
  400. package/switch/Switch.accessibility.test.d.ts +1 -0
  401. package/switch/Switch.accessibility.test.js +98 -0
  402. package/switch/Switch.d.ts +2 -2
  403. package/switch/Switch.js +147 -115
  404. package/switch/Switch.stories.tsx +57 -68
  405. package/switch/Switch.test.d.ts +1 -0
  406. package/switch/Switch.test.js +180 -0
  407. package/switch/types.d.ts +13 -5
  408. package/table/DropdownTheme.js +62 -0
  409. package/table/Table.accessibility.test.d.ts +1 -0
  410. package/table/Table.accessibility.test.js +92 -0
  411. package/table/Table.d.ts +6 -2
  412. package/table/Table.js +79 -36
  413. package/table/Table.stories.tsx +663 -0
  414. package/table/Table.test.d.ts +1 -0
  415. package/table/Table.test.js +111 -0
  416. package/table/types.d.ts +34 -6
  417. package/tabs/Tab.d.ts +4 -0
  418. package/tabs/Tab.js +117 -0
  419. package/tabs/Tabs.accessibility.test.d.ts +1 -0
  420. package/tabs/Tabs.accessibility.test.js +56 -0
  421. package/tabs/Tabs.d.ts +1 -1
  422. package/tabs/Tabs.js +307 -147
  423. package/tabs/Tabs.stories.tsx +127 -18
  424. package/tabs/Tabs.test.d.ts +1 -0
  425. package/tabs/Tabs.test.js +276 -0
  426. package/tabs/types.d.ts +46 -24
  427. package/tag/Tag.accessibility.test.d.ts +1 -0
  428. package/tag/Tag.accessibility.test.js +69 -0
  429. package/tag/Tag.d.ts +1 -1
  430. package/tag/Tag.js +44 -86
  431. package/tag/Tag.stories.tsx +38 -31
  432. package/tag/Tag.test.d.ts +1 -0
  433. package/tag/Tag.test.js +41 -0
  434. package/tag/types.d.ts +25 -16
  435. package/text-input/Suggestion.d.ts +4 -0
  436. package/text-input/Suggestion.js +67 -0
  437. package/text-input/Suggestions.d.ts +4 -0
  438. package/text-input/Suggestions.js +94 -0
  439. package/text-input/TextInput.accessibility.test.d.ts +1 -0
  440. package/text-input/TextInput.accessibility.test.js +320 -0
  441. package/text-input/TextInput.js +335 -552
  442. package/text-input/TextInput.stories.tsx +292 -271
  443. package/text-input/TextInput.test.d.ts +1 -0
  444. package/text-input/TextInput.test.js +1755 -0
  445. package/text-input/types.d.ts +71 -25
  446. package/textarea/Textarea.accessibility.test.d.ts +1 -0
  447. package/textarea/Textarea.accessibility.test.js +155 -0
  448. package/textarea/Textarea.d.ts +4 -0
  449. package/textarea/Textarea.js +92 -173
  450. package/textarea/Textarea.stories.tsx +174 -0
  451. package/textarea/Textarea.test.d.ts +1 -0
  452. package/textarea/Textarea.test.js +406 -0
  453. package/textarea/types.d.ts +141 -0
  454. package/textarea/types.js +5 -0
  455. package/toggle-group/ToggleGroup.accessibility.test.d.ts +1 -0
  456. package/toggle-group/ToggleGroup.accessibility.test.js +107 -0
  457. package/toggle-group/ToggleGroup.d.ts +2 -2
  458. package/toggle-group/ToggleGroup.js +96 -114
  459. package/toggle-group/ToggleGroup.stories.tsx +80 -40
  460. package/toggle-group/ToggleGroup.test.d.ts +1 -0
  461. package/toggle-group/ToggleGroup.test.js +137 -0
  462. package/toggle-group/types.d.ts +67 -37
  463. package/tooltip/Tooltip.accessibility.test.d.ts +1 -0
  464. package/tooltip/Tooltip.accessibility.test.js +144 -0
  465. package/tooltip/Tooltip.d.ts +4 -0
  466. package/tooltip/Tooltip.js +50 -0
  467. package/tooltip/Tooltip.stories.tsx +111 -0
  468. package/tooltip/Tooltip.test.d.ts +1 -0
  469. package/tooltip/Tooltip.test.js +112 -0
  470. package/tooltip/types.d.ts +16 -0
  471. package/tooltip/types.js +5 -0
  472. package/typography/Typography.accessibility.test.d.ts +1 -0
  473. package/typography/Typography.accessibility.test.js +339 -0
  474. package/typography/Typography.d.ts +4 -0
  475. package/typography/Typography.js +23 -0
  476. package/typography/Typography.stories.tsx +196 -0
  477. package/typography/Typography.test.js +23 -0
  478. package/typography/types.d.ts +18 -0
  479. package/typography/types.js +5 -0
  480. package/useTheme.d.ts +1168 -0
  481. package/useTheme.js +4 -11
  482. package/useTranslatedLabels.d.ts +96 -0
  483. package/useTranslatedLabels.js +14 -0
  484. package/utils/BaseTypography.d.ts +21 -0
  485. package/utils/BaseTypography.js +98 -0
  486. package/utils/FocusLock.d.ts +13 -0
  487. package/utils/FocusLock.js +125 -0
  488. package/wizard/Wizard.accessibility.test.d.ts +1 -0
  489. package/wizard/Wizard.accessibility.test.js +55 -0
  490. package/wizard/Wizard.d.ts +1 -1
  491. package/wizard/Wizard.js +122 -114
  492. package/wizard/{Wizard.stories.jsx → Wizard.stories.tsx} +68 -20
  493. package/wizard/Wizard.test.d.ts +1 -0
  494. package/wizard/Wizard.test.js +114 -0
  495. package/wizard/types.d.ts +15 -15
  496. package/ThemeContext.js +0 -246
  497. package/V3Select/V3Select.js +0 -455
  498. package/V3Select/index.d.ts +0 -27
  499. package/V3Textarea/V3Textarea.js +0 -260
  500. package/V3Textarea/index.d.ts +0 -27
  501. package/card/ice-cream.jpg +0 -0
  502. package/common/OpenSans.css +0 -81
  503. package/common/RequiredComponent.js +0 -32
  504. package/common/fonts/OpenSans-Bold.ttf +0 -0
  505. package/common/fonts/OpenSans-BoldItalic.ttf +0 -0
  506. package/common/fonts/OpenSans-ExtraBold.ttf +0 -0
  507. package/common/fonts/OpenSans-ExtraBoldItalic.ttf +0 -0
  508. package/common/fonts/OpenSans-Italic.ttf +0 -0
  509. package/common/fonts/OpenSans-Light.ttf +0 -0
  510. package/common/fonts/OpenSans-LightItalic.ttf +0 -0
  511. package/common/fonts/OpenSans-Regular.ttf +0 -0
  512. package/common/fonts/OpenSans-SemiBold.ttf +0 -0
  513. package/common/fonts/OpenSans-SemiBoldItalic.ttf +0 -0
  514. package/date/Date.js +0 -373
  515. package/date/index.d.ts +0 -27
  516. package/input-text/Icons.js +0 -22
  517. package/input-text/InputText.js +0 -611
  518. package/input-text/index.d.ts +0 -36
  519. package/number-input/numberInputContextTypes.d.ts +0 -19
  520. package/paginator/Icons.js +0 -66
  521. package/progress-bar/ProgressBar.stories.jsx +0 -58
  522. package/radio/Radio.d.ts +0 -4
  523. package/radio/Radio.js +0 -174
  524. package/radio/Radio.stories.tsx +0 -192
  525. package/radio/types.d.ts +0 -54
  526. package/resultsetTable/ResultsetTable.d.ts +0 -4
  527. package/resultsetTable/ResultsetTable.js +0 -251
  528. package/select/index.d.ts +0 -131
  529. package/table/Table.stories.jsx +0 -276
  530. package/textarea/Textarea.stories.jsx +0 -135
  531. package/textarea/index.d.ts +0 -127
  532. package/toggle/Toggle.js +0 -186
  533. package/toggle/index.d.ts +0 -21
  534. package/upload/Upload.js +0 -201
  535. package/upload/buttons-upload/ButtonsUpload.js +0 -111
  536. package/upload/buttons-upload/Icons.js +0 -40
  537. package/upload/dragAndDropArea/DragAndDropArea.js +0 -225
  538. package/upload/dragAndDropArea/Icons.js +0 -39
  539. package/upload/file-upload/FileToUpload.js +0 -115
  540. package/upload/file-upload/Icons.js +0 -66
  541. package/upload/files-upload/FilesToUpload.js +0 -109
  542. package/upload/index.d.ts +0 -15
  543. package/upload/transaction/Icons.js +0 -160
  544. package/upload/transaction/Transaction.js +0 -104
  545. package/upload/transactions/Transactions.js +0 -94
  546. package/wizard/Icons.js +0 -65
  547. /package/{radio → action-icon}/types.js +0 -0
  548. /package/{resultsetTable → badge}/types.js +0 -0
  549. /package/{number-input/numberInputContextTypes.js → bar-chart/types.js} +0 -0
@@ -1,135 +0,0 @@
1
- import React from "react";
2
- import DxcTextarea from "./Textarea";
3
- import Title from "../../.storybook/components/Title";
4
- import ExampleContainer from "../../.storybook/components/ExampleContainer";
5
- import { BackgroundColorProvider } from "../BackgroundColorContext";
6
- import DarkContainer from "../../.storybook/components/DarkSection";
7
-
8
- export default {
9
- title: "Textarea",
10
- component: DxcTextarea,
11
- };
12
-
13
- export const Chromatic = () => (
14
- <>
15
- <>
16
- <ExampleContainer pseudoState="pseudo-hover">
17
- <Title title="Hovered" theme="light" level={4} />
18
- <DxcTextarea label="Hovered" />
19
- </ExampleContainer>
20
- <ExampleContainer pseudoState="pseudo-focus">
21
- <Title title="Focused" theme="light" level={4} />
22
- <DxcTextarea label="Focused" />
23
- </ExampleContainer>
24
- <ExampleContainer>
25
- <Title title="Disabled" theme="light" level={4} />
26
- <DxcTextarea
27
- label="Disabled"
28
- optional
29
- helperText="Sample text"
30
- placeholder="Enter your text here..."
31
- disabled
32
- />
33
- </ExampleContainer>
34
- <ExampleContainer>
35
- <Title title="Disabled with value" theme="light" level={4} />
36
- <DxcTextarea label="Disabled" value="Example text" disabled />
37
- </ExampleContainer>
38
- <ExampleContainer>
39
- <Title title="With error" theme="light" level={4} />
40
- <DxcTextarea
41
- label="Textarea with error"
42
- helperText="Helper text"
43
- placeholder="Enter your text here..."
44
- error="Error message"
45
- />
46
- </ExampleContainer>
47
- <ExampleContainer>
48
- <Title title="Helper text and optional with value" theme="light" level={4} />
49
- <DxcTextarea label="Helper & optional" value="Some text" helperText="Sample text" optional />
50
- </ExampleContainer>
51
- <ExampleContainer>
52
- <Title title="Resizable" theme="light" level={4} />
53
- <DxcTextarea label="With resizer" helperText="Helper text" verticalGrow="manual" />
54
- </ExampleContainer>
55
- <ExampleContainer>
56
- <Title title="Grow manual" theme="light" level={4} />
57
- <DxcTextarea
58
- label="Manual vertical grow"
59
- verticalGrow="manual"
60
- value="Long textttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttttt"
61
- />
62
- </ExampleContainer>
63
- </>
64
- <BackgroundColorProvider color="#333333">
65
- <DarkContainer>
66
- <>
67
- <Title title="Helper text and optional with value" theme="dark" level={4} />
68
- <DxcTextarea label="Helper & optional" value="Some text" margin="medium" helperText="Sample text" optional />
69
-
70
- <Title title="Disabled" theme="dark" level={4} />
71
- <DxcTextarea
72
- label="Disabled"
73
- margin="medium"
74
- optional
75
- helperText="Sample text"
76
- placeholder="Enter your text here..."
77
- disabled
78
- />
79
- <Title title="Disabled with value" theme="dark" level={4} />
80
- <DxcTextarea label="Disabled" margin="medium" value="Example text" disabled />
81
- <Title title="With error" theme="dark" level={4} />
82
- <DxcTextarea
83
- label="Textarea with error"
84
- margin="medium"
85
- helperText="Helper text"
86
- placeholder="Enter your text here..."
87
- error="Error message"
88
- />
89
- </>
90
- </DarkContainer>
91
- </BackgroundColorProvider>
92
- <Title title="Sizes" theme="light" level={2} />
93
- <ExampleContainer>
94
- <DxcTextarea label="Small" size="small" />
95
- </ExampleContainer>
96
- <ExampleContainer>
97
- <DxcTextarea label="Medium" size="medium" />
98
- </ExampleContainer>
99
- <ExampleContainer>
100
- <DxcTextarea label="Large" size="large" />
101
- </ExampleContainer>
102
- <ExampleContainer>
103
- <DxcTextarea label="Fill parent" size="fillParent" />
104
- </ExampleContainer>
105
- <Title title="Margins" theme="light" level={2} />
106
- <ExampleContainer>
107
- <Title title="Xxsmall margin" theme="light" level={4} />
108
- <DxcTextarea label="Xxsmmall" margin="xxsmall" />
109
- </ExampleContainer>
110
- <ExampleContainer>
111
- <Title title="Xsmall margin" theme="light" level={4} />
112
- <DxcTextarea label="xsmmall" margin="xsmall" />
113
- </ExampleContainer>
114
- <ExampleContainer>
115
- <Title title="Small margin" theme="light" level={4} />
116
- <DxcTextarea label="smmall" margin="small" />
117
- </ExampleContainer>
118
- <ExampleContainer>
119
- <Title title="Medium margin" theme="light" level={4} />
120
- <DxcTextarea label="medium" margin="medium" />
121
- </ExampleContainer>
122
- <ExampleContainer>
123
- <Title title="Large margin" theme="light" level={4} />
124
- <DxcTextarea label="Large" margin="large" />
125
- </ExampleContainer>
126
- <ExampleContainer>
127
- <Title title="Xlarge margin" theme="light" level={4} />
128
- <DxcTextarea label="Xlarge" margin="xlarge" />
129
- </ExampleContainer>
130
- <ExampleContainer>
131
- <Title title="Xxlarge margin" theme="light" level={4} />
132
- <DxcTextarea label="Xxlarge" margin="xxlarge" />
133
- </ExampleContainer>
134
- </>
135
- );
@@ -1,127 +0,0 @@
1
- type Size = "small" | "medium" | "large" | "fillParent";
2
- type Space = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
3
- type Margin = {
4
- top?: Space;
5
- bottom?: Space;
6
- left?: Space;
7
- right?: Space;
8
- };
9
-
10
- type Props = {
11
- /**
12
- * Text to be placed above the textarea.
13
- */
14
- label?: string;
15
- /**
16
- * Name attribute of the textarea element.
17
- */
18
- name?: string;
19
- /**
20
- * Value of the textarea. If undefined, the component will be uncontrolled and the value will be managed internally.
21
- */
22
- value?: string;
23
- /**
24
- * Helper text to be placed above the textarea.
25
- */
26
- helperText?: string;
27
- /**
28
- * Text to be put as placeholder of the textarea.
29
- */
30
- placeholder?: string;
31
- /**
32
- * If true, the component will be disabled.
33
- */
34
- disabled?: boolean;
35
- /**
36
- * If true, the textarea will be optional, showing '(Optional)'
37
- * next to the label. Otherwise, the field will be considered required
38
- * and an error will be passed as a parameter to the OnBlur and onChange functions
39
- * when it has not been filled.
40
- */
41
- optional?: boolean;
42
- /**
43
- * Defines the textarea's ability to resize vertically. It can be:
44
- * - 'auto': The textarea grows or shrinks automatically in order to fit the content.
45
- * - 'manual': The height of the textarea is enabled to be manually modified.
46
- * - 'none': The textarea has a fixed height and can't be modified.
47
- */
48
- verticalGrow?: "auto" | "manual" | "none";
49
- /**
50
- * Number of rows of the textarea.
51
- */
52
- rows?: number;
53
- /**
54
- * This function will be called when the user types within the textarea.
55
- * An object including the current value and the error (if the value
56
- * entered is not valid) will be passed to this function.
57
- * If there is no error, error will be null.
58
- */
59
- onChange?: (val: { value: string; error: string }) => void;
60
- /**
61
- * This function will be called when the textarea loses the focus. An
62
- * object including the textarea value and the error (if the value entered
63
- * is not valid) will be passed to this function. If there is no error,
64
- * error will be null.
65
- */
66
- onBlur?: (val: { value: string; error: string }) => void;
67
- /**
68
- * If it is defined, the component will change its appearance, showing
69
- * the error below the textarea. If it is not defined, the error
70
- * messages will be managed internally, but never displayed on its own.
71
- */
72
- error?: string;
73
- /**
74
- * Regular expression that defines the valid format allowed by the
75
- * textarea. This will be checked both when the textarea loses the focus
76
- * and while typing within it. If the string entered does not match the
77
- * pattern, the onBlur and onChange functions will be called with the
78
- * current value and an internal error informing that this value does not
79
- * match the pattern. If the pattern is met, the error parameter of both
80
- * events will be null.
81
- */
82
- pattern?: string;
83
- /**
84
- * Specifies the minimun length allowed by the textarea.
85
- * This will be checked both when the textarea loses the
86
- * focus and while typing within it. If the string entered does not
87
- * comply the minimum length, the onBlur and onChange functions will be called
88
- * with the current value and an internal error informing that the value
89
- * length does not comply the specified range. If a valid length is
90
- * reached, the error parameter of both events will be null.
91
- */
92
- minLength?: number;
93
- /**
94
- * Specifies the maximum length allowed by the textarea.
95
- * This will be checked both when the textarea loses the
96
- * focus and while typing within it. If the string entered does not
97
- * comply the maximum length, the onBlur and onChange functions will be called
98
- * with the current value and an internal error informing that the value
99
- * length does not comply the specified range. If a valid length is
100
- * reached, the error parameter of both events will be null.
101
- */
102
- maxLength?: number;
103
- /**
104
- * HTML autocomplete attribute. Lets the user specify if any permission the user agent has to provide automated assistance in filling out the textarea value.
105
- * Its value must be one of all the possible values of the HTML autocomplete attribute: 'on', 'off', 'email', 'username', 'new-password', ...
106
- */
107
- autocomplete?: string;
108
- /**
109
- * Size of the margin to be applied to the component ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
110
- * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
111
- */
112
- margin?: Space | Margin;
113
- /**
114
- * Size of the component ('small' | 'medium' | 'large' | 'fillParent').
115
- */
116
- size?: Size;
117
- /**
118
- * Value of the tabindex attribute.
119
- */
120
- tabIndex?: number;
121
- /**
122
- * Reference to the component.
123
- */
124
- ref?: React.RefObject<HTMLDivElement>;
125
- };
126
-
127
- export default function DxcTextarea(props: Props): JSX.Element;
package/toggle/Toggle.js DELETED
@@ -1,186 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
-
5
- var _typeof3 = require("@babel/runtime/helpers/typeof");
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 = _interopRequireDefault(require("react"));
19
-
20
- var _lab = require("@material-ui/lab");
21
-
22
- var _propTypes = _interopRequireDefault(require("prop-types"));
23
-
24
- var _styledComponents = _interopRequireWildcard(require("styled-components"));
25
-
26
- var _utils = require("../common/utils.js");
27
-
28
- var _useTheme = _interopRequireDefault(require("../useTheme.js"));
29
-
30
- var _templateObject, _templateObject2, _templateObject3, _templateObject4;
31
-
32
- function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
33
-
34
- function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof3(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
35
-
36
- var DxcToggle = function DxcToggle(_ref) {
37
- var _ref$label = _ref.label,
38
- label = _ref$label === void 0 ? "" : _ref$label,
39
- _ref$iconSrc = _ref.iconSrc,
40
- iconSrc = _ref$iconSrc === void 0 ? "" : _ref$iconSrc,
41
- _ref$mode = _ref.mode,
42
- mode = _ref$mode === void 0 ? "basic" : _ref$mode,
43
- _ref$theme = _ref.theme,
44
- theme = _ref$theme === void 0 ? "light" : _ref$theme,
45
- _ref$disableRipple = _ref.disableRipple,
46
- disableRipple = _ref$disableRipple === void 0 ? false : _ref$disableRipple,
47
- _ref$iconPosition = _ref.iconPosition,
48
- iconPosition = _ref$iconPosition === void 0 ? "before" : _ref$iconPosition,
49
- _ref$disabled = _ref.disabled,
50
- disabled = _ref$disabled === void 0 ? false : _ref$disabled,
51
- onClick = _ref.onClick,
52
- _ref$selected = _ref.selected,
53
- selected = _ref$selected === void 0 ? false : _ref$selected,
54
- margin = _ref.margin,
55
- _ref$size = _ref.size,
56
- size = _ref$size === void 0 ? "fitContent" : _ref$size;
57
- var colorsTheme = (0, _useTheme["default"])();
58
-
59
- var handlerToggleClick = function handlerToggleClick() {
60
- if (!disabled && typeof onClick === "function") {
61
- onClick(!selected);
62
- }
63
- };
64
-
65
- return /*#__PURE__*/_react["default"].createElement(_styledComponents.ThemeProvider, {
66
- theme: colorsTheme
67
- }, /*#__PURE__*/_react["default"].createElement(DxcToggleContainer, {
68
- margin: margin,
69
- brightness: theme,
70
- disabled: disabled,
71
- disableRipple: disableRipple,
72
- selected: selected,
73
- label: label,
74
- mode: mode,
75
- iconPosition: iconPosition,
76
- value: true,
77
- size: size,
78
- onClick: handlerToggleClick
79
- }, /*#__PURE__*/_react["default"].createElement(_lab.ToggleButton, {
80
- disabled: disabled,
81
- disableRipple: disableRipple,
82
- selected: selected,
83
- label: label,
84
- value: true
85
- }, /*#__PURE__*/_react["default"].createElement(ContentContainer, {
86
- iconPosition: iconPosition,
87
- label: label,
88
- iconSrc: iconSrc
89
- }, iconSrc !== "" && /*#__PURE__*/_react["default"].createElement(IconContainer, {
90
- iconPosition: iconPosition,
91
- label: label,
92
- src: iconSrc
93
- }), label !== "" && /*#__PURE__*/_react["default"].createElement(LabelContainer, null, label)))));
94
- };
95
-
96
- var sizes = {
97
- small: "42px",
98
- medium: "120px",
99
- large: "240px",
100
- fillParent: "100%",
101
- fitContent: "unset"
102
- };
103
-
104
- var calculateWidth = function calculateWidth(margin, size) {
105
- if (size === "fillParent") {
106
- return "calc(".concat(sizes[size], " - ").concat((0, _utils.getMargin)(margin, "left"), " - ").concat((0, _utils.getMargin)(margin, "right"), ")");
107
- }
108
-
109
- return sizes[size];
110
- };
111
-
112
- var DxcToggleContainer = _styledComponents["default"].div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n & {\n margin: ", ";\n margin-top: ", ";\n margin-right: ", ";\n margin-bottom: ", ";\n margin-left: ", ";\n\n opacity: ", ";\n cursor: ", ";\n display: inline-block;\n width: ", ";\n }\n\n .MuiToggleButton-label {\n font-size: 14px;\n font-family: ", ";\n color: ", ";\n }\n .MuiButtonBase-root {\n width: ", ";\n min-height: ", ";\n background-color: ", ";\n &:hover {\n background-color: ", ";\n .MuiToggleButton-label {\n color: ", ";\n }\n }\n }\n\n .MuiToggleButton-root {\n min-width: 42px;\n height: 43px;\n border: ", ";\n\n border-radius: 4px !important;\n }\n\n .MuiToggleButton-root.Mui-selected {\n background-color: ", ";\n &:hover {\n background-color: ", ";\n .MuiToggleButton-label {\n color: ", ";\n }\n }\n }\n\n .MuiToggleButton-root:last-child,\n .MuiToggleButton-root:first-child,\n .MuiToggleButton-root:not(:first-child) {\n padding: ", ";\n }\n\n .MuiTouchRipple-child {\n background-color: ", ";\n }\n"])), function (props) {
113
- return props.margin && (0, _typeof2["default"])(props.margin) !== "object" ? spaces[props.margin] : "0px";
114
- }, function (props) {
115
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.top ? spaces[props.margin.top] : "";
116
- }, function (props) {
117
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.right ? spaces[props.margin.right] : "";
118
- }, function (props) {
119
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.bottom ? spaces[props.margin.bottom] : "";
120
- }, function (props) {
121
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.left ? spaces[props.margin.left] : "";
122
- }, function (props) {
123
- return props.disabled ? "0.5" : "1";
124
- }, function (props) {
125
- return props.disabled ? "not-allowed" : "pointer";
126
- }, function (props) {
127
- return calculateWidth(props.margin, props.size);
128
- }, function (props) {
129
- return props.theme.fontFamily;
130
- }, function (props) {
131
- return props.brightness === "dark" && props.mode === "outlined" ? props.theme.white : props.theme.black;
132
- }, function (props) {
133
- return calculateWidth(props.margin, props.size);
134
- }, function (props) {
135
- return props.mode === "outlined" ? "41px" : "43px";
136
- }, function (props) {
137
- return props.mode !== "outlined" ? props.theme.darkWhite : "transparent";
138
- }, function (props) {
139
- return props.mode === "basic" ? props.theme.lightGrey : props.brightness === "dark" ? props.theme.darkGrey : props.theme.darkWhite;
140
- }, function (props) {
141
- return props.brightness === "dark" && props.mode === "outlined" ? props.theme.white : props.theme.black;
142
- }, function (props) {
143
- return props.mode === "basic" ? "none !important" : props.brightness === "dark" && !props.selected ? "2px solid ".concat(props.theme.white, " !important") : props.brightness === "dark" && props.selected ? "2px solid ".concat(props.theme.yellow, " !important") : "2px solid ".concat(props.theme.black, " !important");
144
- }, function (props) {
145
- return props.mode === "outlined" ? props.brightness === "light" ? props.theme.darkWhite : "transparent" : props.theme.yellow;
146
- }, function (props) {
147
- return props.mode === "basic" && props.brightness === "light" ? props.theme.black : props.mode === "basic" && props.brightness === "dark" ? props.theme.lightBlack : props.brightness === "light" ? props.theme.lightGrey : props.theme.darkGrey;
148
- }, function (props) {
149
- return props.mode === "basic" ? props.theme.yellow : props.brightness === "dark" && props.mode === "outlined" ? props.theme.white : props.theme.black;
150
- }, function (props) {
151
- return props.label !== "" && props.size !== "small" ? props.mode === "outlined" ? "8px 30px " : "12px 30px" : props.mode === "outlined" ? "8px 10px " : "12px 10px";
152
- }, function (props) {
153
- return props.mode === "basic" ? props.selected === false ? props.theme.yellow : props.theme.darkWhite : props.selected === false ? props.theme.lightGrey : props.theme.white;
154
- });
155
-
156
- var ContentContainer = _styledComponents["default"].span(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["\n line-height: 1;\n display: flex;\n align-items: center;\n flex-direction: ", ";\n"])), function (props) {
157
- return props.iconPosition === "after" ? "row-reverse" : "row";
158
- });
159
-
160
- var IconContainer = _styledComponents["default"].img(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])(["\n width: 20px;\n height: 20px;\n line-height: 1;\n margin-right: ", ";\n margin-left: ", ";\n"])), function (props) {
161
- return props.label !== "" && props.iconPosition === "before" ? "10px" : "";
162
- }, function (props) {
163
- return props.label !== "" && props.iconPosition === "after" ? "10px" : "";
164
- });
165
-
166
- var LabelContainer = _styledComponents["default"].span(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2["default"])([""])));
167
-
168
- DxcToggle.propTypes = {
169
- size: _propTypes["default"].oneOf((0, _toConsumableArray2["default"])(Object.keys(sizes))),
170
- theme: _propTypes["default"].oneOf(["light", "dark", ""]),
171
- mode: _propTypes["default"].oneOf(["basic", "outlined", ""]),
172
- iconPosition: _propTypes["default"].oneOf(["before", "after", ""]),
173
- iconSrc: _propTypes["default"].string,
174
- selected: _propTypes["default"].bool,
175
- disabled: _propTypes["default"].bool,
176
- disableRipple: _propTypes["default"].bool,
177
- onClick: _propTypes["default"].func,
178
- margin: _propTypes["default"].oneOfType([_propTypes["default"].shape({
179
- top: _propTypes["default"].oneOf(Object.keys(spaces)),
180
- bottom: _propTypes["default"].oneOf(Object.keys(spaces)),
181
- left: _propTypes["default"].oneOf(Object.keys(spaces)),
182
- right: _propTypes["default"].oneOf(Object.keys(spaces))
183
- }), _propTypes["default"].oneOf((0, _toConsumableArray2["default"])(Object.keys(spaces)))])
184
- };
185
- var _default = DxcToggle;
186
- exports["default"] = _default;
package/toggle/index.d.ts DELETED
@@ -1,21 +0,0 @@
1
- type Space = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
2
- type Margin = {
3
- top?: Space;
4
- bottom?: Space;
5
- left?: Space;
6
- right?: Space;
7
- };
8
-
9
- type Props = {
10
- label?: string;
11
- helperText?: string;
12
- value?: any;
13
- onChange?: void;
14
- disabled?: boolean,
15
- options?: any;
16
- multiple?: boolean;
17
- margin?: Space | Margin;
18
- tabIndex?: number;
19
- };
20
-
21
- export default function DxcToggle(props: Props): JSX.Element;
package/upload/Upload.js DELETED
@@ -1,201 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
-
5
- var _typeof3 = require("@babel/runtime/helpers/typeof");
6
-
7
- Object.defineProperty(exports, "__esModule", {
8
- value: true
9
- });
10
- exports["default"] = void 0;
11
-
12
- var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
13
-
14
- var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
15
-
16
- var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
17
-
18
- var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
19
-
20
- var _react = _interopRequireWildcard(require("react"));
21
-
22
- var _styledComponents = _interopRequireDefault(require("styled-components"));
23
-
24
- var _propTypes = _interopRequireDefault(require("prop-types"));
25
-
26
- var _DragAndDropArea = _interopRequireDefault(require("./dragAndDropArea/DragAndDropArea"));
27
-
28
- var _FilesToUpload = _interopRequireDefault(require("./files-upload/FilesToUpload"));
29
-
30
- var _Transactions = _interopRequireDefault(require("./transactions/Transactions"));
31
-
32
- var _variables = require("../common/variables.js");
33
-
34
- var _templateObject;
35
-
36
- function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
37
-
38
- function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof3(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
39
-
40
- var DxcUpload = function DxcUpload(_ref) {
41
- var callbackUpload = _ref.callbackUpload,
42
- margin = _ref.margin,
43
- _ref$tabIndex = _ref.tabIndex,
44
- tabIndex = _ref$tabIndex === void 0 ? 0 : _ref$tabIndex;
45
-
46
- var _useState = (0, _react.useState)([]),
47
- _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
48
- files = _useState2[0],
49
- setFiles = _useState2[1];
50
-
51
- var getFilesToUpload = function getFilesToUpload() {
52
- return files.filter(function (file) {
53
- return file.status === "pending";
54
- }).map(function (file) {
55
- var fileInfo = {
56
- name: file.name,
57
- type: file.type,
58
- image: file.image,
59
- status: file.status
60
- };
61
-
62
- fileInfo.deleteFile = function () {
63
- var uploadFiles = [];
64
- files.forEach(function (item) {
65
- return uploadFiles.push(item);
66
- });
67
- var fileIndex = uploadFiles.indexOf(file, 0);
68
-
69
- if (fileIndex > -1) {
70
- uploadFiles.splice(fileIndex, 1);
71
- setFiles(uploadFiles);
72
- }
73
- };
74
-
75
- return fileInfo;
76
- });
77
- };
78
-
79
- var getTransactionsFiles = function getTransactionsFiles() {
80
- return files.filter(function (file) {
81
- return file.status === "success" || file.status === "error" || file.status === "processing";
82
- }).map(function (file) {
83
- return {
84
- name: file.name,
85
- type: file.type,
86
- image: file.image,
87
- status: file.status
88
- };
89
- });
90
- };
91
-
92
- var getFilePreview = function getFilePreview(file) {
93
- return new Promise(function (resolve) {
94
- var reader = new FileReader();
95
- reader.readAsDataURL(file);
96
-
97
- reader.onload = function (e) {
98
- resolve(e.target.result);
99
- };
100
- });
101
- };
102
-
103
- var onDragHandler = function onDragHandler(filesToAdd) {
104
- setFiles([].concat((0, _toConsumableArray2["default"])(files), (0, _toConsumableArray2["default"])(filesToAdd.map(function (file) {
105
- var fileToAdd = {
106
- status: "pending",
107
- name: file.name,
108
- type: file.type
109
- };
110
- return fileToAdd;
111
- }))));
112
- Promise.all(filesToAdd.map(function (fileToAdd) {
113
- return getFilePreview(fileToAdd);
114
- })).then(function (previews) {
115
- setFiles([].concat((0, _toConsumableArray2["default"])(files), (0, _toConsumableArray2["default"])(filesToAdd.map(function (file, index) {
116
- var fileToAdd = {
117
- status: "pending",
118
- name: file.name,
119
- type: file.type,
120
- image: previews[index]
121
- };
122
- return fileToAdd;
123
- }))));
124
- });
125
- };
126
-
127
- var onUploadHandler = function onUploadHandler() {
128
- var uploadedFiles = [];
129
- files.forEach(function (file) {
130
- uploadedFiles = [].concat((0, _toConsumableArray2["default"])(uploadedFiles), [file]);
131
- });
132
- uploadedFiles.forEach(function (file) {
133
- if (file.status === "pending") {
134
- file.status = "processing";
135
-
136
- if (typeof callbackUpload === "function") {
137
- callbackUpload(file).then(function () {
138
- file.status = "success";
139
- uploadedFiles = getTransactionsFiles();
140
- setFiles(uploadedFiles);
141
- })["catch"](function (err) {
142
- file.status = "error";
143
- file.message = err;
144
- uploadedFiles = getTransactionsFiles();
145
- setFiles(uploadedFiles);
146
- })["finally"]();
147
- }
148
- }
149
-
150
- setFiles(uploadedFiles);
151
- });
152
- };
153
-
154
- var filesToUpload = getFilesToUpload();
155
- var transactionFiles = getTransactionsFiles();
156
- return /*#__PURE__*/_react["default"].createElement(DXCUpload, {
157
- margin: margin
158
- }, transactionFiles && transactionFiles.length !== 0 && /*#__PURE__*/_react["default"].createElement(_Transactions["default"], {
159
- tabIndexValue: tabIndex,
160
- transactions: transactionFiles
161
- }), filesToUpload && filesToUpload.length === 0 && transactionFiles && transactionFiles.length === 0 && /*#__PURE__*/_react["default"].createElement(_DragAndDropArea["default"], {
162
- dashed: false,
163
- addFile: onDragHandler,
164
- tabIndexValue: tabIndex
165
- }) || filesToUpload && filesToUpload.length === 0 && transactionFiles && transactionFiles.length !== 0 && /*#__PURE__*/_react["default"].createElement(_DragAndDropArea["default"], {
166
- dashed: true,
167
- addFile: onDragHandler,
168
- tabIndexValue: tabIndex
169
- }), filesToUpload && filesToUpload.length !== 0 && /*#__PURE__*/_react["default"].createElement(_FilesToUpload["default"], {
170
- filesToUpload: filesToUpload,
171
- addFile: onDragHandler,
172
- onUpload: onUploadHandler,
173
- tabIndexValue: tabIndex
174
- }));
175
- };
176
-
177
- DxcUpload.propTypes = {
178
- callbackUpload: _propTypes["default"].func,
179
- margin: _propTypes["default"].oneOfType([_propTypes["default"].shape({
180
- top: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
181
- bottom: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
182
- left: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
183
- right: _propTypes["default"].oneOf(Object.keys(_variables.spaces))
184
- }), _propTypes["default"].oneOf((0, _toConsumableArray2["default"])(Object.keys(_variables.spaces)))]),
185
- tabIndex: _propTypes["default"].number
186
- };
187
-
188
- var DXCUpload = _styledComponents["default"].div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n max-width: 100%;\n height: 400px;\n box-shadow: 0px 3px 6px #00000029;\n border-radius: 4px;\n display: flex;\n flex-direction: row;\n margin: ", ";\n margin-top: ", ";\n margin-right: ", ";\n margin-bottom: ", ";\n margin-left: ", ";\n"])), function (props) {
189
- return props.margin && (0, _typeof2["default"])(props.margin) !== "object" ? _variables.spaces[props.margin] : "0px";
190
- }, function (props) {
191
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.top ? _variables.spaces[props.margin.top] : "";
192
- }, function (props) {
193
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.right ? _variables.spaces[props.margin.right] : "";
194
- }, function (props) {
195
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.bottom ? _variables.spaces[props.margin.bottom] : "";
196
- }, function (props) {
197
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.left ? _variables.spaces[props.margin.left] : "";
198
- });
199
-
200
- var _default = DxcUpload;
201
- exports["default"] = _default;