@dxc-technology/halstack-react 0.0.0-182d20b → 0.0.0-198050a

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 (414) hide show
  1. package/BackgroundColorContext.d.ts +10 -0
  2. package/BackgroundColorContext.js +48 -0
  3. package/ThemeContext.d.ts +15 -0
  4. package/ThemeContext.js +243 -0
  5. package/V3Select/V3Select.js +455 -0
  6. package/V3Select/index.d.ts +27 -0
  7. package/V3Textarea/V3Textarea.js +260 -0
  8. package/V3Textarea/index.d.ts +27 -0
  9. package/accordion/Accordion.d.ts +4 -0
  10. package/accordion/Accordion.js +258 -0
  11. package/accordion/Accordion.stories.tsx +300 -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/alert/Alert.js +290 -0
  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/box/Box.js +126 -0
  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/button/Button.js +179 -0
  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/card/Card.js +164 -0
  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/checkbox/Checkbox.js +253 -0
  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/chip/Chip.js +199 -0
  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 +5 -19
  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/common/utils.js +22 -0
  64. package/common/variables.js +1574 -0
  65. package/{dist/date → date}/Date.js +87 -70
  66. package/date/index.d.ts +27 -0
  67. package/date-input/DateInput.d.ts +4 -0
  68. package/date-input/DateInput.js +358 -0
  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/dialog/Dialog.js +165 -0
  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/dropdown/Dropdown.js +417 -0
  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 +521 -0
  84. package/file-input/FileItem.d.ts +14 -0
  85. package/file-input/FileItem.js +184 -0
  86. package/file-input/types.d.ts +112 -0
  87. package/file-input/types.js +5 -0
  88. package/footer/Footer.d.ts +4 -0
  89. package/footer/Footer.js +260 -0
  90. package/footer/Footer.stories.tsx +130 -0
  91. package/footer/Icons.d.ts +2 -0
  92. package/footer/Icons.js +77 -0
  93. package/footer/types.d.ts +65 -0
  94. package/footer/types.js +5 -0
  95. package/header/Header.d.ts +7 -0
  96. package/header/Header.js +324 -0
  97. package/header/Header.stories.tsx +162 -0
  98. package/header/Icons.d.ts +2 -0
  99. package/header/Icons.js +34 -0
  100. package/header/types.d.ts +47 -0
  101. package/header/types.js +5 -0
  102. package/heading/Heading.d.ts +4 -0
  103. package/heading/Heading.js +159 -0
  104. package/heading/Heading.stories.tsx +53 -0
  105. package/heading/types.d.ts +33 -0
  106. package/heading/types.js +5 -0
  107. package/input-text/Icons.js +22 -0
  108. package/input-text/InputText.js +611 -0
  109. package/input-text/index.d.ts +36 -0
  110. package/layout/ApplicationLayout.d.ts +10 -0
  111. package/layout/ApplicationLayout.js +225 -0
  112. package/layout/ApplicationLayout.stories.tsx +171 -0
  113. package/layout/Icons.js +55 -0
  114. package/layout/types.d.ts +57 -0
  115. package/layout/types.js +5 -0
  116. package/link/Link.d.ts +3 -0
  117. package/link/Link.js +161 -0
  118. package/link/Link.stories.tsx +146 -0
  119. package/link/types.d.ts +74 -0
  120. package/link/types.js +5 -0
  121. package/list/List.d.ts +8 -0
  122. package/list/List.js +47 -0
  123. package/list/List.stories.tsx +85 -0
  124. package/main.d.ts +48 -0
  125. package/{dist/main.js → main.js} +165 -49
  126. package/number-input/NumberInput.d.ts +4 -0
  127. package/number-input/NumberInput.js +83 -0
  128. package/number-input/NumberInput.stories.tsx +115 -0
  129. package/number-input/NumberInputContext.d.ts +4 -0
  130. package/{dist/ThemeContext.js → number-input/NumberInputContext.js} +6 -2
  131. package/number-input/numberInputContextTypes.d.ts +19 -0
  132. package/number-input/numberInputContextTypes.js +5 -0
  133. package/number-input/types.d.ts +117 -0
  134. package/number-input/types.js +5 -0
  135. package/package.json +38 -23
  136. package/paginator/Icons.js +66 -0
  137. package/paginator/Paginator.d.ts +4 -0
  138. package/paginator/Paginator.js +192 -0
  139. package/paginator/Paginator.stories.tsx +63 -0
  140. package/paginator/types.d.ts +38 -0
  141. package/paginator/types.js +5 -0
  142. package/password-input/PasswordInput.d.ts +4 -0
  143. package/password-input/PasswordInput.js +163 -0
  144. package/password-input/PasswordInput.stories.tsx +131 -0
  145. package/password-input/types.d.ts +107 -0
  146. package/password-input/types.js +5 -0
  147. package/progress-bar/ProgressBar.d.ts +4 -0
  148. package/progress-bar/ProgressBar.js +170 -0
  149. package/progress-bar/ProgressBar.stories.jsx +58 -0
  150. package/progress-bar/types.d.ts +37 -0
  151. package/progress-bar/types.js +5 -0
  152. package/radio/Radio.d.ts +4 -0
  153. package/radio/Radio.js +174 -0
  154. package/radio/Radio.stories.tsx +192 -0
  155. package/radio/types.d.ts +54 -0
  156. package/radio/types.js +5 -0
  157. package/resultsetTable/ResultsetTable.d.ts +4 -0
  158. package/resultsetTable/ResultsetTable.js +251 -0
  159. package/resultsetTable/ResultsetTable.stories.tsx +276 -0
  160. package/resultsetTable/types.d.ts +67 -0
  161. package/resultsetTable/types.js +5 -0
  162. package/row/Row.d.ts +11 -0
  163. package/row/Row.js +124 -0
  164. package/row/Row.stories.tsx +223 -0
  165. package/select/Select.js +863 -0
  166. package/select/Select.stories.tsx +572 -0
  167. package/select/index.d.ts +131 -0
  168. package/sidenav/Sidenav.d.ts +9 -0
  169. package/sidenav/Sidenav.js +136 -0
  170. package/sidenav/Sidenav.stories.tsx +165 -0
  171. package/sidenav/types.d.ts +50 -0
  172. package/sidenav/types.js +5 -0
  173. package/slider/Slider.d.ts +4 -0
  174. package/slider/Slider.js +317 -0
  175. package/slider/Slider.stories.tsx +177 -0
  176. package/slider/types.d.ts +78 -0
  177. package/slider/types.js +5 -0
  178. package/spinner/Spinner.d.ts +4 -0
  179. package/spinner/Spinner.js +250 -0
  180. package/spinner/Spinner.stories.jsx +102 -0
  181. package/spinner/types.d.ts +32 -0
  182. package/spinner/types.js +5 -0
  183. package/stack/Stack.d.ts +10 -0
  184. package/stack/Stack.js +94 -0
  185. package/stack/Stack.stories.tsx +150 -0
  186. package/switch/Switch.d.ts +4 -0
  187. package/switch/Switch.js +179 -0
  188. package/switch/Switch.stories.tsx +160 -0
  189. package/switch/types.d.ts +58 -0
  190. package/switch/types.js +5 -0
  191. package/table/Table.d.ts +4 -0
  192. package/table/Table.js +118 -0
  193. package/table/Table.stories.jsx +276 -0
  194. package/table/types.d.ts +21 -0
  195. package/table/types.js +5 -0
  196. package/tabs/Tabs.d.ts +4 -0
  197. package/tabs/Tabs.js +213 -0
  198. package/tabs/Tabs.stories.tsx +121 -0
  199. package/tabs/types.d.ts +70 -0
  200. package/tabs/types.js +5 -0
  201. package/tag/Tag.d.ts +4 -0
  202. package/tag/Tag.js +193 -0
  203. package/tag/Tag.stories.tsx +145 -0
  204. package/tag/types.d.ts +60 -0
  205. package/tag/types.js +5 -0
  206. package/text/Text.d.ts +7 -0
  207. package/text/Text.js +30 -0
  208. package/text/Text.stories.tsx +19 -0
  209. package/text-input/TextInput.d.ts +4 -0
  210. package/text-input/TextInput.js +786 -0
  211. package/text-input/TextInput.stories.tsx +456 -0
  212. package/text-input/types.d.ts +159 -0
  213. package/text-input/types.js +5 -0
  214. package/textarea/Textarea.d.ts +4 -0
  215. package/textarea/Textarea.js +284 -0
  216. package/textarea/Textarea.stories.jsx +135 -0
  217. package/textarea/types.d.ts +130 -0
  218. package/textarea/types.js +5 -0
  219. package/{dist/toggle → toggle}/Toggle.js +30 -67
  220. package/toggle/index.d.ts +21 -0
  221. package/toggle-group/ToggleGroup.d.ts +4 -0
  222. package/toggle-group/ToggleGroup.js +214 -0
  223. package/toggle-group/ToggleGroup.stories.tsx +173 -0
  224. package/toggle-group/types.d.ts +97 -0
  225. package/toggle-group/types.js +5 -0
  226. package/{dist/upload → upload}/Upload.js +23 -22
  227. package/upload/buttons-upload/ButtonsUpload.js +111 -0
  228. package/upload/buttons-upload/Icons.js +40 -0
  229. package/upload/dragAndDropArea/DragAndDropArea.js +225 -0
  230. package/upload/dragAndDropArea/Icons.js +39 -0
  231. package/upload/file-upload/FileToUpload.js +115 -0
  232. package/upload/file-upload/Icons.js +66 -0
  233. package/upload/files-upload/FilesToUpload.js +109 -0
  234. package/upload/index.d.ts +15 -0
  235. package/upload/transaction/Icons.js +160 -0
  236. package/upload/transaction/Transaction.js +104 -0
  237. package/upload/transactions/Transactions.js +94 -0
  238. package/useTheme.d.ts +2 -0
  239. package/useTheme.js +22 -0
  240. package/wizard/Wizard.d.ts +4 -0
  241. package/wizard/Wizard.js +281 -0
  242. package/wizard/Wizard.stories.tsx +224 -0
  243. package/wizard/types.d.ts +60 -0
  244. package/wizard/types.js +5 -0
  245. package/README.md +0 -66
  246. package/babel.config.js +0 -4
  247. package/dist/accordion/Accordion.js +0 -248
  248. package/dist/accordion/Accordion.stories.js +0 -207
  249. package/dist/accordion/readme.md +0 -96
  250. package/dist/alert/Alert.js +0 -304
  251. package/dist/alert/Alert.stories.js +0 -158
  252. package/dist/alert/close.svg +0 -4
  253. package/dist/alert/error.svg +0 -4
  254. package/dist/alert/info.svg +0 -4
  255. package/dist/alert/readme.md +0 -43
  256. package/dist/alert/success.svg +0 -4
  257. package/dist/alert/warning.svg +0 -4
  258. package/dist/box/Box.js +0 -148
  259. package/dist/button/Button.js +0 -181
  260. package/dist/button/Button.stories.js +0 -224
  261. package/dist/button/readme.md +0 -93
  262. package/dist/card/Card.js +0 -217
  263. package/dist/checkbox/Checkbox.js +0 -240
  264. package/dist/checkbox/Checkbox.stories.js +0 -144
  265. package/dist/checkbox/readme.md +0 -116
  266. package/dist/chip/Chip.js +0 -173
  267. package/dist/common/services/example-service.js +0 -10
  268. package/dist/common/services/example-service.test.js +0 -12
  269. package/dist/common/utils.js +0 -42
  270. package/dist/common/variables.js +0 -434
  271. package/dist/date/Date.stories.js +0 -205
  272. package/dist/date/calendar.svg +0 -1
  273. package/dist/date/calendar_dark.svg +0 -1
  274. package/dist/date/readme.md +0 -73
  275. package/dist/dialog/Dialog.js +0 -197
  276. package/dist/dialog/Dialog.stories.js +0 -217
  277. package/dist/dialog/readme.md +0 -32
  278. package/dist/dropdown/Dropdown.js +0 -416
  279. package/dist/dropdown/Dropdown.stories.js +0 -249
  280. package/dist/dropdown/baseline-arrow_drop_down.svg +0 -1
  281. package/dist/dropdown/baseline-arrow_drop_down_wh.svg +0 -4
  282. package/dist/dropdown/baseline-arrow_drop_up.svg +0 -1
  283. package/dist/dropdown/baseline-arrow_drop_up_wh.svg +0 -4
  284. package/dist/dropdown/readme.md +0 -69
  285. package/dist/footer/Footer.js +0 -346
  286. package/dist/footer/Footer.stories.js +0 -94
  287. package/dist/footer/dxc_logo_wht.png +0 -0
  288. package/dist/footer/readme.md +0 -41
  289. package/dist/header/Header.js +0 -360
  290. package/dist/header/Header.stories.js +0 -176
  291. package/dist/header/close_icon.svg +0 -1
  292. package/dist/header/dxc_logo_black.png +0 -0
  293. package/dist/header/dxc_logo_blk_rgb.svg +0 -6
  294. package/dist/header/dxc_logo_white.png +0 -0
  295. package/dist/header/hamb_menu_black.svg +0 -1
  296. package/dist/header/hamb_menu_white.svg +0 -1
  297. package/dist/header/readme.md +0 -33
  298. package/dist/heading/Heading.js +0 -153
  299. package/dist/input-text/InputText.js +0 -519
  300. package/dist/input-text/InputText.stories.js +0 -209
  301. package/dist/input-text/error.svg +0 -1
  302. package/dist/input-text/readme.md +0 -91
  303. package/dist/layout/ApplicationLayout.js +0 -333
  304. package/dist/layout/facebook.svg +0 -45
  305. package/dist/layout/linkedin.svg +0 -50
  306. package/dist/layout/twitter.svg +0 -53
  307. package/dist/link/Link.js +0 -168
  308. package/dist/link/readme.md +0 -51
  309. package/dist/paginator/Paginator.js +0 -196
  310. package/dist/paginator/images/next.svg +0 -3
  311. package/dist/paginator/images/nextPage.svg +0 -3
  312. package/dist/paginator/images/previous.svg +0 -3
  313. package/dist/paginator/images/previousPage.svg +0 -3
  314. package/dist/paginator/readme.md +0 -50
  315. package/dist/progress-bar/ProgressBar.js +0 -185
  316. package/dist/progress-bar/ProgressBar.stories.js +0 -280
  317. package/dist/progress-bar/readme.md +0 -63
  318. package/dist/radio/Radio.js +0 -195
  319. package/dist/radio/Radio.stories.js +0 -166
  320. package/dist/radio/readme.md +0 -70
  321. package/dist/resultsetTable/ResultsetTable.js +0 -333
  322. package/dist/resultsetTable/arrow_downward-24px_wht.svg +0 -1
  323. package/dist/resultsetTable/arrow_upward-24px_wht.svg +0 -1
  324. package/dist/resultsetTable/unfold_more-24px_wht.svg +0 -1
  325. package/dist/select/Select.js +0 -453
  326. package/dist/select/Select.stories.js +0 -235
  327. package/dist/select/readme.md +0 -72
  328. package/dist/sidenav/Sidenav.js +0 -69
  329. package/dist/slider/Slider.js +0 -258
  330. package/dist/slider/Slider.stories.js +0 -241
  331. package/dist/slider/readme.md +0 -64
  332. package/dist/spinner/Spinner.js +0 -193
  333. package/dist/spinner/Spinner.stories.js +0 -183
  334. package/dist/spinner/readme.md +0 -65
  335. package/dist/switch/Switch.js +0 -199
  336. package/dist/switch/Switch.stories.js +0 -134
  337. package/dist/switch/readme.md +0 -133
  338. package/dist/table/Table.js +0 -105
  339. package/dist/tabs/Tabs.js +0 -172
  340. package/dist/tabs/Tabs.stories.js +0 -130
  341. package/dist/tabs/readme.md +0 -78
  342. package/dist/tabs-for-sections/TabsForSections.js +0 -92
  343. package/dist/tabs-for-sections/readme.md +0 -78
  344. package/dist/tag/Tag.js +0 -234
  345. package/dist/textarea/Textarea.js +0 -227
  346. package/dist/toggle/Toggle.stories.js +0 -297
  347. package/dist/toggle/readme.md +0 -80
  348. package/dist/toggle-group/ToggleGroup.js +0 -214
  349. package/dist/toggle-group/readme.md +0 -82
  350. package/dist/upload/Upload.stories.js +0 -72
  351. package/dist/upload/buttons-upload/ButtonsUpload.js +0 -122
  352. package/dist/upload/buttons-upload/drag-drop-icon.svg +0 -4
  353. package/dist/upload/buttons-upload/upload-button.svg +0 -1
  354. package/dist/upload/dragAndDropArea/DragAndDropArea.js +0 -279
  355. package/dist/upload/dragAndDropArea/upload_drop.svg +0 -4
  356. package/dist/upload/dragAndDropArea/upload_file.svg +0 -4
  357. package/dist/upload/file-upload/FileToUpload.js +0 -158
  358. package/dist/upload/file-upload/audio-icon.svg +0 -4
  359. package/dist/upload/file-upload/close.svg +0 -4
  360. package/dist/upload/file-upload/file-icon.svg +0 -4
  361. package/dist/upload/file-upload/video-icon.svg +0 -4
  362. package/dist/upload/files-upload/FilesToUpload.js +0 -123
  363. package/dist/upload/readme.md +0 -37
  364. package/dist/upload/transaction/Transaction.js +0 -155
  365. package/dist/upload/transaction/audio-icon-err.svg +0 -4
  366. package/dist/upload/transaction/audio-icon.svg +0 -4
  367. package/dist/upload/transaction/error-icon.svg +0 -4
  368. package/dist/upload/transaction/file-icon-err.svg +0 -4
  369. package/dist/upload/transaction/file-icon.svg +0 -4
  370. package/dist/upload/transaction/image-icon-err.svg +0 -4
  371. package/dist/upload/transaction/image-icon.svg +0 -4
  372. package/dist/upload/transaction/success-icon.svg +0 -4
  373. package/dist/upload/transaction/video-icon-err.svg +0 -4
  374. package/dist/upload/transaction/video-icon.svg +0 -4
  375. package/dist/upload/transactions/Transactions.js +0 -120
  376. package/dist/wizard/Wizard.js +0 -327
  377. package/dist/wizard/invalid_icon.svg +0 -6
  378. package/dist/wizard/valid_icon.svg +0 -6
  379. package/dist/wizard/validation-wrong.svg +0 -6
  380. package/test/Accordion.test.js +0 -33
  381. package/test/Alert.test.js +0 -53
  382. package/test/Box.test.js +0 -10
  383. package/test/Button.test.js +0 -18
  384. package/test/Card.test.js +0 -30
  385. package/test/Checkbox.test.js +0 -45
  386. package/test/Chip.test.js +0 -25
  387. package/test/Date.test.js +0 -393
  388. package/test/Dialog.test.js +0 -23
  389. package/test/Dropdown.test.js +0 -130
  390. package/test/Footer.test.js +0 -99
  391. package/test/Header.test.js +0 -39
  392. package/test/Heading.test.js +0 -35
  393. package/test/InputText.test.js +0 -236
  394. package/test/Link.test.js +0 -33
  395. package/test/Paginator.test.js +0 -165
  396. package/test/ProgressBar.test.js +0 -35
  397. package/test/Radio.test.js +0 -37
  398. package/test/ResultsetTable.test.js +0 -282
  399. package/test/Select.test.js +0 -191
  400. package/test/Sidenav.test.js +0 -19
  401. package/test/Slider.test.js +0 -65
  402. package/test/Spinner.test.js +0 -27
  403. package/test/Switch.test.js +0 -45
  404. package/test/Table.test.js +0 -36
  405. package/test/Tabs.test.js +0 -88
  406. package/test/TabsForSections.test.js +0 -34
  407. package/test/Tag.test.js +0 -32
  408. package/test/TextArea.test.js +0 -52
  409. package/test/Toggle.test.js +0 -43
  410. package/test/ToggleGroup.test.js +0 -81
  411. package/test/Upload.test.js +0 -60
  412. package/test/Wizard.test.js +0 -130
  413. package/test/mocks/pngMock.js +0 -1
  414. package/test/mocks/svgMock.js +0 -1
