@dxc-technology/halstack-react 0.0.0-38e128d → 0.0.0-397893c

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 (531) hide show
  1. package/BackgroundColorContext.d.ts +1 -0
  2. package/BackgroundColorContext.js +30 -0
  3. package/HalstackContext.d.ts +1235 -0
  4. package/HalstackContext.js +310 -0
  5. package/README.md +28 -47
  6. package/accordion/Accordion.d.ts +4 -0
  7. package/accordion/Accordion.js +182 -0
  8. package/accordion/Accordion.stories.tsx +283 -0
  9. package/accordion/Accordion.test.js +56 -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 +101 -0
  14. package/accordion-group/AccordionGroup.stories.tsx +252 -0
  15. package/accordion-group/AccordionGroup.test.js +98 -0
  16. package/accordion-group/AccordionGroupAccordion.d.ts +4 -0
  17. package/accordion-group/AccordionGroupAccordion.js +31 -0
  18. package/accordion-group/types.d.ts +67 -0
  19. package/accordion-group/types.js +5 -0
  20. package/action-icon/ActionIcon.d.ts +4 -0
  21. package/action-icon/ActionIcon.js +47 -0
  22. package/action-icon/ActionIcon.stories.tsx +41 -0
  23. package/action-icon/ActionIcon.test.js +64 -0
  24. package/action-icon/types.d.ts +26 -0
  25. package/action-icon/types.js +5 -0
  26. package/alert/Alert.d.ts +4 -0
  27. package/alert/Alert.js +254 -0
  28. package/alert/Alert.stories.tsx +198 -0
  29. package/alert/Alert.test.js +75 -0
  30. package/alert/types.d.ts +49 -0
  31. package/alert/types.js +5 -0
  32. package/badge/Badge.d.ts +4 -0
  33. package/badge/Badge.js +48 -0
  34. package/badge/types.d.ts +5 -0
  35. package/badge/types.js +5 -0
  36. package/bleed/Bleed.d.ts +3 -0
  37. package/bleed/Bleed.js +43 -0
  38. package/bleed/Bleed.stories.tsx +342 -0
  39. package/bleed/types.d.ts +37 -0
  40. package/bleed/types.js +5 -0
  41. package/box/Box.d.ts +4 -0
  42. package/box/Box.js +75 -0
  43. package/box/Box.stories.tsx +119 -0
  44. package/box/Box.test.js +13 -0
  45. package/box/types.d.ts +32 -0
  46. package/box/types.js +5 -0
  47. package/bulleted-list/BulletedList.d.ts +7 -0
  48. package/bulleted-list/BulletedList.js +89 -0
  49. package/bulleted-list/BulletedList.stories.tsx +115 -0
  50. package/bulleted-list/types.d.ts +38 -0
  51. package/bulleted-list/types.js +5 -0
  52. package/button/Button.d.ts +4 -0
  53. package/button/Button.js +120 -0
  54. package/button/Button.stories.tsx +344 -0
  55. package/button/Button.test.js +38 -0
  56. package/button/types.d.ts +57 -0
  57. package/button/types.js +5 -0
  58. package/card/Card.d.ts +4 -0
  59. package/card/Card.js +120 -0
  60. package/card/Card.stories.tsx +171 -0
  61. package/card/Card.test.js +39 -0
  62. package/card/types.d.ts +62 -0
  63. package/card/types.js +5 -0
  64. package/checkbox/Checkbox.d.ts +4 -0
  65. package/checkbox/Checkbox.js +215 -0
  66. package/checkbox/Checkbox.stories.tsx +222 -0
  67. package/checkbox/Checkbox.test.js +199 -0
  68. package/checkbox/types.d.ts +72 -0
  69. package/checkbox/types.js +5 -0
  70. package/chip/Chip.d.ts +4 -0
  71. package/chip/Chip.js +121 -0
  72. package/chip/Chip.stories.tsx +214 -0
  73. package/chip/Chip.test.js +41 -0
  74. package/chip/types.d.ts +45 -0
  75. package/chip/types.js +5 -0
  76. package/common/OpenSans.css +69 -0
  77. package/common/coreTokens.d.ts +237 -0
  78. package/common/coreTokens.js +184 -0
  79. package/common/utils.d.ts +1 -0
  80. package/{dist/common → common}/utils.js +6 -12
  81. package/common/variables.d.ts +1381 -0
  82. package/common/variables.js +1253 -0
  83. package/container/Container.d.ts +4 -0
  84. package/container/Container.js +194 -0
  85. package/container/Container.stories.tsx +214 -0
  86. package/container/types.d.ts +74 -0
  87. package/container/types.js +5 -0
  88. package/date-input/Calendar.d.ts +4 -0
  89. package/date-input/Calendar.js +214 -0
  90. package/date-input/DateInput.d.ts +4 -0
  91. package/date-input/DateInput.js +223 -0
  92. package/date-input/DateInput.stories.tsx +285 -0
  93. package/date-input/DateInput.test.js +808 -0
  94. package/date-input/DatePicker.d.ts +4 -0
  95. package/date-input/DatePicker.js +115 -0
  96. package/date-input/Icons.d.ts +6 -0
  97. package/date-input/Icons.js +58 -0
  98. package/date-input/YearPicker.d.ts +4 -0
  99. package/date-input/YearPicker.js +100 -0
  100. package/date-input/types.d.ts +164 -0
  101. package/date-input/types.js +5 -0
  102. package/dialog/Dialog.d.ts +4 -0
  103. package/dialog/Dialog.js +104 -0
  104. package/dialog/Dialog.stories.tsx +365 -0
  105. package/dialog/Dialog.test.js +307 -0
  106. package/dialog/types.d.ts +36 -0
  107. package/dialog/types.js +5 -0
  108. package/dropdown/Dropdown.d.ts +4 -0
  109. package/dropdown/Dropdown.js +334 -0
  110. package/dropdown/Dropdown.stories.tsx +438 -0
  111. package/dropdown/Dropdown.test.js +599 -0
  112. package/dropdown/DropdownMenu.d.ts +4 -0
  113. package/dropdown/DropdownMenu.js +63 -0
  114. package/dropdown/DropdownMenuItem.d.ts +4 -0
  115. package/dropdown/DropdownMenuItem.js +67 -0
  116. package/dropdown/types.d.ts +98 -0
  117. package/dropdown/types.js +5 -0
  118. package/file-input/FileInput.d.ts +4 -0
  119. package/file-input/FileInput.js +479 -0
  120. package/file-input/FileInput.stories.tsx +618 -0
  121. package/file-input/FileInput.test.js +459 -0
  122. package/file-input/FileItem.d.ts +4 -0
  123. package/file-input/FileItem.js +135 -0
  124. package/file-input/types.d.ts +129 -0
  125. package/file-input/types.js +5 -0
  126. package/flex/Flex.d.ts +4 -0
  127. package/flex/Flex.js +57 -0
  128. package/flex/Flex.stories.tsx +112 -0
  129. package/flex/types.d.ts +97 -0
  130. package/flex/types.js +5 -0
  131. package/footer/Footer.d.ts +4 -0
  132. package/footer/Footer.js +138 -0
  133. package/footer/Footer.stories.tsx +171 -0
  134. package/footer/Footer.test.js +85 -0
  135. package/footer/Icons.d.ts +3 -0
  136. package/footer/Icons.js +136 -0
  137. package/footer/types.d.ts +64 -0
  138. package/footer/types.js +5 -0
  139. package/grid/Grid.d.ts +7 -0
  140. package/grid/Grid.js +76 -0
  141. package/grid/Grid.stories.tsx +219 -0
  142. package/grid/types.d.ts +115 -0
  143. package/grid/types.js +5 -0
  144. package/header/Header.d.ts +8 -0
  145. package/header/Header.js +220 -0
  146. package/header/Header.stories.tsx +251 -0
  147. package/header/Header.test.js +66 -0
  148. package/header/Icons.d.ts +2 -0
  149. package/header/Icons.js +29 -0
  150. package/header/types.d.ts +33 -0
  151. package/header/types.js +5 -0
  152. package/heading/Heading.d.ts +4 -0
  153. package/{dist/heading → heading}/Heading.js +34 -115
  154. package/heading/Heading.stories.tsx +54 -0
  155. package/heading/Heading.test.js +169 -0
  156. package/heading/types.d.ts +33 -0
  157. package/heading/types.js +5 -0
  158. package/image/Image.d.ts +4 -0
  159. package/image/Image.js +70 -0
  160. package/image/Image.stories.tsx +127 -0
  161. package/image/types.d.ts +72 -0
  162. package/image/types.js +5 -0
  163. package/inset/Inset.d.ts +3 -0
  164. package/inset/Inset.js +43 -0
  165. package/inset/Inset.stories.tsx +230 -0
  166. package/inset/types.d.ts +37 -0
  167. package/inset/types.js +5 -0
  168. package/layout/ApplicationLayout.d.ts +20 -0
  169. package/layout/ApplicationLayout.js +134 -0
  170. package/layout/ApplicationLayout.stories.tsx +162 -0
  171. package/layout/Icons.d.ts +8 -0
  172. package/layout/Icons.js +58 -0
  173. package/layout/SidenavContext.d.ts +5 -0
  174. package/layout/SidenavContext.js +13 -0
  175. package/layout/types.d.ts +41 -0
  176. package/layout/types.js +5 -0
  177. package/link/Link.d.ts +4 -0
  178. package/link/Link.js +115 -0
  179. package/link/Link.stories.tsx +253 -0
  180. package/link/Link.test.js +63 -0
  181. package/link/types.d.ts +54 -0
  182. package/link/types.js +5 -0
  183. package/main.d.ts +47 -0
  184. package/{dist/main.js → main.js} +130 -146
  185. package/nav-tabs/NavTabs.d.ts +8 -0
  186. package/nav-tabs/NavTabs.js +93 -0
  187. package/nav-tabs/NavTabs.stories.tsx +274 -0
  188. package/nav-tabs/NavTabs.test.js +75 -0
  189. package/nav-tabs/Tab.d.ts +4 -0
  190. package/nav-tabs/Tab.js +117 -0
  191. package/nav-tabs/types.d.ts +52 -0
  192. package/nav-tabs/types.js +5 -0
  193. package/number-input/NumberInput.d.ts +11 -0
  194. package/number-input/NumberInput.js +67 -0
  195. package/number-input/NumberInput.stories.tsx +131 -0
  196. package/number-input/NumberInput.test.js +830 -0
  197. package/number-input/types.d.ts +130 -0
  198. package/number-input/types.js +5 -0
  199. package/package.json +58 -50
  200. package/paginator/Icons.d.ts +5 -0
  201. package/paginator/Icons.js +40 -0
  202. package/paginator/Paginator.d.ts +4 -0
  203. package/paginator/Paginator.js +135 -0
  204. package/paginator/Paginator.stories.tsx +87 -0
  205. package/paginator/Paginator.test.js +335 -0
  206. package/paginator/types.d.ts +38 -0
  207. package/paginator/types.js +5 -0
  208. package/paragraph/Paragraph.d.ts +5 -0
  209. package/paragraph/Paragraph.js +22 -0
  210. package/paragraph/Paragraph.stories.tsx +27 -0
  211. package/password-input/Icons.d.ts +6 -0
  212. package/password-input/Icons.js +35 -0
  213. package/password-input/PasswordInput.d.ts +4 -0
  214. package/password-input/PasswordInput.js +97 -0
  215. package/password-input/PasswordInput.stories.tsx +99 -0
  216. package/password-input/PasswordInput.test.js +198 -0
  217. package/password-input/types.d.ts +111 -0
  218. package/password-input/types.js +5 -0
  219. package/progress-bar/ProgressBar.d.ts +4 -0
  220. package/progress-bar/ProgressBar.js +144 -0
  221. package/progress-bar/ProgressBar.stories.tsx +93 -0
  222. package/progress-bar/ProgressBar.test.js +93 -0
  223. package/progress-bar/types.d.ts +37 -0
  224. package/progress-bar/types.js +5 -0
  225. package/quick-nav/QuickNav.d.ts +4 -0
  226. package/quick-nav/QuickNav.js +94 -0
  227. package/quick-nav/QuickNav.stories.tsx +356 -0
  228. package/quick-nav/types.d.ts +21 -0
  229. package/quick-nav/types.js +5 -0
  230. package/radio-group/Radio.d.ts +4 -0
  231. package/radio-group/Radio.js +124 -0
  232. package/radio-group/RadioGroup.d.ts +4 -0
  233. package/radio-group/RadioGroup.js +235 -0
  234. package/radio-group/RadioGroup.stories.tsx +214 -0
  235. package/radio-group/RadioGroup.test.js +756 -0
  236. package/radio-group/types.d.ts +114 -0
  237. package/radio-group/types.js +5 -0
  238. package/resultset-table/Icons.d.ts +7 -0
  239. package/resultset-table/Icons.js +47 -0
  240. package/resultset-table/ResultsetTable.d.ts +4 -0
  241. package/resultset-table/ResultsetTable.js +159 -0
  242. package/resultset-table/ResultsetTable.stories.tsx +300 -0
  243. package/resultset-table/ResultsetTable.test.js +305 -0
  244. package/resultset-table/types.d.ts +67 -0
  245. package/resultset-table/types.js +5 -0
  246. package/select/Icons.d.ts +10 -0
  247. package/select/Icons.js +89 -0
  248. package/select/Listbox.d.ts +4 -0
  249. package/select/Listbox.js +143 -0
  250. package/select/Option.d.ts +4 -0
  251. package/select/Option.js +87 -0
  252. package/select/Select.d.ts +4 -0
  253. package/select/Select.js +590 -0
  254. package/select/Select.stories.tsx +971 -0
  255. package/select/Select.test.js +2370 -0
  256. package/select/types.d.ts +209 -0
  257. package/select/types.js +5 -0
  258. package/sidenav/Icons.d.ts +7 -0
  259. package/sidenav/Icons.js +47 -0
  260. package/sidenav/Sidenav.d.ts +10 -0
  261. package/sidenav/Sidenav.js +196 -0
  262. package/sidenav/Sidenav.stories.tsx +282 -0
  263. package/sidenav/Sidenav.test.js +37 -0
  264. package/sidenav/types.d.ts +76 -0
  265. package/sidenav/types.js +5 -0
  266. package/slider/Slider.d.ts +4 -0
  267. package/slider/Slider.js +285 -0
  268. package/slider/Slider.test.js +254 -0
  269. package/slider/types.d.ts +86 -0
  270. package/slider/types.js +5 -0
  271. package/spinner/Spinner.d.ts +4 -0
  272. package/spinner/Spinner.js +206 -0
  273. package/spinner/Spinner.stories.tsx +129 -0
  274. package/spinner/Spinner.test.js +55 -0
  275. package/spinner/types.d.ts +32 -0
  276. package/spinner/types.js +5 -0
  277. package/status-light/StatusLight.d.ts +4 -0
  278. package/status-light/StatusLight.js +51 -0
  279. package/status-light/StatusLight.stories.tsx +74 -0
  280. package/status-light/StatusLight.test.js +25 -0
  281. package/status-light/types.d.ts +17 -0
  282. package/status-light/types.js +5 -0
  283. package/switch/Switch.d.ts +4 -0
  284. package/switch/Switch.js +214 -0
  285. package/switch/Switch.stories.tsx +137 -0
  286. package/switch/Switch.test.js +180 -0
  287. package/switch/types.d.ts +66 -0
  288. package/switch/types.js +5 -0
  289. package/table/Table.d.ts +4 -0
  290. package/{dist/table → table}/Table.js +14 -50
  291. package/table/Table.stories.tsx +356 -0
  292. package/table/Table.test.js +21 -0
  293. package/table/types.d.ts +21 -0
  294. package/table/types.js +5 -0
  295. package/tabs/Tab.d.ts +4 -0
  296. package/tabs/Tab.js +113 -0
  297. package/tabs/Tabs.d.ts +4 -0
  298. package/tabs/Tabs.js +384 -0
  299. package/tabs/Tabs.stories.tsx +226 -0
  300. package/tabs/Tabs.test.js +294 -0
  301. package/tabs/types.d.ts +92 -0
  302. package/tabs/types.js +5 -0
  303. package/tag/Tag.d.ts +4 -0
  304. package/tag/Tag.js +151 -0
  305. package/tag/Tag.stories.tsx +155 -0
  306. package/tag/Tag.test.js +49 -0
  307. package/tag/types.d.ts +69 -0
  308. package/tag/types.js +5 -0
  309. package/text-input/Icons.d.ts +8 -0
  310. package/text-input/Icons.js +56 -0
  311. package/text-input/Suggestion.d.ts +4 -0
  312. package/text-input/Suggestion.js +67 -0
  313. package/text-input/Suggestions.d.ts +4 -0
  314. package/text-input/Suggestions.js +84 -0
  315. package/text-input/TextInput.d.ts +4 -0
  316. package/text-input/TextInput.js +572 -0
  317. package/text-input/TextInput.stories.tsx +465 -0
  318. package/text-input/TextInput.test.js +1739 -0
  319. package/text-input/types.d.ts +205 -0
  320. package/text-input/types.js +5 -0
  321. package/textarea/Textarea.d.ts +4 -0
  322. package/textarea/Textarea.js +234 -0
  323. package/textarea/Textarea.stories.tsx +174 -0
  324. package/textarea/Textarea.test.js +406 -0
  325. package/textarea/types.d.ts +141 -0
  326. package/textarea/types.js +5 -0
  327. package/toggle-group/ToggleGroup.d.ts +4 -0
  328. package/toggle-group/ToggleGroup.js +201 -0
  329. package/toggle-group/ToggleGroup.stories.tsx +218 -0
  330. package/toggle-group/ToggleGroup.test.js +137 -0
  331. package/toggle-group/types.d.ts +114 -0
  332. package/toggle-group/types.js +5 -0
  333. package/typography/Typography.d.ts +4 -0
  334. package/typography/Typography.js +23 -0
  335. package/typography/Typography.stories.tsx +198 -0
  336. package/typography/types.d.ts +18 -0
  337. package/typography/types.js +5 -0
  338. package/useTheme.d.ts +1134 -0
  339. package/{dist/useTheme.js → useTheme.js} +4 -11
  340. package/useTranslatedLabels.d.ts +85 -0
  341. package/useTranslatedLabels.js +14 -0
  342. package/utils/BaseTypography.d.ts +21 -0
  343. package/utils/BaseTypography.js +94 -0
  344. package/utils/FocusLock.d.ts +13 -0
  345. package/utils/FocusLock.js +124 -0
  346. package/wizard/Wizard.d.ts +4 -0
  347. package/wizard/Wizard.js +250 -0
  348. package/wizard/Wizard.stories.tsx +253 -0
  349. package/wizard/Wizard.test.js +114 -0
  350. package/wizard/types.d.ts +64 -0
  351. package/wizard/types.js +5 -0
  352. package/babel.config.js +0 -8
  353. package/dist/BackgroundColorContext.js +0 -46
  354. package/dist/ThemeContext.js +0 -248
  355. package/dist/accordion/Accordion.js +0 -353
  356. package/dist/accordion-group/AccordionGroup.js +0 -186
  357. package/dist/alert/Alert.js +0 -403
  358. package/dist/alert/index.d.ts +0 -51
  359. package/dist/badge/Badge.js +0 -63
  360. package/dist/box/Box.js +0 -156
  361. package/dist/button/Button.js +0 -238
  362. package/dist/card/Card.js +0 -254
  363. package/dist/checkbox/Checkbox.js +0 -300
  364. package/dist/checkbox/Checkbox.stories.js +0 -144
  365. package/dist/checkbox/readme.md +0 -116
  366. package/dist/chip/Chip.js +0 -265
  367. package/dist/common/OpenSans.css +0 -81
  368. package/dist/common/RequiredComponent.js +0 -40
  369. package/dist/common/variables.js +0 -1441
  370. package/dist/date/Date.js +0 -379
  371. package/dist/date/Date.stories.js +0 -205
  372. package/dist/date/readme.md +0 -73
  373. package/dist/dialog/Dialog.js +0 -218
  374. package/dist/dropdown/Dropdown.js +0 -544
  375. package/dist/file-input/FileInput.js +0 -641
  376. package/dist/file-input/FileItem.js +0 -280
  377. package/dist/file-input/index.d.ts +0 -81
  378. package/dist/footer/Footer.js +0 -395
  379. package/dist/footer/Footer.stories.js +0 -94
  380. package/dist/footer/dxc_logo.svg +0 -15
  381. package/dist/footer/readme.md +0 -41
  382. package/dist/header/Header.js +0 -403
  383. package/dist/header/Header.stories.js +0 -176
  384. package/dist/header/close_icon.svg +0 -1
  385. package/dist/header/dxc_logo_black.svg +0 -8
  386. package/dist/header/hamb_menu_black.svg +0 -1
  387. package/dist/header/hamb_menu_white.svg +0 -1
  388. package/dist/header/readme.md +0 -33
  389. package/dist/input-text/InputText.js +0 -707
  390. package/dist/input-text/InputText.stories.js +0 -209
  391. package/dist/input-text/error.svg +0 -1
  392. package/dist/input-text/readme.md +0 -91
  393. package/dist/layout/ApplicationLayout.js +0 -331
  394. package/dist/layout/facebook.svg +0 -45
  395. package/dist/layout/linkedin.svg +0 -50
  396. package/dist/layout/twitter.svg +0 -53
  397. package/dist/link/Link.js +0 -237
  398. package/dist/link/readme.md +0 -51
  399. package/dist/main.d.ts +0 -7
  400. package/dist/new-date/NewDate.js +0 -400
  401. package/dist/new-date/index.d.ts +0 -95
  402. package/dist/new-input-text/NewInputText.js +0 -964
  403. package/dist/new-input-text/index.d.ts +0 -135
  404. package/dist/new-textarea/NewTextarea.js +0 -362
  405. package/dist/new-textarea/index.d.ts +0 -117
  406. package/dist/number/Number.js +0 -136
  407. package/dist/number/NumberContext.js +0 -16
  408. package/dist/number/index.d.ts +0 -113
  409. package/dist/paginator/Paginator.js +0 -289
  410. package/dist/paginator/images/next.svg +0 -3
  411. package/dist/paginator/images/nextPage.svg +0 -3
  412. package/dist/paginator/images/previous.svg +0 -3
  413. package/dist/paginator/images/previousPage.svg +0 -3
  414. package/dist/paginator/readme.md +0 -50
  415. package/dist/password/Password.js +0 -200
  416. package/dist/password/index.d.ts +0 -94
  417. package/dist/password/styles.css +0 -3
  418. package/dist/progress-bar/ProgressBar.js +0 -242
  419. package/dist/progress-bar/ProgressBar.stories.js +0 -280
  420. package/dist/progress-bar/readme.md +0 -63
  421. package/dist/radio/Radio.js +0 -209
  422. package/dist/radio/Radio.stories.js +0 -166
  423. package/dist/radio/readme.md +0 -70
  424. package/dist/resultsetTable/ResultsetTable.js +0 -358
  425. package/dist/resultsetTable/arrow_downward-24px_wht.svg +0 -1
  426. package/dist/resultsetTable/arrow_upward-24px_wht.svg +0 -1
  427. package/dist/resultsetTable/unfold_more-24px_wht.svg +0 -1
  428. package/dist/select/Select.js +0 -549
  429. package/dist/sidenav/Sidenav.js +0 -179
  430. package/dist/slider/Slider.js +0 -319
  431. package/dist/slider/Slider.stories.js +0 -241
  432. package/dist/slider/readme.md +0 -64
  433. package/dist/spinner/Spinner.js +0 -381
  434. package/dist/spinner/Spinner.stories.js +0 -183
  435. package/dist/spinner/readme.md +0 -65
  436. package/dist/switch/Switch.js +0 -222
  437. package/dist/switch/Switch.stories.js +0 -134
  438. package/dist/switch/readme.md +0 -133
  439. package/dist/tabs/Tabs.js +0 -343
  440. package/dist/tabs/Tabs.stories.js +0 -130
  441. package/dist/tabs/readme.md +0 -78
  442. package/dist/tabs-for-sections/TabsForSections.js +0 -92
  443. package/dist/tabs-for-sections/readme.md +0 -78
  444. package/dist/tag/Tag.js +0 -282
  445. package/dist/textarea/Textarea.js +0 -264
  446. package/dist/toggle/Toggle.js +0 -220
  447. package/dist/toggle/Toggle.stories.js +0 -297
  448. package/dist/toggle/readme.md +0 -80
  449. package/dist/toggle-group/ToggleGroup.js +0 -223
  450. package/dist/upload/Upload.js +0 -205
  451. package/dist/upload/Upload.stories.js +0 -72
  452. package/dist/upload/buttons-upload/ButtonsUpload.js +0 -139
  453. package/dist/upload/buttons-upload/drag-drop-icon.svg +0 -4
  454. package/dist/upload/buttons-upload/upload-button.svg +0 -1
  455. package/dist/upload/dragAndDropArea/DragAndDropArea.js +0 -329
  456. package/dist/upload/dragAndDropArea/upload_drop.svg +0 -4
  457. package/dist/upload/dragAndDropArea/upload_file.svg +0 -4
  458. package/dist/upload/file-upload/FileToUpload.js +0 -184
  459. package/dist/upload/file-upload/audio-icon.svg +0 -4
  460. package/dist/upload/file-upload/close.svg +0 -4
  461. package/dist/upload/file-upload/file-icon.svg +0 -4
  462. package/dist/upload/file-upload/video-icon.svg +0 -4
  463. package/dist/upload/files-upload/FilesToUpload.js +0 -123
  464. package/dist/upload/readme.md +0 -37
  465. package/dist/upload/transaction/Transaction.js +0 -175
  466. package/dist/upload/transaction/audio-icon-err.svg +0 -4
  467. package/dist/upload/transaction/audio-icon.svg +0 -4
  468. package/dist/upload/transaction/error-icon.svg +0 -4
  469. package/dist/upload/transaction/file-icon-err.svg +0 -4
  470. package/dist/upload/transaction/file-icon.svg +0 -4
  471. package/dist/upload/transaction/image-icon-err.svg +0 -4
  472. package/dist/upload/transaction/image-icon.svg +0 -4
  473. package/dist/upload/transaction/success-icon.svg +0 -4
  474. package/dist/upload/transaction/video-icon-err.svg +0 -4
  475. package/dist/upload/transaction/video-icon.svg +0 -4
  476. package/dist/upload/transactions/Transactions.js +0 -138
  477. package/dist/wizard/Wizard.js +0 -411
  478. package/dist/wizard/invalid_icon.svg +0 -5
  479. package/dist/wizard/valid_icon.svg +0 -5
  480. package/dist/wizard/validation-wrong.svg +0 -6
  481. package/test/Accordion.test.js +0 -33
  482. package/test/AccordionGroup.test.js +0 -125
  483. package/test/Alert.test.js +0 -53
  484. package/test/Box.test.js +0 -10
  485. package/test/Button.test.js +0 -18
  486. package/test/Card.test.js +0 -30
  487. package/test/Checkbox.test.js +0 -45
  488. package/test/Chip.test.js +0 -25
  489. package/test/Date.test.js +0 -393
  490. package/test/Dialog.test.js +0 -23
  491. package/test/Dropdown.test.js +0 -145
  492. package/test/FileInput.test.js +0 -201
  493. package/test/Footer.test.js +0 -99
  494. package/test/Header.test.js +0 -39
  495. package/test/Heading.test.js +0 -35
  496. package/test/InputText.test.js +0 -240
  497. package/test/Link.test.js +0 -43
  498. package/test/NewDate.test.js +0 -232
  499. package/test/NewInputText.test.js +0 -734
  500. package/test/NewTextarea.test.js +0 -195
  501. package/test/Number.test.js +0 -257
  502. package/test/Paginator.test.js +0 -177
  503. package/test/Password.test.js +0 -83
  504. package/test/ProgressBar.test.js +0 -35
  505. package/test/Radio.test.js +0 -37
  506. package/test/ResultsetTable.test.js +0 -329
  507. package/test/Select.test.js +0 -212
  508. package/test/Sidenav.test.js +0 -45
  509. package/test/Slider.test.js +0 -82
  510. package/test/Spinner.test.js +0 -32
  511. package/test/Switch.test.js +0 -45
  512. package/test/Table.test.js +0 -36
  513. package/test/Tabs.test.js +0 -109
  514. package/test/TabsForSections.test.js +0 -34
  515. package/test/Tag.test.js +0 -32
  516. package/test/TextArea.test.js +0 -52
  517. package/test/ToggleGroup.test.js +0 -81
  518. package/test/Upload.test.js +0 -60
  519. package/test/Wizard.test.js +0 -130
  520. package/test/mocks/pngMock.js +0 -1
  521. package/test/mocks/svgMock.js +0 -1
  522. /package/{dist/common → common}/fonts/OpenSans-Bold.ttf +0 -0
  523. /package/{dist/common → common}/fonts/OpenSans-BoldItalic.ttf +0 -0
  524. /package/{dist/common → common}/fonts/OpenSans-ExtraBold.ttf +0 -0
  525. /package/{dist/common → common}/fonts/OpenSans-ExtraBoldItalic.ttf +0 -0
  526. /package/{dist/common → common}/fonts/OpenSans-Italic.ttf +0 -0
  527. /package/{dist/common → common}/fonts/OpenSans-Light.ttf +0 -0
  528. /package/{dist/common → common}/fonts/OpenSans-LightItalic.ttf +0 -0
  529. /package/{dist/common → common}/fonts/OpenSans-Regular.ttf +0 -0
  530. /package/{dist/common → common}/fonts/OpenSans-SemiBold.ttf +0 -0
  531. /package/{dist/common → common}/fonts/OpenSans-SemiBoldItalic.ttf +0 -0
