@dxc-technology/halstack-react 0.0.0-b3de035 → 0.0.0-b3e2de9

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 (577) hide show
  1. package/BackgroundColorContext.d.ts +1 -0
  2. package/BackgroundColorContext.js +30 -0
  3. package/HalstackContext.d.ts +1249 -0
  4. package/HalstackContext.js +310 -0
  5. package/README.md +28 -47
  6. package/accordion/Accordion.accessibility.test.js +71 -0
  7. package/accordion/Accordion.d.ts +4 -0
  8. package/accordion/Accordion.js +169 -0
  9. package/accordion/Accordion.stories.tsx +251 -0
  10. package/accordion/Accordion.test.js +56 -0
  11. package/accordion/types.d.ts +57 -0
  12. package/accordion/types.js +5 -0
  13. package/accordion-group/AccordionGroup.accessibility.test.js +88 -0
  14. package/accordion-group/AccordionGroup.d.ts +7 -0
  15. package/accordion-group/AccordionGroup.js +101 -0
  16. package/accordion-group/AccordionGroup.stories.tsx +252 -0
  17. package/accordion-group/AccordionGroup.test.js +98 -0
  18. package/accordion-group/AccordionGroupAccordion.d.ts +4 -0
  19. package/accordion-group/AccordionGroupAccordion.js +31 -0
  20. package/accordion-group/AccordionGroupContext.d.ts +3 -0
  21. package/accordion-group/AccordionGroupContext.js +8 -0
  22. package/accordion-group/types.d.ts +67 -0
  23. package/accordion-group/types.js +5 -0
  24. package/action-icon/ActionIcon.accessibility.test.js +63 -0
  25. package/action-icon/ActionIcon.d.ts +4 -0
  26. package/action-icon/ActionIcon.js +48 -0
  27. package/action-icon/ActionIcon.stories.tsx +41 -0
  28. package/action-icon/ActionIcon.test.js +64 -0
  29. package/action-icon/types.d.ts +26 -0
  30. package/action-icon/types.js +5 -0
  31. package/alert/Alert.accessibility.test.js +95 -0
  32. package/alert/Alert.d.ts +4 -0
  33. package/alert/Alert.js +200 -0
  34. package/alert/Alert.stories.tsx +198 -0
  35. package/alert/Alert.test.js +75 -0
  36. package/alert/types.d.ts +49 -0
  37. package/alert/types.js +5 -0
  38. package/badge/Badge.accessibility.test.js +129 -0
  39. package/badge/Badge.d.ts +4 -0
  40. package/badge/Badge.js +159 -0
  41. package/badge/Badge.stories.tsx +210 -0
  42. package/badge/Badge.test.js +30 -0
  43. package/badge/types.d.ts +54 -0
  44. package/badge/types.js +5 -0
  45. package/bleed/Bleed.d.ts +3 -0
  46. package/bleed/Bleed.js +43 -0
  47. package/bleed/Bleed.stories.tsx +342 -0
  48. package/bleed/types.d.ts +37 -0
  49. package/bleed/types.js +5 -0
  50. package/box/Box.accessibility.test.js +33 -0
  51. package/box/Box.d.ts +4 -0
  52. package/box/Box.js +75 -0
  53. package/box/Box.stories.tsx +119 -0
  54. package/box/Box.test.js +13 -0
  55. package/box/types.d.ts +32 -0
  56. package/box/types.js +5 -0
  57. package/bulleted-list/BulletedList.accessibility.test.js +107 -0
  58. package/bulleted-list/BulletedList.d.ts +7 -0
  59. package/bulleted-list/BulletedList.js +92 -0
  60. package/bulleted-list/BulletedList.stories.tsx +115 -0
  61. package/bulleted-list/types.d.ts +38 -0
  62. package/bulleted-list/types.js +5 -0
  63. package/button/Button.accessibility.test.js +127 -0
  64. package/button/Button.d.ts +4 -0
  65. package/button/Button.js +121 -0
  66. package/button/Button.stories.tsx +325 -0
  67. package/button/Button.test.js +38 -0
  68. package/button/types.d.ts +57 -0
  69. package/button/types.js +5 -0
  70. package/card/Card.accessibility.test.js +36 -0
  71. package/card/Card.d.ts +4 -0
  72. package/card/Card.js +120 -0
  73. package/card/Card.stories.tsx +171 -0
  74. package/card/Card.test.js +39 -0
  75. package/card/types.d.ts +62 -0
  76. package/card/types.js +5 -0
  77. package/checkbox/Checkbox.accessibility.test.js +87 -0
  78. package/checkbox/Checkbox.d.ts +4 -0
  79. package/checkbox/Checkbox.js +215 -0
  80. package/checkbox/Checkbox.stories.tsx +222 -0
  81. package/checkbox/Checkbox.test.js +199 -0
  82. package/checkbox/types.d.ts +72 -0
  83. package/checkbox/types.js +5 -0
  84. package/chip/Chip.accessibility.test.js +67 -0
  85. package/chip/Chip.d.ts +4 -0
  86. package/chip/Chip.js +124 -0
  87. package/chip/Chip.stories.tsx +195 -0
  88. package/chip/Chip.test.js +41 -0
  89. package/chip/types.d.ts +45 -0
  90. package/chip/types.js +5 -0
  91. package/common/coreTokens.d.ts +237 -0
  92. package/common/coreTokens.js +184 -0
  93. package/common/utils.d.ts +1 -0
  94. package/{dist/common → common}/utils.js +6 -12
  95. package/common/variables.d.ts +1395 -0
  96. package/common/variables.js +1267 -0
  97. package/container/Container.d.ts +4 -0
  98. package/container/Container.js +194 -0
  99. package/container/Container.stories.tsx +214 -0
  100. package/container/types.d.ts +74 -0
  101. package/container/types.js +5 -0
  102. package/contextual-menu/ContextualMenu.accessibility.test.js +86 -0
  103. package/contextual-menu/ContextualMenu.d.ts +7 -0
  104. package/contextual-menu/ContextualMenu.js +71 -0
  105. package/contextual-menu/ContextualMenu.stories.tsx +182 -0
  106. package/contextual-menu/ContextualMenu.test.js +71 -0
  107. package/contextual-menu/MenuItemAction.d.ts +4 -0
  108. package/contextual-menu/MenuItemAction.js +46 -0
  109. package/contextual-menu/types.d.ts +22 -0
  110. package/contextual-menu/types.js +5 -0
  111. package/date-input/Calendar.d.ts +4 -0
  112. package/date-input/Calendar.js +214 -0
  113. package/date-input/DateInput.accessibility.test.js +216 -0
  114. package/date-input/DateInput.d.ts +4 -0
  115. package/date-input/DateInput.js +223 -0
  116. package/date-input/DateInput.stories.tsx +285 -0
  117. package/date-input/DateInput.test.js +808 -0
  118. package/date-input/DatePicker.d.ts +4 -0
  119. package/date-input/DatePicker.js +115 -0
  120. package/date-input/Icons.d.ts +6 -0
  121. package/date-input/Icons.js +58 -0
  122. package/date-input/YearPicker.d.ts +4 -0
  123. package/date-input/YearPicker.js +100 -0
  124. package/date-input/types.d.ts +164 -0
  125. package/date-input/types.js +5 -0
  126. package/dialog/Dialog.accessibility.test.js +69 -0
  127. package/dialog/Dialog.d.ts +4 -0
  128. package/dialog/Dialog.js +104 -0
  129. package/dialog/Dialog.stories.tsx +365 -0
  130. package/dialog/Dialog.test.js +307 -0
  131. package/dialog/types.d.ts +36 -0
  132. package/dialog/types.js +5 -0
  133. package/divider/Divider.accessibility.test.js +33 -0
  134. package/divider/Divider.d.ts +4 -0
  135. package/divider/Divider.js +36 -0
  136. package/divider/Divider.stories.tsx +223 -0
  137. package/divider/Divider.test.js +38 -0
  138. package/divider/types.d.ts +21 -0
  139. package/divider/types.js +5 -0
  140. package/dropdown/Dropdown.accessibility.test.js +180 -0
  141. package/dropdown/Dropdown.d.ts +4 -0
  142. package/dropdown/Dropdown.js +319 -0
  143. package/dropdown/Dropdown.stories.tsx +427 -0
  144. package/dropdown/Dropdown.test.js +599 -0
  145. package/dropdown/DropdownMenu.d.ts +4 -0
  146. package/dropdown/DropdownMenu.js +63 -0
  147. package/dropdown/DropdownMenuItem.d.ts +4 -0
  148. package/dropdown/DropdownMenuItem.js +70 -0
  149. package/dropdown/types.d.ts +96 -0
  150. package/dropdown/types.js +5 -0
  151. package/file-input/FileInput.accessibility.test.js +160 -0
  152. package/file-input/FileInput.d.ts +4 -0
  153. package/file-input/FileInput.js +479 -0
  154. package/file-input/FileInput.stories.tsx +618 -0
  155. package/file-input/FileInput.test.js +459 -0
  156. package/file-input/FileItem.d.ts +4 -0
  157. package/file-input/FileItem.js +135 -0
  158. package/file-input/types.d.ts +129 -0
  159. package/file-input/types.js +5 -0
  160. package/flex/Flex.d.ts +4 -0
  161. package/flex/Flex.js +57 -0
  162. package/flex/Flex.stories.tsx +112 -0
  163. package/flex/types.d.ts +97 -0
  164. package/flex/types.js +5 -0
  165. package/footer/Footer.accessibility.test.js +117 -0
  166. package/footer/Footer.d.ts +4 -0
  167. package/footer/Footer.js +138 -0
  168. package/footer/Footer.stories.tsx +170 -0
  169. package/footer/Footer.test.js +85 -0
  170. package/footer/Icons.d.ts +3 -0
  171. package/footer/Icons.js +136 -0
  172. package/footer/types.d.ts +64 -0
  173. package/footer/types.js +5 -0
  174. package/grid/Grid.d.ts +7 -0
  175. package/grid/Grid.js +76 -0
  176. package/grid/Grid.stories.tsx +219 -0
  177. package/grid/types.d.ts +115 -0
  178. package/grid/types.js +5 -0
  179. package/header/Header.accessibility.test.js +84 -0
  180. package/header/Header.d.ts +8 -0
  181. package/header/Header.js +220 -0
  182. package/header/Header.stories.tsx +251 -0
  183. package/header/Header.test.js +66 -0
  184. package/header/Icons.d.ts +2 -0
  185. package/{dist/header → header}/Icons.js +9 -39
  186. package/header/types.d.ts +33 -0
  187. package/header/types.js +5 -0
  188. package/heading/Heading.accessibility.test.js +33 -0
  189. package/heading/Heading.d.ts +4 -0
  190. package/{dist/heading → heading}/Heading.js +31 -124
  191. package/heading/Heading.stories.tsx +54 -0
  192. package/heading/Heading.test.js +169 -0
  193. package/heading/types.d.ts +33 -0
  194. package/heading/types.js +5 -0
  195. package/icon/Icon.accessibility.test.js +30 -0
  196. package/icon/Icon.d.ts +4 -0
  197. package/icon/Icon.js +33 -0
  198. package/icon/Icon.stories.tsx +28 -0
  199. package/icon/types.d.ts +4 -0
  200. package/icon/types.js +5 -0
  201. package/image/Image.accessibility.test.js +56 -0
  202. package/image/Image.d.ts +4 -0
  203. package/image/Image.js +70 -0
  204. package/image/Image.stories.tsx +129 -0
  205. package/image/types.d.ts +72 -0
  206. package/image/types.js +5 -0
  207. package/inset/Inset.d.ts +3 -0
  208. package/inset/Inset.js +43 -0
  209. package/inset/Inset.stories.tsx +230 -0
  210. package/inset/types.d.ts +37 -0
  211. package/inset/types.js +5 -0
  212. package/layout/ApplicationLayout.d.ts +20 -0
  213. package/layout/ApplicationLayout.js +134 -0
  214. package/layout/ApplicationLayout.stories.tsx +162 -0
  215. package/layout/Icons.d.ts +8 -0
  216. package/layout/Icons.js +56 -0
  217. package/layout/types.d.ts +41 -0
  218. package/layout/types.js +5 -0
  219. package/link/Link.accessibility.test.js +112 -0
  220. package/link/Link.d.ts +4 -0
  221. package/link/Link.js +117 -0
  222. package/link/Link.stories.tsx +253 -0
  223. package/link/Link.test.js +63 -0
  224. package/link/types.d.ts +54 -0
  225. package/link/types.js +5 -0
  226. package/main.d.ts +49 -0
  227. package/{dist/main.js → main.js} +135 -137
  228. package/nav-tabs/NavTabs.accessibility.test.js +52 -0
  229. package/nav-tabs/NavTabs.d.ts +7 -0
  230. package/nav-tabs/NavTabs.js +93 -0
  231. package/nav-tabs/NavTabs.stories.tsx +276 -0
  232. package/nav-tabs/NavTabs.test.js +76 -0
  233. package/nav-tabs/NavTabsContext.d.ts +3 -0
  234. package/nav-tabs/NavTabsContext.js +8 -0
  235. package/nav-tabs/Tab.d.ts +4 -0
  236. package/nav-tabs/Tab.js +118 -0
  237. package/nav-tabs/types.d.ts +52 -0
  238. package/nav-tabs/types.js +5 -0
  239. package/number-input/NumberInput.accessibility.test.js +228 -0
  240. package/number-input/NumberInput.d.ts +4 -0
  241. package/number-input/NumberInput.js +86 -0
  242. package/number-input/NumberInput.stories.tsx +131 -0
  243. package/number-input/NumberInput.test.js +989 -0
  244. package/number-input/NumberInputContext.d.ts +3 -0
  245. package/number-input/NumberInputContext.js +8 -0
  246. package/number-input/types.d.ts +136 -0
  247. package/number-input/types.js +5 -0
  248. package/package.json +62 -50
  249. package/paginator/Icons.d.ts +5 -0
  250. package/paginator/Icons.js +40 -0
  251. package/paginator/Paginator.accessibility.test.js +79 -0
  252. package/paginator/Paginator.d.ts +4 -0
  253. package/paginator/Paginator.js +135 -0
  254. package/paginator/Paginator.stories.tsx +87 -0
  255. package/paginator/Paginator.test.js +335 -0
  256. package/paginator/types.d.ts +38 -0
  257. package/paginator/types.js +5 -0
  258. package/paragraph/Paragraph.accessibility.test.js +28 -0
  259. package/paragraph/Paragraph.d.ts +5 -0
  260. package/paragraph/Paragraph.js +22 -0
  261. package/paragraph/Paragraph.stories.tsx +27 -0
  262. package/password-input/Icons.d.ts +6 -0
  263. package/password-input/Icons.js +35 -0
  264. package/password-input/PasswordInput.accessibility.test.js +153 -0
  265. package/password-input/PasswordInput.d.ts +4 -0
  266. package/password-input/PasswordInput.js +97 -0
  267. package/password-input/PasswordInput.stories.tsx +99 -0
  268. package/password-input/PasswordInput.test.js +198 -0
  269. package/password-input/types.d.ts +111 -0
  270. package/password-input/types.js +5 -0
  271. package/progress-bar/ProgressBar.accessibility.test.js +35 -0
  272. package/progress-bar/ProgressBar.d.ts +4 -0
  273. package/progress-bar/ProgressBar.js +144 -0
  274. package/progress-bar/ProgressBar.stories.tsx +93 -0
  275. package/progress-bar/ProgressBar.test.js +93 -0
  276. package/progress-bar/types.d.ts +37 -0
  277. package/progress-bar/types.js +5 -0
  278. package/quick-nav/QuickNav.accessibility.test.js +57 -0
  279. package/quick-nav/QuickNav.d.ts +4 -0
  280. package/quick-nav/QuickNav.js +94 -0
  281. package/quick-nav/QuickNav.stories.tsx +356 -0
  282. package/quick-nav/types.d.ts +21 -0
  283. package/quick-nav/types.js +5 -0
  284. package/radio-group/Radio.d.ts +4 -0
  285. package/radio-group/Radio.js +124 -0
  286. package/radio-group/RadioGroup.accessibility.test.js +97 -0
  287. package/radio-group/RadioGroup.d.ts +4 -0
  288. package/radio-group/RadioGroup.js +235 -0
  289. package/radio-group/RadioGroup.stories.tsx +214 -0
  290. package/radio-group/RadioGroup.test.js +756 -0
  291. package/radio-group/types.d.ts +114 -0
  292. package/radio-group/types.js +5 -0
  293. package/resultset-table/Icons.d.ts +7 -0
  294. package/resultset-table/Icons.js +47 -0
  295. package/resultset-table/ResultsetTable.accessibility.test.js +274 -0
  296. package/resultset-table/ResultsetTable.d.ts +7 -0
  297. package/resultset-table/ResultsetTable.js +170 -0
  298. package/resultset-table/ResultsetTable.stories.tsx +401 -0
  299. package/resultset-table/ResultsetTable.test.js +381 -0
  300. package/resultset-table/types.d.ts +100 -0
  301. package/resultset-table/types.js +5 -0
  302. package/select/Icons.d.ts +10 -0
  303. package/select/Icons.js +89 -0
  304. package/select/Listbox.d.ts +4 -0
  305. package/select/Listbox.js +143 -0
  306. package/select/Option.d.ts +4 -0
  307. package/select/Option.js +87 -0
  308. package/select/Select.accessibility.test.js +217 -0
  309. package/select/Select.d.ts +4 -0
  310. package/select/Select.js +590 -0
  311. package/select/Select.stories.tsx +970 -0
  312. package/select/Select.test.js +2370 -0
  313. package/select/types.d.ts +209 -0
  314. package/select/types.js +5 -0
  315. package/sidenav/Icons.d.ts +7 -0
  316. package/sidenav/Icons.js +47 -0
  317. package/sidenav/Sidenav.accessibility.test.js +59 -0
  318. package/sidenav/Sidenav.d.ts +10 -0
  319. package/sidenav/Sidenav.js +197 -0
  320. package/sidenav/Sidenav.stories.tsx +281 -0
  321. package/sidenav/Sidenav.test.js +37 -0
  322. package/sidenav/SidenavContext.d.ts +5 -0
  323. package/sidenav/SidenavContext.js +13 -0
  324. package/sidenav/types.d.ts +76 -0
  325. package/sidenav/types.js +5 -0
  326. package/slider/Slider.accessibility.test.js +104 -0
  327. package/slider/Slider.d.ts +4 -0
  328. package/slider/Slider.js +285 -0
  329. package/slider/Slider.test.js +254 -0
  330. package/slider/types.d.ts +86 -0
  331. package/slider/types.js +5 -0
  332. package/spinner/Spinner.accessibility.test.js +96 -0
  333. package/spinner/Spinner.d.ts +4 -0
  334. package/spinner/Spinner.js +206 -0
  335. package/spinner/Spinner.stories.tsx +129 -0
  336. package/spinner/Spinner.test.js +55 -0
  337. package/spinner/types.d.ts +32 -0
  338. package/spinner/types.js +5 -0
  339. package/status-light/StatusLight.accessibility.test.js +157 -0
  340. package/status-light/StatusLight.d.ts +4 -0
  341. package/status-light/StatusLight.js +51 -0
  342. package/status-light/StatusLight.stories.tsx +74 -0
  343. package/status-light/StatusLight.test.js +25 -0
  344. package/status-light/types.d.ts +17 -0
  345. package/status-light/types.js +5 -0
  346. package/switch/Switch.accessibility.test.js +89 -0
  347. package/switch/Switch.d.ts +4 -0
  348. package/switch/Switch.js +214 -0
  349. package/switch/Switch.stories.tsx +137 -0
  350. package/switch/Switch.test.js +180 -0
  351. package/switch/types.d.ts +66 -0
  352. package/switch/types.js +5 -0
  353. package/table/DropdownTheme.js +62 -0
  354. package/table/Table.accessibility.test.js +82 -0
  355. package/table/Table.d.ts +8 -0
  356. package/table/Table.js +161 -0
  357. package/table/Table.stories.tsx +651 -0
  358. package/table/Table.test.js +113 -0
  359. package/table/types.d.ts +49 -0
  360. package/table/types.js +5 -0
  361. package/tabs/Tab.d.ts +4 -0
  362. package/tabs/Tab.js +116 -0
  363. package/tabs/Tabs.accessibility.test.js +56 -0
  364. package/tabs/Tabs.d.ts +4 -0
  365. package/tabs/Tabs.js +384 -0
  366. package/tabs/Tabs.stories.tsx +226 -0
  367. package/tabs/Tabs.test.js +294 -0
  368. package/tabs/types.d.ts +92 -0
  369. package/tabs/types.js +5 -0
  370. package/tag/Tag.accessibility.test.js +69 -0
  371. package/tag/Tag.d.ts +4 -0
  372. package/tag/Tag.js +151 -0
  373. package/tag/Tag.stories.tsx +155 -0
  374. package/tag/Tag.test.js +49 -0
  375. package/tag/types.d.ts +69 -0
  376. package/tag/types.js +5 -0
  377. package/text-input/Suggestion.d.ts +4 -0
  378. package/text-input/Suggestion.js +67 -0
  379. package/text-input/Suggestions.d.ts +4 -0
  380. package/text-input/Suggestions.js +86 -0
  381. package/text-input/TextInput.accessibility.test.js +321 -0
  382. package/text-input/TextInput.d.ts +4 -0
  383. package/text-input/TextInput.js +567 -0
  384. package/text-input/TextInput.stories.tsx +465 -0
  385. package/text-input/TextInput.test.js +1756 -0
  386. package/text-input/types.d.ts +205 -0
  387. package/text-input/types.js +5 -0
  388. package/textarea/Textarea.accessibility.test.js +155 -0
  389. package/textarea/Textarea.d.ts +4 -0
  390. package/textarea/Textarea.js +234 -0
  391. package/textarea/Textarea.stories.tsx +174 -0
  392. package/textarea/Textarea.test.js +406 -0
  393. package/textarea/types.d.ts +141 -0
  394. package/textarea/types.js +5 -0
  395. package/toggle-group/ToggleGroup.accessibility.test.js +107 -0
  396. package/toggle-group/ToggleGroup.d.ts +4 -0
  397. package/toggle-group/ToggleGroup.js +201 -0
  398. package/toggle-group/ToggleGroup.stories.tsx +218 -0
  399. package/toggle-group/ToggleGroup.test.js +137 -0
  400. package/toggle-group/types.d.ts +114 -0
  401. package/toggle-group/types.js +5 -0
  402. package/typography/Typography.accessibility.test.js +339 -0
  403. package/typography/Typography.d.ts +4 -0
  404. package/typography/Typography.js +23 -0
  405. package/typography/Typography.stories.tsx +198 -0
  406. package/typography/types.d.ts +18 -0
  407. package/typography/types.js +5 -0
  408. package/useTheme.d.ts +1148 -0
  409. package/{dist/useTheme.js → useTheme.js} +4 -11
  410. package/useTranslatedLabels.d.ts +85 -0
  411. package/useTranslatedLabels.js +14 -0
  412. package/utils/BaseTypography.d.ts +21 -0
  413. package/utils/BaseTypography.js +94 -0
  414. package/utils/FocusLock.d.ts +13 -0
  415. package/utils/FocusLock.js +124 -0
  416. package/wizard/Wizard.accessibility.test.js +55 -0
  417. package/wizard/Wizard.d.ts +4 -0
  418. package/wizard/Wizard.js +250 -0
  419. package/wizard/Wizard.stories.tsx +253 -0
  420. package/wizard/Wizard.test.js +114 -0
  421. package/wizard/types.d.ts +64 -0
  422. package/wizard/types.js +5 -0
  423. package/babel.config.js +0 -8
  424. package/dist/BackgroundColorContext.js +0 -46
  425. package/dist/ThemeContext.js +0 -250
  426. package/dist/V3Select/V3Select.js +0 -549
  427. package/dist/V3Select/index.d.ts +0 -27
  428. package/dist/V3Textarea/V3Textarea.js +0 -264
  429. package/dist/V3Textarea/index.d.ts +0 -27
  430. package/dist/accordion/Accordion.js +0 -353
  431. package/dist/accordion/index.d.ts +0 -28
  432. package/dist/accordion-group/AccordionGroup.js +0 -186
  433. package/dist/accordion-group/index.d.ts +0 -16
  434. package/dist/alert/Alert.js +0 -403
  435. package/dist/alert/index.d.ts +0 -51
  436. package/dist/badge/Badge.js +0 -63
  437. package/dist/box/Box.js +0 -156
  438. package/dist/box/index.d.ts +0 -25
  439. package/dist/button/Button.js +0 -238
  440. package/dist/button/index.d.ts +0 -24
  441. package/dist/card/Card.js +0 -254
  442. package/dist/card/index.d.ts +0 -22
  443. package/dist/checkbox/Checkbox.js +0 -299
  444. package/dist/checkbox/index.d.ts +0 -24
  445. package/dist/chip/Chip.js +0 -265
  446. package/dist/chip/index.d.ts +0 -22
  447. package/dist/common/OpenSans.css +0 -81
  448. package/dist/common/RequiredComponent.js +0 -40
  449. package/dist/common/fonts/OpenSans-Bold.ttf +0 -0
  450. package/dist/common/fonts/OpenSans-BoldItalic.ttf +0 -0
  451. package/dist/common/fonts/OpenSans-ExtraBold.ttf +0 -0
  452. package/dist/common/fonts/OpenSans-ExtraBoldItalic.ttf +0 -0
  453. package/dist/common/fonts/OpenSans-Italic.ttf +0 -0
  454. package/dist/common/fonts/OpenSans-Light.ttf +0 -0
  455. package/dist/common/fonts/OpenSans-LightItalic.ttf +0 -0
  456. package/dist/common/fonts/OpenSans-Regular.ttf +0 -0
  457. package/dist/common/fonts/OpenSans-SemiBold.ttf +0 -0
  458. package/dist/common/fonts/OpenSans-SemiBoldItalic.ttf +0 -0
  459. package/dist/common/variables.js +0 -1574
  460. package/dist/date/Date.js +0 -379
  461. package/dist/date/index.d.ts +0 -27
  462. package/dist/date-input/DateInput.js +0 -400
  463. package/dist/date-input/index.d.ts +0 -95
  464. package/dist/dialog/Dialog.js +0 -218
  465. package/dist/dialog/index.d.ts +0 -18
  466. package/dist/dropdown/Dropdown.js +0 -544
  467. package/dist/dropdown/index.d.ts +0 -26
  468. package/dist/file-input/FileInput.js +0 -644
  469. package/dist/file-input/FileItem.js +0 -287
  470. package/dist/file-input/index.d.ts +0 -81
  471. package/dist/footer/Footer.js +0 -421
  472. package/dist/footer/Icons.js +0 -77
  473. package/dist/footer/index.d.ts +0 -25
  474. package/dist/header/Header.js +0 -470
  475. package/dist/header/index.d.ts +0 -25
  476. package/dist/heading/index.d.ts +0 -17
  477. package/dist/input-text/Icons.js +0 -22
  478. package/dist/input-text/InputText.js +0 -705
  479. package/dist/input-text/index.d.ts +0 -36
  480. package/dist/layout/ApplicationLayout.js +0 -327
  481. package/dist/layout/Icons.js +0 -55
  482. package/dist/link/Link.js +0 -237
  483. package/dist/link/index.d.ts +0 -23
  484. package/dist/main.d.ts +0 -40
  485. package/dist/number-input/NumberInput.js +0 -136
  486. package/dist/number-input/NumberInputContext.js +0 -16
  487. package/dist/number-input/index.d.ts +0 -113
  488. package/dist/paginator/Icons.js +0 -66
  489. package/dist/paginator/Paginator.js +0 -283
  490. package/dist/paginator/index.d.ts +0 -20
  491. package/dist/password-input/PasswordInput.js +0 -203
  492. package/dist/password-input/index.d.ts +0 -94
  493. package/dist/progress-bar/ProgressBar.js +0 -242
  494. package/dist/progress-bar/index.d.ts +0 -18
  495. package/dist/radio/Radio.js +0 -209
  496. package/dist/radio/index.d.ts +0 -23
  497. package/dist/resultsetTable/ResultsetTable.js +0 -358
  498. package/dist/resultsetTable/index.d.ts +0 -19
  499. package/dist/select/Select.js +0 -1069
  500. package/dist/select/index.d.ts +0 -53
  501. package/dist/sidenav/Sidenav.js +0 -179
  502. package/dist/sidenav/index.d.ts +0 -13
  503. package/dist/slider/Slider.js +0 -404
  504. package/dist/slider/index.d.ts +0 -29
  505. package/dist/spinner/Spinner.js +0 -381
  506. package/dist/spinner/index.d.ts +0 -17
  507. package/dist/switch/Switch.js +0 -222
  508. package/dist/switch/index.d.ts +0 -24
  509. package/dist/table/Table.js +0 -132
  510. package/dist/table/index.d.ts +0 -13
  511. package/dist/tabs/Tabs.js +0 -343
  512. package/dist/tabs/index.d.ts +0 -19
  513. package/dist/tag/Tag.js +0 -282
  514. package/dist/tag/index.d.ts +0 -24
  515. package/dist/text-input/TextInput.js +0 -974
  516. package/dist/text-input/index.d.ts +0 -135
  517. package/dist/textarea/Textarea.js +0 -369
  518. package/dist/textarea/index.d.ts +0 -117
  519. package/dist/toggle/Toggle.js +0 -220
  520. package/dist/toggle/index.d.ts +0 -21
  521. package/dist/toggle-group/ToggleGroup.js +0 -327
  522. package/dist/toggle-group/index.d.ts +0 -21
  523. package/dist/upload/Upload.js +0 -205
  524. package/dist/upload/buttons-upload/ButtonsUpload.js +0 -135
  525. package/dist/upload/buttons-upload/Icons.js +0 -40
  526. package/dist/upload/dragAndDropArea/DragAndDropArea.js +0 -329
  527. package/dist/upload/dragAndDropArea/Icons.js +0 -39
  528. package/dist/upload/file-upload/FileToUpload.js +0 -189
  529. package/dist/upload/file-upload/Icons.js +0 -66
  530. package/dist/upload/files-upload/FilesToUpload.js +0 -123
  531. package/dist/upload/index.d.ts +0 -15
  532. package/dist/upload/transaction/Icons.js +0 -160
  533. package/dist/upload/transaction/Transaction.js +0 -148
  534. package/dist/upload/transactions/Transactions.js +0 -138
  535. package/dist/wizard/Icons.js +0 -65
  536. package/dist/wizard/Wizard.js +0 -405
  537. package/dist/wizard/index.d.ts +0 -18
  538. package/test/Accordion.test.js +0 -33
  539. package/test/AccordionGroup.test.js +0 -125
  540. package/test/Alert.test.js +0 -53
  541. package/test/Box.test.js +0 -10
  542. package/test/Button.test.js +0 -18
  543. package/test/Card.test.js +0 -30
  544. package/test/Checkbox.test.js +0 -45
  545. package/test/Chip.test.js +0 -25
  546. package/test/Date.test.js +0 -395
  547. package/test/DateInput.test.js +0 -242
  548. package/test/Dialog.test.js +0 -23
  549. package/test/Dropdown.test.js +0 -145
  550. package/test/FileInput.test.js +0 -201
  551. package/test/Footer.test.js +0 -94
  552. package/test/Header.test.js +0 -34
  553. package/test/Heading.test.js +0 -83
  554. package/test/InputText.test.js +0 -248
  555. package/test/Link.test.js +0 -43
  556. package/test/NumberInput.test.js +0 -259
  557. package/test/Paginator.test.js +0 -177
  558. package/test/PasswordInput.test.js +0 -83
  559. package/test/ProgressBar.test.js +0 -35
  560. package/test/Radio.test.js +0 -37
  561. package/test/ResultsetTable.test.js +0 -329
  562. package/test/Sidenav.test.js +0 -45
  563. package/test/Slider.test.js +0 -74
  564. package/test/Spinner.test.js +0 -32
  565. package/test/Switch.test.js +0 -45
  566. package/test/Table.test.js +0 -36
  567. package/test/Tabs.test.js +0 -109
  568. package/test/Tag.test.js +0 -32
  569. package/test/TextInput.test.js +0 -732
  570. package/test/Textarea.test.js +0 -193
  571. package/test/ToggleGroup.test.js +0 -85
  572. package/test/Upload.test.js +0 -60
  573. package/test/V3Select.test.js +0 -212
  574. package/test/V3TextArea.test.js +0 -51
  575. package/test/Wizard.test.js +0 -130
  576. package/test/mocks/pngMock.js +0 -1
  577. package/test/mocks/svgMock.js +0 -1
