@dxc-technology/halstack-react 0.0.0-acb1a24 → 0.0.0-ad31801

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 (462) hide show
  1. package/BackgroundColorContext.d.ts +10 -0
  2. package/BackgroundColorContext.js +47 -0
  3. package/HalstackContext.d.ts +12 -0
  4. package/HalstackContext.js +343 -0
  5. package/accordion/Accordion.d.ts +4 -0
  6. package/accordion/Accordion.js +239 -0
  7. package/accordion/Accordion.stories.tsx +395 -0
  8. package/accordion/Accordion.test.js +71 -0
  9. package/accordion/types.d.ts +69 -0
  10. package/accordion/types.js +5 -0
  11. package/accordion-group/AccordionGroup.d.ts +7 -0
  12. package/accordion-group/AccordionGroup.js +149 -0
  13. package/accordion-group/AccordionGroup.stories.tsx +251 -0
  14. package/accordion-group/AccordionGroup.test.js +126 -0
  15. package/accordion-group/types.d.ts +79 -0
  16. package/accordion-group/types.js +5 -0
  17. package/alert/Alert.d.ts +4 -0
  18. package/{dist/alert → alert}/Alert.js +44 -154
  19. package/alert/Alert.stories.tsx +198 -0
  20. package/alert/Alert.test.js +92 -0
  21. package/alert/types.d.ts +49 -0
  22. package/alert/types.js +5 -0
  23. package/badge/Badge.d.ts +4 -0
  24. package/badge/Badge.js +61 -0
  25. package/badge/types.d.ts +5 -0
  26. package/badge/types.js +5 -0
  27. package/bleed/Bleed.d.ts +3 -0
  28. package/bleed/Bleed.js +51 -0
  29. package/bleed/Bleed.stories.tsx +341 -0
  30. package/bleed/types.d.ts +37 -0
  31. package/bleed/types.js +5 -0
  32. package/box/Box.d.ts +4 -0
  33. package/box/Box.js +116 -0
  34. package/box/Box.stories.tsx +147 -0
  35. package/box/Box.test.js +18 -0
  36. package/box/types.d.ts +44 -0
  37. package/box/types.js +5 -0
  38. package/bulleted-list/BulletedList.d.ts +7 -0
  39. package/bulleted-list/BulletedList.js +123 -0
  40. package/bulleted-list/BulletedList.stories.tsx +200 -0
  41. package/bulleted-list/types.d.ts +11 -0
  42. package/bulleted-list/types.js +5 -0
  43. package/button/Button.d.ts +4 -0
  44. package/button/Button.js +154 -0
  45. package/button/Button.stories.tsx +425 -0
  46. package/button/Button.test.js +35 -0
  47. package/button/types.d.ts +53 -0
  48. package/button/types.js +5 -0
  49. package/card/Card.d.ts +4 -0
  50. package/card/Card.js +161 -0
  51. package/card/Card.stories.tsx +201 -0
  52. package/card/Card.test.js +50 -0
  53. package/card/ice-cream.jpg +0 -0
  54. package/card/types.d.ts +68 -0
  55. package/card/types.js +5 -0
  56. package/checkbox/Checkbox.d.ts +4 -0
  57. package/checkbox/Checkbox.js +250 -0
  58. package/checkbox/Checkbox.stories.tsx +260 -0
  59. package/checkbox/Checkbox.test.js +155 -0
  60. package/checkbox/types.d.ts +68 -0
  61. package/checkbox/types.js +5 -0
  62. package/chip/Chip.d.ts +4 -0
  63. package/chip/Chip.js +155 -0
  64. package/chip/Chip.stories.tsx +206 -0
  65. package/chip/Chip.test.js +56 -0
  66. package/chip/types.d.ts +45 -0
  67. package/chip/types.js +5 -0
  68. package/{dist/common → common}/variables.js +588 -624
  69. package/date-input/Calendar.d.ts +4 -0
  70. package/date-input/Calendar.js +258 -0
  71. package/date-input/DateInput.d.ts +4 -0
  72. package/date-input/DateInput.js +269 -0
  73. package/date-input/DateInput.stories.tsx +304 -0
  74. package/date-input/DateInput.test.js +835 -0
  75. package/date-input/DatePicker.d.ts +4 -0
  76. package/date-input/DatePicker.js +146 -0
  77. package/date-input/Icons.d.ts +6 -0
  78. package/date-input/Icons.js +75 -0
  79. package/date-input/YearPicker.d.ts +4 -0
  80. package/date-input/YearPicker.js +126 -0
  81. package/date-input/types.d.ts +158 -0
  82. package/date-input/types.js +5 -0
  83. package/dialog/Dialog.d.ts +4 -0
  84. package/dialog/Dialog.js +160 -0
  85. package/dialog/Dialog.stories.tsx +289 -0
  86. package/dialog/Dialog.test.js +70 -0
  87. package/dialog/types.d.ts +44 -0
  88. package/dialog/types.js +5 -0
  89. package/dropdown/Dropdown.d.ts +4 -0
  90. package/dropdown/Dropdown.js +388 -0
  91. package/dropdown/Dropdown.stories.tsx +438 -0
  92. package/dropdown/Dropdown.test.js +585 -0
  93. package/dropdown/DropdownMenu.d.ts +4 -0
  94. package/dropdown/DropdownMenu.js +70 -0
  95. package/dropdown/DropdownMenuItem.d.ts +4 -0
  96. package/dropdown/DropdownMenuItem.js +81 -0
  97. package/dropdown/types.d.ts +100 -0
  98. package/dropdown/types.js +5 -0
  99. package/file-input/FileInput.d.ts +4 -0
  100. package/file-input/FileInput.js +551 -0
  101. package/file-input/FileInput.stories.tsx +618 -0
  102. package/file-input/FileInput.test.js +498 -0
  103. package/file-input/FileItem.d.ts +4 -0
  104. package/file-input/FileItem.js +161 -0
  105. package/file-input/types.d.ts +129 -0
  106. package/file-input/types.js +5 -0
  107. package/flex/Flex.d.ts +4 -0
  108. package/flex/Flex.js +69 -0
  109. package/flex/Flex.stories.tsx +103 -0
  110. package/flex/types.d.ts +32 -0
  111. package/flex/types.js +5 -0
  112. package/footer/Footer.d.ts +4 -0
  113. package/footer/Footer.js +185 -0
  114. package/footer/Footer.stories.tsx +228 -0
  115. package/footer/Footer.test.js +109 -0
  116. package/footer/Icons.d.ts +2 -0
  117. package/{dist/footer → footer}/Icons.js +16 -16
  118. package/footer/types.d.ts +66 -0
  119. package/footer/types.js +5 -0
  120. package/header/Header.d.ts +7 -0
  121. package/header/Header.js +303 -0
  122. package/header/Header.stories.tsx +315 -0
  123. package/header/Header.test.js +79 -0
  124. package/header/Icons.d.ts +2 -0
  125. package/{dist/header → header}/Icons.js +9 -34
  126. package/header/types.d.ts +48 -0
  127. package/header/types.js +5 -0
  128. package/heading/Heading.d.ts +4 -0
  129. package/{dist/heading → heading}/Heading.js +25 -96
  130. package/heading/Heading.stories.tsx +54 -0
  131. package/heading/Heading.test.js +186 -0
  132. package/heading/types.d.ts +33 -0
  133. package/heading/types.js +5 -0
  134. package/inset/Inset.d.ts +3 -0
  135. package/inset/Inset.js +51 -0
  136. package/inset/Inset.stories.tsx +229 -0
  137. package/inset/types.d.ts +37 -0
  138. package/inset/types.js +5 -0
  139. package/layout/ApplicationLayout.d.ts +20 -0
  140. package/layout/ApplicationLayout.js +171 -0
  141. package/layout/ApplicationLayout.stories.tsx +162 -0
  142. package/layout/Icons.d.ts +5 -0
  143. package/{dist/layout → layout}/Icons.js +19 -8
  144. package/layout/SidenavContext.d.ts +5 -0
  145. package/layout/SidenavContext.js +19 -0
  146. package/layout/types.d.ts +42 -0
  147. package/layout/types.js +5 -0
  148. package/link/Link.d.ts +4 -0
  149. package/link/Link.js +136 -0
  150. package/link/Link.stories.tsx +253 -0
  151. package/link/Link.test.js +83 -0
  152. package/link/types.d.ts +54 -0
  153. package/link/types.js +5 -0
  154. package/main.d.ts +44 -0
  155. package/{dist/main.js → main.js} +114 -104
  156. package/nav-tabs/NavTabs.d.ts +8 -0
  157. package/nav-tabs/NavTabs.js +125 -0
  158. package/nav-tabs/NavTabs.stories.tsx +260 -0
  159. package/nav-tabs/NavTabs.test.js +82 -0
  160. package/nav-tabs/Tab.d.ts +4 -0
  161. package/nav-tabs/Tab.js +150 -0
  162. package/nav-tabs/types.d.ts +53 -0
  163. package/nav-tabs/types.js +5 -0
  164. package/number-input/NumberInput.d.ts +4 -0
  165. package/number-input/NumberInput.js +76 -0
  166. package/number-input/NumberInput.stories.tsx +115 -0
  167. package/number-input/NumberInput.test.js +542 -0
  168. package/number-input/NumberInputContext.d.ts +4 -0
  169. package/{dist/number-input → number-input}/NumberInputContext.js +5 -2
  170. package/number-input/numberInputContextTypes.d.ts +19 -0
  171. package/number-input/numberInputContextTypes.js +5 -0
  172. package/number-input/types.d.ts +124 -0
  173. package/number-input/types.js +5 -0
  174. package/package.json +44 -34
  175. package/paginator/Icons.d.ts +5 -0
  176. package/paginator/Icons.js +54 -0
  177. package/paginator/Paginator.d.ts +4 -0
  178. package/paginator/Paginator.js +165 -0
  179. package/paginator/Paginator.stories.tsx +87 -0
  180. package/paginator/Paginator.test.js +315 -0
  181. package/paginator/types.d.ts +38 -0
  182. package/paginator/types.js +5 -0
  183. package/paragraph/Paragraph.d.ts +6 -0
  184. package/paragraph/Paragraph.js +38 -0
  185. package/paragraph/Paragraph.stories.tsx +44 -0
  186. package/password-input/PasswordInput.d.ts +4 -0
  187. package/{dist/password-input → password-input}/PasswordInput.js +40 -77
  188. package/password-input/PasswordInput.stories.tsx +131 -0
  189. package/password-input/PasswordInput.test.js +181 -0
  190. package/password-input/types.d.ts +110 -0
  191. package/password-input/types.js +5 -0
  192. package/progress-bar/ProgressBar.d.ts +4 -0
  193. package/progress-bar/ProgressBar.js +176 -0
  194. package/progress-bar/ProgressBar.stories.jsx +93 -0
  195. package/progress-bar/ProgressBar.test.js +110 -0
  196. package/progress-bar/types.d.ts +36 -0
  197. package/progress-bar/types.js +5 -0
  198. package/quick-nav/QuickNav.d.ts +4 -0
  199. package/quick-nav/QuickNav.js +117 -0
  200. package/quick-nav/QuickNav.stories.tsx +356 -0
  201. package/quick-nav/types.d.ts +21 -0
  202. package/quick-nav/types.js +5 -0
  203. package/radio-group/Radio.d.ts +4 -0
  204. package/radio-group/Radio.js +156 -0
  205. package/radio-group/RadioGroup.d.ts +4 -0
  206. package/radio-group/RadioGroup.js +283 -0
  207. package/radio-group/RadioGroup.stories.tsx +214 -0
  208. package/radio-group/RadioGroup.test.js +722 -0
  209. package/radio-group/types.d.ts +114 -0
  210. package/radio-group/types.js +5 -0
  211. package/resultsetTable/Icons.d.ts +7 -0
  212. package/resultsetTable/Icons.js +51 -0
  213. package/resultsetTable/ResultsetTable.d.ts +4 -0
  214. package/resultsetTable/ResultsetTable.js +195 -0
  215. package/resultsetTable/ResultsetTable.stories.tsx +300 -0
  216. package/resultsetTable/ResultsetTable.test.js +325 -0
  217. package/resultsetTable/types.d.ts +67 -0
  218. package/resultsetTable/types.js +5 -0
  219. package/select/Icons.d.ts +10 -0
  220. package/select/Icons.js +93 -0
  221. package/select/Listbox.d.ts +4 -0
  222. package/select/Listbox.js +169 -0
  223. package/select/Option.d.ts +4 -0
  224. package/select/Option.js +97 -0
  225. package/select/Select.d.ts +4 -0
  226. package/select/Select.js +664 -0
  227. package/select/Select.stories.tsx +971 -0
  228. package/select/Select.test.js +2228 -0
  229. package/select/types.d.ts +210 -0
  230. package/select/types.js +5 -0
  231. package/sidenav/Sidenav.d.ts +10 -0
  232. package/sidenav/Sidenav.js +266 -0
  233. package/sidenav/Sidenav.stories.tsx +282 -0
  234. package/sidenav/Sidenav.test.js +44 -0
  235. package/sidenav/types.d.ts +73 -0
  236. package/sidenav/types.js +5 -0
  237. package/slider/Slider.d.ts +4 -0
  238. package/slider/Slider.js +343 -0
  239. package/slider/Slider.stories.tsx +240 -0
  240. package/slider/Slider.test.js +250 -0
  241. package/slider/types.d.ts +86 -0
  242. package/slider/types.js +5 -0
  243. package/spinner/Spinner.d.ts +4 -0
  244. package/spinner/Spinner.js +250 -0
  245. package/spinner/Spinner.stories.jsx +129 -0
  246. package/spinner/Spinner.test.js +64 -0
  247. package/spinner/types.d.ts +32 -0
  248. package/spinner/types.js +5 -0
  249. package/switch/Switch.d.ts +4 -0
  250. package/switch/Switch.js +262 -0
  251. package/switch/Switch.stories.tsx +171 -0
  252. package/switch/Switch.test.js +225 -0
  253. package/switch/types.d.ts +66 -0
  254. package/switch/types.js +5 -0
  255. package/table/Table.d.ts +4 -0
  256. package/{dist/table → table}/Table.js +12 -26
  257. package/table/Table.stories.jsx +356 -0
  258. package/table/Table.test.js +26 -0
  259. package/table/types.d.ts +21 -0
  260. package/table/types.js +5 -0
  261. package/tabs/Tab.d.ts +4 -0
  262. package/tabs/Tab.js +133 -0
  263. package/tabs/Tabs.d.ts +4 -0
  264. package/tabs/Tabs.js +467 -0
  265. package/tabs/Tabs.stories.tsx +226 -0
  266. package/tabs/Tabs.test.js +351 -0
  267. package/tabs/types.d.ts +92 -0
  268. package/tabs/types.js +5 -0
  269. package/tag/Tag.d.ts +4 -0
  270. package/tag/Tag.js +183 -0
  271. package/tag/Tag.stories.tsx +155 -0
  272. package/tag/Tag.test.js +60 -0
  273. package/tag/types.d.ts +69 -0
  274. package/tag/types.js +5 -0
  275. package/text-input/Icons.d.ts +8 -0
  276. package/text-input/Icons.js +60 -0
  277. package/text-input/Suggestion.d.ts +4 -0
  278. package/text-input/Suggestion.js +84 -0
  279. package/text-input/Suggestions.d.ts +4 -0
  280. package/text-input/Suggestions.js +134 -0
  281. package/text-input/TextInput.d.ts +4 -0
  282. package/text-input/TextInput.js +673 -0
  283. package/text-input/TextInput.stories.tsx +569 -0
  284. package/text-input/TextInput.test.js +1724 -0
  285. package/text-input/types.d.ts +197 -0
  286. package/text-input/types.js +5 -0
  287. package/textarea/Textarea.d.ts +4 -0
  288. package/{dist/textarea → textarea}/Textarea.js +50 -142
  289. package/textarea/Textarea.stories.jsx +216 -0
  290. package/textarea/Textarea.test.js +437 -0
  291. package/textarea/types.d.ts +137 -0
  292. package/textarea/types.js +5 -0
  293. package/toggle-group/ToggleGroup.d.ts +4 -0
  294. package/{dist/toggle-group → toggle-group}/ToggleGroup.js +36 -148
  295. package/toggle-group/ToggleGroup.stories.tsx +215 -0
  296. package/toggle-group/ToggleGroup.test.js +156 -0
  297. package/toggle-group/types.d.ts +105 -0
  298. package/toggle-group/types.js +5 -0
  299. package/typography/Typography.d.ts +4 -0
  300. package/typography/Typography.js +131 -0
  301. package/typography/Typography.stories.tsx +198 -0
  302. package/typography/types.d.ts +18 -0
  303. package/typography/types.js +5 -0
  304. package/useTheme.d.ts +2 -0
  305. package/{dist/useTheme.js → useTheme.js} +2 -2
  306. package/useTranslatedLabels.d.ts +2 -0
  307. package/useTranslatedLabels.js +20 -0
  308. package/wizard/Wizard.d.ts +4 -0
  309. package/wizard/Wizard.js +285 -0
  310. package/wizard/Wizard.stories.tsx +253 -0
  311. package/wizard/Wizard.test.js +141 -0
  312. package/wizard/types.d.ts +65 -0
  313. package/wizard/types.js +5 -0
  314. package/README.md +0 -66
  315. package/babel.config.js +0 -8
  316. package/dist/BackgroundColorContext.js +0 -46
  317. package/dist/ThemeContext.js +0 -250
  318. package/dist/V3Select/V3Select.js +0 -549
  319. package/dist/V3Select/index.d.ts +0 -27
  320. package/dist/V3Textarea/V3Textarea.js +0 -264
  321. package/dist/V3Textarea/index.d.ts +0 -27
  322. package/dist/accordion/Accordion.js +0 -353
  323. package/dist/accordion/index.d.ts +0 -28
  324. package/dist/accordion-group/AccordionGroup.js +0 -186
  325. package/dist/accordion-group/index.d.ts +0 -16
  326. package/dist/alert/index.d.ts +0 -51
  327. package/dist/badge/Badge.js +0 -63
  328. package/dist/box/Box.js +0 -156
  329. package/dist/box/index.d.ts +0 -25
  330. package/dist/button/Button.js +0 -238
  331. package/dist/button/index.d.ts +0 -24
  332. package/dist/card/Card.js +0 -254
  333. package/dist/card/index.d.ts +0 -22
  334. package/dist/checkbox/Checkbox.js +0 -299
  335. package/dist/checkbox/index.d.ts +0 -24
  336. package/dist/chip/Chip.js +0 -265
  337. package/dist/chip/index.d.ts +0 -22
  338. package/dist/common/RequiredComponent.js +0 -40
  339. package/dist/date/Date.js +0 -379
  340. package/dist/date/index.d.ts +0 -27
  341. package/dist/date-input/DateInput.js +0 -400
  342. package/dist/date-input/index.d.ts +0 -95
  343. package/dist/dialog/Dialog.js +0 -218
  344. package/dist/dialog/index.d.ts +0 -18
  345. package/dist/dropdown/Dropdown.js +0 -544
  346. package/dist/dropdown/index.d.ts +0 -26
  347. package/dist/file-input/FileInput.js +0 -644
  348. package/dist/file-input/FileItem.js +0 -287
  349. package/dist/file-input/index.d.ts +0 -81
  350. package/dist/footer/Footer.js +0 -421
  351. package/dist/footer/index.d.ts +0 -25
  352. package/dist/header/Header.js +0 -470
  353. package/dist/header/index.d.ts +0 -25
  354. package/dist/heading/index.d.ts +0 -17
  355. package/dist/input-text/Icons.js +0 -22
  356. package/dist/input-text/InputText.js +0 -705
  357. package/dist/input-text/index.d.ts +0 -36
  358. package/dist/layout/ApplicationLayout.js +0 -327
  359. package/dist/link/Link.js +0 -237
  360. package/dist/link/index.d.ts +0 -23
  361. package/dist/main.d.ts +0 -40
  362. package/dist/number-input/NumberInput.js +0 -136
  363. package/dist/number-input/index.d.ts +0 -113
  364. package/dist/paginator/Icons.js +0 -66
  365. package/dist/paginator/Paginator.js +0 -305
  366. package/dist/paginator/index.d.ts +0 -20
  367. package/dist/password-input/index.d.ts +0 -94
  368. package/dist/progress-bar/ProgressBar.js +0 -242
  369. package/dist/progress-bar/index.d.ts +0 -18
  370. package/dist/radio/Radio.js +0 -209
  371. package/dist/radio/index.d.ts +0 -23
  372. package/dist/resultsetTable/ResultsetTable.js +0 -358
  373. package/dist/resultsetTable/index.d.ts +0 -19
  374. package/dist/select/Select.js +0 -1096
  375. package/dist/select/index.d.ts +0 -53
  376. package/dist/sidenav/Sidenav.js +0 -179
  377. package/dist/sidenav/index.d.ts +0 -13
  378. package/dist/slider/Slider.js +0 -404
  379. package/dist/slider/index.d.ts +0 -29
  380. package/dist/spinner/Spinner.js +0 -381
  381. package/dist/spinner/index.d.ts +0 -17
  382. package/dist/switch/Switch.js +0 -222
  383. package/dist/switch/index.d.ts +0 -24
  384. package/dist/table/index.d.ts +0 -13
  385. package/dist/tabs/Tabs.js +0 -343
  386. package/dist/tabs/index.d.ts +0 -19
  387. package/dist/tag/Tag.js +0 -282
  388. package/dist/tag/index.d.ts +0 -24
  389. package/dist/text-input/TextInput.js +0 -974
  390. package/dist/text-input/index.d.ts +0 -135
  391. package/dist/textarea/index.d.ts +0 -117
  392. package/dist/toggle/Toggle.js +0 -220
  393. package/dist/toggle/index.d.ts +0 -21
  394. package/dist/toggle-group/index.d.ts +0 -21
  395. package/dist/upload/Upload.js +0 -205
  396. package/dist/upload/buttons-upload/ButtonsUpload.js +0 -135
  397. package/dist/upload/buttons-upload/Icons.js +0 -40
  398. package/dist/upload/dragAndDropArea/DragAndDropArea.js +0 -329
  399. package/dist/upload/dragAndDropArea/Icons.js +0 -39
  400. package/dist/upload/file-upload/FileToUpload.js +0 -189
  401. package/dist/upload/file-upload/Icons.js +0 -66
  402. package/dist/upload/files-upload/FilesToUpload.js +0 -123
  403. package/dist/upload/index.d.ts +0 -15
  404. package/dist/upload/transaction/Icons.js +0 -160
  405. package/dist/upload/transaction/Transaction.js +0 -148
  406. package/dist/upload/transactions/Transactions.js +0 -138
  407. package/dist/wizard/Icons.js +0 -65
  408. package/dist/wizard/Wizard.js +0 -405
  409. package/dist/wizard/index.d.ts +0 -18
  410. package/test/Accordion.test.js +0 -33
  411. package/test/AccordionGroup.test.js +0 -125
  412. package/test/Alert.test.js +0 -53
  413. package/test/Box.test.js +0 -10
  414. package/test/Button.test.js +0 -18
  415. package/test/Card.test.js +0 -30
  416. package/test/Checkbox.test.js +0 -45
  417. package/test/Chip.test.js +0 -25
  418. package/test/Date.test.js +0 -395
  419. package/test/DateInput.test.js +0 -242
  420. package/test/Dialog.test.js +0 -23
  421. package/test/Dropdown.test.js +0 -145
  422. package/test/FileInput.test.js +0 -201
  423. package/test/Footer.test.js +0 -94
  424. package/test/Header.test.js +0 -34
  425. package/test/Heading.test.js +0 -83
  426. package/test/InputText.test.js +0 -240
  427. package/test/Link.test.js +0 -43
  428. package/test/NumberInput.test.js +0 -259
  429. package/test/Paginator.test.js +0 -181
  430. package/test/PasswordInput.test.js +0 -83
  431. package/test/ProgressBar.test.js +0 -35
  432. package/test/Radio.test.js +0 -37
  433. package/test/ResultsetTable.test.js +0 -330
  434. package/test/Select.test.js +0 -415
  435. package/test/Sidenav.test.js +0 -45
  436. package/test/Slider.test.js +0 -74
  437. package/test/Spinner.test.js +0 -32
  438. package/test/Switch.test.js +0 -45
  439. package/test/Table.test.js +0 -36
  440. package/test/Tabs.test.js +0 -109
  441. package/test/Tag.test.js +0 -32
  442. package/test/TextInput.test.js +0 -732
  443. package/test/Textarea.test.js +0 -193
  444. package/test/ToggleGroup.test.js +0 -85
  445. package/test/Upload.test.js +0 -60
  446. package/test/V3Select.test.js +0 -212
  447. package/test/V3TextArea.test.js +0 -51
  448. package/test/Wizard.test.js +0 -130
  449. package/test/mocks/pngMock.js +0 -1
  450. package/test/mocks/svgMock.js +0 -1
  451. /package/{dist/common → common}/OpenSans.css +0 -0
  452. /package/{dist/common → common}/fonts/OpenSans-Bold.ttf +0 -0
  453. /package/{dist/common → common}/fonts/OpenSans-BoldItalic.ttf +0 -0
  454. /package/{dist/common → common}/fonts/OpenSans-ExtraBold.ttf +0 -0
  455. /package/{dist/common → common}/fonts/OpenSans-ExtraBoldItalic.ttf +0 -0
  456. /package/{dist/common → common}/fonts/OpenSans-Italic.ttf +0 -0
  457. /package/{dist/common → common}/fonts/OpenSans-Light.ttf +0 -0
  458. /package/{dist/common → common}/fonts/OpenSans-LightItalic.ttf +0 -0
  459. /package/{dist/common → common}/fonts/OpenSans-Regular.ttf +0 -0
  460. /package/{dist/common → common}/fonts/OpenSans-SemiBold.ttf +0 -0
  461. /package/{dist/common → common}/fonts/OpenSans-SemiBoldItalic.ttf +0 -0
  462. /package/{dist/common → common}/utils.js +0 -0
