@dxc-technology/halstack-react 0.0.0-c6243ef → 0.0.0-c67081d

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 (513) hide show
  1. package/BackgroundColorContext.d.ts +10 -0
  2. package/BackgroundColorContext.js +47 -0
  3. package/HalstackContext.d.ts +1356 -0
  4. package/HalstackContext.js +335 -0
  5. package/README.md +28 -47
  6. package/accordion/Accordion.d.ts +4 -0
  7. package/accordion/Accordion.js +222 -0
  8. package/accordion/Accordion.stories.tsx +297 -0
  9. package/accordion/Accordion.test.js +71 -0
  10. package/accordion/types.d.ts +57 -0
  11. package/accordion/types.js +5 -0
  12. package/accordion-group/AccordionGroup.d.ts +8 -0
  13. package/accordion-group/AccordionGroup.js +128 -0
  14. package/accordion-group/AccordionGroup.stories.tsx +252 -0
  15. package/accordion-group/AccordionGroup.test.js +116 -0
  16. package/accordion-group/AccordionGroupAccordion.d.ts +4 -0
  17. package/accordion-group/AccordionGroupAccordion.js +43 -0
  18. package/accordion-group/types.d.ts +67 -0
  19. package/accordion-group/types.js +5 -0
  20. package/alert/Alert.d.ts +4 -0
  21. package/{dist/alert → alert}/Alert.js +45 -159
  22. package/alert/Alert.stories.tsx +198 -0
  23. package/alert/Alert.test.js +92 -0
  24. package/alert/types.d.ts +49 -0
  25. package/alert/types.js +5 -0
  26. package/badge/Badge.d.ts +4 -0
  27. package/badge/Badge.js +61 -0
  28. package/badge/types.d.ts +5 -0
  29. package/badge/types.js +5 -0
  30. package/bleed/Bleed.d.ts +3 -0
  31. package/bleed/Bleed.js +51 -0
  32. package/bleed/Bleed.stories.tsx +342 -0
  33. package/bleed/types.d.ts +37 -0
  34. package/bleed/types.js +5 -0
  35. package/box/Box.d.ts +4 -0
  36. package/box/Box.js +97 -0
  37. package/box/Box.stories.tsx +119 -0
  38. package/box/Box.test.js +18 -0
  39. package/box/types.d.ts +32 -0
  40. package/box/types.js +5 -0
  41. package/bulleted-list/BulletedList.d.ts +7 -0
  42. package/bulleted-list/BulletedList.js +125 -0
  43. package/bulleted-list/BulletedList.stories.tsx +206 -0
  44. package/bulleted-list/types.d.ts +38 -0
  45. package/bulleted-list/types.js +5 -0
  46. package/button/Button.d.ts +4 -0
  47. package/button/Button.js +144 -0
  48. package/button/Button.stories.tsx +425 -0
  49. package/button/Button.test.js +46 -0
  50. package/button/types.d.ts +57 -0
  51. package/button/types.js +5 -0
  52. package/card/Card.d.ts +4 -0
  53. package/card/Card.js +143 -0
  54. package/card/Card.stories.tsx +171 -0
  55. package/card/Card.test.js +50 -0
  56. package/card/types.d.ts +62 -0
  57. package/card/types.js +5 -0
  58. package/checkbox/Checkbox.d.ts +4 -0
  59. package/checkbox/Checkbox.js +269 -0
  60. package/checkbox/Checkbox.stories.tsx +276 -0
  61. package/checkbox/Checkbox.test.js +228 -0
  62. package/checkbox/types.d.ts +72 -0
  63. package/checkbox/types.js +5 -0
  64. package/chip/Chip.d.ts +4 -0
  65. package/chip/Chip.js +140 -0
  66. package/chip/Chip.stories.tsx +214 -0
  67. package/chip/Chip.test.js +54 -0
  68. package/chip/types.d.ts +45 -0
  69. package/chip/types.js +5 -0
  70. package/common/OpenSans.css +69 -0
  71. package/common/coreTokens.d.ts +146 -0
  72. package/common/coreTokens.js +167 -0
  73. package/common/utils.d.ts +1 -0
  74. package/{dist/common → common}/utils.js +4 -4
  75. package/common/variables.d.ts +1499 -0
  76. package/common/variables.js +1378 -0
  77. package/date-input/Calendar.d.ts +4 -0
  78. package/date-input/Calendar.js +258 -0
  79. package/date-input/DateInput.d.ts +4 -0
  80. package/date-input/DateInput.js +271 -0
  81. package/date-input/DateInput.stories.tsx +314 -0
  82. package/date-input/DateInput.test.js +849 -0
  83. package/date-input/DatePicker.d.ts +4 -0
  84. package/date-input/DatePicker.js +146 -0
  85. package/date-input/Icons.d.ts +6 -0
  86. package/date-input/Icons.js +75 -0
  87. package/date-input/YearPicker.d.ts +4 -0
  88. package/date-input/YearPicker.js +126 -0
  89. package/date-input/types.d.ts +164 -0
  90. package/date-input/types.js +5 -0
  91. package/dialog/Dialog.d.ts +4 -0
  92. package/dialog/Dialog.js +131 -0
  93. package/dialog/Dialog.stories.tsx +195 -0
  94. package/dialog/Dialog.test.js +369 -0
  95. package/dialog/types.d.ts +31 -0
  96. package/dialog/types.js +5 -0
  97. package/dropdown/Dropdown.d.ts +4 -0
  98. package/dropdown/Dropdown.js +388 -0
  99. package/dropdown/Dropdown.stories.tsx +438 -0
  100. package/dropdown/Dropdown.test.js +586 -0
  101. package/dropdown/DropdownMenu.d.ts +4 -0
  102. package/dropdown/DropdownMenu.js +74 -0
  103. package/dropdown/DropdownMenuItem.d.ts +4 -0
  104. package/dropdown/DropdownMenuItem.js +79 -0
  105. package/dropdown/types.d.ts +100 -0
  106. package/dropdown/types.js +5 -0
  107. package/file-input/FileInput.d.ts +4 -0
  108. package/file-input/FileInput.js +547 -0
  109. package/file-input/FileInput.stories.tsx +618 -0
  110. package/file-input/FileInput.test.js +457 -0
  111. package/file-input/FileItem.d.ts +4 -0
  112. package/file-input/FileItem.js +162 -0
  113. package/file-input/types.d.ts +129 -0
  114. package/file-input/types.js +5 -0
  115. package/flex/Flex.d.ts +4 -0
  116. package/flex/Flex.js +71 -0
  117. package/flex/Flex.stories.tsx +112 -0
  118. package/flex/types.d.ts +97 -0
  119. package/flex/types.js +5 -0
  120. package/footer/Footer.d.ts +4 -0
  121. package/footer/Footer.js +165 -0
  122. package/footer/Footer.stories.tsx +152 -0
  123. package/footer/Footer.test.js +99 -0
  124. package/footer/Icons.d.ts +2 -0
  125. package/footer/Icons.js +77 -0
  126. package/footer/types.d.ts +64 -0
  127. package/footer/types.js +5 -0
  128. package/grid/Grid.d.ts +7 -0
  129. package/grid/Grid.js +91 -0
  130. package/grid/Grid.stories.tsx +219 -0
  131. package/grid/types.d.ts +115 -0
  132. package/grid/types.js +5 -0
  133. package/header/Header.d.ts +8 -0
  134. package/header/Header.js +276 -0
  135. package/header/Header.stories.tsx +251 -0
  136. package/header/Header.test.js +79 -0
  137. package/header/Icons.d.ts +2 -0
  138. package/header/Icons.js +34 -0
  139. package/header/types.d.ts +34 -0
  140. package/header/types.js +5 -0
  141. package/heading/Heading.d.ts +4 -0
  142. package/{dist/heading → heading}/Heading.js +32 -91
  143. package/heading/Heading.stories.tsx +54 -0
  144. package/heading/Heading.test.js +186 -0
  145. package/heading/types.d.ts +33 -0
  146. package/heading/types.js +5 -0
  147. package/image/Image.d.ts +4 -0
  148. package/image/Image.js +85 -0
  149. package/image/Image.stories.tsx +127 -0
  150. package/image/types.d.ts +72 -0
  151. package/image/types.js +5 -0
  152. package/inset/Inset.d.ts +3 -0
  153. package/inset/Inset.js +51 -0
  154. package/inset/Inset.stories.tsx +230 -0
  155. package/inset/types.d.ts +37 -0
  156. package/inset/types.js +5 -0
  157. package/layout/ApplicationLayout.d.ts +20 -0
  158. package/layout/ApplicationLayout.js +174 -0
  159. package/layout/ApplicationLayout.stories.tsx +162 -0
  160. package/layout/Icons.d.ts +8 -0
  161. package/layout/Icons.js +62 -0
  162. package/layout/SidenavContext.d.ts +5 -0
  163. package/layout/SidenavContext.js +19 -0
  164. package/layout/types.d.ts +41 -0
  165. package/layout/types.js +5 -0
  166. package/link/Link.d.ts +4 -0
  167. package/link/Link.js +136 -0
  168. package/link/Link.stories.tsx +253 -0
  169. package/link/Link.test.js +81 -0
  170. package/link/types.d.ts +54 -0
  171. package/link/types.js +5 -0
  172. package/main.d.ts +46 -0
  173. package/{dist/main.js → main.js} +130 -112
  174. package/nav-tabs/NavTabs.d.ts +8 -0
  175. package/nav-tabs/NavTabs.js +122 -0
  176. package/nav-tabs/NavTabs.stories.tsx +274 -0
  177. package/nav-tabs/NavTabs.test.js +82 -0
  178. package/nav-tabs/Tab.d.ts +4 -0
  179. package/nav-tabs/Tab.js +146 -0
  180. package/nav-tabs/types.d.ts +52 -0
  181. package/nav-tabs/types.js +5 -0
  182. package/number-input/NumberInput.d.ts +11 -0
  183. package/number-input/NumberInput.js +80 -0
  184. package/number-input/NumberInput.stories.tsx +160 -0
  185. package/number-input/NumberInput.test.js +768 -0
  186. package/number-input/types.d.ts +130 -0
  187. package/number-input/types.js +5 -0
  188. package/package.json +47 -41
  189. package/paginator/Icons.d.ts +5 -0
  190. package/paginator/Icons.js +54 -0
  191. package/paginator/Paginator.d.ts +4 -0
  192. package/paginator/Paginator.js +163 -0
  193. package/paginator/Paginator.stories.tsx +87 -0
  194. package/paginator/Paginator.test.js +318 -0
  195. package/paginator/types.d.ts +38 -0
  196. package/paginator/types.js +5 -0
  197. package/paragraph/Paragraph.d.ts +5 -0
  198. package/paragraph/Paragraph.js +38 -0
  199. package/paragraph/Paragraph.stories.tsx +44 -0
  200. package/password-input/Icons.d.ts +6 -0
  201. package/password-input/Icons.js +39 -0
  202. package/password-input/PasswordInput.d.ts +4 -0
  203. package/password-input/PasswordInput.js +119 -0
  204. package/password-input/PasswordInput.stories.tsx +132 -0
  205. package/password-input/PasswordInput.test.js +174 -0
  206. package/password-input/types.d.ts +110 -0
  207. package/password-input/types.js +5 -0
  208. package/progress-bar/ProgressBar.d.ts +4 -0
  209. package/progress-bar/ProgressBar.js +176 -0
  210. package/progress-bar/ProgressBar.stories.jsx +93 -0
  211. package/progress-bar/ProgressBar.test.js +110 -0
  212. package/progress-bar/types.d.ts +37 -0
  213. package/progress-bar/types.js +5 -0
  214. package/quick-nav/QuickNav.d.ts +4 -0
  215. package/quick-nav/QuickNav.js +117 -0
  216. package/quick-nav/QuickNav.stories.tsx +356 -0
  217. package/quick-nav/types.d.ts +21 -0
  218. package/quick-nav/types.js +5 -0
  219. package/radio-group/Radio.d.ts +4 -0
  220. package/radio-group/Radio.js +156 -0
  221. package/radio-group/RadioGroup.d.ts +4 -0
  222. package/radio-group/RadioGroup.js +281 -0
  223. package/radio-group/RadioGroup.stories.tsx +214 -0
  224. package/radio-group/RadioGroup.test.js +749 -0
  225. package/radio-group/types.d.ts +114 -0
  226. package/radio-group/types.js +5 -0
  227. package/resultsetTable/Icons.d.ts +7 -0
  228. package/resultsetTable/Icons.js +51 -0
  229. package/resultsetTable/ResultsetTable.d.ts +4 -0
  230. package/resultsetTable/ResultsetTable.js +195 -0
  231. package/resultsetTable/ResultsetTable.stories.tsx +300 -0
  232. package/resultsetTable/ResultsetTable.test.js +325 -0
  233. package/resultsetTable/types.d.ts +67 -0
  234. package/resultsetTable/types.js +5 -0
  235. package/select/Icons.d.ts +10 -0
  236. package/select/Icons.js +93 -0
  237. package/select/Listbox.d.ts +4 -0
  238. package/select/Listbox.js +169 -0
  239. package/select/Option.d.ts +4 -0
  240. package/select/Option.js +97 -0
  241. package/select/Select.d.ts +4 -0
  242. package/select/Select.js +666 -0
  243. package/select/Select.stories.tsx +971 -0
  244. package/select/Select.test.js +2228 -0
  245. package/select/types.d.ts +210 -0
  246. package/select/types.js +5 -0
  247. package/sidenav/Icons.d.ts +7 -0
  248. package/sidenav/Icons.js +51 -0
  249. package/sidenav/Sidenav.d.ts +10 -0
  250. package/sidenav/Sidenav.js +238 -0
  251. package/sidenav/Sidenav.stories.tsx +282 -0
  252. package/sidenav/Sidenav.test.js +44 -0
  253. package/sidenav/types.d.ts +76 -0
  254. package/sidenav/types.js +5 -0
  255. package/slider/Slider.d.ts +4 -0
  256. package/slider/Slider.js +342 -0
  257. package/slider/Slider.stories.tsx +240 -0
  258. package/slider/Slider.test.js +250 -0
  259. package/slider/types.d.ts +86 -0
  260. package/slider/types.js +5 -0
  261. package/spinner/Spinner.d.ts +4 -0
  262. package/spinner/Spinner.js +244 -0
  263. package/spinner/Spinner.stories.jsx +129 -0
  264. package/spinner/Spinner.test.js +64 -0
  265. package/spinner/types.d.ts +32 -0
  266. package/spinner/types.js +5 -0
  267. package/switch/Switch.d.ts +4 -0
  268. package/switch/Switch.js +262 -0
  269. package/switch/Switch.stories.tsx +171 -0
  270. package/switch/Switch.test.js +225 -0
  271. package/switch/types.d.ts +66 -0
  272. package/switch/types.js +5 -0
  273. package/table/Table.d.ts +4 -0
  274. package/{dist/table → table}/Table.js +14 -28
  275. package/table/Table.stories.jsx +356 -0
  276. package/table/Table.test.js +26 -0
  277. package/table/types.d.ts +21 -0
  278. package/table/types.js +5 -0
  279. package/tabs/Tab.d.ts +4 -0
  280. package/tabs/Tab.js +132 -0
  281. package/tabs/Tabs.d.ts +4 -0
  282. package/tabs/Tabs.js +461 -0
  283. package/tabs/Tabs.stories.tsx +226 -0
  284. package/tabs/Tabs.test.js +350 -0
  285. package/tabs/types.d.ts +92 -0
  286. package/tabs/types.js +5 -0
  287. package/tag/Tag.d.ts +4 -0
  288. package/tag/Tag.js +181 -0
  289. package/tag/Tag.stories.tsx +155 -0
  290. package/tag/Tag.test.js +60 -0
  291. package/tag/types.d.ts +69 -0
  292. package/tag/types.js +5 -0
  293. package/text-input/Icons.d.ts +8 -0
  294. package/text-input/Icons.js +60 -0
  295. package/text-input/Suggestion.d.ts +4 -0
  296. package/text-input/Suggestion.js +84 -0
  297. package/text-input/Suggestions.d.ts +4 -0
  298. package/text-input/Suggestions.js +134 -0
  299. package/text-input/TextInput.d.ts +4 -0
  300. package/text-input/TextInput.js +651 -0
  301. package/text-input/TextInput.stories.tsx +608 -0
  302. package/text-input/TextInput.test.js +1834 -0
  303. package/text-input/types.d.ts +203 -0
  304. package/text-input/types.js +5 -0
  305. package/textarea/Textarea.d.ts +4 -0
  306. package/textarea/Textarea.js +278 -0
  307. package/textarea/Textarea.stories.jsx +224 -0
  308. package/textarea/Textarea.test.js +479 -0
  309. package/textarea/types.d.ts +141 -0
  310. package/textarea/types.js +5 -0
  311. package/toggle-group/ToggleGroup.d.ts +4 -0
  312. package/toggle-group/ToggleGroup.js +241 -0
  313. package/toggle-group/ToggleGroup.stories.tsx +218 -0
  314. package/toggle-group/ToggleGroup.test.js +170 -0
  315. package/toggle-group/types.d.ts +114 -0
  316. package/toggle-group/types.js +5 -0
  317. package/typography/Typography.d.ts +4 -0
  318. package/typography/Typography.js +32 -0
  319. package/typography/Typography.stories.tsx +198 -0
  320. package/typography/types.d.ts +18 -0
  321. package/typography/types.js +5 -0
  322. package/useTheme.d.ts +1252 -0
  323. package/{dist/useTheme.js → useTheme.js} +3 -3
  324. package/useTranslatedLabels.d.ts +85 -0
  325. package/useTranslatedLabels.js +20 -0
  326. package/utils/BaseTypography.d.ts +21 -0
  327. package/utils/BaseTypography.js +108 -0
  328. package/utils/FocusLock.d.ts +13 -0
  329. package/utils/FocusLock.js +138 -0
  330. package/wizard/Wizard.d.ts +4 -0
  331. package/wizard/Wizard.js +285 -0
  332. package/wizard/Wizard.stories.tsx +253 -0
  333. package/wizard/Wizard.test.js +141 -0
  334. package/wizard/types.d.ts +64 -0
  335. package/wizard/types.js +5 -0
  336. package/babel.config.js +0 -8
  337. package/dist/BackgroundColorContext.js +0 -46
  338. package/dist/ThemeContext.js +0 -248
  339. package/dist/accordion/Accordion.js +0 -353
  340. package/dist/accordion-group/AccordionGroup.js +0 -186
  341. package/dist/alert/index.d.ts +0 -51
  342. package/dist/badge/Badge.js +0 -63
  343. package/dist/box/Box.js +0 -156
  344. package/dist/button/Button.js +0 -238
  345. package/dist/card/Card.js +0 -254
  346. package/dist/checkbox/Checkbox.js +0 -300
  347. package/dist/checkbox/Checkbox.stories.js +0 -144
  348. package/dist/checkbox/readme.md +0 -116
  349. package/dist/chip/Chip.js +0 -265
  350. package/dist/common/OpenSans.css +0 -81
  351. package/dist/common/RequiredComponent.js +0 -40
  352. package/dist/common/variables.js +0 -1569
  353. package/dist/date/Date.js +0 -379
  354. package/dist/date/Date.stories.js +0 -205
  355. package/dist/date/readme.md +0 -73
  356. package/dist/dialog/Dialog.js +0 -218
  357. package/dist/dropdown/Dropdown.js +0 -544
  358. package/dist/file-input/FileInput.js +0 -644
  359. package/dist/file-input/FileItem.js +0 -280
  360. package/dist/file-input/index.d.ts +0 -81
  361. package/dist/footer/Footer.js +0 -395
  362. package/dist/footer/dxc_logo.svg +0 -15
  363. package/dist/footer/readme.md +0 -41
  364. package/dist/header/Header.js +0 -403
  365. package/dist/header/Header.stories.js +0 -176
  366. package/dist/header/close_icon.svg +0 -1
  367. package/dist/header/dxc_logo_black.svg +0 -8
  368. package/dist/header/hamb_menu_black.svg +0 -1
  369. package/dist/header/hamb_menu_white.svg +0 -1
  370. package/dist/header/readme.md +0 -33
  371. package/dist/input-text/InputText.js +0 -707
  372. package/dist/input-text/error.svg +0 -1
  373. package/dist/input-text/readme.md +0 -91
  374. package/dist/layout/ApplicationLayout.js +0 -331
  375. package/dist/layout/facebook.svg +0 -45
  376. package/dist/layout/linkedin.svg +0 -50
  377. package/dist/layout/twitter.svg +0 -53
  378. package/dist/link/Link.js +0 -237
  379. package/dist/link/readme.md +0 -51
  380. package/dist/main.d.ts +0 -8
  381. package/dist/new-date/NewDate.js +0 -400
  382. package/dist/new-date/index.d.ts +0 -95
  383. package/dist/new-select/NewSelect.js +0 -836
  384. package/dist/new-select/index.d.ts +0 -53
  385. package/dist/new-textarea/NewTextarea.js +0 -369
  386. package/dist/new-textarea/index.d.ts +0 -117
  387. package/dist/number/Number.js +0 -136
  388. package/dist/number/NumberContext.js +0 -16
  389. package/dist/number/index.d.ts +0 -113
  390. package/dist/paginator/Paginator.js +0 -289
  391. package/dist/paginator/images/next.svg +0 -3
  392. package/dist/paginator/images/nextPage.svg +0 -3
  393. package/dist/paginator/images/previous.svg +0 -3
  394. package/dist/paginator/images/previousPage.svg +0 -3
  395. package/dist/paginator/readme.md +0 -50
  396. package/dist/password-input/PasswordInput.js +0 -198
  397. package/dist/password-input/index.d.ts +0 -94
  398. package/dist/progress-bar/ProgressBar.js +0 -242
  399. package/dist/progress-bar/ProgressBar.stories.js +0 -280
  400. package/dist/progress-bar/readme.md +0 -63
  401. package/dist/radio/Radio.js +0 -209
  402. package/dist/radio/Radio.stories.js +0 -166
  403. package/dist/radio/readme.md +0 -70
  404. package/dist/resultsetTable/ResultsetTable.js +0 -358
  405. package/dist/resultsetTable/arrow_downward-24px_wht.svg +0 -1
  406. package/dist/resultsetTable/arrow_upward-24px_wht.svg +0 -1
  407. package/dist/resultsetTable/unfold_more-24px_wht.svg +0 -1
  408. package/dist/select/Select.js +0 -549
  409. package/dist/sidenav/Sidenav.js +0 -179
  410. package/dist/slider/Slider.js +0 -394
  411. package/dist/slider/Slider.stories.js +0 -241
  412. package/dist/slider/readme.md +0 -64
  413. package/dist/spinner/Spinner.js +0 -381
  414. package/dist/spinner/Spinner.stories.js +0 -183
  415. package/dist/spinner/readme.md +0 -65
  416. package/dist/switch/Switch.js +0 -222
  417. package/dist/switch/Switch.stories.js +0 -134
  418. package/dist/switch/readme.md +0 -133
  419. package/dist/tabs/Tabs.js +0 -343
  420. package/dist/tabs/Tabs.stories.js +0 -130
  421. package/dist/tabs/readme.md +0 -78
  422. package/dist/tabs-for-sections/TabsForSections.js +0 -92
  423. package/dist/tabs-for-sections/readme.md +0 -78
  424. package/dist/tag/Tag.js +0 -282
  425. package/dist/text-input/TextInput.js +0 -971
  426. package/dist/text-input/index.d.ts +0 -135
  427. package/dist/textarea/Textarea.js +0 -264
  428. package/dist/toggle/Toggle.js +0 -220
  429. package/dist/toggle/Toggle.stories.js +0 -297
  430. package/dist/toggle/readme.md +0 -80
  431. package/dist/toggle-group/ToggleGroup.js +0 -327
  432. package/dist/upload/Upload.js +0 -205
  433. package/dist/upload/Upload.stories.js +0 -72
  434. package/dist/upload/buttons-upload/ButtonsUpload.js +0 -139
  435. package/dist/upload/buttons-upload/drag-drop-icon.svg +0 -4
  436. package/dist/upload/buttons-upload/upload-button.svg +0 -1
  437. package/dist/upload/dragAndDropArea/DragAndDropArea.js +0 -329
  438. package/dist/upload/dragAndDropArea/upload_drop.svg +0 -4
  439. package/dist/upload/dragAndDropArea/upload_file.svg +0 -4
  440. package/dist/upload/file-upload/FileToUpload.js +0 -184
  441. package/dist/upload/file-upload/audio-icon.svg +0 -4
  442. package/dist/upload/file-upload/close.svg +0 -4
  443. package/dist/upload/file-upload/file-icon.svg +0 -4
  444. package/dist/upload/file-upload/video-icon.svg +0 -4
  445. package/dist/upload/files-upload/FilesToUpload.js +0 -123
  446. package/dist/upload/readme.md +0 -37
  447. package/dist/upload/transaction/Transaction.js +0 -175
  448. package/dist/upload/transaction/audio-icon-err.svg +0 -4
  449. package/dist/upload/transaction/audio-icon.svg +0 -4
  450. package/dist/upload/transaction/error-icon.svg +0 -4
  451. package/dist/upload/transaction/file-icon-err.svg +0 -4
  452. package/dist/upload/transaction/file-icon.svg +0 -4
  453. package/dist/upload/transaction/image-icon-err.svg +0 -4
  454. package/dist/upload/transaction/image-icon.svg +0 -4
  455. package/dist/upload/transaction/success-icon.svg +0 -4
  456. package/dist/upload/transaction/video-icon-err.svg +0 -4
  457. package/dist/upload/transaction/video-icon.svg +0 -4
  458. package/dist/upload/transactions/Transactions.js +0 -138
  459. package/dist/wizard/Wizard.js +0 -411
  460. package/dist/wizard/invalid_icon.svg +0 -5
  461. package/dist/wizard/valid_icon.svg +0 -5
  462. package/dist/wizard/validation-wrong.svg +0 -6
  463. package/test/Accordion.test.js +0 -33
  464. package/test/AccordionGroup.test.js +0 -125
  465. package/test/Alert.test.js +0 -53
  466. package/test/Box.test.js +0 -10
  467. package/test/Button.test.js +0 -18
  468. package/test/Card.test.js +0 -30
  469. package/test/Checkbox.test.js +0 -45
  470. package/test/Chip.test.js +0 -25
  471. package/test/Date.test.js +0 -393
  472. package/test/Dialog.test.js +0 -23
  473. package/test/Dropdown.test.js +0 -145
  474. package/test/FileInput.test.js +0 -201
  475. package/test/Footer.test.js +0 -99
  476. package/test/Header.test.js +0 -39
  477. package/test/Heading.test.js +0 -35
  478. package/test/InputText.test.js +0 -240
  479. package/test/Link.test.js +0 -43
  480. package/test/NewDate.test.js +0 -232
  481. package/test/NewTextarea.test.js +0 -195
  482. package/test/Number.test.js +0 -257
  483. package/test/Paginator.test.js +0 -177
  484. package/test/PasswordInput.test.js +0 -83
  485. package/test/ProgressBar.test.js +0 -35
  486. package/test/Radio.test.js +0 -37
  487. package/test/ResultsetTable.test.js +0 -329
  488. package/test/Select.test.js +0 -212
  489. package/test/Sidenav.test.js +0 -45
  490. package/test/Slider.test.js +0 -82
  491. package/test/Spinner.test.js +0 -32
  492. package/test/Switch.test.js +0 -45
  493. package/test/Table.test.js +0 -36
  494. package/test/Tabs.test.js +0 -109
  495. package/test/TabsForSections.test.js +0 -34
  496. package/test/Tag.test.js +0 -32
  497. package/test/TextArea.test.js +0 -52
  498. package/test/TextInput.test.js +0 -732
  499. package/test/ToggleGroup.test.js +0 -85
  500. package/test/Upload.test.js +0 -60
  501. package/test/Wizard.test.js +0 -130
  502. package/test/mocks/pngMock.js +0 -1
  503. package/test/mocks/svgMock.js +0 -1
  504. /package/{dist/common → common}/fonts/OpenSans-Bold.ttf +0 -0
  505. /package/{dist/common → common}/fonts/OpenSans-BoldItalic.ttf +0 -0
  506. /package/{dist/common → common}/fonts/OpenSans-ExtraBold.ttf +0 -0
  507. /package/{dist/common → common}/fonts/OpenSans-ExtraBoldItalic.ttf +0 -0
  508. /package/{dist/common → common}/fonts/OpenSans-Italic.ttf +0 -0
  509. /package/{dist/common → common}/fonts/OpenSans-Light.ttf +0 -0
  510. /package/{dist/common → common}/fonts/OpenSans-LightItalic.ttf +0 -0
  511. /package/{dist/common → common}/fonts/OpenSans-Regular.ttf +0 -0
  512. /package/{dist/common → common}/fonts/OpenSans-SemiBold.ttf +0 -0
  513. /package/{dist/common → common}/fonts/OpenSans-SemiBoldItalic.ttf +0 -0
