@dxc-technology/halstack-react 0.0.0-a0543ea → 0.0.0-a0a27b4

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