@@ -1,964 +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 _useTheme = _interopRequireDefault(require("../useTheme.js"));
25
-
26
- var _propTypes = _interopRequireDefault(require("prop-types"));
27
-
28
- var _variables = require("../common/variables.js");
29
-
30
- var _utils = require("../common/utils.js");
31
-
32
- var _uuid = require("uuid");
33
-
34
- var _BackgroundColorContext = _interopRequireDefault(require("../BackgroundColorContext.js"));
35
-
36
- var _NumberContext = _interopRequireDefault(require("../number/NumberContext.js"));
37
-
38
- function _templateObject17() {
39
- var data = (0, _taggedTemplateLiteral2["default"])(["\n display: flex;\n padding: calc((39px - 1.75em) / 2) 0 calc((39px - 1.75em) / 2) 1em;\n align-items: center;\n font-size: 0.875rem;\n line-height: 1.75em;\n"]);
40
-
41
- _templateObject17 = function _templateObject17() {
42
- return data;
43
- };
44
-
45
- return data;
46
- }
47
-
48
- function _templateObject16() {
49
- var data = (0, _taggedTemplateLiteral2["default"])(["\n display: flex;\n flex-wrap: wrap;\n align-content: center;\n margin-right: 0.5rem;\n height: 18px;\n width: 18px;\n color: ", ";\n\n svg {\n line-height: 1.75em;\n font-size: 0.875rem;\n }\n"]);
50
-
51
- _templateObject16 = function _templateObject16() {
52
- return data;
53
- };
54
-
55
- return data;
56
- }
57
-
58
- function _templateObject15() {
59
- var data = (0, _taggedTemplateLiteral2["default"])(["\n display: flex;\n padding: calc((39px - 1.75em) / 2) 0 calc((39px - 1.75em) / 2) 1em;\n color: ", ";\n font-size: 0.875rem;\n line-height: 1.75em;\n"]);
60
-
61
- _templateObject15 = function _templateObject15() {
62
- return data;
63
- };
64
-
65
- return data;
66
- }
67
-
68
- function _templateObject14() {
69
- var data = (0, _taggedTemplateLiteral2["default"])(["\n padding: calc((39px - 1.75em) / 2) 0 calc((39px - 1.75em) / 2) 1em;\n line-height: 1.75em;\n list-style-type: none;\n cursor: pointer;\n\n ", "\n"]);
70
-
71
- _templateObject14 = function _templateObject14() {
72
- return data;
73
- };
74
-
75
- return data;
76
- }
77
-
78
- function _templateObject13() {
79
- var data = (0, _taggedTemplateLiteral2["default"])(["\n background-color: ", ";\n position: absolute;\n z-index: 1;\n max-height: 160px;\n overflow: auto;\n top: calc(100% + 4px);\n left: 0;\n margin: 0;\n padding: 0;\n width: 100%;\n box-sizing: border-box;\n cursor: default;\n border-radius: 4px;\n border: 1px solid ", ";\n color: ", ";\n font-family: ", ";\n font-size: ", ";\n font-style: ", ";\n font-weight: ", ";\n"]);
80
-
81
- _templateObject13 = function _templateObject13() {
82
- return data;
83
- };
84
-
85
- return data;
86
- }
87
-
88
- function _templateObject12() {
89
- var data = (0, _taggedTemplateLiteral2["default"])(["\n min-height: 1.5em;\n color: ", ";\n font-family: ", ";\n font-size: 0.75rem;\n font-weight: 400;\n line-height: 1.5em;\n"]);
90
-
91
- _templateObject12 = function _templateObject12() {
92
- return data;
93
- };
94
-
95
- return data;
96
- }
97
-
98
- function _templateObject11() {
99
- var data = (0, _taggedTemplateLiteral2["default"])(["\n display: flex;\n flex-wrap: wrap;\n align-content: center;\n padding: 3px;\n height: 18px;\n width: 18px;\n margin-left: calc(1rem * 0.25);\n color: ", ";\n\n svg {\n line-height: 18px;\n font-size: 1.25rem;\n }\n"]);
100
-
101
- _templateObject11 = function _templateObject11() {
102
- return data;
103
- };
104
-
105
- return data;
106
- }
107
-
108
- function _templateObject10() {
109
- var data = (0, _taggedTemplateLiteral2["default"])(["\n height: calc(1rem * 1.5);\n line-height: calc(1rem * 1.5);\n margin: 0 calc(1rem * 0.25);\n padding: 0 0 0 calc(1rem * 0.5);\n ", ";\n font-family: ", ";\n font-size: 1rem;\n pointer-events: none;\n"]);
110
-
111
- _templateObject10 = function _templateObject10() {
112
- return data;
113
- };
114
-
115
- return data;
116
- }
117
-
118
- function _templateObject9() {
119
- var data = (0, _taggedTemplateLiteral2["default"])(["\n height: calc(1rem * 1.5);\n line-height: calc(1rem * 1.5);\n margin-left: calc(1rem * 0.25);\n padding: 0 calc(1rem * 0.5) 0 0;\n ", ";\n font-family: ", ";\n font-size: 1rem;\n pointer-events: none;\n"]);
120
-
121
- _templateObject9 = function _templateObject9() {
122
- return data;
123
- };
124
-
125
- return data;
126
- }
127
-
128
- function _templateObject8() {
129
- var data = (0, _taggedTemplateLiteral2["default"])(["\n display: flex;\n flex-wrap: wrap;\n align-content: center;\n height: 24px;\n width: 24px;\n font-size: 1rem;\n font-family: ", ";\n border: 1px solid transparent;\n border-radius: 4px;\n padding: 3px;\n margin-left: calc(1rem * 0.25);\n ", "\n\n box-shadow: 0 0 0 2px transparent;\n background-color: ", ";\n\n color: ", ";\n\n ", "\n\n svg {\n line-height: 18px;\n }\n"]);
130
-
131
- _templateObject8 = function _templateObject8() {
132
- return data;
133
- };
134
-
135
- return data;
136
- }
137
-
138
- function _templateObject7() {
139
- var data = (0, _taggedTemplateLiteral2["default"])(["\n width: 16px;\n height: 16px;\n"]);
140
-
141
- _templateObject7 = function _templateObject7() {
142
- return data;
143
- };
144
-
145
- return data;
146
- }
147
-
148
- function _templateObject6() {
149
- var data = (0, _taggedTemplateLiteral2["default"])(["\n height: calc(calc(1rem * 2.5) - calc(1px * 2));\n width: 100%;\n background: none;\n border: none;\n outline: none;\n padding: 0 calc(1rem * 0.5);\n\n color: ", ";\n\n font-family: ", ";\n font-size: ", ";\n font-style: ", ";\n font-weight: ", ";\n line-height: 1.5em;\n ", "\n\n ::placeholder {\n color: ", ";\n }\n"]);
150
-
151
- _templateObject6 = function _templateObject6() {
152
- return data;
153
- };
154
-
155
- return data;
156
- }
157
-
158
- function _templateObject5() {
159
- var data = (0, _taggedTemplateLiteral2["default"])(["\n display: flex;\n position: relative;\n align-items: center;\n height: calc(calc(1rem * 2.5) - calc(1px * 2));\n margin: calc(1rem * 0.25) 0;\n padding: 0 calc(1rem * 0.5);\n\n ", "\n box-shadow: 0 0 0 2px transparent;\n border-radius: 4px;\n border: 1px solid\n ", ";\n ", "\n ", ";\n\n ", ";\n"]);
160
-
161
- _templateObject5 = function _templateObject5() {
162
- return data;
163
- };
164
-
165
- return data;
166
- }
167
-
168
- function _templateObject4() {
169
- var data = (0, _taggedTemplateLiteral2["default"])(["\n color: ", ";\n\n font-family: ", ";\n font-size: ", ";\n font-style: ", ";\n font-weight: ", ";\n line-height: 1.5em;\n"]);
170
-
171
- _templateObject4 = function _templateObject4() {
172
- return data;
173
- };
174
-
175
- return data;
176
- }
177
-
178
- function _templateObject3() {
179
- var data = (0, _taggedTemplateLiteral2["default"])(["\n font-weight: ", ";\n"]);
180
-
181
- _templateObject3 = function _templateObject3() {
182
- return data;
183
- };
184
-
185
- return data;
186
- }
187
-
188
- function _templateObject2() {
189
- var data = (0, _taggedTemplateLiteral2["default"])(["\n color: ", ";\n\n font-family: ", ";\n font-size: ", ";\n font-style: ", ";\n font-weight: ", ";\n line-height: 1.75em;\n"]);
190
-
191
- _templateObject2 = function _templateObject2() {
192
- return data;
193
- };
194
-
195
- return data;
196
- }
197
-
198
- function _templateObject() {
199
- 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"]);
200
-
201
- _templateObject = function _templateObject() {
202
- return data;
203
- };
204
-
205
- return data;
206
- }
207
-
208
- var makeCancelable = function makeCancelable(promise) {
209
- var hasCanceled_ = false;
210
- var wrappedPromise = new Promise(function (resolve, reject) {
211
- promise.then(function (val) {
212
- return hasCanceled_ ? reject({
213
- isCanceled: true
214
- }) : resolve(val);
215
- }, function (promiseError) {
216
- return hasCanceled_ ? reject({
217
- isCanceled: true
218
- }) : reject(promiseError);
219
- });
220
- });
221
- return {
222
- promise: wrappedPromise,
223
- cancel: function cancel() {
224
- hasCanceled_ = true;
225
- }
226
- };
227
- };
228
-
229
- var getNotOptionalErrorMessage = function getNotOptionalErrorMessage() {
230
- return "This field is required. Please, enter a value.";
231
- };
232
-
233
- var getLengthErrorMessage = function getLengthErrorMessage(length) {
234
- return "Min length ".concat(length.min, ", max length ").concat(length.max, ".");
235
- };
236
-
237
- var getPatternErrorMessage = function getPatternErrorMessage() {
238
- return "Please match the format requested.";
239
- };
240
-
241
- var patternMatch = function patternMatch(pattern, value) {
242
- return new RegExp(pattern).test(value);
243
- };
244
-
245
- var DxcNewInputText = _react["default"].forwardRef(function (_ref, ref) {
246
- var _ref$label = _ref.label,
247
- label = _ref$label === void 0 ? "" : _ref$label,
248
- _ref$name = _ref.name,
249
- name = _ref$name === void 0 ? "" : _ref$name,
250
- value = _ref.value,
251
- _ref$helperText = _ref.helperText,
252
- helperText = _ref$helperText === void 0 ? "" : _ref$helperText,
253
- _ref$placeholder = _ref.placeholder,
254
- placeholder = _ref$placeholder === void 0 ? "" : _ref$placeholder,
255
- action = _ref.action,
256
- _ref$clearable = _ref.clearable,
257
- clearable = _ref$clearable === void 0 ? false : _ref$clearable,
258
- _ref$disabled = _ref.disabled,
259
- disabled = _ref$disabled === void 0 ? false : _ref$disabled,
260
- _ref$optional = _ref.optional,
261
- optional = _ref$optional === void 0 ? false : _ref$optional,
262
- _ref$prefix = _ref.prefix,
263
- prefix = _ref$prefix === void 0 ? "" : _ref$prefix,
264
- _ref$suffix = _ref.suffix,
265
- suffix = _ref$suffix === void 0 ? "" : _ref$suffix,
266
- onChange = _ref.onChange,
267
- onBlur = _ref.onBlur,
268
- _ref$error = _ref.error,
269
- error = _ref$error === void 0 ? "" : _ref$error,
270
- suggestions = _ref.suggestions,
271
- pattern = _ref.pattern,
272
- length = _ref.length,
273
- _ref$autocomplete = _ref.autocomplete,
274
- autocomplete = _ref$autocomplete === void 0 ? "off" : _ref$autocomplete,
275
- margin = _ref.margin,
276
- _ref$size = _ref.size,
277
- size = _ref$size === void 0 ? "medium" : _ref$size,
278
- _ref$tabIndex = _ref.tabIndex,
279
- tabIndex = _ref$tabIndex === void 0 ? 0 : _ref$tabIndex;
280
-
281
- var _useState = (0, _react.useState)(""),
282
- _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
283
- innerValue = _useState2[0],
284
- setInnerValue = _useState2[1];
285
-
286
- var _useState3 = (0, _react.useState)(false),
287
- _useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
288
- isOpen = _useState4[0],
289
- changeIsOpen = _useState4[1];
290
-
291
- var _useState5 = (0, _react.useState)(false),
292
- _useState6 = (0, _slicedToArray2["default"])(_useState5, 2),
293
- isSearching = _useState6[0],
294
- changeIsSearching = _useState6[1];
295
-
296
- var _useState7 = (0, _react.useState)(false),
297
- _useState8 = (0, _slicedToArray2["default"])(_useState7, 2),
298
- isScrollable = _useState8[0],
299
- changeIsScrollable = _useState8[1];
300
-
301
- var _useState9 = (0, _react.useState)(false),
302
- _useState10 = (0, _slicedToArray2["default"])(_useState9, 2),
303
- isActiveSuggestion = _useState10[0],
304
- changeIsActiveSuggestion = _useState10[1];
305
-
306
- var _useState11 = (0, _react.useState)(false),
307
- _useState12 = (0, _slicedToArray2["default"])(_useState11, 2),
308
- isAutosuggestError = _useState12[0],
309
- changeIsAutosuggestError = _useState12[1];
310
-
311
- var _useState13 = (0, _react.useState)([]),
312
- _useState14 = (0, _slicedToArray2["default"])(_useState13, 2),
313
- filteredSuggestions = _useState14[0],
314
- changeFilteredSuggestions = _useState14[1];
315
-
316
- var _useState15 = (0, _react.useState)(-1),
317
- _useState16 = (0, _slicedToArray2["default"])(_useState15, 2),
318
- visualFocusedSuggIndex = _useState16[0],
319
- changeVisualFocusedSuggIndex = _useState16[1];
320
-
321
- var suggestionsRef = (0, _react.useRef)(null);
322
- var inputRef = (0, _react.useRef)(null);
323
- var actionRef = (0, _react.useRef)(null);
324
- var colorsTheme = (0, _useTheme["default"])();
325
- var backgroundType = (0, _react.useContext)(_BackgroundColorContext["default"]);
326
- var inputId = "input-".concat((0, _uuid.v4)());
327
- var autosuggestId = "".concat(inputId, "-listBox");
328
- var errorId = "error-message-".concat(inputId);
329
- var numberContext = (0, _react.useContext)(_NumberContext["default"]);
330
-
331
- var isNotOptional = function isNotOptional(value) {
332
- return value === "" && !optional;
333
- };
334
-
335
- var isLengthIncorrect = function isLengthIncorrect(value) {
336
- return value !== "" && length && length.min && length.max && (value.length < length.min || value.length > length.max);
337
- };
338
-
339
- var isNumberIncorrect = function isNumberIncorrect(value) {
340
- return (numberContext === null || numberContext === void 0 ? void 0 : numberContext.minNumber) && parseInt(value) < (numberContext === null || numberContext === void 0 ? void 0 : numberContext.minNumber) || (numberContext === null || numberContext === void 0 ? void 0 : numberContext.maxNumber) && parseInt(value) > (numberContext === null || numberContext === void 0 ? void 0 : numberContext.maxNumber);
341
- };
342
-
343
- var isTextInputType = function isTextInputType() {
344
- var _inputRef$current, _inputRef$current2;
345
-
346
- return !(inputRef !== null && inputRef !== void 0 && (_inputRef$current = inputRef.current) !== null && _inputRef$current !== void 0 && _inputRef$current.getAttribute("type")) || (inputRef === null || inputRef === void 0 ? void 0 : (_inputRef$current2 = inputRef.current) === null || _inputRef$current2 === void 0 ? void 0 : _inputRef$current2.getAttribute("type")) === "text";
347
- };
348
-
349
- var getNumberErrorMessage = function getNumberErrorMessage(value) {
350
- if (numberContext !== null && numberContext !== void 0 && numberContext.minNumber && parseInt(value) < (numberContext === null || numberContext === void 0 ? void 0 : numberContext.minNumber)) return "Value must be greater than or equal to ".concat(numberContext === null || numberContext === void 0 ? void 0 : numberContext.minNumber, ".");else if (numberContext !== null && numberContext !== void 0 && numberContext.maxNumber && parseInt(value) > (numberContext === null || numberContext === void 0 ? void 0 : numberContext.maxNumber)) return "Value must be less than or equal to ".concat(numberContext === null || numberContext === void 0 ? void 0 : numberContext.maxNumber, ".");
351
- };
352
-
353
- var hasInputSuggestions = function hasInputSuggestions() {
354
- return typeof suggestions === "function" || suggestions && suggestions.length > 0;
355
- };
356
-
357
- var openSuggestions = function openSuggestions() {
358
- hasInputSuggestions() && changeIsOpen(true);
359
- };
360
-
361
- var closeSuggestions = function closeSuggestions() {
362
- changeIsOpen(false);
363
- changeVisualFocusedSuggIndex(-1);
364
- };
365
-
366
- var changeValue = function changeValue(newValue) {
367
- value !== null && value !== void 0 ? value : setInnerValue(newValue);
368
- var changedValue = typeof newValue === "number" ? newValue.toString() : newValue;
369
- if (isNotOptional(newValue)) onChange === null || onChange === void 0 ? void 0 : onChange({
370
- value: changedValue,
371
- error: getNotOptionalErrorMessage()
372
- });else if (isLengthIncorrect(newValue)) onChange === null || onChange === void 0 ? void 0 : onChange({
373
- value: changedValue,
374
- error: getLengthErrorMessage(length)
375
- });else if (newValue && pattern && !patternMatch(pattern, newValue)) onChange === null || onChange === void 0 ? void 0 : onChange({
376
- value: changedValue,
377
- error: getPatternErrorMessage()
378
- });else if (newValue && isNumberIncorrect(newValue)) onChange === null || onChange === void 0 ? void 0 : onChange({
379
- value: changedValue,
380
- error: getNumberErrorMessage(newValue)
381
- });else onChange === null || onChange === void 0 ? void 0 : onChange({
382
- value: changedValue,
383
- error: null
384
- });
385
- };
386
-
387
- var handleInputContainerOnClick = function handleInputContainerOnClick() {
388
- document.activeElement !== actionRef.current && inputRef.current.focus();
389
- };
390
-
391
- var handleIOnChange = function handleIOnChange(event) {
392
- openSuggestions();
393
- changeValue(event.target.value);
394
- };
395
-
396
- var handleIOnClick = function handleIOnClick() {
397
- openSuggestions();
398
- };
399
-
400
- var handleIOnBlur = function handleIOnBlur(event) {
401
- suggestions && closeSuggestions();
402
- if (isNotOptional(event.target.value)) onBlur === null || onBlur === void 0 ? void 0 : onBlur({
403
- value: event.target.value,
404
- error: getNotOptionalErrorMessage()
405
- });else if (isLengthIncorrect(event.target.value)) onBlur === null || onBlur === void 0 ? void 0 : onBlur({
406
- value: event.target.value,
407
- error: getLengthErrorMessage(length)
408
- });else if (event.target.value && pattern && !patternMatch(pattern, event.target.value)) onBlur === null || onBlur === void 0 ? void 0 : onBlur({
409
- value: event.target.value,
410
- error: getPatternErrorMessage()
411
- });else if (event.target.value && isNumberIncorrect(event.target.value)) onBlur === null || onBlur === void 0 ? void 0 : onBlur({
412
- value: event.target.value,
413
- error: getNumberErrorMessage(event.target.value)
414
- });else onBlur === null || onBlur === void 0 ? void 0 : onBlur({
415
- value: event.target.value,
416
- error: null
417
- });
418
- };
419
-
420
- var handleIOnFocus = function handleIOnFocus() {
421
- openSuggestions();
422
- };
423
-
424
- var handleIOnKeyDown = function handleIOnKeyDown(event) {
425
- switch (event.keyCode) {
426
- case 40:
427
- // Arrow Down
428
- if (numberContext) {
429
- decrementNumber();
430
- event.preventDefault();
431
- } else {
432
- event.preventDefault();
433
- openSuggestions();
434
-
435
- if (!isAutosuggestError && !isSearching && filteredSuggestions.length > 0) {
436
- changeVisualFocusedSuggIndex(function (visualFocusedSuggIndex) {
437
- if (visualFocusedSuggIndex < filteredSuggestions.length - 1) return visualFocusedSuggIndex + 1;else if (visualFocusedSuggIndex === filteredSuggestions.length - 1) return 0;
438
- });
439
- changeIsScrollable(true);
440
- changeIsActiveSuggestion(false);
441
- }
442
- }
443
-
444
- break;
445
-
446
- case 38:
447
- // Arrow Up
448
- if (numberContext) {
449
- incrementNumber();
450
- event.preventDefault();
451
- } else {
452
- event.preventDefault();
453
- openSuggestions();
454
-
455
- if (!isAutosuggestError && !isSearching && filteredSuggestions.length > 0) {
456
- changeVisualFocusedSuggIndex(function (visualFocusedSuggIndex) {
457
- if (visualFocusedSuggIndex === 0 || visualFocusedSuggIndex === -1) return filteredSuggestions.length > 0 ? filteredSuggestions.length - 1 : suggestions.length - 1;else return visualFocusedSuggIndex - 1;
458
- });
459
- changeIsScrollable(true);
460
- changeIsActiveSuggestion(false);
461
- }
462
- }
463
-
464
- break;
465
-
466
- case 27:
467
- // Esc
468
- event.preventDefault();
469
-
470
- if (hasInputSuggestions()) {
471
- changeValue("");
472
- isOpen && closeSuggestions();
473
- }
474
-
475
- break;
476
-
477
- case 13:
478
- // Enter
479
- if (hasInputSuggestions() && !isSearching) {
480
- var validFocusedSuggestion = filteredSuggestions.length > 0 && visualFocusedSuggIndex >= 0 && visualFocusedSuggIndex < filteredSuggestions.length;
481
- validFocusedSuggestion && changeValue(filteredSuggestions[visualFocusedSuggIndex]);
482
- isOpen && closeSuggestions();
483
- }
484
-
485
- break;
486
- }
487
- };
488
-
489
- var setNumberProps = function setNumberProps(type, min, max, step) {
490
- var _inputRef$current3, _inputRef$current4, _inputRef$current5, _inputRef$current6;
491
-
492
- type && (inputRef === null || inputRef === void 0 ? void 0 : (_inputRef$current3 = inputRef.current) === null || _inputRef$current3 === void 0 ? void 0 : _inputRef$current3.setAttribute("type", type));
493
- min && (inputRef === null || inputRef === void 0 ? void 0 : (_inputRef$current4 = inputRef.current) === null || _inputRef$current4 === void 0 ? void 0 : _inputRef$current4.setAttribute("min", min));
494
- max && (inputRef === null || inputRef === void 0 ? void 0 : (_inputRef$current5 = inputRef.current) === null || _inputRef$current5 === void 0 ? void 0 : _inputRef$current5.setAttribute("max", max));
495
- step && (inputRef === null || inputRef === void 0 ? void 0 : (_inputRef$current6 = inputRef.current) === null || _inputRef$current6 === void 0 ? void 0 : _inputRef$current6.setAttribute("step", step));
496
- };
497
-
498
- (0, _react.useLayoutEffect)(function () {
499
- var _suggestionsRef$curre;
500
-
501
- isScrollable && (suggestionsRef === null || suggestionsRef === void 0 ? void 0 : (_suggestionsRef$curre = suggestionsRef.current) === null || _suggestionsRef$curre === void 0 ? void 0 : _suggestionsRef$curre.scrollTo({
502
- top: visualFocusedSuggIndex * 39
503
- }));
504
- return changeIsScrollable(false);
505
- }, [isScrollable, visualFocusedSuggIndex]);
506
- (0, _react.useEffect)(function () {
507
- if (typeof suggestions === "function") {
508
- changeIsSearching(true);
509
- changeIsAutosuggestError(false);
510
- changeFilteredSuggestions([]);
511
- var cancelablePromise = makeCancelable(suggestions(value !== null && value !== void 0 ? value : innerValue));
512
- cancelablePromise.promise.then(function (promiseResponse) {
513
- changeIsSearching(false);
514
- changeIsAutosuggestError(false);
515
- changeFilteredSuggestions(promiseResponse);
516
- })["catch"](function (err) {
517
- if (!err.isCanceled) {
518
- changeIsSearching(false);
519
- changeIsAutosuggestError(true);
520
- }
521
- });
522
- return function () {
523
- cancelablePromise.cancel();
524
- };
525
- } else if (suggestions && suggestions.length) {
526
- changeFilteredSuggestions(suggestions.filter(function (suggestion) {
527
- return suggestion.toUpperCase().startsWith((value !== null && value !== void 0 ? value : innerValue).toUpperCase());
528
- }));
529
- changeVisualFocusedSuggIndex(-1);
530
- }
531
-
532
- numberContext && setNumberProps(numberContext.typeNumber, numberContext.minNumber, numberContext.maxNumber, numberContext.stepNumber);
533
- }, [value, innerValue, suggestions]);
534
- var defaultClearAction = {
535
- onClick: function onClick() {
536
- changeValue("");
537
- inputRef.current.focus();
538
- suggestions && closeSuggestions();
539
- },
540
- icon: _react["default"].createElement("svg", {
541
- xmlns: "http://www.w3.org/2000/svg",
542
- width: "24",
543
- height: "24",
544
- viewBox: "0 0 24 24",
545
- fill: "currentColor"
546
- }, _react["default"].createElement("path", {
547
- d: "M0 0h24v24H0V0z",
548
- fill: "none"
549
- }), _react["default"].createElement("path", {
550
- d: "M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12 19 6.41z"
551
- }))
552
- };
553
-
554
- var errorIcon = _react["default"].createElement("svg", {
555
- xmlns: "http://www.w3.org/2000/svg",
556
- height: "24px",
557
- viewBox: "0 0 24 24",
558
- width: "24px",
559
- fill: "currentColor"
560
- }, _react["default"].createElement("path", {
561
- d: "M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-2h2v2zm0-4h-2V7h2v6z"
562
- }));
563
-
564
- var decrementNumber = function decrementNumber() {
565
- var numberValue = value !== null && value !== void 0 ? value : innerValue;
566
-
567
- if (numberContext !== null && numberContext !== void 0 && numberContext.minNumber && parseInt(numberValue) < (numberContext === null || numberContext === void 0 ? void 0 : numberContext.minNumber)) {
568
- changeValue(parseInt(numberValue));
569
- } else if (numberContext !== null && numberContext !== void 0 && numberContext.maxNumber && parseInt(numberValue) > (numberContext === null || numberContext === void 0 ? void 0 : numberContext.maxNumber)) {
570
- changeValue(numberContext === null || numberContext === void 0 ? void 0 : numberContext.maxNumber);
571
- } else if (numberContext !== null && numberContext !== void 0 && numberContext.minNumber && (parseInt(numberValue) === (numberContext === null || numberContext === void 0 ? void 0 : numberContext.minNumber) || numberValue === "" || numberContext !== null && numberContext !== void 0 && numberContext.stepNumber && parseInt(numberValue) - (numberContext === null || numberContext === void 0 ? void 0 : numberContext.stepNumber) < (numberContext === null || numberContext === void 0 ? void 0 : numberContext.minNumber))) {
572
- changeValue(numberContext === null || numberContext === void 0 ? void 0 : numberContext.minNumber);
573
- } else if (numberContext !== null && numberContext !== void 0 && numberContext.stepNumber && numberContext !== null && numberContext !== void 0 && numberContext.minNumber && parseInt(numberValue) - (numberContext === null || numberContext === void 0 ? void 0 : numberContext.stepNumber) >= (numberContext === null || numberContext === void 0 ? void 0 : numberContext.minNumber) || numberContext !== null && numberContext !== void 0 && numberContext.stepNumber && numberValue !== "") {
574
- changeValue(parseInt(numberValue) - (numberContext === null || numberContext === void 0 ? void 0 : numberContext.stepNumber));
575
- } else if (numberContext !== null && numberContext !== void 0 && numberContext.stepNumber && numberValue == "") {
576
- changeValue(-(numberContext === null || numberContext === void 0 ? void 0 : numberContext.stepNumber));
577
- } else if (numberValue === "") {
578
- changeValue(-1);
579
- } else {
580
- changeValue(parseInt(numberValue) - 1);
581
- }
582
- };
583
-
584
- var incrementNumber = function incrementNumber() {
585
- var numberValue = value !== null && value !== void 0 ? value : innerValue;
586
-
587
- if (numberContext !== null && numberContext !== void 0 && numberContext.maxNumber && parseInt(numberValue) > (numberContext === null || numberContext === void 0 ? void 0 : numberContext.maxNumber)) {
588
- changeValue(parseInt(numberValue));
589
- } else if (numberContext !== null && numberContext !== void 0 && numberContext.minNumber && (parseInt(numberValue) < (numberContext === null || numberContext === void 0 ? void 0 : numberContext.minNumber) || numberValue === "")) {
590
- changeValue(numberContext === null || numberContext === void 0 ? void 0 : numberContext.minNumber);
591
- } else if (numberContext !== null && numberContext !== void 0 && numberContext.maxNumber && (parseInt(numberValue) === (numberContext === null || numberContext === void 0 ? void 0 : numberContext.maxNumber) || numberContext !== null && numberContext !== void 0 && numberContext.stepNumber && parseInt(numberValue) + (numberContext === null || numberContext === void 0 ? void 0 : numberContext.stepNumber) > (numberContext === null || numberContext === void 0 ? void 0 : numberContext.maxNumber))) {
592
- changeValue(numberContext === null || numberContext === void 0 ? void 0 : numberContext.maxNumber);
593
- } else if (numberContext !== null && numberContext !== void 0 && numberContext.stepNumber && numberContext !== null && numberContext !== void 0 && numberContext.maxNumber && parseInt(numberValue) + (numberContext === null || numberContext === void 0 ? void 0 : numberContext.stepNumber) <= (numberContext === null || numberContext === void 0 ? void 0 : numberContext.maxNumber) || numberContext !== null && numberContext !== void 0 && numberContext.stepNumber && numberValue !== "") {
594
- changeValue(parseInt(numberValue) + (numberContext === null || numberContext === void 0 ? void 0 : numberContext.stepNumber));
595
- } else if (numberContext !== null && numberContext !== void 0 && numberContext.stepNumber && numberValue == "") {
596
- changeValue(numberContext === null || numberContext === void 0 ? void 0 : numberContext.stepNumber);
597
- } else if (numberValue === "") {
598
- changeValue(1);
599
- } else {
600
- changeValue(parseInt(numberValue) + 1);
601
- }
602
- };
603
-
604
- var decrementAction = {
605
- onClick: function onClick() {
606
- decrementNumber();
607
- inputRef.current.focus();
608
- },
609
- icon: _react["default"].createElement("svg", {
610
- xmlns: "http://www.w3.org/2000/svg",
611
- height: "24px",
612
- viewBox: "0 0 24 24",
613
- width: "24px",
614
- fill: "currentColor"
615
- }, _react["default"].createElement("path", {
616
- d: "M0 0h24v24H0z",
617
- fill: "none"
618
- }), _react["default"].createElement("path", {
619
- d: "M19 13H5v-2h14v2z"
620
- }))
621
- };
622
- var incrementAction = {
623
- onClick: function onClick() {
624
- incrementNumber();
625
- inputRef.current.focus();
626
- },
627
- icon: _react["default"].createElement("svg", {
628
- xmlns: "http://www.w3.org/2000/svg",
629
- height: "24px",
630
- viewBox: "0 0 24 24",
631
- width: "24px",
632
- fill: "currentColor"
633
- }, _react["default"].createElement("path", {
634
- d: "M0 0h24v24H0z",
635
- fill: "none"
636
- }), _react["default"].createElement("path", {
637
- d: "M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z"
638
- }))
639
- };
640
-
641
- var HighlightedSuggestion = function HighlightedSuggestion(_ref2) {
642
- var suggestion = _ref2.suggestion,
643
- index = _ref2.index;
644
- var regEx = new RegExp(value !== null && value !== void 0 ? value : innerValue, "i");
645
- var matchedWords = suggestion.match(regEx);
646
- var noMatchedWords = suggestion.replace(regEx, "");
647
- return _react["default"].createElement(Suggestion, {
648
- id: "suggestion-".concat(index),
649
- onMouseDown: function onMouseDown() {
650
- changeIsActiveSuggestion(true);
651
- },
652
- onMouseUp: function onMouseUp() {
653
- if (isActiveSuggestion) {
654
- changeValue(suggestion);
655
- changeIsActiveSuggestion(false);
656
- closeSuggestions();
657
- }
658
- },
659
- onMouseEnter: function onMouseEnter() {
660
- changeVisualFocusedSuggIndex(index);
661
- },
662
- onMouseLeave: function onMouseLeave() {
663
- changeIsActiveSuggestion(false);
664
- },
665
- visualFocused: visualFocusedSuggIndex === index,
666
- active: visualFocusedSuggIndex === index && isActiveSuggestion,
667
- role: "option",
668
- "aria-selected": visualFocusedSuggIndex === index && "true"
669
- }, typeof suggestions === "function" ? suggestion : _react["default"].createElement(_react["default"].Fragment, null, _react["default"].createElement("strong", null, matchedWords), noMatchedWords));
670
- };
671
-
672
- return _react["default"].createElement(_styledComponents.ThemeProvider, {
673
- theme: colorsTheme.newInputText
674
- }, _react["default"].createElement(DxcInput, {
675
- margin: margin,
676
- ref: ref,
677
- size: size
678
- }, _react["default"].createElement(Label, {
679
- htmlFor: inputId,
680
- disabled: disabled,
681
- backgroundType: backgroundType
682
- }, label, " ", optional && _react["default"].createElement(OptionalLabel, null, "(Optional)")), _react["default"].createElement(HelperText, {
683
- disabled: disabled,
684
- backgroundType: backgroundType
685
- }, helperText), _react["default"].createElement(InputContainer, {
686
- error: error,
687
- disabled: disabled,
688
- backgroundType: backgroundType,
689
- onClick: handleInputContainerOnClick
690
- }, prefix && _react["default"].createElement(Prefix, {
691
- disabled: disabled,
692
- backgroundType: backgroundType
693
- }, prefix), _react["default"].createElement(Input, {
694
- id: inputId,
695
- name: name,
696
- value: value !== null && value !== void 0 ? value : innerValue,
697
- placeholder: placeholder,
698
- onChange: handleIOnChange,
699
- onClick: handleIOnClick,
700
- onBlur: handleIOnBlur,
701
- onFocus: handleIOnFocus,
702
- onKeyDown: handleIOnKeyDown,
703
- disabled: disabled,
704
- ref: inputRef,
705
- backgroundType: backgroundType,
706
- pattern: pattern,
707
- minLength: length === null || length === void 0 ? void 0 : length.min,
708
- maxLength: length === null || length === void 0 ? void 0 : length.max,
709
- autoComplete: autocomplete,
710
- tabIndex: tabIndex,
711
- role: isTextInputType() && hasInputSuggestions() ? "combobox" : "textbox",
712
- "aria-autocomplete": isTextInputType() && hasInputSuggestions() ? "list" : undefined,
713
- "aria-controls": isTextInputType() && hasInputSuggestions() ? inputId : undefined,
714
- "aria-expanded": isTextInputType() && hasInputSuggestions() ? isOpen ? "true" : "false" : undefined,
715
- "aria-activedescendant": isTextInputType() && hasInputSuggestions() && isOpen && visualFocusedSuggIndex !== -1 ? "suggestion-".concat(visualFocusedSuggIndex) : undefined,
716
- "aria-invalid": error ? "true" : "false",
717
- "aria-describedby": error ? errorId : undefined,
718
- "aria-required": optional ? "false" : "true"
719
- }), !disabled && error && _react["default"].createElement(ErrorIcon, {
720
- backgroundType: backgroundType,
721
- "aria-label": "Error"
722
- }, errorIcon), !disabled && clearable && (value !== null && value !== void 0 ? value : innerValue).length > 0 && _react["default"].createElement(Action, {
723
- onClick: defaultClearAction.onClick,
724
- backgroundType: backgroundType,
725
- tabIndex: tabIndex,
726
- "aria-label": "Clear"
727
- }, defaultClearAction.icon), (numberContext === null || numberContext === void 0 ? void 0 : numberContext.typeNumber) === "number" ? _react["default"].createElement(_react["default"].Fragment, null, _react["default"].createElement(Action, {
728
- ref: actionRef,
729
- disabled: disabled,
730
- onClick: decrementAction.onClick,
731
- backgroundType: backgroundType,
732
- tabIndex: tabIndex,
733
- "aria-label": "Decrement"
734
- }, decrementAction.icon), _react["default"].createElement(Action, {
735
- ref: actionRef,
736
- disabled: disabled,
737
- onClick: incrementAction.onClick,
738
- backgroundType: backgroundType,
739
- tabIndex: tabIndex,
740
- "aria-label": "Increment"
741
- }, incrementAction.icon)) : action && _react["default"].createElement(Action, {
742
- ref: actionRef,
743
- disabled: disabled,
744
- onClick: action.onClick,
745
- backgroundType: backgroundType,
746
- tabIndex: tabIndex
747
- }, typeof action.icon === "string" ? _react["default"].createElement(ActionIcon, {
748
- src: action.icon
749
- }) : action.icon), suffix && _react["default"].createElement(Suffix, {
750
- disabled: disabled,
751
- backgroundType: backgroundType
752
- }, suffix), isOpen && _react["default"].createElement(Suggestions, {
753
- id: autosuggestId,
754
- isError: isAutosuggestError,
755
- onMouseDown: function onMouseDown(event) {
756
- event.preventDefault();
757
- },
758
- onMouseLeave: function onMouseLeave() {
759
- changeVisualFocusedSuggIndex(-1);
760
- },
761
- ref: suggestionsRef,
762
- role: "listbox",
763
- "aria-label": label
764
- }, !isSearching && !isAutosuggestError && filteredSuggestions.length === 0 && _react["default"].createElement(SuggestionsSystemMessage, null, "No results found"), !isSearching && !isAutosuggestError && filteredSuggestions.length > 0 && filteredSuggestions.map(function (suggestion, index) {
765
- return _react["default"].createElement(HighlightedSuggestion, {
766
- key: "suggestion-".concat((0, _uuid.v4)()),
767
- suggestion: suggestion,
768
- index: index
769
- });
770
- }), isSearching && _react["default"].createElement(SuggestionsSystemMessage, null, "Searching..."), isAutosuggestError && _react["default"].createElement(SuggestionsError, null, _react["default"].createElement(SuggestionsErrorIcon, {
771
- backgroundType: backgroundType
772
- }, errorIcon), "Error fetching data"))), !disabled && _react["default"].createElement(Error, {
773
- id: errorId,
774
- backgroundType: backgroundType
775
- }, error)));
776
- });
777
-
778
- var sizes = {
779
- small: "240px",
780
- medium: "360px",
781
- large: "480px",
782
- fillParent: "100%"
783
- };
784
-
785
- var calculateWidth = function calculateWidth(margin, size) {
786
- return size === "fillParent" ? "calc(".concat(sizes[size], " - ").concat((0, _utils.getMargin)(margin, "left"), " - ").concat((0, _utils.getMargin)(margin, "right"), ")") : sizes[size];
787
- };
788
-
789
- var DxcInput = _styledComponents["default"].div(_templateObject(), function (props) {
790
- return calculateWidth(props.margin, props.size);
791
- }, function (props) {
792
- return props.margin && (0, _typeof2["default"])(props.margin) !== "object" ? _variables.spaces[props.margin] : "0px";
793
- }, function (props) {
794
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.top ? _variables.spaces[props.margin.top] : "";
795
- }, function (props) {
796
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.right ? _variables.spaces[props.margin.right] : "";
797
- }, function (props) {
798
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.bottom ? _variables.spaces[props.margin.bottom] : "";
799
- }, function (props) {
800
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.left ? _variables.spaces[props.margin.left] : "";
801
- });
802
-
803
- var Label = _styledComponents["default"].label(_templateObject2(), function (props) {
804
- return props.disabled ? props.backgroundType === "dark" ? props.theme.disabledLabelFontColorOnDark : props.theme.disabledLabelFontColor : props.backgroundType === "dark" ? props.theme.labelFontColorOnDark : props.theme.labelFontColor;
805
- }, function (props) {
806
- return props.theme.fontFamily;
807
- }, function (props) {
808
- return props.theme.labelFontSize;
809
- }, function (props) {
810
- return props.theme.labelFontStyle;
811
- }, function (props) {
812
- return props.theme.labelFontWeight;
813
- });
814
-
815
- var OptionalLabel = _styledComponents["default"].span(_templateObject3(), function (props) {
816
- return props.theme.optionalLabelFontWeight;
817
- });
818
-
819
- var HelperText = _styledComponents["default"].span(_templateObject4(), function (props) {
820
- return props.disabled ? props.backgroundType === "dark" ? props.theme.disabledHelperTextFontColorOnDark : props.theme.disabledHelperTextFontColor : props.backgroundType === "dark" ? props.theme.helperTextFontColorOnDark : props.theme.helperTextFontColor;
821
- }, function (props) {
822
- return props.theme.fontFamily;
823
- }, function (props) {
824
- return props.theme.helperTextFontSize;
825
- }, function (props) {
826
- return props.theme.helperTextFontStyle;
827
- }, function (props) {
828
- return props.theme.helperTextFontWeight;
829
- });
830
-
831
- var InputContainer = _styledComponents["default"].div(_templateObject5(), function (props) {
832
- if (props.disabled) return props.backgroundType === "dark" ? "background-color: ".concat(props.theme.disabledContainerFillColorOnDark, ";") : "background-color: ".concat(props.theme.disabledContainerFillColor, ";");
833
- }, function (props) {
834
- if (props.disabled) return props.backgroundType === "dark" ? props.theme.disabledBorderColorOnDark : props.theme.disabledBorderColor;else return props.backgroundType === "dark" ? props.theme.enabledBorderColorOnDark : props.theme.enabledBorderColor;
835
- }, function (props) {
836
- 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 ");
837
- }, function (props) {
838
- return props.disabled && "cursor: not-allowed;";
839
- }, function (props) {
840
- 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-within {\n border-color: transparent;\n box-shadow: 0 0 0 2px ").concat(props.backgroundType === "dark" ? props.theme.focusBorderColorOnDark : props.theme.focusBorderColor, ";\n }\n ");
841
- });
842
-
843
- var Input = _styledComponents["default"].input(_templateObject6(), function (props) {
844
- return props.disabled ? props.backgroundType === "dark" ? props.theme.disabledValueFontColorOnDark : props.theme.disabledValueFontColor : props.backgroundType === "dark" ? props.theme.valueFontColorOnDark : props.theme.valueFontColor;
845
- }, function (props) {
846
- return props.theme.fontFamily;
847
- }, function (props) {
848
- return props.theme.valueFontSize;
849
- }, function (props) {
850
- return props.theme.valueFontStyle;
851
- }, function (props) {
852
- return props.theme.valueFontWeight;
853
- }, function (props) {
854
- return props.disabled && "cursor: not-allowed;";
855
- }, function (props) {
856
- return props.disabled ? props.backgroundType === "dark" ? props.theme.disabledPlaceholderFontColorOnDark : props.theme.disabledPlaceholderFontColor : props.backgroundType === "dark" ? props.theme.placeholderFontColorOnDark : props.theme.placeholderFontColor;
857
- });
858
-
859
- var ActionIcon = _styledComponents["default"].img(_templateObject7());
860
-
861
- var Action = _styledComponents["default"].button(_templateObject8(), function (props) {
862
- return props.theme.fontFamily;
863
- }, function (props) {
864
- return props.disabled ? "cursor: not-allowed;" : "cursor: pointer;";
865
- }, function (props) {
866
- return props.disabled ? props.backgroundType === "dark" ? props.theme.disabledActionBackgroundColorOnDark : props.theme.disabledActionBackgroundColor : props.backgroundType === "dark" ? props.theme.actionBackgroundColorOnDark : props.theme.actionBackgroundColor;
867
- }, function (props) {
868
- return props.disabled ? props.backgroundType === "dark" ? props.theme.disabledActionIconColorOnDark : props.theme.disabledActionIconColor : props.backgroundType === "dark" ? props.theme.actionIconColorOnDark : props.theme.actionIconColor;
869
- }, function (props) {
870
- return !props.disabled && "\n &:hover {\n background-color: ".concat(props.backgroundType === "dark" ? props.theme.hoverActionBackgroundColorOnDark : props.theme.hoverActionBackgroundColor, ";\n color: ").concat(props.backgroundType === "dark" ? props.theme.hoverActionIconColorOnDark : props.theme.hoverActionIconColor, ";\n }\n &:focus {\n outline: none;\n box-shadow: 0 0 0 2px ").concat(props.backgroundType === "dark" ? props.theme.focusActionBorderColorOnDark : props.theme.focusActionBorderColor, ";\n color: ").concat(props.backgroundType === "dark" ? props.theme.focusActionIconColorOnDark : props.theme.focusActionIconColor, ";\n }\n &:focus-visible {\n outline: none;\n box-shadow: 0 0 0 2px ").concat(props.backgroundType === "dark" ? props.theme.focusActionBorderColorOnDark : props.theme.focusActionBorderColor, ";\n color: ").concat(props.backgroundType === "dark" ? props.theme.focusActionIconColorOnDark : props.theme.focusActionIconColor, ";\n }\n &:active {\n background-color: ").concat(props.backgroundType === "dark" ? props.theme.activeActionBackgroundColorOnDark : props.theme.activeActionBackgroundColor, ";\n color: ").concat(props.backgroundType === "dark" ? props.theme.activeActionIconColorOnDark : props.theme.activeActionIconColor, ";\n }\n ");
871
- });
872
-
873
- var Prefix = _styledComponents["default"].span(_templateObject9(), function (props) {
874
- var color = props.disabled ? props.backgroundType === "dark" ? props.theme.disabledPrefixColorOnDark : props.theme.disabledPrefixColor : props.backgroundType === "dark" ? props.theme.prefixColorOnDark : props.theme.prefixColor;
875
- return "color: ".concat(color, "; border-right: 1px solid ").concat(color, ";");
876
- }, function (props) {
877
- return props.theme.fontFamily;
878
- });
879
-
880
- var Suffix = _styledComponents["default"].span(_templateObject10(), function (props) {
881
- var color = props.disabled ? props.backgroundType === "dark" ? props.theme.disabledSuffixColorOnDark : props.theme.disabledSuffixColor : props.backgroundType === "dark" ? props.theme.suffixColorOnDark : props.theme.suffixColor;
882
- return "color: ".concat(color, "; border-left: 1px solid ").concat(color, ";");
883
- }, function (props) {
884
- return props.theme.fontFamily;
885
- });
886
-
887
- var ErrorIcon = _styledComponents["default"].span(_templateObject11(), function (props) {
888
- return props.backgroundType === "dark" ? props.theme.errorIconColorOnDark : props.theme.errorIconColor;
889
- });
890
-
891
- var Error = _styledComponents["default"].span(_templateObject12(), function (props) {
892
- return props.backgroundType === "dark" ? props.theme.errorMessageColorOnDark : props.theme.errorMessageColor;
893
- }, function (props) {
894
- return props.theme.fontFamily;
895
- });
896
-
897
- var Suggestions = _styledComponents["default"].ul(_templateObject13(), function (props) {
898
- return props.isError ? props.theme.errorMessageBackgroundColor : "#ffffff";
899
- }, function (props) {
900
- return props.isError ? props.theme.errorMessageBorderColor : props.theme.enabledBorderColor;
901
- }, function (props) {
902
- return props.theme.listOptionFontColor;
903
- }, function (props) {
904
- return props.theme.fontFamily;
905
- }, function (props) {
906
- return props.theme.listOptionFontSize;
907
- }, function (props) {
908
- return props.theme.listOptionFontStyle;
909
- }, function (props) {
910
- return props.theme.listOptionFontWeight;
911
- });
912
-
913
- var Suggestion = _styledComponents["default"].li(_templateObject14(), function (props) {
914
- return props.active ? "background-color: ".concat(props.theme.activeListOptionBackgroundColor, ";") : props.visualFocused && "background-color: ".concat(props.theme.hoverListOptionBackgroundColor, ";");
915
- });
916
-
917
- var SuggestionsSystemMessage = _styledComponents["default"].span(_templateObject15(), function (props) {
918
- return props.theme.systemMessageFontColor;
919
- });
920
-
921
- var SuggestionsErrorIcon = _styledComponents["default"].span(_templateObject16(), function (props) {
922
- return props.backgroundType === "dark" ? props.theme.errorIconColorOnDark : props.theme.errorIconColor;
923
- });
924
-
925
- var SuggestionsError = _styledComponents["default"].span(_templateObject17());
926
-
927
- DxcNewInputText.propTypes = {
928
- label: _propTypes["default"].string,
929
- name: _propTypes["default"].string,
930
- value: _propTypes["default"].string,
931
- helperText: _propTypes["default"].string,
932
- placeholder: _propTypes["default"].string,
933
- action: _propTypes["default"].shape({
934
- onClick: _propTypes["default"].func.isRequired,
935
- icon: _propTypes["default"].oneOfType([_propTypes["default"].shape({
936
- type: _propTypes["default"].oneOf(["svg"])
937
- }), _propTypes["default"].string]).isRequired
938
- }),
939
- clearable: _propTypes["default"].bool,
940
- disabled: _propTypes["default"].bool,
941
- optional: _propTypes["default"].bool,
942
- prefix: _propTypes["default"].string,
943
- suffix: _propTypes["default"].string,
944
- onChange: _propTypes["default"].func,
945
- onBlur: _propTypes["default"].func,
946
- error: _propTypes["default"].string,
947
- autocomplete: _propTypes["default"].string,
948
- margin: _propTypes["default"].oneOfType([_propTypes["default"].shape({
949
- top: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
950
- bottom: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
951
- left: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
952
- right: _propTypes["default"].oneOf(Object.keys(_variables.spaces))
953
- }), _propTypes["default"].oneOf((0, _toConsumableArray2["default"])(Object.keys(_variables.spaces)))]),
954
- size: _propTypes["default"].oneOf((0, _toConsumableArray2["default"])(Object.keys(sizes))),
955
- suggestions: _propTypes["default"].oneOfType([_propTypes["default"].func, _propTypes["default"].array]),
956
- pattern: _propTypes["default"].string,
957
- length: _propTypes["default"].shape({
958
- min: _propTypes["default"].number,
959
- max: _propTypes["default"].number
960
- }),
961
- tabIndex: _propTypes["default"].number
962
- };
963
- var _default = DxcNewInputText;
964
- exports["default"] = _default;