@@ -1,63 +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 _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
13
-
14
- var _react = _interopRequireDefault(require("react"));
15
-
16
- var _styledComponents = _interopRequireWildcard(require("styled-components"));
17
-
18
- var _useTheme = _interopRequireDefault(require("../useTheme.js"));
19
-
20
- function _templateObject() {
21
- var data = (0, _taggedTemplateLiteral2["default"])(["\n background-color: ", ";\n font-family: ", ";\n font-size: ", ";\n font-style: ", ";\n font-weight: ", ";\n color: ", ";\n letter-spacing: ", ";\n width: ", ";\n height: ", ";\n border-radius: ", ";\n display: flex;\n padding-bottom: 1px;\n padding-right: 1px;\n flex-wrap: wrap;\n box-sizing: border-box;\n align-items: center;\n line-height: 1;\n align-content: center;\n flex-direction: row;\n justify-content: center;\n"]);
22
-
23
- _templateObject = function _templateObject() {
24
- return data;
25
- };
26
-
27
- return data;
28
- }
29
-
30
- var DxcBadge = function DxcBadge(_ref) {
31
- var notificationText = _ref.notificationText;
32
- var colorsTheme = (0, _useTheme["default"])();
33
- return _react["default"].createElement(_styledComponents.ThemeProvider, {
34
- theme: colorsTheme.tabs
35
- }, _react["default"].createElement(StyledDxcBadge, {
36
- notificationText: notificationText
37
- }, _react["default"].createElement("span", null, notificationText)));
38
- };
39
-
40
- var StyledDxcBadge = _styledComponents["default"].div(_templateObject(), function (props) {
41
- return props.theme.badgeBackgroundColor;
42
- }, function (props) {
43
- return props.theme.badgeFontFamily;
44
- }, function (props) {
45
- return props.theme.badgeFontSize;
46
- }, function (props) {
47
- return props.theme.badgeFontStyle;
48
- }, function (props) {
49
- return props.theme.badgeFontWeight;
50
- }, function (props) {
51
- return props.theme.badgeFontColor;
52
- }, function (props) {
53
- return props.theme.badgeLetterSpacing;
54
- }, function (props) {
55
- return props.notificationText === true ? props.theme.badgeWidth : props.theme.badgeWidthWithNotificationNumber;
56
- }, function (props) {
57
- return props.notificationText === true ? props.theme.badgeHeight : props.theme.badgeHeightWithNotificationNumber;
58
- }, function (props) {
59
- return props.notificationText === true ? props.theme.badgeRadius : props.theme.badgeRadiusWithNotificationNumber;
60
- });
61
-
62
- var _default = DxcBadge;
63
- exports["default"] = _default;
package/dist/box/Box.js DELETED
@@ -1,156 +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 = _interopRequireDefault(require("react"));
19
-
20
- var _styledComponents = _interopRequireWildcard(require("styled-components"));
21
-
22
- var _propTypes = _interopRequireDefault(require("prop-types"));
23
-
24
- var _variables = require("../common/variables.js");
25
-
26
- var _utils = require("../common/utils.js");
27
-
28
- var _useTheme = _interopRequireDefault(require("../useTheme.js"));
29
-
30
- var _BackgroundColorContext = require("../BackgroundColorContext.js");
31
-
32
- function _templateObject() {
33
- var data = (0, _taggedTemplateLiteral2["default"])(["\n display: ", ";\n border-radius: ", ";\n border-width: ", ";\n border-style: ", ";\n border-color: ", ";\n letter-spacing: ", ";\n overflow: hidden;\n width: ", ";\n background-color: ", ";\n box-shadow: ", ";\n\n margin: ", ";\n margin-top: ", ";\n margin-right: ", ";\n margin-bottom: ", ";\n margin-left: ", ";\n\n padding: ", ";\n padding-top: ", ";\n padding-right: ", ";\n padding-bottom: ", ";\n padding-left: ", ";\n"]);
34
-
35
- _templateObject = function _templateObject() {
36
- return data;
37
- };
38
-
39
- return data;
40
- }
41
-
42
- var DxcBox = function DxcBox(_ref) {
43
- var shadowDepth = _ref.shadowDepth,
44
- margin = _ref.margin,
45
- padding = _ref.padding,
46
- _ref$display = _ref.display,
47
- display = _ref$display === void 0 ? "inline-flex" : _ref$display,
48
- children = _ref.children,
49
- _ref$size = _ref.size,
50
- size = _ref$size === void 0 ? "fitContent" : _ref$size;
51
- var colorsTheme = (0, _useTheme["default"])();
52
- return _react["default"].createElement(_styledComponents.ThemeProvider, {
53
- theme: colorsTheme.box
54
- }, _react["default"].createElement(StyledDxcBox, {
55
- shadowDepth: shadowDepth,
56
- display: display,
57
- margin: margin,
58
- padding: padding,
59
- size: size
60
- }, _react["default"].createElement(_BackgroundColorContext.BackgroundColorProvider, {
61
- color: colorsTheme.box.backgroundColor
62
- }, children)));
63
- };
64
-
65
- var sizes = {
66
- small: "48px",
67
- medium: "240px",
68
- large: "480px",
69
- fillParent: "100%",
70
- fitContent: "unset"
71
- };
72
-
73
- var calculateWidth = function calculateWidth(margin, size, padding) {
74
- if (size === "fillParent") {
75
- return "calc(".concat(sizes[size], " - ").concat((0, _utils.getMargin)(margin, "left"), " - ").concat((0, _utils.getMargin)(margin, "right"), " -\n ").concat((0, _utils.getMargin)(padding, "left"), " - ").concat((0, _utils.getMargin)(padding, "right"), ")");
76
- }
77
-
78
- return sizes[size];
79
- };
80
-
81
- var StyledDxcBox = _styledComponents["default"].div(_templateObject(), function (_ref2) {
82
- var display = _ref2.display;
83
- return display;
84
- }, function (props) {
85
- return props.theme.borderRadius;
86
- }, function (props) {
87
- return props.theme.borderThickness;
88
- }, function (props) {
89
- return props.theme.borderStyle;
90
- }, function (props) {
91
- return props.theme.borderColor;
92
- }, function (props) {
93
- return props.theme.letterSpacing;
94
- }, function (props) {
95
- return calculateWidth(props.margin, props.size, props.padding);
96
- }, function (props) {
97
- return props.theme.backgroundColor;
98
- }, function (props) {
99
- return props.shadowDepth === 1 ? "".concat(props.theme.oneShadowDepthShadowOffsetX, " ").concat(props.theme.oneShadowDepthShadowOffsetY, " ").concat(props.theme.oneShadowDepthShadowBlur, " ").concat(props.theme.oneShadowDepthShadowSpread, " ").concat(props.theme.oneShadowDepthShadowColor) : props.shadowDepth === 2 ? "".concat(props.theme.twoShadowDepthShadowOffsetX, " ").concat(props.theme.twoShadowDepthShadowOffsetY, " ").concat(props.theme.twoShadowDepthShadowBlur, " ").concat(props.theme.twoShadowDepthShadowSpread, " ").concat(props.theme.twoShadowDepthShadowColor) : "".concat(props.theme.noneShadowDepthShadowOffsetX, " ").concat(props.theme.noneShadowDepthShadowOffsetY, " ").concat(props.theme.noneShadowDepthShadowBlur, " ").concat(props.theme.noneShadowDepthShadowSpread, " ").concat(props.theme.noneShadowDepthShadowColor);
100
- }, function (_ref3) {
101
- var margin = _ref3.margin;
102
- return margin && (0, _typeof2["default"])(margin) !== "object" ? _variables.spaces[margin] : "0px";
103
- }, function (_ref4) {
104
- var margin = _ref4.margin;
105
- return margin && margin.top ? _variables.spaces[margin.top] : "";
106
- }, function (_ref5) {
107
- var margin = _ref5.margin;
108
- return margin && margin.right ? _variables.spaces[margin.right] : "";
109
- }, function (_ref6) {
110
- var margin = _ref6.margin;
111
- return margin && margin.bottom ? _variables.spaces[margin.bottom] : "";
112
- }, function (_ref7) {
113
- var margin = _ref7.margin;
114
- return margin && margin.left ? _variables.spaces[margin.left] : "";
115
- }, function (_ref8) {
116
- var padding = _ref8.padding;
117
- return padding && (0, _typeof2["default"])(padding) !== "object" ? _variables.spaces[padding] : "0px";
118
- }, function (_ref9) {
119
- var padding = _ref9.padding;
120
- return padding && padding.top ? _variables.spaces[padding.top] : "";
121
- }, function (_ref10) {
122
- var padding = _ref10.padding;
123
- return padding && padding.right ? _variables.spaces[padding.right] : "";
124
- }, function (_ref11) {
125
- var padding = _ref11.padding;
126
- return padding && padding.bottom ? _variables.spaces[padding.bottom] : "";
127
- }, function (_ref12) {
128
- var padding = _ref12.padding;
129
- return padding && padding.left ? _variables.spaces[padding.left] : "";
130
- });
131
-
132
- DxcBox.propTypes = {
133
- size: _propTypes["default"].oneOf((0, _toConsumableArray2["default"])(Object.keys(sizes))),
134
- display: _propTypes["default"].string,
135
- shadowDepth: _propTypes["default"].oneOf([0, 1, 2]),
136
- margin: _propTypes["default"].oneOfType([_propTypes["default"].shape({
137
- top: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
138
- bottom: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
139
- left: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
140
- right: _propTypes["default"].oneOf(Object.keys(_variables.spaces))
141
- }), _propTypes["default"].oneOf((0, _toConsumableArray2["default"])(Object.keys(_variables.spaces)))]),
142
- padding: _propTypes["default"].oneOfType([_propTypes["default"].shape({
143
- top: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
144
- bottom: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
145
- left: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
146
- right: _propTypes["default"].oneOf(Object.keys(_variables.spaces))
147
- }), _propTypes["default"].oneOf((0, _toConsumableArray2["default"])(Object.keys(_variables.spaces)))])
148
- };
149
- DxcBox.defaultProps = {
150
- shadowDepth: 2,
151
- display: "inline-flex",
152
- margin: null,
153
- padding: null
154
- };
155
- var _default = DxcBox;
156
- exports["default"] = _default;
@@ -1,25 +0,0 @@
1
- type Size = "small" | "medium" | "large" | "fillParent" | "fitContent";
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
- type Padding = {
10
- top?: Space;
11
- bottom?: Space;
12
- left?: Space;
13
- right?: Space;
14
- };
15
-
16
-
17
- type Props = {
18
- shadowDepth?: 0 | 1 | 2;
19
- margin?: Space | Margin;
20
- padging?: Space | Padding;
21
- display: string;
22
- size: Size;
23
- };
24
-
25
- export default function DxcBox(props: Props): JSX.Element;
@@ -1,238 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
4
-
5
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
6
-
7
- Object.defineProperty(exports, "__esModule", {
8
- value: true
9
- });
10
- exports["default"] = void 0;
11
-
12
- var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
13
-
14
- var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
15
-
16
- var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
17
-
18
- var _react = _interopRequireWildcard(require("react"));
19
-
20
- var _Button = _interopRequireDefault(require("@material-ui/core/Button"));
21
-
22
- var _propTypes = _interopRequireDefault(require("prop-types"));
23
-
24
- var _styledComponents = _interopRequireWildcard(require("styled-components"));
25
-
26
- var _variables = require("../common/variables.js");
27
-
28
- var _utils = require("../common/utils.js");
29
-
30
- var _useTheme = _interopRequireDefault(require("../useTheme.js"));
31
-
32
- var _BackgroundColorContext = _interopRequireDefault(require("../BackgroundColorContext.js"));
33
-
34
- function _templateObject4() {
35
- var data = (0, _taggedTemplateLiteral2["default"])(["\n margin: ", ";\n margin-top: ", ";\n margin-right: ", ";\n margin-bottom: ", ";\n margin-left: ", ";\n\n display: inline-block;\n width: ", ";\n cursor: ", ";\n\n .MuiButtonBase-root {\n padding-left: ", ";\n padding-right: ", ";\n padding-top: ", ";\n padding-bottom: ", ";\n\n .MuiButton-label {\n display: flex;\n flex-direction: ", ";\n align-items: center;\n }\n\n box-shadow: 0 0 0 2px transparent;\n font-family: ", ";\n font-size: ", ";\n font-weight: ", ";\n letter-spacing: ", ";\n min-width: ", ";\n width: 100%;\n height: 40px;\n transition: none !important;\n\n &:focus {\n border-color: transparent;\n box-shadow: 0 0 0 2px\n ", ";\n }\n\n ", "\n }\n"]);
36
-
37
- _templateObject4 = function _templateObject4() {
38
- return data;
39
- };
40
-
41
- return data;
42
- }
43
-
44
- function _templateObject3() {
45
- var data = (0, _taggedTemplateLiteral2["default"])(["\n max-height: 24px;\n max-width: 24px;\n margin-left: ", ";\n margin-right: ", ";\n"]);
46
-
47
- _templateObject3 = function _templateObject3() {
48
- return data;
49
- };
50
-
51
- return data;
52
- }
53
-
54
- function _templateObject2() {
55
- var data = (0, _taggedTemplateLiteral2["default"])(["\n max-height: 24px;\n max-width: 24px;\n margin-left: ", ";\n margin-right: ", ";\n overflow: hidden;\n display: flex;\n img,\n svg {\n height: 100%;\n width: 100%;\n }\n"]);
56
-
57
- _templateObject2 = function _templateObject2() {
58
- return data;
59
- };
60
-
61
- return data;
62
- }
63
-
64
- function _templateObject() {
65
- var data = (0, _taggedTemplateLiteral2["default"])(["\n line-height: ", ";\n font-size: ", ";\n text-overflow: ellipsis;\n overflow: hidden;\n text-transform: none;\n margin-right: ", ";\n margin-left: ", ";\n"]);
66
-
67
- _templateObject = function _templateObject() {
68
- return data;
69
- };
70
-
71
- return data;
72
- }
73
-
74
- var DxcButton = function DxcButton(_ref) {
75
- var _ref$label = _ref.label,
76
- label = _ref$label === void 0 ? "" : _ref$label,
77
- _ref$mode = _ref.mode,
78
- mode = _ref$mode === void 0 ? "primary" : _ref$mode,
79
- _ref$disabled = _ref.disabled,
80
- disabled = _ref$disabled === void 0 ? false : _ref$disabled,
81
- _ref$iconPosition = _ref.iconPosition,
82
- iconPosition = _ref$iconPosition === void 0 ? "before" : _ref$iconPosition,
83
- _ref$type = _ref.type,
84
- type = _ref$type === void 0 ? "button" : _ref$type,
85
- _ref$iconSrc = _ref.iconSrc,
86
- iconSrc = _ref$iconSrc === void 0 ? "" : _ref$iconSrc,
87
- icon = _ref.icon,
88
- _ref$onClick = _ref.onClick,
89
- _onClick = _ref$onClick === void 0 ? "" : _ref$onClick,
90
- margin = _ref.margin,
91
- size = _ref.size,
92
- _ref$tabIndex = _ref.tabIndex,
93
- tabIndex = _ref$tabIndex === void 0 ? 0 : _ref$tabIndex;
94
-
95
- var colorsTheme = (0, _useTheme["default"])();
96
- var backgroundType = (0, _react.useContext)(_BackgroundColorContext["default"]);
97
- return _react["default"].createElement(_styledComponents.ThemeProvider, {
98
- theme: colorsTheme.button
99
- }, _react["default"].createElement(DxCButton, {
100
- type: type,
101
- margin: margin,
102
- mode: mode !== "primary" && mode !== "secondary" && mode !== "text" ? "primary" : mode,
103
- disabled: disabled,
104
- iconPosition: iconPosition,
105
- size: size,
106
- backgroundType: backgroundType,
107
- icon: icon
108
- }, _react["default"].createElement(_Button["default"], {
109
- disabled: disabled,
110
- type: type,
111
- disableRipple: true,
112
- "aria-disabled": disabled ? true : false,
113
- tabIndex: disabled ? -1 : tabIndex,
114
- onClick: function onClick() {
115
- if (_onClick) {
116
- _onClick();
117
- }
118
- }
119
- }, label && _react["default"].createElement(LabelContainer, {
120
- icon: icon,
121
- iconPosition: iconPosition
122
- }, label), icon ? _react["default"].createElement(IconContainer, {
123
- label: label,
124
- iconPosition: iconPosition
125
- }, (0, _typeof2["default"])(icon) === "object" ? icon : _react["default"].createElement(icon)) : iconSrc && _react["default"].createElement(ButtonIcon, {
126
- label: label,
127
- iconPosition: iconPosition,
128
- src: iconSrc
129
- }))));
130
- };
131
-
132
- var sizes = {
133
- small: "42px",
134
- medium: "120px",
135
- large: "240px",
136
- fillParent: "100%",
137
- fitContent: "unset"
138
- };
139
-
140
- var calculateWidth = function calculateWidth(margin, size) {
141
- if (size === "fillParent") {
142
- return "calc(".concat(sizes[size], " - ").concat((0, _utils.getMargin)(margin, "left"), " - ").concat((0, _utils.getMargin)(margin, "right"), ")");
143
- }
144
-
145
- return sizes[size];
146
- };
147
-
148
- var LabelContainer = _styledComponents["default"].span(_templateObject(), function (props) {
149
- return props.theme.labelFontLineHeight;
150
- }, function (props) {
151
- return props.theme.fontSize;
152
- }, function (props) {
153
- return !props.icon || props.iconPosition === "before" ? "8px" : "0px";
154
- }, function (props) {
155
- return !props.icon || props.iconPosition === "after" ? "8px" : "0px";
156
- });
157
-
158
- var IconContainer = _styledComponents["default"].div(_templateObject2(), function (props) {
159
- return !props.label ? "0px" : props.iconPosition === "after" && props.label !== "" && "8px" || "8px";
160
- }, function (props) {
161
- return !props.label ? "0px" : props.iconPosition === "before" && props.label !== "" && "8px" || "8px";
162
- });
163
-
164
- var ButtonIcon = _styledComponents["default"].img(_templateObject3(), function (props) {
165
- return props.iconPosition === "after" && props.label !== "" && "10px" || "0px";
166
- }, function (props) {
167
- return props.iconPosition === "before" && props.label !== "" && "10px" || "0px";
168
- });
169
-
170
- var DxCButton = _styledComponents["default"].div(_templateObject4(), function (props) {
171
- return props.margin && (0, _typeof2["default"])(props.margin) !== "object" ? _variables.spaces[props.margin] : "0px";
172
- }, function (props) {
173
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.top ? _variables.spaces[props.margin.top] : "";
174
- }, function (props) {
175
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.right ? _variables.spaces[props.margin.right] : "";
176
- }, function (props) {
177
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.bottom ? _variables.spaces[props.margin.bottom] : "";
178
- }, function (props) {
179
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.left ? _variables.spaces[props.margin.left] : "";
180
- }, function (props) {
181
- return calculateWidth(props.margin, props.size);
182
- }, function (props) {
183
- return props.disabled && "not-allowed" || "pointer";
184
- }, function (props) {
185
- return props.theme.paddingLeft;
186
- }, function (props) {
187
- return props.theme.paddingRight;
188
- }, function (props) {
189
- return props.theme.paddingTop;
190
- }, function (props) {
191
- return props.theme.paddingBottom;
192
- }, function (props) {
193
- return props.iconPosition === "after" && "row" || "row-reverse";
194
- }, function (props) {
195
- return props.theme.fontFamily;
196
- }, function (props) {
197
- return props.theme.fontSize;
198
- }, function (props) {
199
- return props.theme.fontWeight;
200
- }, function (props) {
201
- return props.theme.labelLetterSpacing;
202
- }, function (props) {
203
- return props.size === "small" && "calc(100% - 22px)" || "unset";
204
- }, function (props) {
205
- return props.backgroundType === "dark" ? props.theme.focusBorderColorOnDark : props.theme.focusBorderColor;
206
- }, function (props) {
207
- var mode = props.mode,
208
- backgroundType = props.backgroundType;
209
-
210
- if (mode === "primary") {
211
- return "\n border-radius: ".concat(props.theme.primaryBorderRadius, ";\n border-width: ").concat(props.theme.primaryBorderThickness, ";\n border-style: ").concat(props.theme.primaryBorderStyle, ";\n font-family: ").concat(props.theme.primaryFontFamily, ";\n font-size: ").concat(props.theme.primaryFontSize, ";\n font-weight: ").concat(props.theme.primaryFontWeight, ";\n background-color: ").concat(backgroundType === "dark" ? props.theme.primaryBackgroundColorOnDark : props.theme.primaryBackgroundColor, ";\n color: ").concat(backgroundType && backgroundType === "dark" ? props.theme.primaryFontColorOnDark : props.theme.primaryFontColor, " !important;\n\n &:hover {\n background-color: ").concat(backgroundType === "dark" ? props.theme.primaryHoverBackgroundColorOnDark : props.theme.primaryHoverBackgroundColor, ";\n }\n &:active {\n background-color: ").concat(backgroundType === "dark" ? props.theme.primaryActiveBackgroundColorOnDark : props.theme.primaryActiveBackgroundColor, " !important;\n border-color: transparent;\n box-shadow: 0 0 0 2px ").concat(backgroundType === "dark" ? props.theme.focusBorderColorOnDark : props.theme.focusBorderColor, ";\n }\n &:disabled { \n cursor: not-allowed;\n background-color: ").concat(backgroundType === "dark" ? props.theme.primaryDisabledBackgroundColorOnDark : props.theme.primaryDisabledBackgroundColor, ";\n color: ").concat(backgroundType === "dark" ? props.theme.primaryDisabledFontColorOnDark : props.theme.primaryDisabledFontColor, "!important; \n }\n .MuiButton-label {\n z-index: 5;\n }\n ");
212
- } else if (mode === "secondary") {
213
- return "\n border-radius: ".concat(props.theme.secondaryBorderRadius, ";\n border-width: ").concat(props.theme.secondaryBorderThickness, ";\n border-style: ").concat(props.theme.secondaryBorderStyle, ";\n font-family: ").concat(props.theme.secondaryFontFamily, ";\n font-size: ").concat(props.theme.secondaryFontSize, ";\n font-weight: ").concat(props.theme.secondaryFontWeight, ";\n background-color: ").concat(backgroundType === "dark" ? props.theme.secondaryBackgroundColorOnDark : props.theme.secondaryBackgroundColor, ";\n color: ").concat(backgroundType === "dark" ? props.theme.secondaryFontColorOnDark : props.theme.secondaryFontColor, " !important;\n border-color: ").concat(backgroundType === "dark" ? props.theme.secondaryBorderColorOnDark : props.theme.secondaryBorderColor, ";\n\n &:hover {\n background-color: ").concat(backgroundType === "dark" ? props.theme.secondaryHoverBackgroundColorOnDark : props.theme.secondaryHoverBackgroundColor, ";\n color: ").concat(backgroundType === "dark" ? props.theme.secondaryHoverFontColorOnDark : props.theme.secondaryHoverFontColor, " !important;\n }\n &:active {\n background-color: ").concat(backgroundType === "dark" ? props.theme.secondaryActiveBackgroundColorOnDark : props.theme.secondaryActiveBackgroundColor, " !important;\n color: ").concat(backgroundType === "dark" ? props.theme.secondaryHoverFontColorOnDark : props.theme.secondaryHoverFontColor, " !important;\n border-color: transparent;\n box-shadow: 0 0 0 2px ").concat(backgroundType === "dark" ? props.theme.focusBorderColorOnDark : props.theme.focusBorderColor, ";\n }\n &:disabled {\n cursor: not-allowed;\n background-color: ").concat(backgroundType === "dark" ? props.theme.secondaryDisabledBackgroundColorOnDark : props.theme.secondaryDisabledBackgroundColor, " !important;\n color: ").concat(backgroundType === "dark" ? props.theme.secondaryDisabledFontColorOnDark : props.theme.secondaryDisabledFontColor, " !important;\n border-color: ").concat(backgroundType === "dark" ? props.theme.secondaryDisabledBorderColorOnDark : props.theme.secondaryDisabledBorderColor, ";\n }\n .MuiButton-label {\n z-index: 5;\n }\n ");
214
- } else if (mode === "text") {
215
- return "\n border-radius: ".concat(props.theme.textBorderRadius, ";\n border-width: ").concat(props.theme.textBorderThickness, ";\n border-style: ").concat(props.theme.textBorderStyle, ";\n font-family: ").concat(props.theme.textFontFamily, ";\n font-size: ").concat(props.theme.textFontSize, ";\n font-weight: ").concat(props.theme.textFontWeight, ";\n background-color: ").concat(backgroundType === "dark" ? props.theme.textBackgroundColorOnDark : props.theme.textBackgroundColor, ";\n color: ").concat(backgroundType === "dark" ? props.theme.textFontColorOnDark : props.theme.textFontColor, " !important;\n\n &:hover {\n background-color: ").concat(backgroundType === "dark" ? props.theme.textHoverBackgroundColorOnDark : props.theme.textHoverBackgroundColor, ";\n }\n &:active {\n background-color: ").concat(backgroundType === "dark" ? props.theme.textActiveBackgroundColorOnDark : props.theme.textActiveBackgroundColor, " !important;\n border-color: transparent;\n box-shadow: 0 0 0 2px ").concat(backgroundType === "dark" ? props.theme.focusBorderColorOnDark : props.theme.focusBorderColor, ";\n }\n &:disabled {\n cursor:not-allowed;\n color: ").concat(backgroundType === "dark" ? props.theme.textDisabledFontColorOnDark : props.theme.textDisabledFontColor, " !important;\n background-color: ").concat(backgroundType === "dark" ? props.theme.textDisabledBackgroundColorOnDark : props.theme.textDisabledBackgroundColor, ";\n }\n ");
216
- }
217
- });
218
-
219
- DxcButton.propTypes = {
220
- size: _propTypes["default"].oneOf((0, _toConsumableArray2["default"])(Object.keys(sizes))),
221
- margin: _propTypes["default"].oneOfType([_propTypes["default"].shape({
222
- top: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
223
- bottom: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
224
- left: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
225
- right: _propTypes["default"].oneOf(Object.keys(_variables.spaces))
226
- }), _propTypes["default"].oneOf((0, _toConsumableArray2["default"])(Object.keys(_variables.spaces)))]),
227
- label: _propTypes["default"].string,
228
- mode: _propTypes["default"].oneOf(["primary", "secondary", "text"]),
229
- disabled: _propTypes["default"].bool,
230
- iconPosition: _propTypes["default"].oneOf(["after", "before"]),
231
- onClick: _propTypes["default"].func,
232
- iconSrc: _propTypes["default"].string,
233
- icon: _propTypes["default"].oneOfType([_propTypes["default"].element, _propTypes["default"].func]),
234
- type: _propTypes["default"].oneOf(["button", "reset", "submit"]),
235
- tabIndex: _propTypes["default"].number
236
- };
237
- var _default = DxcButton;
238
- exports["default"] = _default;
@@ -1,24 +0,0 @@
1
- type Size = "small" | "medium" | "large" | "fillParent" | "fitContent";
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
- label?: string;
12
- mode?: "primary" | "secondary" | "text";
13
- disabled?: boolean;
14
- iconPosition?: "before" | "after";
15
- type?: "button" | "reset" | "submit";
16
- iconSrc?: string;
17
- icon?: any;
18
- onClick?: void;
19
- margin?: Space | Margin;
20
- size?: Size;
21
- tabIndex?: number;
22
- };
23
-
24
- export default function DxcButton(props: Props): JSX.Element;