@@ -1,381 +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 _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 _react = _interopRequireWildcard(require("react"));
19
-
20
- var _styledComponents = _interopRequireWildcard(require("styled-components"));
21
-
22
- var _propTypes = _interopRequireDefault(require("prop-types"));
23
-
24
- var _variables = require("../common/variables.js");
25
-
26
- var _useTheme = _interopRequireDefault(require("../useTheme.js"));
27
-
28
- var _BackgroundColorContext = _interopRequireDefault(require("../BackgroundColorContext.js"));
29
-
30
- function _templateObject12() {
31
- var data = (0, _taggedTemplateLiteral2["default"])(["\n margin: 0;\n width: 100%;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n display: ", ";\n font-family: ", ";\n font-weight: ", ";\n font-size: ", ";\n font-style: ", ";\n color: ", ";\n text-align: ", ";\n letter-spacing: ", ";\n"]);
32
-
33
- _templateObject12 = function _templateObject12() {
34
- return data;
35
- };
36
-
37
- return data;
38
- }
39
-
40
- function _templateObject11() {
41
- var data = (0, _taggedTemplateLiteral2["default"])(["\n margin: 0;\n width: 100%;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n font-family: ", ";\n font-weight: ", ";\n font-size: ", ";\n font-style: ", ";\n color: ", ";\n text-align: ", ";\n letter-spacing: ", ";\n"]);
42
-
43
- _templateObject11 = function _templateObject11() {
44
- return data;
45
- };
46
-
47
- return data;
48
- }
49
-
50
- function _templateObject10() {
51
- var data = (0, _taggedTemplateLiteral2["default"])(["\n display: block;\n margin: 0 auto;\n position: absolute;\n text-align: center;\n width: 110px;\n"]);
52
-
53
- _templateObject10 = function _templateObject10() {
54
- return data;
55
- };
56
-
57
- return data;
58
- }
59
-
60
- function _templateObject9() {
61
- var data = (0, _taggedTemplateLiteral2["default"])(["\n fill: transparent;\n stroke-linecap: initial;\n vector-effect: non-scaling-stroke;\n animation: ", ";\n stroke: ", ";\n transform-origin: ", ";\n stroke-dasharray: ", ";\n stroke-width: ", ";\n stroke-dashoffset: ", ";\n"]);
62
-
63
- _templateObject9 = function _templateObject9() {
64
- return data;
65
- };
66
-
67
- return data;
68
- }
69
-
70
- function _templateObject8() {
71
- var data = (0, _taggedTemplateLiteral2["default"])(["\n height: inherit;\n width: inherit;\n transform: rotate(-90deg);\n top: 0;\n left: 0;\n transform-origin: center;\n overflow: visible;\n animation: ", ";\n"]);
72
-
73
- _templateObject8 = function _templateObject8() {
74
- return data;
75
- };
76
-
77
- return data;
78
- }
79
-
80
- function _templateObject7() {
81
- var data = (0, _taggedTemplateLiteral2["default"])(["\n height: inherit;\n width: inherit;\n position: relative;\n z-index: 2;\n"]);
82
-
83
- _templateObject7 = function _templateObject7() {
84
- return data;
85
- };
86
-
87
- return data;
88
- }
89
-
90
- function _templateObject6() {
91
- var data = (0, _taggedTemplateLiteral2["default"])(["\n animation: none;\n fill: transparent;\n stroke: ", ";\n stroke-dasharray: ", ";\n stroke-linecap: initial;\n stroke-width: ", ";\n transform-origin: 50% 50%;\n vector-effect: non-scaling-stroke;\n"]);
92
-
93
- _templateObject6 = function _templateObject6() {
94
- return data;
95
- };
96
-
97
- return data;
98
- }
99
-
100
- function _templateObject5() {
101
- var data = (0, _taggedTemplateLiteral2["default"])(["\n height: inherit;\n width: inherit;\n"]);
102
-
103
- _templateObject5 = function _templateObject5() {
104
- return data;
105
- };
106
-
107
- return data;
108
- }
109
-
110
- function _templateObject4() {
111
- var data = (0, _taggedTemplateLiteral2["default"])(["\n height: inherit;\n width: inherit;\n position: absolute;\n z-index: 1;\n"]);
112
-
113
- _templateObject4 = function _templateObject4() {
114
- return data;
115
- };
116
-
117
- return data;
118
- }
119
-
120
- function _templateObject3() {
121
- var data = (0, _taggedTemplateLiteral2["default"])(["\n width: 100vw;\n height: 100vh;\n opacity: 1;\n transition: opacity 225ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;\n position: fixed;\n top: 0;\n left: 0;\n background-color: ", ";\n opacity: ", ";\n"]);
122
-
123
- _templateObject3 = function _templateObject3() {
124
- return data;
125
- };
126
-
127
- return data;
128
- }
129
-
130
- function _templateObject2() {
131
- var data = (0, _taggedTemplateLiteral2["default"])(["\n align-items: center;\n display: flex;\n height: ", ";\n width: ", ";\n justify-content: center;\n position: relative;\n background-color: transparent;\n\n @keyframes spinner-svg {\n 0% {\n transform: rotateZ(0deg);\n }\n 100% {\n transform: rotateZ(360deg);\n }\n }\n @keyframes svg-circle-large {\n 0% {\n stroke-dashoffset: 400;\n transform: rotate(0);\n }\n\n 50% {\n stroke-dashoffset: 75;\n transform: rotate(45deg);\n }\n\n 100% {\n stroke-dashoffset: 400;\n transform: rotate(360deg);\n }\n }\n @keyframes svg-circle-small {\n 0% {\n stroke-dashoffset: 35;\n transform: rotate(0);\n }\n\n 50% {\n stroke-dashoffset: 8;\n transform: rotate(45deg);\n }\n\n 100% {\n stroke-dashoffset: 35;\n transform: rotate(360deg);\n }\n }\n"]);
132
-
133
- _templateObject2 = function _templateObject2() {
134
- return data;
135
- };
136
-
137
- return data;
138
- }
139
-
140
- function _templateObject() {
141
- var data = (0, _taggedTemplateLiteral2["default"])(["\n height: ", ";\n width: ", ";\n display: ", ";\n position: ", ";\n top: ", ";\n left: ", ";\n justify-content: ", ";\n align-items: ", ";\n z-index: ", ";\n\n margin: ", ";\n margin-top: ", ";\n margin-right: ", ";\n margin-bottom: ", ";\n margin-left: ", ";\n"]);
142
-
143
- _templateObject = function _templateObject() {
144
- return data;
145
- };
146
-
147
- return data;
148
- }
149
-
150
- var DxcSpinner = function DxcSpinner(_ref) {
151
- var _ref$label = _ref.label,
152
- label = _ref$label === void 0 ? "" : _ref$label,
153
- value = _ref.value,
154
- _ref$showValue = _ref.showValue,
155
- showValue = _ref$showValue === void 0 ? false : _ref$showValue,
156
- _ref$mode = _ref.mode,
157
- mode = _ref$mode === void 0 ? "large" : _ref$mode,
158
- margin = _ref.margin;
159
- var colorsTheme = (0, _useTheme["default"])();
160
- var backgroundType = (0, _react.useContext)(_BackgroundColorContext["default"]);
161
- return _react["default"].createElement(_styledComponents.ThemeProvider, {
162
- theme: colorsTheme.spinner
163
- }, _react["default"].createElement(DXCSpinner, {
164
- margin: margin,
165
- mode: mode
166
- }, _react["default"].createElement(SpinnerContainer, {
167
- backgroundType: backgroundType,
168
- mode: mode
169
- }, mode === "overlay" && _react["default"].createElement(BackOverlay, null), _react["default"].createElement(BackgroundSpinner, {
170
- mode: mode
171
- }, mode !== "small" && _react["default"].createElement(SVGBackground, {
172
- viewBox: "0 0 140 140"
173
- }, _react["default"].createElement(CircleBackground, {
174
- cx: "70",
175
- cy: "70",
176
- r: "65",
177
- mode: mode
178
- })), mode === "small" && _react["default"].createElement(SVGBackground, {
179
- viewBox: "0 0 16 16"
180
- }, _react["default"].createElement(CircleBackground, {
181
- cx: "8",
182
- cy: "8",
183
- r: "6",
184
- mode: mode
185
- }))), value >= 0 && value <= 100 ? _react["default"].createElement(Spinner, {
186
- role: "progressbar",
187
- mode: mode
188
- }, mode !== "small" && _react["default"].createElement(SVGSpinner, {
189
- viewBox: "0 0 140 140",
190
- isDeterminated: true
191
- }, _react["default"].createElement(CircleSpinner, {
192
- cx: "70",
193
- cy: "70",
194
- r: "65",
195
- backgroundType: backgroundType,
196
- mode: mode,
197
- isDeterminated: true,
198
- value: value
199
- })), mode === "small" && _react["default"].createElement(SVGSpinner, {
200
- viewBox: "0 0 16 16",
201
- isDeterminated: true
202
- }, _react["default"].createElement(CircleSpinner, {
203
- cx: "8",
204
- cy: "8",
205
- r: "6",
206
- backgroundType: backgroundType,
207
- mode: mode,
208
- isDeterminated: true,
209
- value: value
210
- }))) : _react["default"].createElement(Spinner, {
211
- role: "progressbar",
212
- mode: mode
213
- }, mode !== "small" && _react["default"].createElement(SVGSpinner, {
214
- viewBox: "0 0 140 140",
215
- isDeterminated: false
216
- }, _react["default"].createElement(CircleSpinner, {
217
- cx: "70",
218
- cy: "70",
219
- r: "65",
220
- backgroundType: backgroundType,
221
- mode: mode,
222
- isDeterminated: false
223
- })), mode === "small" && _react["default"].createElement(SVGSpinner, {
224
- viewBox: "0 0 16 16",
225
- isDeterminated: false
226
- }, _react["default"].createElement(CircleSpinner, {
227
- cx: "8",
228
- cy: "8",
229
- r: "6",
230
- backgroundType: backgroundType,
231
- mode: mode,
232
- isDeterminated: false
233
- }))), mode !== "small" && _react["default"].createElement(LabelsContainer, {
234
- label: label,
235
- value: value,
236
- showValue: showValue
237
- }, _react["default"].createElement(SpinnerLabel, {
238
- backgroundType: backgroundType,
239
- mode: mode
240
- }, label), (value || value === 0) && showValue && _react["default"].createElement(SpinnerProgress, {
241
- backgroundType: backgroundType,
242
- mode: mode,
243
- showValue: showValue
244
- }, value, "%")))));
245
- };
246
-
247
- var determinatedValue = function determinatedValue(props, strokeDashArray) {
248
- var val = 0;
249
-
250
- if (props.value >= 0 && props.value <= 100) {
251
- val = strokeDashArray * (1 - props.value / 100);
252
- }
253
-
254
- return val;
255
- };
256
-
257
- DxcSpinner.propTypes = {
258
- label: _propTypes["default"].string,
259
- value: _propTypes["default"].number,
260
- showValue: _propTypes["default"].bool,
261
- mode: _propTypes["default"].oneOf(["large", "small", "overlay"]),
262
- margin: _propTypes["default"].oneOfType([_propTypes["default"].shape({
263
- top: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
264
- bottom: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
265
- left: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
266
- right: _propTypes["default"].oneOf(Object.keys(_variables.spaces))
267
- }), _propTypes["default"].oneOf((0, _toConsumableArray2["default"])(Object.keys(_variables.spaces)))])
268
- };
269
-
270
- var DXCSpinner = _styledComponents["default"].div(_templateObject(), function (props) {
271
- return props.mode === "overlay" ? "100vh" : "";
272
- }, function (props) {
273
- return props.mode === "overlay" ? "100vw" : "";
274
- }, function (props) {
275
- return props.mode === "overlay" ? "flex" : "";
276
- }, function (props) {
277
- return props.mode === "overlay" ? "fixed" : "";
278
- }, function (props) {
279
- return props.mode === "overlay" ? 0 : "";
280
- }, function (props) {
281
- return props.mode === "overlay" ? 0 : "";
282
- }, function (props) {
283
- return props.mode === "overlay" ? "center" : "";
284
- }, function (props) {
285
- return props.mode === "overlay" ? "center" : "";
286
- }, function (props) {
287
- return props.mode === "overlay" ? 1300 : "";
288
- }, function (props) {
289
- return props.margin && (0, _typeof2["default"])(props.margin) !== "object" ? _variables.spaces[props.margin] : "0px";
290
- }, function (props) {
291
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.top ? _variables.spaces[props.margin.top] : "";
292
- }, function (props) {
293
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.right ? _variables.spaces[props.margin.right] : "";
294
- }, function (props) {
295
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.bottom ? _variables.spaces[props.margin.bottom] : "";
296
- }, function (props) {
297
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.left ? _variables.spaces[props.margin.left] : "";
298
- });
299
-
300
- var SpinnerContainer = _styledComponents["default"].div(_templateObject2(), function (props) {
301
- return props.mode === "small" ? "16px" : "140px";
302
- }, function (props) {
303
- return props.mode === "small" ? "16px" : "140px";
304
- });
305
-
306
- var BackOverlay = _styledComponents["default"].div(_templateObject3(), function (props) {
307
- return "".concat(props.theme.overlayBackgroundColor);
308
- }, function (props) {
309
- return "".concat(props.theme.overlayOpacity);
310
- });
311
-
312
- var BackgroundSpinner = _styledComponents["default"].div(_templateObject4());
313
-
314
- var SVGBackground = _styledComponents["default"].svg(_templateObject5());
315
-
316
- var CircleBackground = _styledComponents["default"].circle(_templateObject6(), function (props) {
317
- return "".concat(props.theme.totalCircleColor);
318
- }, function (props) {
319
- return props.mode !== "small" ? "409" : "38";
320
- }, function (props) {
321
- return props.mode !== "small" ? "8.5px" : "2px";
322
- });
323
-
324
- var Spinner = _styledComponents["default"].div(_templateObject7());
325
-
326
- var SVGSpinner = _styledComponents["default"].svg(_templateObject8(), function (props) {
327
- return !props.isDeterminated ? "1.4s linear infinite both spinner-svg" : "";
328
- });
329
-
330
- var CircleSpinner = _styledComponents["default"].circle(_templateObject9(), function (props) {
331
- return props.isDeterminated ? "none" : props.mode !== "small" ? "1.4s ease-in-out infinite both svg-circle-large" : "1.4s ease-in-out infinite both svg-circle-small";
332
- }, function (props) {
333
- return props.backgroundType === "dark" ? props.theme.trackCircleColorOnDark : props.theme.trackCircleColor;
334
- }, function (props) {
335
- return !props.isDeterminated ? "50% 50%" : "";
336
- }, function (props) {
337
- return props.mode !== "small" ? "409" : "38";
338
- }, function (props) {
339
- return props.mode !== "small" ? "8.5px" : "2px";
340
- }, function (props) {
341
- return props.isDeterminated ? props.mode !== "small" ? determinatedValue(props, 409) : determinatedValue(props, 38) : "";
342
- });
343
-
344
- var LabelsContainer = _styledComponents["default"].div(_templateObject10());
345
-
346
- var SpinnerLabel = _styledComponents["default"].p(_templateObject11(), function (props) {
347
- return props.mode === "overlay" ? props.theme.overlayLabelFontFamily : props.theme.labelFontFamily;
348
- }, function (props) {
349
- return props.mode === "overlay" ? props.theme.overlayLabelFontWeight : props.theme.labelFontWeight;
350
- }, function (props) {
351
- return props.mode === "overlay" ? props.theme.overlayLabelFontSize : props.theme.labelFontSize;
352
- }, function (props) {
353
- return props.mode === "overlay" ? props.theme.overlayLabelFontStyle : props.theme.labelFontStyle;
354
- }, function (props) {
355
- return props.mode === "overlay" ? props.theme.overlayLabelFontColor : props.backgroundType === "dark" ? props.theme.labelFontColorOnDark : props.theme.labelFontColor;
356
- }, function (props) {
357
- return props.mode === "overlay" ? props.theme.overlayLabelTextAlign : props.theme.labelTextAlign;
358
- }, function (props) {
359
- return props.mode === "overlay" ? props.theme.overlayLabelLetterSpacing : props.theme.labelLetterSpacing;
360
- });
361
-
362
- var SpinnerProgress = _styledComponents["default"].p(_templateObject12(), function (props) {
363
- return props.value !== "" && props.showValue === true && "block" || "none";
364
- }, function (props) {
365
- return props.mode === "overlay" ? props.theme.overlayProgressValueFontFamily : props.theme.progressValueFontFamily;
366
- }, function (props) {
367
- return props.mode === "overlay" ? props.theme.overlayProgressValueFontWeight : props.theme.progressValueFontWeight;
368
- }, function (props) {
369
- return props.mode === "overlay" ? props.theme.overlayProgressValueFontSize : props.theme.progressValueFontSize;
370
- }, function (props) {
371
- return props.mode === "overlay" ? props.theme.overlayProgressValueFontStyle : props.theme.progressValueFontStyle;
372
- }, function (props) {
373
- return props.mode === "overlay" ? props.theme.overlayProgressValueFontColor : props.backgroundType === "dark" ? props.theme.progressValueFontColorOnDark : props.theme.progressValueFontColor;
374
- }, function (props) {
375
- return props.mode === "overlay" ? props.theme.overlayProgressValueTextAlign : props.theme.progressValueTextAlign;
376
- }, function (props) {
377
- return props.mode === "overlay" ? props.theme.overlayProgressValueLetterSpacing : props.theme.progressValueLetterSpacing;
378
- });
379
-
380
- var _default = DxcSpinner;
381
- exports["default"] = _default;
@@ -1,17 +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
- value?: number;
12
- showValue?: boolean;
13
- mode?: "large" | "small" | "overlay";
14
- margin?: Space | Margin;
15
- };
16
-
17
- export default function DxcSpinner(props: Props): JSX.Element;
@@ -1,222 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
4
-
5
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
6
-
7
- Object.defineProperty(exports, "__esModule", {
8
- value: true
9
- });
10
- exports["default"] = void 0;
11
-
12
- var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
13
-
14
- var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
15
-
16
- var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
17
-
18
- var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
19
-
20
- var _react = _interopRequireWildcard(require("react"));
21
-
22
- var _styledComponents = _interopRequireWildcard(require("styled-components"));
23
-
24
- var _propTypes = _interopRequireDefault(require("prop-types"));
25
-
26
- var _core = require("@material-ui/core");
27
-
28
- var _RequiredComponent = _interopRequireDefault(require("../common/RequiredComponent"));
29
-
30
- var _variables = require("../common/variables.js");
31
-
32
- var _utils = require("../common/utils.js");
33
-
34
- var _useTheme = _interopRequireDefault(require("../useTheme.js"));
35
-
36
- var _BackgroundColorContext = _interopRequireDefault(require("../BackgroundColorContext.js"));
37
-
38
- function _templateObject2() {
39
- var data = (0, _taggedTemplateLiteral2["default"])(["\n color: ", ";\n opacity: 1;\n font-family: ", ";\n font-size: ", ";\n font-style: ", ";\n font-weight: ", ";\n cursor: ", ";\n ", "\n"]);
40
-
41
- _templateObject2 = function _templateObject2() {
42
- return data;
43
- };
44
-
45
- return data;
46
- }
47
-
48
- function _templateObject() {
49
- var data = (0, _taggedTemplateLiteral2["default"])(["\n width: ", ";\n display: inline-flex;\n align-items: center;\n flex-direction: ", ";\n\n margin: ", ";\n margin-top: ", ";\n margin-right: ", ";\n margin-bottom: ", ";\n margin-left: ", ";\n cursor: ", ";\n opacity: 1;\n \n .MuiSwitch-root {\n align-items: center;\n width: ", ";\n height: 45px;\n margin: 3px;\n\n .Mui-focusVisible {\n border: ", ";\n padding: 7px;\n }\n\n .MuiSwitch-track {\n /*Enabled and unchecked bar*/\n background-color: ", ";\n height: ", ";\n }\n\n .MuiSwitch-switchBase + .MuiSwitch-track {\n opacity: 1;\n }\n\n .MuiIconButton-root {\n /*Enabled and unchecked*/\n top: unset;\n .MuiSwitch-thumb {\n /*Only for thumb in all states*/\n width: ", ";\n height: ", ";\n }\n color: ", ";\n &:hover {\n background-color: transparent;\n }\n &.Mui-disabled {\n /*Disabled and unchecked*/\n color: ", ";\n + .MuiSwitch-track {\n /*Disabled and unchecked bar*/\n background-color: ", ";\n }\n }\n &.Mui-disabled.Mui-checked {\n /*Disabled and checked*/\n color: ", ";\n + .MuiSwitch-track {\n /*Disabled and checked bar*/\n background-color: ", ";\n }\n }\n &.Mui-checked {\n /*Enabled and checked*/\n color: ", ";\n transform: translateX(", ");\n &:hover {\n background-color: transparent;\n }\n + .MuiSwitch-track {\n /*Enabled and checked bar*/\n background-color: ", ";\n }\n }\n }\n }\n"]);
50
-
51
- _templateObject = function _templateObject() {
52
- return data;
53
- };
54
-
55
- return data;
56
- }
57
-
58
- var DxcSwitch = function DxcSwitch(_ref) {
59
- var checked = _ref.checked,
60
- value = _ref.value,
61
- label = _ref.label,
62
- _ref$labelPosition = _ref.labelPosition,
63
- labelPosition = _ref$labelPosition === void 0 ? "before" : _ref$labelPosition,
64
- name = _ref.name,
65
- _ref$disabled = _ref.disabled,
66
- disabled = _ref$disabled === void 0 ? false : _ref$disabled,
67
- onChange = _ref.onChange,
68
- _ref$required = _ref.required,
69
- required = _ref$required === void 0 ? false : _ref$required,
70
- margin = _ref.margin,
71
- _ref$size = _ref.size,
72
- size = _ref$size === void 0 ? "fitContent" : _ref$size,
73
- _ref$tabIndex = _ref.tabIndex,
74
- tabIndex = _ref$tabIndex === void 0 ? 0 : _ref$tabIndex;
75
-
76
- var _useState = (0, _react.useState)(0),
77
- _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
78
- innerChecked = _useState2[0],
79
- setInnerChecked = _useState2[1];
80
-
81
- var colorsTheme = (0, _useTheme["default"])();
82
- var backgroundType = (0, _react.useContext)(_BackgroundColorContext["default"]);
83
-
84
- var handlerSwitchChange = function handlerSwitchChange(newValue) {
85
- if (checked === undefined) {
86
- var isChecked = newValue.target.checked === undefined ? !innerChecked : newValue.target.checked;
87
- setInnerChecked(isChecked);
88
-
89
- if (typeof onChange === "function") {
90
- onChange(isChecked);
91
- }
92
- } else {
93
- if (typeof onChange === "function") {
94
- onChange(!checked);
95
- }
96
- }
97
- };
98
-
99
- return _react["default"].createElement(_styledComponents.ThemeProvider, {
100
- theme: colorsTheme["switch"]
101
- }, _react["default"].createElement(SwitchContainer, {
102
- margin: margin,
103
- disabled: disabled,
104
- labelPosition: labelPosition,
105
- size: size,
106
- backgroundType: backgroundType
107
- }, _react["default"].createElement(_core.Switch, {
108
- checked: checked != undefined ? checked : innerChecked,
109
- inputProps: {
110
- name: name,
111
- tabIndex: tabIndex
112
- },
113
- onChange: handlerSwitchChange,
114
- value: value,
115
- disabled: disabled,
116
- disableRipple: true
117
- }), _react["default"].createElement(LabelContainer, {
118
- labelPosition: labelPosition,
119
- onClick: disabled === true ? function () {} : handlerSwitchChange,
120
- disabled: disabled,
121
- backgroundType: backgroundType
122
- }, required && _react["default"].createElement(_RequiredComponent["default"], null), label)));
123
- };
124
-
125
- var sizes = {
126
- small: "60px",
127
- medium: "240px",
128
- large: "480px",
129
- fillParent: "100%",
130
- fitContent: "unset"
131
- };
132
-
133
- var calculateWidth = function calculateWidth(margin, size) {
134
- if (size === "fillParent") {
135
- return "calc(".concat(sizes[size], " - ").concat((0, _utils.getMargin)(margin, "left"), " - ").concat((0, _utils.getMargin)(margin, "right"), ")");
136
- }
137
-
138
- return sizes[size];
139
- };
140
-
141
- var SwitchContainer = _styledComponents["default"].div(_templateObject(), function (props) {
142
- return calculateWidth(props.margin, props.size);
143
- }, function (props) {
144
- return props.labelPosition === "after" ? "row" : "row-reverse";
145
- }, function (props) {
146
- return props.margin && (0, _typeof2["default"])(props.margin) !== "object" ? _variables.spaces[props.margin] : "0px";
147
- }, function (props) {
148
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.top ? _variables.spaces[props.margin.top] : "";
149
- }, function (props) {
150
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.right ? _variables.spaces[props.margin.right] : "";
151
- }, function (props) {
152
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.bottom ? _variables.spaces[props.margin.bottom] : "";
153
- }, function (props) {
154
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.left ? _variables.spaces[props.margin.left] : "";
155
- }, function (props) {
156
- return props.disabled ? "not-allowed" : "default";
157
- }, function (props) {
158
- return props.theme.trackWidth;
159
- }, function (props) {
160
- return "".concat(props.backgroundType === "dark" ? props.theme.thumbFocusColorOnDark : props.theme.thumbFocusColor, " solid 2px");
161
- }, function (props) {
162
- return props.backgroundType === "dark" ? props.theme.uncheckedTrackBackgroundColorOnDark : props.theme.uncheckedTrackBackgroundColor;
163
- }, function (props) {
164
- return props.theme.trackHeight;
165
- }, function (props) {
166
- return props.theme.thumbWidth;
167
- }, function (props) {
168
- return props.theme.thumbHeight;
169
- }, function (props) {
170
- return props.backgroundType === "dark" ? props.theme.uncheckedThumbBackgroundColorOnDark : props.theme.uncheckedThumbBackgroundColor;
171
- }, function (props) {
172
- return props.backgroundType === "dark" ? props.theme.disabledUncheckedThumbBackgroundColorOnDark : props.theme.disabledUncheckedThumbBackgroundColor;
173
- }, function (props) {
174
- return props.backgroundType === "dark" ? props.theme.disabledUncheckedTrackBackgroundColorOnDark : props.theme.disabledUncheckedTrackBackgroundColor;
175
- }, function (props) {
176
- return props.backgroundType === "dark" ? props.theme.disabledCheckedThumbBackgroundColorOnDark : props.theme.disabledCheckedThumbBackgroundColor;
177
- }, function (props) {
178
- return props.backgroundType === "dark" ? props.theme.disabledCheckedTrackBackgroundColorOnDark : props.theme.disabledCheckedTrackBackgroundColor;
179
- }, function (props) {
180
- return props.backgroundType === "dark" ? props.theme.checkedThumbBackgroundColorOnDark : props.theme.checkedThumbBackgroundColor;
181
- }, function (props) {
182
- return props.theme.thumbShift;
183
- }, function (props) {
184
- return props.backgroundType === "dark" ? props.theme.checkedTrackBackgroundColorOnDark : props.theme.checkedTrackBackgroundColor;
185
- });
186
-
187
- var LabelContainer = _styledComponents["default"].span(_templateObject2(), function (props) {
188
- return props.disabled ? props.backgroundType === "dark" ? props.theme.disabledLabelFontColorOnDark : props.theme.disabledLabelFontColor : props.backgroundType === "dark" ? props.theme.labelFontColorOnDark : props.theme.labelFontColor;
189
- }, function (props) {
190
- return props.theme.labelFontFamily;
191
- }, function (props) {
192
- return props.theme.labelFontSize;
193
- }, function (props) {
194
- return props.disabled ? props.theme.disabledLabelFontStyle : props.theme.labelFontStyle;
195
- }, function (props) {
196
- return props.theme.labelFontWeight;
197
- }, function (props) {
198
- return props.disabled === true ? "not-allowed" : "pointer";
199
- }, function (props) {
200
- return props.labelPosition === "after" ? "margin-left: ".concat(props.theme.spaceBetweenLabelSwitch, ";") : "margin-right: ".concat(props.theme.spaceBetweenLabelSwitch, ";");
201
- });
202
-
203
- DxcSwitch.propTypes = {
204
- size: _propTypes["default"].oneOf((0, _toConsumableArray2["default"])(Object.keys(sizes))),
205
- checked: _propTypes["default"].bool,
206
- value: _propTypes["default"].any,
207
- label: _propTypes["default"].string,
208
- labelPosition: _propTypes["default"].oneOf(["after", "before", ""]),
209
- name: _propTypes["default"].string,
210
- disabled: _propTypes["default"].bool,
211
- onChange: _propTypes["default"].func,
212
- required: _propTypes["default"].bool,
213
- margin: _propTypes["default"].oneOfType([_propTypes["default"].shape({
214
- top: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
215
- bottom: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
216
- left: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
217
- right: _propTypes["default"].oneOf(Object.keys(_variables.spaces))
218
- }), _propTypes["default"].oneOf((0, _toConsumableArray2["default"])(Object.keys(_variables.spaces)))]),
219
- tabIndex: _propTypes["default"].number
220
- };
221
- var _default = DxcSwitch;
222
- 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
- checked?: boolean;
12
- value?: any;
13
- label?: string;
14
- labelPosition?: "before" | "after";
15
- name?: string,
16
- disabled?: boolean;
17
- onChange?: void;
18
- required?: boolean;
19
- margin?: Space | Margin;
20
- size?: Size;
21
- tabIndex?: number;
22
- };
23
-
24
- export default function DxcSwitch(props: Props): JSX.Element;
@@ -1,13 +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
- margin?: Space | Margin;
11
- };
12
-
13
- export default function DxcTable(props: Props): JSX.Element;