package/dist/tabs/Tabs.js DELETED
@@ -1,172 +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 _Tabs = _interopRequireDefault(require("@material-ui/core/Tabs"));
23
-
24
- var _Tab = _interopRequireDefault(require("@material-ui/core/Tab"));
25
-
26
- var _styledComponents = _interopRequireWildcard(require("styled-components"));
27
-
28
- var _propTypes = _interopRequireDefault(require("prop-types"));
29
-
30
- require("../common/OpenSans.css");
31
-
32
- var _variables = require("../common/variables.js");
33
-
34
- var _utils = require("../common/utils.js");
35
-
36
- var _ThemeContext = _interopRequireDefault(require("../ThemeContext.js"));
37
-
38
- function _templateObject3() {
39
- var data = (0, _taggedTemplateLiteral2["default"])(["\n max-height: 22px;\n max-width: 22px;\n"]);
40
-
41
- _templateObject3 = function _templateObject3() {
42
- return data;
43
- };
44
-
45
- return data;
46
- }
47
-
48
- function _templateObject2() {
49
- var data = (0, _taggedTemplateLiteral2["default"])(["\n position: relative;\n margin: ", ";\n margin-top: ", ";\n margin-right: ", ";\n margin-bottom: ", ";\n margin-left: ", ";\n .MuiTabs-root {\n background: white;\n .MuiTabs-scroller {\n .MuiTabs-flexContainer + span {\n z-index: 4;\n }\n }\n .MuiButtonBase-root {\n padding: 12px;\n min-height: 48px;\n height: auto;\n font-family: \"Open Sans\", sans-serif;\n font-size: 14px;\n /* height: 64px cuando vengan con icono y texto */\n min-width: 180px;\n color: ", ";\n margin: 1px 0;\n &:not(.Mui-selected) {\n background-color: ", ";\n color: ", ";\n }\n &.Mui-selected {\n background-color: ", ";\n color: ", ";\n }\n &.Mui-disabled {\n cursor: not-allowed !important;\n pointer-events: all;\n opacity: ", ";\n }\n &:focus {\n outline: ", " auto 1px;\n }\n }\n\n .MuiTabs-indicator {\n background-color: ", ";\n }\n }\n"]);
50
-
51
- _templateObject2 = function _templateObject2() {
52
- return data;
53
- };
54
-
55
- return data;
56
- }
57
-
58
- function _templateObject() {
59
- var data = (0, _taggedTemplateLiteral2["default"])(["\n left: 0px;\n bottom: 0;\n width: 100%;\n height: 2px;\n position: absolute;\n background-color: ", ";\n"]);
60
-
61
- _templateObject = function _templateObject() {
62
- return data;
63
- };
64
-
65
- return data;
66
- }
67
-
68
- var DxcTabs = function DxcTabs(_ref) {
69
- var activeTabIndex = _ref.activeTabIndex,
70
- _ref$tabs = _ref.tabs,
71
- tabs = _ref$tabs === void 0 ? [] : _ref$tabs,
72
- onTabClick = _ref.onTabClick,
73
- margin = _ref.margin;
74
-
75
- var _React$useState = _react["default"].useState(0),
76
- _React$useState2 = (0, _slicedToArray2["default"])(_React$useState, 2),
77
- innerActiveTabIndex = _React$useState2[0],
78
- setInnerActiveTabIndex = _React$useState2[1];
79
-
80
- var customTheme = (0, _react.useContext)(_ThemeContext["default"]);
81
- var colorsTheme = (0, _react.useMemo)(function () {
82
- return (0, _utils.getCustomTheme)(_variables.theme, (0, _utils.getCustomTheme)(_variables.defaultTheme, customTheme));
83
- }, [customTheme]);
84
-
85
- var handleChange = function handleChange(event, newValue) {
86
- if (activeTabIndex == null) {
87
- setInnerActiveTabIndex(newValue);
88
- }
89
-
90
- if (typeof onTabClick === "function") {
91
- onTabClick(newValue);
92
- }
93
- };
94
-
95
- return _react["default"].createElement(_styledComponents.ThemeProvider, {
96
- theme: colorsTheme.tabs
97
- }, _react["default"].createElement(DxCTabs, {
98
- margin: margin
99
- }, _react["default"].createElement(Underline, null), _react["default"].createElement(_Tabs["default"], {
100
- value: activeTabIndex != null ? activeTabIndex : innerActiveTabIndex,
101
- onChange: handleChange,
102
- variant: "scrollable",
103
- scrollButtons: "off"
104
- }, tabs.map(function (tab, i) {
105
- return _react["default"].createElement(_Tab["default"], {
106
- key: "tab".concat(i).concat(tab.label),
107
- label: tab.label,
108
- icon: tab.iconSrc && _react["default"].createElement(TabIcon, {
109
- src: tab.iconSrc
110
- }),
111
- disabled: tab.isDisabled,
112
- disableRipple: true
113
- });
114
- }))));
115
- };
116
-
117
- var Underline = _styledComponents["default"].div(_templateObject(), function (props) {
118
- return props.theme.underlinedColor;
119
- });
120
-
121
- var DxCTabs = _styledComponents["default"].div(_templateObject2(), function (props) {
122
- return props.margin && (0, _typeof2["default"])(props.margin) !== "object" ? _variables.spaces[props.margin] : "0px";
123
- }, function (props) {
124
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.top ? _variables.spaces[props.margin.top] : "";
125
- }, function (props) {
126
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.right ? _variables.spaces[props.margin.right] : "";
127
- }, function (props) {
128
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.bottom ? _variables.spaces[props.margin.bottom] : "";
129
- }, function (props) {
130
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.left ? _variables.spaces[props.margin.left] : "";
131
- }, function (props) {
132
- return props.theme.fontColor;
133
- }, function (props) {
134
- return "".concat(props.theme.selectedBackgroundColor).concat(props.theme.backgroundColor);
135
- }, function (props) {
136
- return "".concat(props.theme.fontColor).concat(props.theme.notSelectedOpacity);
137
- }, function (props) {
138
- return props.theme.selectedBackgroundColor;
139
- }, function (props) {
140
- return props.theme.selectedFontColor;
141
- }, function (props) {
142
- return props.theme.disabled;
143
- }, function (props) {
144
- return props.theme.focusColor;
145
- }, function (props) {
146
- return props.theme.selectedUnderlinedColor;
147
- });
148
-
149
- var TabIcon = _styledComponents["default"].img(_templateObject3());
150
-
151
- DxcTabs.propTypes = {
152
- activeTabIndex: _propTypes["default"].number,
153
- onTabClick: _propTypes["default"].func,
154
- tabs: _propTypes["default"].arrayOf(_propTypes["default"].shape({
155
- label: _propTypes["default"].string,
156
- iconSrc: _propTypes["default"].string,
157
- isDisabled: _propTypes["default"]["boolean"]
158
- })),
159
- margin: _propTypes["default"].oneOfType([_propTypes["default"].shape({
160
- top: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
161
- bottom: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
162
- left: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
163
- right: _propTypes["default"].oneOf(Object.keys(_variables.spaces))
164
- }), _propTypes["default"].oneOf((0, _toConsumableArray2["default"])(Object.keys(_variables.spaces)))])
165
- };
166
- DxcTabs.defaultProps = {
167
- activeTabIndex: null,
168
- tabs: [],
169
- onTabClick: function onTabClick() {}
170
- };
171
- var _default = DxcTabs;
172
- exports["default"] = _default;
@@ -1,130 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
-
5
- var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
6
-
7
- var _react = _interopRequireDefault(require("react"));
8
-
9
- var _react2 = require("@storybook/react");
10
-
11
- var _addonActions = require("@storybook/addon-actions");
12
-
13
- var _addonKnobs = require("@storybook/addon-knobs");
14
-
15
- var _readme = _interopRequireDefault(require("./readme.md"));
16
-
17
- var _Tabs = _interopRequireDefault(require("./Tabs"));
18
-
19
- var _Tab = _interopRequireDefault(require("./tab/Tab"));
20
-
21
- var _amazon = _interopRequireDefault(require("../../.storybook/public/amazon.svg"));
22
-
23
- var _ebay = _interopRequireDefault(require("../../.storybook/public/ebay.svg"));
24
-
25
- var _apple = _interopRequireDefault(require("../../.storybook/public/apple.svg"));
26
-
27
- var onChange = (0, _addonActions.action)("onChange");
28
-
29
- onChange.toString = function () {
30
- return "onChangeHandler";
31
- };
32
-
33
- (0, _react2.storiesOf)("Form Components|Tabs", module).add("Types", function () {
34
- return _react["default"].createElement("div", null, _react["default"].createElement("h3", null, "Light"), _react["default"].createElement("div", null, _react["default"].createElement(_Tabs["default"], {
35
- activeTabIndex: 0,
36
- activeTabIndexChange: onChange,
37
- mode: "underlined"
38
- }, _react["default"].createElement(_Tab["default"], {
39
- label: "Tab ONE",
40
- iconSrc: "",
41
- disabled: false
42
- }, _react["default"].createElement("div", null, "Lorem ipsum dolor sit amet consectetur adipiscing elit aliquam class orci, est lectus eros praesent rhoncus dui etiam nascetur a mauris, luctus bibendum facilisis senectus sodales lobortis condimentum porta posuere. Massa varius ac imperdiet mauris quis rhoncus, nisl interdum gravida ullamcorper aliquam aptent pellentesque, consequat leo quam nec montes. Ridiculus mollis augue nam erat volutpat nibh congue, nostra habitasse dignissim pulvinar libero iaculis taciti et, bibendum morbi potenti lobortis purus laoreet.")), _react["default"].createElement(_Tab["default"], {
43
- label: "Tab TWO",
44
- iconSrc: "",
45
- disabled: false
46
- }, _react["default"].createElement("div", null, "Lorem ipsum dolor sit amet consectetur adipiscing elit aliquam class orci, est lectus eros praesent rhoncus dui etiam nascetur a mauris, luctus bibendum facilisis senectus sodales lobortis condimentum porta posuere. Massa varius ac imperdiet mauris quis rhoncus, nisl interdum gravida ullamcorper aliquam aptent pellentesque, consequat leo quam nec montes. Ridiculus mollis augue nam erat volutpat nibh congue, nostra habitasse dignissim pulvinar libero iaculis taciti et, bibendum morbi potenti lobortis purus laoreet.")), _react["default"].createElement(_Tab["default"], {
47
- label: "Tab THREE",
48
- iconSrc: "",
49
- disabled: false
50
- }, _react["default"].createElement("div", null, "Lorem ipsum dolor sit amet consectetur adipiscing elit aliquam class orci, est lectus eros praesent rhoncus dui etiam nascetur a mauris, luctus bibendum facilisis senectus sodales lobortis condimentum porta posuere. Massa varius ac imperdiet mauris quis rhoncus, nisl interdum gravida ullamcorper aliquam aptent pellentesque, consequat leo quam nec montes. Ridiculus mollis augue nam erat volutpat nibh congue, nostra habitasse dignissim pulvinar libero iaculis taciti et, bibendum morbi potenti lobortis purus laoreet.")))), _react["default"].createElement("div", null, _react["default"].createElement(_Tabs["default"], {
51
- activeTabIndex: 0,
52
- activeTabIndexChange: onChange,
53
- mode: "filled"
54
- }, _react["default"].createElement(_Tab["default"], {
55
- label: "Label 1",
56
- iconSrc: _amazon["default"],
57
- disabled: false
58
- }, _react["default"].createElement("div", null, "Lorem ipsum dolor sit amet consectetur adipiscing elit aliquam class orci, est lectus eros praesent rhoncus dui etiam nascetur a mauris, luctus bibendum facilisis senectus sodales lobortis condimentum porta posuere. Massa varius ac imperdiet mauris quis rhoncus, nisl interdum gravida ullamcorper aliquam aptent pellentesque, consequat leo quam nec montes. Ridiculus mollis augue nam erat volutpat nibh congue, nostra habitasse dignissim pulvinar libero iaculis taciti et, bibendum morbi potenti lobortis purus laoreet.")), _react["default"].createElement(_Tab["default"], {
59
- label: "Label 2",
60
- iconSrc: _ebay["default"],
61
- disabled: false
62
- }, _react["default"].createElement("div", null, "Lorem ipsum dolor sit amet consectetur adipiscing elit aliquam class orci, est lectus eros praesent rhoncus dui etiam nascetur a mauris, luctus bibendum facilisis senectus sodales lobortis condimentum porta posuere. Massa varius ac imperdiet mauris quis rhoncus, nisl interdum gravida ullamcorper aliquam aptent pellentesque, consequat leo quam nec montes. Ridiculus mollis augue nam erat volutpat nibh congue, nostra habitasse dignissim pulvinar libero iaculis taciti et, bibendum morbi potenti lobortis purus laoreet.")), _react["default"].createElement(_Tab["default"], {
63
- label: "Label 3",
64
- iconSrc: _apple["default"],
65
- disabled: true
66
- }, _react["default"].createElement("div", null, "Lorem ipsum dolor sit amet consectetur adipiscing elit aliquam class orci, est lectus eros praesent rhoncus dui etiam nascetur a mauris, luctus bibendum facilisis senectus sodales lobortis condimentum porta posuere. Massa varius ac imperdiet mauris quis rhoncus, nisl interdum gravida ullamcorper aliquam aptent pellentesque, consequat leo quam nec montes. Ridiculus mollis augue nam erat volutpat nibh congue, nostra habitasse dignissim pulvinar libero iaculis taciti et, bibendum morbi potenti lobortis purus laoreet.")))));
67
- }, {
68
- notes: {
69
- markdown: _readme["default"]
70
- }
71
- });
72
-
73
- var knobProps = function knobProps() {
74
- return {
75
- mode: (0, _addonKnobs.select)("mode", {
76
- filled: "filled",
77
- underlined: "underlined"
78
- }, "filled"),
79
- theme: (0, _addonKnobs.select)("theme", {
80
- light: "light",
81
- dark: "dark"
82
- }, "light"),
83
- activeTabIndex: (0, _addonKnobs.number)("Tab Active", 0)
84
- };
85
- };
86
-
87
- var knobTab1Props = function knobTab1Props() {
88
- return {
89
- label: (0, _addonKnobs.text)("First Tab Label", "Tab 1"),
90
- disabled: (0, _addonKnobs["boolean"])("First Tab Disabled", false)
91
- };
92
- };
93
-
94
- var knobTab2Props = function knobTab2Props() {
95
- return {
96
- label: (0, _addonKnobs.text)("Second Tab Label", "Tab 2"),
97
- disabled: (0, _addonKnobs["boolean"])("Second Tab Disabled", false)
98
- };
99
- };
100
-
101
- var knobTab3Props = function knobTab3Props() {
102
- return {
103
- label: (0, _addonKnobs.text)("Third Tab Label", "Tab 3"),
104
- disabled: (0, _addonKnobs["boolean"])("Third Tab Disabled", false)
105
- };
106
- };
107
-
108
- (0, _react2.storiesOf)("Form Components|Tabs", module).add("Knobs example", function () {
109
- var props = knobProps();
110
- var tab1Props = knobTab1Props();
111
- var tab2Props = knobTab2Props();
112
- var tab3Props = knobTab3Props();
113
- return _react["default"].createElement("div", {
114
- style: {
115
- background: props.theme === "dark" && "black" || "transparent"
116
- }
117
- }, _react["default"].createElement(_Tabs["default"], (0, _extends2["default"])({}, props, {
118
- activeTabIndexChange: onChange
119
- }), _react["default"].createElement(_Tab["default"], (0, _extends2["default"])({}, tab1Props, {
120
- iconSrc: _amazon["default"]
121
- }), "Content ONE"), _react["default"].createElement(_Tab["default"], (0, _extends2["default"])({}, tab2Props, {
122
- iconSrc: _ebay["default"]
123
- }), "Content TWO"), _react["default"].createElement(_Tab["default"], (0, _extends2["default"])({}, tab3Props, {
124
- iconSrc: _apple["default"]
125
- }), "Content THREE")));
126
- }, {
127
- notes: {
128
- markdown: _readme["default"]
129
- }
130
- });
@@ -1,78 +0,0 @@
1
- # DXC Tabs Component
2
-
3
- ## Tab Group Props
4
-
5
- <table>
6
- <tr style="background-color: grey">
7
- <td>Name</td>
8
- <td>Default</td>
9
- <td>Description</td>
10
- </tr>
11
- <tr>
12
- <td>mode: 'filled' | 'underlined'</td>
13
- <td><code>'filled'</code></td>
14
- <td>Uses one of the available component modes.</td>
15
- </tr>
16
- <tr>
17
- <td>theme: 'light' | 'dark'</td>
18
- <td><code>'light'</code></td>
19
- <td>Uses one of the available component themes.</td>
20
- </tr>
21
- <tr>
22
- <td>showDotIndicator: boolean</td>
23
- <td><code>false</code></td>
24
- <td>If true, a dot indicator will be shown in the active tab.</td>
25
- </tr>
26
- <tr>
27
- <td>disableRipple: boolean</td>
28
- <td><code>false</code></td>
29
- <td>If true, the ripple effect will be disabled.</td>
30
- </tr>
31
- <tr>
32
- <td>activeTabIndex: number</td>
33
- <td><code>0</code></td>
34
- <td>The index of the active tab.</td>
35
- </tr>
36
- <tr>
37
- <td>activeTabIndexChange: function</td>
38
- <td></td>
39
- <td>This function will be called when the user clicks on a tab. The index of the clicked tab will be passed as a parameter.</td>
40
- </tr>
41
- <tr>
42
- <td>stepper: boolean</td>
43
- <td><code>false</code></td>
44
- <td>If true, the component should be rendered as a Stepper component.</td>
45
- </tr>
46
- <tr>
47
- <td>orientation: 'horizontal' | 'vertical'</td>
48
- <td><code>'horizontal'</code></td>
49
- <td>Only if stepper, this parameter shows the stepper orientation.</td>
50
- </tr>
51
-
52
- </table>
53
-
54
- ## Tab Props
55
-
56
- <table>
57
- <tr style="background-color: grey">
58
- <td>Name</td>
59
- <td>Default</td>
60
- <td>Description</td>
61
- </tr>
62
- <tr>
63
- <td>label: string</td>
64
- <td></td>
65
- <td>Text to be placed within the tab.</td>
66
- </tr>
67
- <tr>
68
- <td>iconSrc: string</td>
69
- <td></td>
70
- <td>The path of an icon to be placed within the tab.</td>
71
- </tr>
72
- <tr>
73
- <td>disabled: boolean</td>
74
- <td><code>false</code></td>
75
- <td>Whether the tab is disabled.</td>
76
- </tr>
77
- </table>
78
-
@@ -1,92 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
-
5
- Object.defineProperty(exports, "__esModule", {
6
- value: true
7
- });
8
- exports["default"] = void 0;
9
-
10
- var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
11
-
12
- var _react = _interopRequireDefault(require("react"));
13
-
14
- var _styledComponents = _interopRequireDefault(require("styled-components"));
15
-
16
- var _propTypes = _interopRequireDefault(require("prop-types"));
17
-
18
- var _reactUseScrollspy = _interopRequireDefault(require("react-use-scrollspy"));
19
-
20
- var _Tabs = _interopRequireDefault(require("../tabs/Tabs"));
21
-
22
- function _templateObject() {
23
- var data = (0, _taggedTemplateLiteral2["default"])(["\n z-index: 10;\n ", "\n"]);
24
-
25
- _templateObject = function _templateObject() {
26
- return data;
27
- };
28
-
29
- return data;
30
- }
31
-
32
- var TABS_HEIGHT = 54;
33
-
34
- var DxcTabsForSections = function DxcTabsForSections(_ref) {
35
- var _ref$sections = _ref.sections,
36
- sections = _ref$sections === void 0 ? [] : _ref$sections,
37
- _ref$stickAtPx = _ref.stickAtPx,
38
- stickAtPx = _ref$stickAtPx === void 0 ? 0 : _ref$stickAtPx;
39
- var tabs = sections.map(function (section) {
40
- return {
41
- label: section.tabLabel
42
- };
43
- });
44
- var refs = sections.map(function () {
45
- return _react["default"].createRef();
46
- });
47
- var activeTab = (0, _reactUseScrollspy["default"])({
48
- sectionElementRefs: refs,
49
- offsetPx: -stickAtPx - TABS_HEIGHT
50
- });
51
-
52
- var onTabClick = function onTabClick(tabId) {
53
- var topOfElement = refs[tabId].current.offsetTop - stickAtPx - TABS_HEIGHT + 5;
54
- window.scroll({
55
- top: topOfElement,
56
- behavior: "smooth"
57
- });
58
- };
59
-
60
- return _react["default"].createElement(_react["default"].Fragment, null, _react["default"].createElement(StyledTabs, {
61
- stickAtPx: stickAtPx
62
- }, _react["default"].createElement(_Tabs["default"], {
63
- tabs: tabs,
64
- activeTabIndex: activeTab,
65
- onTabClick: onTabClick
66
- })), sections.map(function (section, i) {
67
- return _react["default"].createElement("div", {
68
- key: "section".concat(i),
69
- ref: refs[i]
70
- }, _react["default"].createElement(section.section, null));
71
- }));
72
- };
73
-
74
- DxcTabsForSections.propTypes = {
75
- stickAtPx: _propTypes["default"].number,
76
- sections: _propTypes["default"].arrayOf(_propTypes["default"].shape({
77
- tabLabel: _propTypes["default"].string,
78
- section: _propTypes["default"].func
79
- }))
80
- };
81
- DxcTabsForSections.defaultProps = {
82
- stickAtPx: 0,
83
- sections: []
84
- };
85
-
86
- var StyledTabs = _styledComponents["default"].div(_templateObject(), function (_ref2) {
87
- var stickAtPx = _ref2.stickAtPx;
88
- return stickAtPx && "\n position: sticky;\n top: ".concat(stickAtPx, "px;\n ");
89
- });
90
-
91
- var _default = DxcTabsForSections;
92
- exports["default"] = _default;
@@ -1,78 +0,0 @@
1
- # DXC Tabs Component
2
-
3
- ## Tab Group Props
4
-
5
- <table>
6
- <tr style="background-color: grey">
7
- <td>Name</td>
8
- <td>Default</td>
9
- <td>Description</td>
10
- </tr>
11
- <tr>
12
- <td>mode: 'filled' | 'underlined'</td>
13
- <td><code>'filled'</code></td>
14
- <td>Uses one of the available component modes.</td>
15
- </tr>
16
- <tr>
17
- <td>theme: 'light' | 'dark'</td>
18
- <td><code>'light'</code></td>
19
- <td>Uses one of the available component themes.</td>
20
- </tr>
21
- <tr>
22
- <td>showDotIndicator: boolean</td>
23
- <td><code>false</code></td>
24
- <td>If true, a dot indicator will be shown in the active tab.</td>
25
- </tr>
26
- <tr>
27
- <td>disableRipple: boolean</td>
28
- <td><code>false</code></td>
29
- <td>If true, the ripple effect will be disabled.</td>
30
- </tr>
31
- <tr>
32
- <td>activeTabIndex: number</td>
33
- <td><code>0</code></td>
34
- <td>The index of the active tab.</td>
35
- </tr>
36
- <tr>
37
- <td>activeTabIndexChange: function</td>
38
- <td></td>
39
- <td>This function will be called when the user clicks on a tab. The index of the clicked tab will be passed as a parameter.</td>
40
- </tr>
41
- <tr>
42
- <td>stepper: boolean</td>
43
- <td><code>false</code></td>
44
- <td>If true, the component should be rendered as a Stepper component.</td>
45
- </tr>
46
- <tr>
47
- <td>orientation: 'horizontal' | 'vertical'</td>
48
- <td><code>'horizontal'</code></td>
49
- <td>Only if stepper, this parameter shows the stepper orientation.</td>
50
- </tr>
51
-
52
- </table>
53
-
54
- ## Tab Props
55
-
56
- <table>
57
- <tr style="background-color: grey">
58
- <td>Name</td>
59
- <td>Default</td>
60
- <td>Description</td>
61
- </tr>
62
- <tr>
63
- <td>label: string</td>
64
- <td></td>
65
- <td>Text to be placed within the tab.</td>
66
- </tr>
67
- <tr>
68
- <td>iconSrc: string</td>
69
- <td></td>
70
- <td>The path of an icon to be placed within the tab.</td>
71
- </tr>
72
- <tr>
73
- <td>disabled: boolean</td>
74
- <td><code>false</code></td>
75
- <td>Whether the tab is disabled.</td>
76
- </tr>
77
- </table>
78
-