@@ -1,53 +0,0 @@
1
- type SVG = string | (HTMLElement & SVGElement);
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 OptionGroup = {
11
- label: string;
12
- options: Option[];
13
- };
14
- type Option = {
15
- icon?: string | SVG;
16
- label: string;
17
- value: string;
18
- };
19
-
20
- type Props = {
21
- label?: string;
22
- name?: string;
23
- value?: string | string[];
24
- options?: Option[] | OptionGroup[];
25
- helperText?: string;
26
- placeholder?: string;
27
- disabled?: boolean;
28
- optional?: boolean;
29
- searchable?: boolean;
30
- multiple?: boolean;
31
- onChange?: (value: string | string[]) => void;
32
- onBlur?: (val: { value: string | string[]; error: string }) => void;
33
- error?: string;
34
- /**
35
- * Size of the margin to be applied to the component ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
36
- * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
37
- */
38
- margin?: Space | Margin;
39
- /**
40
- * Size of the component ('small' | 'medium' | 'large' | 'fillParent').
41
- */
42
- size?: "small" | "medium" | "large" | "fillParent";
43
- /**
44
- * Value of the tabindex attribute.
45
- */
46
- tabIndex?: number;
47
- /**
48
- * Reference to the component.
49
- */
50
- ref?: React.RefObject<HTMLDivElement>;
51
- };
52
-
53
- export default function DxcNewSelect(props: Props): JSX.Element;
@@ -1,369 +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 _utils = require("../common/utils.js");
25
-
26
- var _useTheme = _interopRequireDefault(require("../useTheme.js"));
27
-
28
- var _propTypes = _interopRequireDefault(require("prop-types"));
29
-
30
- var _variables = require("../common/variables.js");
31
-
32
- var _uuid = require("uuid");
33
-
34
- var _BackgroundColorContext = _interopRequireDefault(require("../BackgroundColorContext.js"));
35
-
36
- function _templateObject6() {
37
- var data = (0, _taggedTemplateLiteral2["default"])(["\n color: ", ";\n font-family: ", ";\n font-size: 0.75rem;\n font-weight: 400;\n min-height: 1.5em;\n line-height: 1.5em;\n"]);
38
-
39
- _templateObject6 = function _templateObject6() {
40
- return data;
41
- };
42
-
43
- return data;
44
- }
45
-
46
- function _templateObject5() {
47
- var data = (0, _taggedTemplateLiteral2["default"])(["\n ", ";\n ", "\n\n margin: calc(1rem * 0.25) 0;\n padding: calc(1rem * 0.5) calc(1rem * 1);\n box-shadow: 0 0 0 2px transparent;\n border-radius: calc(1rem * 0.25);\n border: 1px solid\n ", ";\n ", "\n\n ", ";\n ", ";\n\n color: ", ";\n font-family: ", ";\n font-size: ", ";\n font-style: ", ";\n font-weight: ", ";\n line-height: 1.5em;\n\n ::placeholder {\n color: ", ";\n }\n"]);
48
-
49
- _templateObject5 = function _templateObject5() {
50
- return data;
51
- };
52
-
53
- return data;
54
- }
55
-
56
- function _templateObject4() {
57
- var data = (0, _taggedTemplateLiteral2["default"])(["\n color: ", ";\n\n font-family: ", ";\n font-size: ", ";\n font-style: ", ";\n font-weight: ", ";\n line-height: ", ";\n"]);
58
-
59
- _templateObject4 = function _templateObject4() {
60
- return data;
61
- };
62
-
63
- return data;
64
- }
65
-
66
- function _templateObject3() {
67
- var data = (0, _taggedTemplateLiteral2["default"])(["\n font-weight: ", ";\n"]);
68
-
69
- _templateObject3 = function _templateObject3() {
70
- return data;
71
- };
72
-
73
- return data;
74
- }
75
-
76
- function _templateObject2() {
77
- var data = (0, _taggedTemplateLiteral2["default"])(["\n color: ", ";\n\n font-family: ", ";\n font-size: ", ";\n font-style: ", ";\n font-weight: ", ";\n line-height: ", ";\n"]);
78
-
79
- _templateObject2 = function _templateObject2() {
80
- return data;
81
- };
82
-
83
- return data;
84
- }
85
-
86
- function _templateObject() {
87
- var data = (0, _taggedTemplateLiteral2["default"])(["\n display: flex;\n flex-direction: column;\n\n width: ", ";\n margin: ", ";\n margin-top: ", ";\n margin-right: ", ";\n margin-bottom: ", ";\n margin-left: ", ";\n"]);
88
-
89
- _templateObject = function _templateObject() {
90
- return data;
91
- };
92
-
93
- return data;
94
- }
95
-
96
- var getNotOptionalErrorMessage = function getNotOptionalErrorMessage() {
97
- return "This field is required. Please, enter a value.";
98
- };
99
-
100
- var getLengthErrorMessage = function getLengthErrorMessage(length) {
101
- return "Min length ".concat(length.min, ", max length ").concat(length.max, ".");
102
- };
103
-
104
- var getPatternErrorMessage = function getPatternErrorMessage() {
105
- return "Please match the format requested.";
106
- };
107
-
108
- var patternMatch = function patternMatch(pattern, value) {
109
- return new RegExp(pattern).test(value);
110
- };
111
-
112
- var DxcNewTextarea = _react["default"].forwardRef(function (_ref, ref) {
113
- var _ref$label = _ref.label,
114
- label = _ref$label === void 0 ? "" : _ref$label,
115
- _ref$name = _ref.name,
116
- name = _ref$name === void 0 ? "" : _ref$name,
117
- value = _ref.value,
118
- _ref$helperText = _ref.helperText,
119
- helperText = _ref$helperText === void 0 ? "" : _ref$helperText,
120
- _ref$placeholder = _ref.placeholder,
121
- placeholder = _ref$placeholder === void 0 ? "" : _ref$placeholder,
122
- _ref$disabled = _ref.disabled,
123
- disabled = _ref$disabled === void 0 ? false : _ref$disabled,
124
- _ref$optional = _ref.optional,
125
- optional = _ref$optional === void 0 ? false : _ref$optional,
126
- _ref$verticalGrow = _ref.verticalGrow,
127
- verticalGrow = _ref$verticalGrow === void 0 ? "auto" : _ref$verticalGrow,
128
- _ref$rows = _ref.rows,
129
- rows = _ref$rows === void 0 ? 4 : _ref$rows,
130
- onChange = _ref.onChange,
131
- onBlur = _ref.onBlur,
132
- _ref$error = _ref.error,
133
- error = _ref$error === void 0 ? "" : _ref$error,
134
- pattern = _ref.pattern,
135
- length = _ref.length,
136
- _ref$autocomplete = _ref.autocomplete,
137
- autocomplete = _ref$autocomplete === void 0 ? "off" : _ref$autocomplete,
138
- margin = _ref.margin,
139
- _ref$size = _ref.size,
140
- size = _ref$size === void 0 ? "medium" : _ref$size,
141
- _ref$tabIndex = _ref.tabIndex,
142
- tabIndex = _ref$tabIndex === void 0 ? 0 : _ref$tabIndex;
143
-
144
- var _useState = (0, _react.useState)(""),
145
- _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
146
- innerValue = _useState2[0],
147
- setInnerValue = _useState2[1];
148
-
149
- var _useState3 = (0, _react.useState)("textarea-".concat((0, _uuid.v4)())),
150
- _useState4 = (0, _slicedToArray2["default"])(_useState3, 1),
151
- textareaId = _useState4[0];
152
-
153
- var colorsTheme = (0, _useTheme["default"])();
154
- var backgroundType = (0, _react.useContext)(_BackgroundColorContext["default"]);
155
- var textareaRef = (0, _react.useRef)(null);
156
- var errorId = "error-message-".concat(textareaId);
157
-
158
- var isNotOptional = function isNotOptional(value) {
159
- return value === "" && !optional;
160
- };
161
-
162
- var isLengthIncorrect = function isLengthIncorrect(value) {
163
- return value !== "" && length && length.min && length.max && (value.length < length.min || value.length > length.max);
164
- };
165
-
166
- var changeValue = function changeValue(newValue) {
167
- value !== null && value !== void 0 ? value : setInnerValue(newValue);
168
- if (isNotOptional(newValue)) onChange === null || onChange === void 0 ? void 0 : onChange({
169
- value: newValue,
170
- error: getNotOptionalErrorMessage()
171
- });else if (isLengthIncorrect(newValue)) onChange === null || onChange === void 0 ? void 0 : onChange({
172
- value: newValue,
173
- error: getLengthErrorMessage(length)
174
- });else if (newValue && pattern && !patternMatch(pattern, newValue)) onChange === null || onChange === void 0 ? void 0 : onChange({
175
- value: newValue,
176
- error: getPatternErrorMessage()
177
- });else onChange === null || onChange === void 0 ? void 0 : onChange({
178
- value: newValue,
179
- error: null
180
- });
181
- };
182
-
183
- var handleTOnBlur = function handleTOnBlur(event) {
184
- if (isNotOptional(event.target.value)) onBlur === null || onBlur === void 0 ? void 0 : onBlur({
185
- value: event.target.value,
186
- error: getNotOptionalErrorMessage()
187
- });else if (isLengthIncorrect(event.target.value)) onBlur === null || onBlur === void 0 ? void 0 : onBlur({
188
- value: event.target.value,
189
- error: getLengthErrorMessage(length)
190
- });else if (event.target.value && pattern && !patternMatch(pattern, event.target.value)) onBlur === null || onBlur === void 0 ? void 0 : onBlur({
191
- value: event.target.value,
192
- error: getPatternErrorMessage()
193
- });else onBlur === null || onBlur === void 0 ? void 0 : onBlur({
194
- value: event.target.value,
195
- error: null
196
- });
197
- };
198
-
199
- var handleTOnChange = function handleTOnChange(event) {
200
- changeValue(event.target.value);
201
- };
202
-
203
- (0, _react.useLayoutEffect)(function () {
204
- if (verticalGrow === "auto") {
205
- var textareaLineHeight = parseInt(window.getComputedStyle(textareaRef.current)["line-height"]);
206
- var textareaPaddingTopBottom = parseInt(window.getComputedStyle(textareaRef.current)["padding-top"]) * 2;
207
- textareaRef.current.style.height = "".concat(textareaLineHeight * rows, "px");
208
- var newHeight = textareaRef.current.scrollHeight - textareaPaddingTopBottom;
209
- textareaRef.current.style.height = "".concat(newHeight, "px");
210
- }
211
- }, [value, verticalGrow, rows, innerValue]);
212
- return _react["default"].createElement(_styledComponents.ThemeProvider, {
213
- theme: colorsTheme.newTextarea
214
- }, _react["default"].createElement(DxcTextarea, {
215
- margin: margin,
216
- size: size,
217
- ref: ref
218
- }, _react["default"].createElement(Label, {
219
- htmlFor: textareaId,
220
- disabled: disabled,
221
- backgroundType: backgroundType
222
- }, label, " ", optional && _react["default"].createElement(OptionalLabel, null, "(Optional)")), _react["default"].createElement(HelperText, {
223
- disabled: disabled,
224
- backgroundType: backgroundType
225
- }, helperText), _react["default"].createElement(Textarea, {
226
- id: textareaId,
227
- name: name,
228
- value: value !== null && value !== void 0 ? value : innerValue,
229
- placeholder: placeholder,
230
- verticalGrow: verticalGrow,
231
- rows: rows,
232
- onChange: handleTOnChange,
233
- onBlur: handleTOnBlur,
234
- disabled: disabled,
235
- error: error,
236
- minLength: length === null || length === void 0 ? void 0 : length.min,
237
- maxLength: length === null || length === void 0 ? void 0 : length.max,
238
- autoComplete: autocomplete,
239
- backgroundType: backgroundType,
240
- ref: textareaRef,
241
- tabIndex: tabIndex,
242
- "aria-invalid": error ? "true" : "false",
243
- "aria-describedby": error ? errorId : undefined,
244
- "aria-required": optional ? "false" : "true"
245
- }), !disabled && _react["default"].createElement(Error, {
246
- id: errorId,
247
- backgroundType: backgroundType
248
- }, error)));
249
- });
250
-
251
- var sizes = {
252
- small: "240px",
253
- medium: "360px",
254
- large: "480px",
255
- fillParent: "100%"
256
- };
257
-
258
- var calculateWidth = function calculateWidth(margin, size) {
259
- return size === "fillParent" ? "calc(".concat(sizes[size], " - ").concat((0, _utils.getMargin)(margin, "left"), " - ").concat((0, _utils.getMargin)(margin, "right"), ")") : sizes[size];
260
- };
261
-
262
- var DxcTextarea = _styledComponents["default"].div(_templateObject(), function (props) {
263
- return calculateWidth(props.margin, props.size);
264
- }, function (props) {
265
- return props.margin && (0, _typeof2["default"])(props.margin) !== "object" ? _variables.spaces[props.margin] : "0px";
266
- }, function (props) {
267
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.top ? _variables.spaces[props.margin.top] : "";
268
- }, function (props) {
269
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.right ? _variables.spaces[props.margin.right] : "";
270
- }, function (props) {
271
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.bottom ? _variables.spaces[props.margin.bottom] : "";
272
- }, function (props) {
273
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.left ? _variables.spaces[props.margin.left] : "";
274
- });
275
-
276
- var Label = _styledComponents["default"].label(_templateObject2(), function (props) {
277
- return props.disabled ? props.backgroundType === "dark" ? props.theme.disabledLabelFontColorOnDark : props.theme.disabledLabelFontColor : props.backgroundType === "dark" ? props.theme.labelFontColorOnDark : props.theme.labelFontColor;
278
- }, function (props) {
279
- return props.theme.fontFamily;
280
- }, function (props) {
281
- return props.theme.labelFontSize;
282
- }, function (props) {
283
- return props.theme.labelFontStyle;
284
- }, function (props) {
285
- return props.theme.labelFontWeight;
286
- }, function (props) {
287
- return props.theme.labelLineHeight;
288
- });
289
-
290
- var OptionalLabel = _styledComponents["default"].span(_templateObject3(), function (props) {
291
- return props.theme.optionalLabelFontWeight;
292
- });
293
-
294
- var HelperText = _styledComponents["default"].span(_templateObject4(), function (props) {
295
- return props.disabled ? props.backgroundType === "dark" ? props.theme.disabledHelperTextFontColorOnDark : props.theme.disabledHelperTextFontColor : props.backgroundType === "dark" ? props.theme.helperTextFontColorOnDark : props.theme.helperTextFontColor;
296
- }, function (props) {
297
- return props.theme.fontFamily;
298
- }, function (props) {
299
- return props.theme.helperTextFontSize;
300
- }, function (props) {
301
- return props.theme.helperTextFontStyle;
302
- }, function (props) {
303
- return props.theme.helperTextFontWeight;
304
- }, function (props) {
305
- return props.theme.helperTextLineHeight;
306
- });
307
-
308
- var Textarea = _styledComponents["default"].textarea(_templateObject5(), function (props) {
309
- if (props.verticalGrow === "none") return "resize: none;";else if (props.verticalGrow === "auto") return "resize: none; overflow: hidden;";else if (props.verticalGrow === "manual") return "resize: vertical;";else return "resize: none;";
310
- }, function (props) {
311
- if (props.disabled) return props.backgroundType === "dark" ? "background-color: ".concat(props.theme.disabledContainerFillColorOnDark, ";") : "background-color: ".concat(props.theme.disabledContainerFillColor, ";");else return "background-color: transparent;";
312
- }, function (props) {
313
- if (props.disabled) return props.backgroundType === "dark" ? props.theme.disabledBorderColorOnDark : props.theme.disabledBorderColor;else return props.backgroundType === "dark" ? props.theme.enabledBorderColorOnDark : props.theme.enabledBorderColor;
314
- }, function (props) {
315
- return props.error && !props.disabled && "border-color: transparent;\n box-shadow: 0 0 0 2px ".concat(props.backgroundType === "dark" ? props.theme.errorBorderColorOnDark : props.theme.errorBorderColor, ";\n ");
316
- }, function (props) {
317
- return props.disabled && "cursor: not-allowed;";
318
- }, function (props) {
319
- return !props.disabled && "\n &:hover {\n border-color: ".concat(props.error ? "transparent" : props.backgroundType === "dark" ? props.theme.hoverBorderColorOnDark : props.theme.hoverBorderColor, ";\n ").concat(props.error && "box-shadow: 0 0 0 2px ".concat(props.backgroundType === "dark" ? props.theme.hoverErrorBorderColorOnDark : props.theme.hoverErrorBorderColor, ";"), "\n }\n &:focus {\n outline: none;\n border-color: transparent;\n box-shadow: 0 0 0 2px ").concat(props.backgroundType === "dark" ? props.theme.focusBorderColorOnDark : props.theme.focusBorderColor, ";\n }\n &:focus-within {\n outline: none;\n border-color: transparent;\n box-shadow: 0 0 0 2px ").concat(props.backgroundType === "dark" ? props.theme.focusBorderColorOnDark : props.theme.focusBorderColor, ";\n }\n ");
320
- }, function (props) {
321
- return props.disabled ? props.backgroundType === "dark" ? props.theme.disabledValueFontColorOnDark : props.theme.disabledValueFontColor : props.backgroundType === "dark" ? props.theme.valueFontColorOnDark : props.theme.valueFontColor;
322
- }, function (props) {
323
- return props.theme.fontFamily;
324
- }, function (props) {
325
- return props.theme.valueFontSize;
326
- }, function (props) {
327
- return props.theme.valueFontStyle;
328
- }, function (props) {
329
- return props.theme.valueFontWeight;
330
- }, function (props) {
331
- return props.disabled ? props.backgroundType === "dark" ? props.theme.disabledPlaceholderFontColorOnDark : props.theme.disabledPlaceholderFontColor : props.backgroundType === "dark" ? props.theme.placeholderFontColorOnDark : props.theme.placeholderFontColor;
332
- });
333
-
334
- var Error = _styledComponents["default"].span(_templateObject6(), function (props) {
335
- return props.backgroundType === "dark" ? props.theme.errorMessageColorOnDark : props.theme.errorMessageColor;
336
- }, function (props) {
337
- return props.theme.fontFamily;
338
- });
339
-
340
- DxcNewTextarea.propTypes = {
341
- label: _propTypes["default"].string,
342
- name: _propTypes["default"].string,
343
- value: _propTypes["default"].string,
344
- helperText: _propTypes["default"].string,
345
- placeholder: _propTypes["default"].string,
346
- verticalGrow: _propTypes["default"].oneOf(["auto", "none", "manual"]),
347
- rows: _propTypes["default"].number,
348
- length: _propTypes["default"].shape({
349
- min: _propTypes["default"].number,
350
- max: _propTypes["default"].number
351
- }),
352
- pattern: _propTypes["default"].string,
353
- disabled: _propTypes["default"].bool,
354
- optional: _propTypes["default"].bool,
355
- onChange: _propTypes["default"].func,
356
- onBlur: _propTypes["default"].func,
357
- error: _propTypes["default"].string,
358
- autocomplete: _propTypes["default"].string,
359
- margin: _propTypes["default"].oneOfType([_propTypes["default"].shape({
360
- top: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
361
- bottom: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
362
- left: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
363
- right: _propTypes["default"].oneOf(Object.keys(_variables.spaces))
364
- }), _propTypes["default"].oneOf((0, _toConsumableArray2["default"])(Object.keys(_variables.spaces)))]),
365
- size: _propTypes["default"].oneOf((0, _toConsumableArray2["default"])(Object.keys(sizes))),
366
- tabIndex: _propTypes["default"].number
367
- };
368
- var _default = DxcNewTextarea;
369
- exports["default"] = _default;
@@ -1,117 +0,0 @@
1
- type Size = "small" | "medium" | "large" | "fillParent";
2
- type Space = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
3
- type Margin = {
4
- top?: Space;
5
- bottom?: Space;
6
- left?: Space;
7
- right?: Space;
8
- };
9
-
10
- type Props = {
11
- /**
12
- * Text to be placed above the textarea.
13
- */
14
- label?: string;
15
- /**
16
- * Name attribute of the textarea element.
17
- */
18
- name?: string;
19
- /**
20
- * Value of the textarea. If undefined, the component will be uncontrolled and the value will be managed internally.
21
- */
22
- value?: string;
23
- /**
24
- * Helper text to be placed above the textarea.
25
- */
26
- helperText?: string;
27
- /**
28
- * Text to be put as placeholder of the textarea.
29
- */
30
- placeholder?: string;
31
- /**
32
- * If true, the component will be disabled.
33
- */
34
- disabled?: boolean;
35
- /**
36
- * If true, the textarea will be optional, showing '(Optional)'
37
- * next to the label. Otherwise, the field will be considered required
38
- * and an error will be passed as a parameter to the OnBlur and onChange functions
39
- * when it has not been filled.
40
- */
41
- optional?: boolean;
42
- /**
43
- * Defines the textarea's ability to resize vertically. It can be:
44
- * - 'auto': The textarea grows or shrinks automatically in order to fit the content.
45
- * - 'manual': The height of the textarea is enabled to be manually modified.
46
- * - 'none': The textarea has a fixed height and can't be modified.
47
- */
48
- verticalGrow?: "auto" | "manual" | "none";
49
- /**
50
- * Number of rows of the textarea.
51
- */
52
- rows?: number;
53
- /**
54
- * This function will be called when the user types within the textarea.
55
- * An object including the current value and the error (if the value
56
- * entered is not valid) will be passed to this function.
57
- * If there is no error, error will be null.
58
- */
59
- onChange?: (val: { value: string; error: string }) => void;
60
- /**
61
- * This function will be called when the textarea loses the focus. An
62
- * object including the textarea value and the error (if the value entered
63
- * is not valid) will be passed to this function. If there is no error,
64
- * error will be null.
65
- */
66
- onBlur?: (val: { value: string; error: string }) => void;
67
- /**
68
- * If it is defined, the component will change its appearance, showing
69
- * the error below the textarea. If it is not defined, the error
70
- * messages will be managed internally, but never displayed on its own.
71
- */
72
- error?: string;
73
- /**
74
- * Regular expression that defines the valid format allowed by the
75
- * textarea. This will be checked both when the textarea loses the focus
76
- * and while typing within it. If the string entered does not match the
77
- * pattern, the onBlur and onChange functions will be called with the
78
- * current value and an internal error informing that this value does not
79
- * match the pattern. If the pattern is met, the error parameter of both
80
- * events will be null.
81
- */
82
- pattern?: string;
83
- /**
84
- * Specifies the minimun and maximum length allowed by the textarea.
85
- * This will be checked both when the textarea loses the
86
- * focus and while typing within it. If the string entered does not
87
- * comply the length, the onBlur and onChange functions will be called
88
- * with the current value and an internal error informing that the value
89
- * length does not comply the specified range. If a valid length is
90
- * reached, the error parameter of both events will be null.
91
- */
92
- length?: { min: number; max: number };
93
- /**
94
- * HTML autocomplete attribute. Lets the user specify if any permission the user agent has to provide automated assistance in filling out the textarea value.
95
- * Its value must be one of all the possible values of the HTML autocomplete attribute: 'on', 'off', 'email', 'username', 'new-password', ...
96
- */
97
- autocomplete?: string;
98
- /**
99
- * Size of the margin to be applied to the component ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
100
- * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
101
- */
102
- margin?: Space | Margin;
103
- /**
104
- * Size of the component ('small' | 'medium' | 'large' | 'fillParent').
105
- */
106
- size?: Size;
107
- /**
108
- * Value of the tabindex attribute.
109
- */
110
- tabIndex?: number;
111
- /**
112
- * Reference to the component.
113
- */
114
- ref?: React.RefObject<HTMLDivElement>;
115
- };
116
-
117
- export default function DxcNewTextarea(props: Props): JSX.Element;
@@ -1,136 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
-
5
- Object.defineProperty(exports, "__esModule", {
6
- value: true
7
- });
8
- exports["default"] = void 0;
9
-
10
- var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
11
-
12
- var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
13
-
14
- var _react = _interopRequireDefault(require("react"));
15
-
16
- var _propTypes = _interopRequireDefault(require("prop-types"));
17
-
18
- var _styledComponents = _interopRequireDefault(require("styled-components"));
19
-
20
- var _TextInput = _interopRequireDefault(require("../text-input/TextInput"));
21
-
22
- var _NumberContext = _interopRequireDefault(require("./NumberContext"));
23
-
24
- var _variables = require("../common/variables.js");
25
-
26
- function _templateObject() {
27
- var data = (0, _taggedTemplateLiteral2["default"])(["\n // Chrome, Safari, Edge, Opera\n input::-webkit-outer-spin-button,\n input::-webkit-inner-spin-button {\n -webkit-appearance: none;\n margin: 0;\n }\n\n // Firefox\n input[type=\"number\"] {\n -moz-appearance: textfield;\n }\n"]);
28
-
29
- _templateObject = function _templateObject() {
30
- return data;
31
- };
32
-
33
- return data;
34
- }
35
-
36
- var DxcNumber = _react["default"].forwardRef(function (_ref, ref) {
37
- var _ref$label = _ref.label,
38
- label = _ref$label === void 0 ? "" : _ref$label,
39
- _ref$name = _ref.name,
40
- name = _ref$name === void 0 ? "" : _ref$name,
41
- value = _ref.value,
42
- _ref$helperText = _ref.helperText,
43
- helperText = _ref$helperText === void 0 ? "" : _ref$helperText,
44
- _ref$placeholder = _ref.placeholder,
45
- placeholder = _ref$placeholder === void 0 ? "" : _ref$placeholder,
46
- _ref$disabled = _ref.disabled,
47
- disabled = _ref$disabled === void 0 ? false : _ref$disabled,
48
- _ref$optional = _ref.optional,
49
- optional = _ref$optional === void 0 ? false : _ref$optional,
50
- _ref$prefix = _ref.prefix,
51
- prefix = _ref$prefix === void 0 ? "" : _ref$prefix,
52
- _ref$suffix = _ref.suffix,
53
- suffix = _ref$suffix === void 0 ? "" : _ref$suffix,
54
- min = _ref.min,
55
- max = _ref.max,
56
- step = _ref.step,
57
- onChange = _ref.onChange,
58
- onBlur = _ref.onBlur,
59
- _ref$error = _ref.error,
60
- error = _ref$error === void 0 ? "" : _ref$error,
61
- _ref$autocomplete = _ref.autocomplete,
62
- autocomplete = _ref$autocomplete === void 0 ? "off" : _ref$autocomplete,
63
- margin = _ref.margin,
64
- _ref$size = _ref.size,
65
- size = _ref$size === void 0 ? "medium" : _ref$size,
66
- _ref$tabIndex = _ref.tabIndex,
67
- tabIndex = _ref$tabIndex === void 0 ? 0 : _ref$tabIndex;
68
- return _react["default"].createElement(_NumberContext["default"].Provider, {
69
- value: {
70
- typeNumber: "number",
71
- minNumber: min,
72
- maxNumber: max,
73
- stepNumber: step
74
- }
75
- }, _react["default"].createElement(NumberContainer, null, _react["default"].createElement(_TextInput["default"], {
76
- label: label,
77
- name: name,
78
- value: value,
79
- helperText: helperText,
80
- placeholder: placeholder,
81
- disabled: disabled,
82
- optional: optional,
83
- prefix: prefix,
84
- suffix: suffix,
85
- error: error,
86
- onChange: onChange,
87
- onBlur: onBlur,
88
- autocomplete: autocomplete,
89
- margin: margin,
90
- size: size,
91
- tabIndex: tabIndex,
92
- ref: ref
93
- })));
94
- });
95
-
96
- var sizes = {
97
- small: "240px",
98
- medium: "360px",
99
- large: "480px",
100
- fillParent: "100%"
101
- };
102
-
103
- var NumberContainer = _styledComponents["default"].div(_templateObject());
104
-
105
- DxcNumber.propTypes = {
106
- label: _propTypes["default"].string,
107
- name: _propTypes["default"].string,
108
- value: _propTypes["default"].string,
109
- helperText: _propTypes["default"].string,
110
- placeholder: _propTypes["default"].string,
111
- error: _propTypes["default"].string,
112
- disabled: _propTypes["default"].bool,
113
- optional: _propTypes["default"].bool,
114
- prefix: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].shape({
115
- type: _propTypes["default"].oneOf(["svg"])
116
- })]),
117
- suffix: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].shape({
118
- type: _propTypes["default"].oneOf(["svg"])
119
- })]),
120
- min: _propTypes["default"].number,
121
- max: _propTypes["default"].number,
122
- step: _propTypes["default"].number,
123
- onChange: _propTypes["default"].func,
124
- onBlur: _propTypes["default"].func,
125
- autocomplete: _propTypes["default"].string,
126
- margin: _propTypes["default"].oneOfType([_propTypes["default"].shape({
127
- top: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
128
- bottom: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
129
- left: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
130
- right: _propTypes["default"].oneOf(Object.keys(_variables.spaces))
131
- }), _propTypes["default"].oneOf((0, _toConsumableArray2["default"])(Object.keys(_variables.spaces)))]),
132
- size: _propTypes["default"].oneOf((0, _toConsumableArray2["default"])(Object.keys(sizes))),
133
- tabIndex: _propTypes["default"].number
134
- };
135
- var _default = DxcNumber;
136
- exports["default"] = _default;