@dxc-technology/halstack-react 0.0.0-bd47c58 → 0.0.0-bd89f9e

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 (220) hide show
  1. package/BackgroundColorContext.d.ts +2 -2
  2. package/BackgroundColorContext.js +5 -17
  3. package/HalstackContext.d.ts +14 -5
  4. package/HalstackContext.js +9 -34
  5. package/accordion/Accordion.js +21 -58
  6. package/accordion/Accordion.stories.tsx +1 -15
  7. package/accordion/Accordion.test.js +18 -33
  8. package/accordion/types.d.ts +5 -5
  9. package/accordion-group/AccordionGroup.js +15 -42
  10. package/accordion-group/AccordionGroup.stories.tsx +1 -1
  11. package/accordion-group/AccordionGroup.test.js +42 -60
  12. package/accordion-group/AccordionGroupAccordion.js +9 -21
  13. package/accordion-group/types.d.ts +6 -6
  14. package/alert/Alert.js +14 -46
  15. package/alert/Alert.test.js +28 -45
  16. package/alert/types.d.ts +5 -5
  17. package/badge/Badge.js +4 -17
  18. package/badge/types.d.ts +1 -1
  19. package/bleed/Bleed.js +13 -21
  20. package/bleed/types.d.ts +2 -2
  21. package/box/Box.js +10 -29
  22. package/box/Box.test.js +1 -6
  23. package/box/types.d.ts +3 -3
  24. package/bulleted-list/BulletedList.js +7 -33
  25. package/bulleted-list/BulletedList.stories.tsx +1 -91
  26. package/bulleted-list/types.d.ts +5 -5
  27. package/button/Button.js +23 -46
  28. package/button/Button.stories.tsx +5 -86
  29. package/button/Button.test.js +11 -21
  30. package/button/types.d.ts +4 -4
  31. package/card/Card.js +21 -44
  32. package/card/Card.test.js +10 -21
  33. package/card/types.d.ts +5 -5
  34. package/checkbox/Checkbox.js +81 -111
  35. package/checkbox/Checkbox.stories.tsx +16 -54
  36. package/checkbox/Checkbox.test.js +107 -63
  37. package/checkbox/types.d.ts +8 -4
  38. package/chip/Chip.js +12 -31
  39. package/chip/Chip.stories.tsx +1 -1
  40. package/chip/Chip.test.js +15 -28
  41. package/chip/types.d.ts +4 -4
  42. package/common/coreTokens.d.ts +105 -14
  43. package/common/coreTokens.js +40 -23
  44. package/common/utils.js +2 -8
  45. package/common/variables.d.ts +15 -6
  46. package/common/variables.js +17 -15
  47. package/container/Container.d.ts +4 -0
  48. package/container/Container.js +198 -0
  49. package/container/Container.stories.tsx +229 -0
  50. package/container/types.d.ts +74 -0
  51. package/date-input/Calendar.js +13 -57
  52. package/date-input/DateInput.js +50 -96
  53. package/date-input/DateInput.stories.tsx +11 -30
  54. package/date-input/DateInput.test.js +674 -701
  55. package/date-input/DatePicker.js +11 -42
  56. package/date-input/Icons.d.ts +6 -6
  57. package/date-input/Icons.js +6 -23
  58. package/date-input/YearPicker.js +8 -34
  59. package/date-input/types.d.ts +27 -21
  60. package/dialog/Dialog.js +11 -35
  61. package/dialog/Dialog.test.js +125 -187
  62. package/dialog/types.d.ts +18 -13
  63. package/dropdown/Dropdown.js +39 -93
  64. package/dropdown/Dropdown.test.js +391 -378
  65. package/dropdown/DropdownMenu.js +8 -19
  66. package/dropdown/DropdownMenuItem.js +5 -17
  67. package/dropdown/types.d.ts +17 -19
  68. package/file-input/FileInput.js +180 -248
  69. package/file-input/FileInput.stories.tsx +1 -1
  70. package/file-input/FileInput.test.js +356 -354
  71. package/file-input/FileItem.js +12 -39
  72. package/file-input/types.d.ts +9 -9
  73. package/flex/Flex.js +25 -39
  74. package/flex/types.d.ts +6 -6
  75. package/footer/Footer.js +9 -39
  76. package/footer/Footer.stories.tsx +8 -7
  77. package/footer/Footer.test.js +18 -32
  78. package/footer/Icons.d.ts +2 -2
  79. package/footer/Icons.js +2 -7
  80. package/footer/types.d.ts +13 -13
  81. package/grid/Grid.js +1 -16
  82. package/grid/types.d.ts +10 -10
  83. package/header/Header.d.ts +1 -1
  84. package/header/Header.js +19 -64
  85. package/header/Header.test.js +12 -25
  86. package/header/Icons.d.ts +2 -2
  87. package/header/Icons.js +2 -7
  88. package/header/types.d.ts +5 -7
  89. package/heading/Heading.js +9 -31
  90. package/heading/Heading.test.js +70 -87
  91. package/heading/types.d.ts +7 -7
  92. package/image/Image.d.ts +2 -2
  93. package/image/Image.js +17 -32
  94. package/image/types.d.ts +2 -2
  95. package/inset/Inset.js +13 -21
  96. package/inset/types.d.ts +2 -2
  97. package/layout/ApplicationLayout.d.ts +1 -1
  98. package/layout/ApplicationLayout.js +25 -65
  99. package/layout/ApplicationLayout.stories.tsx +1 -1
  100. package/layout/Icons.d.ts +8 -5
  101. package/layout/Icons.js +51 -59
  102. package/layout/SidenavContext.d.ts +1 -1
  103. package/layout/SidenavContext.js +3 -9
  104. package/layout/types.d.ts +3 -3
  105. package/link/Link.js +21 -42
  106. package/link/Link.test.js +23 -41
  107. package/link/types.d.ts +14 -14
  108. package/main.d.ts +3 -2
  109. package/main.js +10 -52
  110. package/nav-tabs/NavTabs.js +11 -43
  111. package/nav-tabs/NavTabs.stories.tsx +1 -1
  112. package/nav-tabs/NavTabs.test.js +36 -43
  113. package/nav-tabs/Tab.js +16 -45
  114. package/nav-tabs/types.d.ts +9 -9
  115. package/number-input/NumberInput.d.ts +1 -1
  116. package/number-input/NumberInput.js +24 -35
  117. package/number-input/NumberInput.stories.tsx +42 -26
  118. package/number-input/NumberInput.test.js +682 -577
  119. package/number-input/types.d.ts +11 -5
  120. package/package.json +29 -27
  121. package/paginator/Icons.d.ts +5 -5
  122. package/paginator/Icons.js +5 -19
  123. package/paginator/Paginator.js +14 -39
  124. package/paginator/Paginator.test.js +224 -207
  125. package/paginator/types.d.ts +3 -3
  126. package/paragraph/Paragraph.js +3 -14
  127. package/paragraph/Paragraph.stories.tsx +0 -17
  128. package/password-input/Icons.d.ts +3 -3
  129. package/password-input/Icons.js +1 -5
  130. package/password-input/PasswordInput.js +26 -48
  131. package/password-input/PasswordInput.stories.tsx +1 -33
  132. package/password-input/PasswordInput.test.js +153 -129
  133. package/password-input/types.d.ts +8 -7
  134. package/progress-bar/ProgressBar.js +16 -42
  135. package/progress-bar/{ProgressBar.stories.jsx → ProgressBar.stories.tsx} +1 -1
  136. package/progress-bar/ProgressBar.test.js +35 -52
  137. package/progress-bar/types.d.ts +3 -3
  138. package/quick-nav/QuickNav.js +4 -27
  139. package/quick-nav/QuickNav.stories.tsx +1 -1
  140. package/quick-nav/types.d.ts +10 -10
  141. package/radio-group/Radio.d.ts +1 -1
  142. package/radio-group/Radio.js +22 -54
  143. package/radio-group/RadioGroup.js +37 -83
  144. package/radio-group/RadioGroup.stories.tsx +10 -10
  145. package/radio-group/RadioGroup.test.js +504 -470
  146. package/radio-group/types.d.ts +8 -8
  147. package/resultset-table/Icons.d.ts +7 -0
  148. package/{resultsetTable → resultset-table}/Icons.js +1 -5
  149. package/{resultsetTable → resultset-table}/ResultsetTable.js +23 -59
  150. package/{resultsetTable → resultset-table}/ResultsetTable.test.js +72 -92
  151. package/{resultsetTable → resultset-table}/types.d.ts +7 -7
  152. package/resultset-table/types.js +5 -0
  153. package/select/Icons.d.ts +7 -7
  154. package/select/Icons.js +1 -5
  155. package/select/Listbox.js +13 -39
  156. package/select/Option.js +9 -26
  157. package/select/Select.js +54 -138
  158. package/select/Select.stories.tsx +3 -3
  159. package/select/Select.test.js +1906 -1800
  160. package/select/types.d.ts +14 -15
  161. package/sidenav/Icons.d.ts +4 -4
  162. package/sidenav/Icons.js +1 -5
  163. package/sidenav/Sidenav.js +24 -63
  164. package/sidenav/Sidenav.test.js +3 -10
  165. package/sidenav/types.d.ts +18 -18
  166. package/slider/Slider.js +38 -86
  167. package/slider/Slider.test.js +107 -103
  168. package/slider/types.d.ts +4 -4
  169. package/spinner/Spinner.js +10 -40
  170. package/spinner/Spinner.test.js +25 -34
  171. package/spinner/types.d.ts +3 -3
  172. package/switch/Switch.js +26 -69
  173. package/switch/Switch.stories.tsx +0 -34
  174. package/switch/Switch.test.js +51 -96
  175. package/switch/types.d.ts +4 -4
  176. package/table/Table.js +4 -23
  177. package/table/Table.test.js +1 -6
  178. package/table/types.d.ts +8 -8
  179. package/tabs/Tab.js +10 -29
  180. package/tabs/Tabs.js +48 -124
  181. package/tabs/Tabs.test.js +62 -118
  182. package/tabs/types.d.ts +19 -19
  183. package/tag/Tag.js +21 -51
  184. package/tag/Tag.test.js +19 -30
  185. package/tag/types.d.ts +7 -7
  186. package/text-input/Icons.d.ts +5 -5
  187. package/text-input/Icons.js +1 -5
  188. package/text-input/Suggestion.js +9 -26
  189. package/text-input/Suggestions.d.ts +1 -1
  190. package/text-input/Suggestions.js +12 -57
  191. package/text-input/TextInput.js +128 -193
  192. package/text-input/TextInput.stories.tsx +48 -152
  193. package/text-input/TextInput.test.js +1210 -1194
  194. package/text-input/types.d.ts +25 -17
  195. package/textarea/Textarea.js +60 -96
  196. package/textarea/{Textarea.stories.jsx → Textarea.stories.tsx} +58 -99
  197. package/textarea/Textarea.test.js +150 -179
  198. package/textarea/types.d.ts +9 -5
  199. package/toggle-group/ToggleGroup.js +20 -57
  200. package/toggle-group/ToggleGroup.stories.tsx +4 -4
  201. package/toggle-group/ToggleGroup.test.js +48 -81
  202. package/toggle-group/types.d.ts +10 -10
  203. package/typography/Typography.js +4 -13
  204. package/typography/types.d.ts +1 -1
  205. package/useTheme.d.ts +12 -3
  206. package/useTheme.js +1 -8
  207. package/useTranslatedLabels.js +1 -7
  208. package/utils/BaseTypography.d.ts +2 -2
  209. package/utils/BaseTypography.js +16 -30
  210. package/utils/FocusLock.js +12 -36
  211. package/wizard/Wizard.js +14 -49
  212. package/wizard/Wizard.test.js +53 -80
  213. package/wizard/types.d.ts +6 -6
  214. package/resultsetTable/Icons.d.ts +0 -7
  215. package/slider/Slider.stories.tsx +0 -240
  216. /package/{resultsetTable → container}/types.js +0 -0
  217. /package/{resultsetTable → resultset-table}/ResultsetTable.d.ts +0 -0
  218. /package/{resultsetTable → resultset-table}/ResultsetTable.stories.tsx +0 -0
  219. /package/spinner/{Spinner.stories.jsx → Spinner.stories.tsx} +0 -0
  220. /package/table/{Table.stories.jsx → Table.stories.tsx} +0 -0
package/link/types.d.ts CHANGED
@@ -1,21 +1,25 @@
1
1
  /// <reference types="react" />
2
- declare type Space = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
3
- declare type Margin = {
2
+ type Space = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
3
+ type Margin = {
4
4
  top?: Space;
5
5
  bottom?: Space;
6
6
  left?: Space;
7
7
  right?: Space;
8
8
  };
9
- declare type SVG = React.ReactNode & React.SVGProps<SVGSVGElement>;
10
- export declare type LinkProps = {
9
+ type SVG = React.ReactNode & React.SVGProps<SVGSVGElement>;
10
+ export type LinkProps = {
11
+ /**
12
+ * If true, the link is disabled.
13
+ */
14
+ disabled?: boolean;
11
15
  /**
12
16
  * If true, the color is inherited from parent.
13
17
  */
14
18
  inheritColor?: boolean;
15
19
  /**
16
- * If true, the link is disabled.
20
+ * Element or path used as the icon that will be placed next to the link text.
17
21
  */
18
- disabled?: boolean;
22
+ icon?: string | SVG;
19
23
  /**
20
24
  * Indicates the position of the icon in the component.
21
25
  */
@@ -33,6 +37,10 @@ export declare type LinkProps = {
33
37
  * function will be called when the user clicks the link.
34
38
  */
35
39
  onClick?: () => void;
40
+ /**
41
+ * Text of the link.
42
+ */
43
+ children: string;
36
44
  /**
37
45
  * Size of the margin to be applied to the component ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
38
46
  * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
@@ -42,13 +50,5 @@ export declare type LinkProps = {
42
50
  * Value of the tabindex.
43
51
  */
44
52
  tabIndex?: number;
45
- /**
46
- * Content of the link.
47
- */
48
- children: string;
49
- /**
50
- * Element or path used as the icon that will be placed next to the link text.
51
- */
52
- icon?: string | SVG;
53
53
  };
54
54
  export {};
package/main.d.ts CHANGED
@@ -17,7 +17,7 @@ import DxcPaginator from "./paginator/Paginator";
17
17
  import DxcWizard from "./wizard/Wizard";
18
18
  import DxcLink from "./link/Link";
19
19
  import DxcHeading from "./heading/Heading";
20
- import DxcResultsetTable from "./resultsetTable/ResultsetTable";
20
+ import DxcResultsetTable from "./resultset-table/ResultsetTable";
21
21
  import DxcChip from "./chip/Chip";
22
22
  import DxcApplicationLayout from "./layout/ApplicationLayout";
23
23
  import DxcToggleGroup from "./toggle-group/ToggleGroup";
@@ -41,6 +41,7 @@ import DxcParagraph from "./paragraph/Paragraph";
41
41
  import DxcBulletedList from "./bulleted-list/BulletedList";
42
42
  import DxcGrid from "./grid/Grid";
43
43
  import DxcImage from "./image/Image";
44
+ import DxcContainer from "./container/Container";
44
45
  import HalstackContext, { HalstackProvider, HalstackLanguageContext } from "./HalstackContext";
45
46
  import { BackgroundColorProvider } from "./BackgroundColorContext";
46
- export { DxcAlert, DxcButton, DxcCheckbox, DxcTextInput, DxcDropdown, DxcSwitch, DxcSlider, DxcTable, DxcTabs, DxcToggleGroup, DxcDialog, DxcCard, DxcProgressBar, DxcAccordion, DxcSpinner, DxcBox, DxcTag, DxcPaginator, DxcWizard, DxcLink, DxcHeading, DxcResultsetTable, DxcChip, DxcApplicationLayout, HalstackContext, HalstackLanguageContext, HalstackProvider, BackgroundColorProvider, DxcAccordionGroup, DxcBadge, DxcPasswordInput, DxcDateInput, DxcNumberInput, DxcTextarea, DxcSelect, DxcFileInput, DxcRadioGroup, DxcBleed, DxcInset, DxcQuickNav, DxcNavTabs, DxcFlex, DxcTypography, DxcParagraph, DxcBulletedList, DxcGrid, DxcImage, };
47
+ export { DxcAlert, DxcButton, DxcCheckbox, DxcTextInput, DxcDropdown, DxcSwitch, DxcSlider, DxcTable, DxcTabs, DxcToggleGroup, DxcDialog, DxcCard, DxcProgressBar, DxcAccordion, DxcSpinner, DxcBox, DxcTag, DxcPaginator, DxcWizard, DxcLink, DxcHeading, DxcResultsetTable, DxcChip, DxcApplicationLayout, HalstackContext, HalstackLanguageContext, HalstackProvider, BackgroundColorProvider, DxcAccordionGroup, DxcBadge, DxcPasswordInput, DxcDateInput, DxcNumberInput, DxcTextarea, DxcSelect, DxcFileInput, DxcRadioGroup, DxcBleed, DxcInset, DxcQuickNav, DxcNavTabs, DxcFlex, DxcTypography, DxcParagraph, DxcBulletedList, DxcGrid, DxcImage, DxcContainer, };
package/main.js CHANGED
@@ -1,9 +1,7 @@
1
1
  "use strict";
2
2
 
3
3
  var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
-
5
4
  var _typeof = require("@babel/runtime/helpers/typeof");
6
-
7
5
  Object.defineProperty(exports, "__esModule", {
8
6
  value: true
9
7
  });
@@ -85,6 +83,12 @@ Object.defineProperty(exports, "DxcChip", {
85
83
  return _Chip["default"];
86
84
  }
87
85
  });
86
+ Object.defineProperty(exports, "DxcContainer", {
87
+ enumerable: true,
88
+ get: function get() {
89
+ return _Container["default"];
90
+ }
91
+ });
88
92
  Object.defineProperty(exports, "DxcDateInput", {
89
93
  enumerable: true,
90
94
  get: function get() {
@@ -289,97 +293,51 @@ Object.defineProperty(exports, "HalstackProvider", {
289
293
  return _HalstackContext.HalstackProvider;
290
294
  }
291
295
  });
292
-
293
296
  var _Alert = _interopRequireDefault(require("./alert/Alert"));
294
-
295
297
  var _Accordion = _interopRequireDefault(require("./accordion/Accordion"));
296
-
297
298
  var _Button = _interopRequireDefault(require("./button/Button"));
298
-
299
299
  var _Card = _interopRequireDefault(require("./card/Card"));
300
-
301
300
  var _Checkbox = _interopRequireDefault(require("./checkbox/Checkbox"));
302
-
303
301
  var _Dialog = _interopRequireDefault(require("./dialog/Dialog"));
304
-
305
302
  var _Dropdown = _interopRequireDefault(require("./dropdown/Dropdown"));
306
-
307
303
  var _Slider = _interopRequireDefault(require("./slider/Slider"));
308
-
309
304
  var _Switch = _interopRequireDefault(require("./switch/Switch"));
310
-
311
305
  var _Tabs = _interopRequireDefault(require("./tabs/Tabs"));
312
-
313
306
  var _ProgressBar = _interopRequireDefault(require("./progress-bar/ProgressBar"));
314
-
315
307
  var _Spinner = _interopRequireDefault(require("./spinner/Spinner"));
316
-
317
308
  var _Table = _interopRequireDefault(require("./table/Table"));
318
-
319
309
  var _Box = _interopRequireDefault(require("./box/Box"));
320
-
321
310
  var _Tag = _interopRequireDefault(require("./tag/Tag"));
322
-
323
311
  var _Paginator = _interopRequireDefault(require("./paginator/Paginator"));
324
-
325
312
  var _Wizard = _interopRequireDefault(require("./wizard/Wizard"));
326
-
327
313
  var _Link = _interopRequireDefault(require("./link/Link"));
328
-
329
314
  var _Heading = _interopRequireDefault(require("./heading/Heading"));
330
-
331
- var _ResultsetTable = _interopRequireDefault(require("./resultsetTable/ResultsetTable"));
332
-
315
+ var _ResultsetTable = _interopRequireDefault(require("./resultset-table/ResultsetTable"));
333
316
  var _Chip = _interopRequireDefault(require("./chip/Chip"));
334
-
335
317
  var _ApplicationLayout = _interopRequireDefault(require("./layout/ApplicationLayout"));
336
-
337
318
  var _ToggleGroup = _interopRequireDefault(require("./toggle-group/ToggleGroup"));
338
-
339
319
  var _AccordionGroup = _interopRequireDefault(require("./accordion-group/AccordionGroup"));
340
-
341
320
  var _Badge = _interopRequireDefault(require("./badge/Badge"));
342
-
343
321
  var _TextInput = _interopRequireDefault(require("./text-input/TextInput"));
344
-
345
322
  var _PasswordInput = _interopRequireDefault(require("./password-input/PasswordInput"));
346
-
347
323
  var _DateInput = _interopRequireDefault(require("./date-input/DateInput"));
348
-
349
324
  var _NumberInput = _interopRequireDefault(require("./number-input/NumberInput"));
350
-
351
325
  var _Textarea = _interopRequireDefault(require("./textarea/Textarea"));
352
-
353
326
  var _Select = _interopRequireDefault(require("./select/Select"));
354
-
355
327
  var _FileInput = _interopRequireDefault(require("./file-input/FileInput"));
356
-
357
328
  var _RadioGroup = _interopRequireDefault(require("./radio-group/RadioGroup"));
358
-
359
329
  var _Bleed = _interopRequireDefault(require("./bleed/Bleed"));
360
-
361
330
  var _Inset = _interopRequireDefault(require("./inset/Inset"));
362
-
363
331
  var _QuickNav = _interopRequireDefault(require("./quick-nav/QuickNav"));
364
-
365
332
  var _NavTabs = _interopRequireDefault(require("./nav-tabs/NavTabs"));
366
-
367
333
  var _Flex = _interopRequireDefault(require("./flex/Flex"));
368
-
369
334
  var _Typography = _interopRequireDefault(require("./typography/Typography"));
370
-
371
335
  var _Paragraph = _interopRequireDefault(require("./paragraph/Paragraph"));
372
-
373
336
  var _BulletedList = _interopRequireDefault(require("./bulleted-list/BulletedList"));
374
-
375
337
  var _Grid = _interopRequireDefault(require("./grid/Grid"));
376
-
377
338
  var _Image = _interopRequireDefault(require("./image/Image"));
378
-
339
+ var _Container = _interopRequireDefault(require("./container/Container"));
379
340
  var _HalstackContext = _interopRequireWildcard(require("./HalstackContext"));
380
-
381
341
  var _BackgroundColorContext = require("./BackgroundColorContext");
382
-
383
- function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
384
-
385
- function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
342
+ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
343
+ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
@@ -1,39 +1,24 @@
1
1
  "use strict";
2
2
 
3
3
  var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
-
5
4
  var _typeof = require("@babel/runtime/helpers/typeof");
6
-
7
5
  Object.defineProperty(exports, "__esModule", {
8
6
  value: true
9
7
  });
10
8
  exports["default"] = exports.NavTabsContext = void 0;
11
-
12
9
  var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
13
-
14
10
  var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
15
-
16
11
  var _react = _interopRequireWildcard(require("react"));
17
-
18
12
  var _styledComponents = _interopRequireWildcard(require("styled-components"));
19
-
20
13
  var _useTheme = _interopRequireDefault(require("../useTheme"));
21
-
22
14
  var _Tab = _interopRequireDefault(require("./Tab"));
23
-
24
15
  var _templateObject;
25
-
26
- function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
27
-
28
- function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
29
-
30
- var NavTabsContext = /*#__PURE__*/(0, _react.createContext)(null);
31
- exports.NavTabsContext = NavTabsContext;
32
-
16
+ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
17
+ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
18
+ var NavTabsContext = exports.NavTabsContext = /*#__PURE__*/(0, _react.createContext)(null);
33
19
  var getPropInChild = function getPropInChild(child, propName) {
34
20
  return child.props ? child.props[propName] ? child.props[propName] : child.props.children ? getPropInChild(child.props.children, propName) : undefined : undefined;
35
21
  };
36
-
37
22
  var getLabelFromTab = function getLabelFromTab(child) {
38
23
  if (typeof child === "string") {
39
24
  return child.toString();
@@ -41,39 +26,30 @@ var getLabelFromTab = function getLabelFromTab(child) {
41
26
  return Array.isArray(child.props.children) ? getLabelFromTab(child.props.children[0]) : getLabelFromTab(child.props.children);
42
27
  }
43
28
  };
44
-
45
29
  var getPreviousTabIndex = function getPreviousTabIndex(array, initialIndex) {
46
30
  var index = initialIndex === 0 ? array.length - 1 : initialIndex - 1;
47
-
48
31
  while (getPropInChild(array[index], "disabled")) {
49
32
  index = index === 0 ? array.length - 1 : index - 1;
50
33
  }
51
-
52
34
  return index;
53
35
  };
54
-
55
36
  var getNextTabIndex = function getNextTabIndex(array, initialIndex) {
56
37
  var index = initialIndex === array.length - 1 ? 0 : initialIndex + 1;
57
-
58
38
  while (getPropInChild(array[index], "disabled")) {
59
39
  index = index === array.length - 1 ? 0 : index + 1;
60
40
  }
61
-
62
41
  return index;
63
42
  };
64
-
65
43
  var DxcNavTabs = function DxcNavTabs(_ref) {
66
44
  var _ref$iconPosition = _ref.iconPosition,
67
- iconPosition = _ref$iconPosition === void 0 ? "top" : _ref$iconPosition,
68
- _ref$tabIndex = _ref.tabIndex,
69
- tabIndex = _ref$tabIndex === void 0 ? 0 : _ref$tabIndex,
70
- children = _ref.children;
71
-
45
+ iconPosition = _ref$iconPosition === void 0 ? "top" : _ref$iconPosition,
46
+ _ref$tabIndex = _ref.tabIndex,
47
+ tabIndex = _ref$tabIndex === void 0 ? 0 : _ref$tabIndex,
48
+ children = _ref.children;
72
49
  var _useState = (0, _react.useState)(null),
73
- _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
74
- innerFocusIndex = _useState2[0],
75
- setInnerFocusIndex = _useState2[1];
76
-
50
+ _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
51
+ innerFocusIndex = _useState2[0],
52
+ setInnerFocusIndex = _useState2[1];
77
53
  var colorsTheme = (0, _useTheme["default"])();
78
54
  var contextValue = (0, _react.useMemo)(function () {
79
55
  return {
@@ -82,19 +58,16 @@ var DxcNavTabs = function DxcNavTabs(_ref) {
82
58
  focusedLabel: innerFocusIndex === null ? undefined : getLabelFromTab(children[innerFocusIndex])
83
59
  };
84
60
  }, [iconPosition, tabIndex, innerFocusIndex]);
85
-
86
61
  var handleOnKeyDown = function handleOnKeyDown(event) {
87
62
  var activeTab = _react["default"].Children.toArray(children).findIndex(function (child) {
88
63
  return getPropInChild(child, "active");
89
64
  });
90
-
91
65
  switch (event.key) {
92
66
  case "Left":
93
67
  case "ArrowLeft":
94
68
  event.preventDefault();
95
69
  setInnerFocusIndex(getPreviousTabIndex(children, innerFocusIndex === null ? activeTab : innerFocusIndex));
96
70
  break;
97
-
98
71
  case "Right":
99
72
  case "ArrowRight":
100
73
  event.preventDefault();
@@ -102,7 +75,6 @@ var DxcNavTabs = function DxcNavTabs(_ref) {
102
75
  break;
103
76
  }
104
77
  };
105
-
106
78
  return /*#__PURE__*/_react["default"].createElement(_styledComponents.ThemeProvider, {
107
79
  theme: colorsTheme.navTabs
108
80
  }, /*#__PURE__*/_react["default"].createElement(NavTabsContainer, {
@@ -113,10 +85,6 @@ var DxcNavTabs = function DxcNavTabs(_ref) {
113
85
  value: contextValue
114
86
  }, children)));
115
87
  };
116
-
117
88
  DxcNavTabs.Tab = _Tab["default"];
118
-
119
89
  var NavTabsContainer = _styledComponents["default"].div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n display: flex;\n"])));
120
-
121
- var _default = DxcNavTabs;
122
- exports["default"] = _default;
90
+ var _default = exports["default"] = DxcNavTabs;
@@ -5,7 +5,7 @@ import ExampleContainer from "../../.storybook/components/ExampleContainer";
5
5
  import { HalstackProvider } from "../HalstackContext";
6
6
 
7
7
  export default {
8
- title: "NavTabs",
8
+ title: "Nav Tabs",
9
9
  component: DxcNavTabs,
10
10
  };
11
11
 
@@ -1,28 +1,23 @@
1
1
  "use strict";
2
2
 
3
3
  var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
-
5
4
  var _react = _interopRequireDefault(require("react"));
6
-
7
5
  var _react2 = require("@testing-library/react");
8
-
9
6
  var _NavTabs = _interopRequireDefault(require("./NavTabs.tsx"));
10
-
11
7
  describe("Tabs component tests", function () {
12
8
  test("Tabs render with correct labels and attributes", function () {
13
9
  var _render = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NavTabs["default"], null, /*#__PURE__*/_react["default"].createElement(_NavTabs["default"].Tab, {
14
- href: "/test1",
15
- active: true
16
- }, "Tab 1"), /*#__PURE__*/_react["default"].createElement(_NavTabs["default"].Tab, {
17
- href: "/test2",
18
- disabled: true
19
- }, "Tab 2"), /*#__PURE__*/_react["default"].createElement(_NavTabs["default"].Tab, {
20
- href: "/test3"
21
- }, "Tab 3"))),
22
- getByText = _render.getByText,
23
- getAllByRole = _render.getAllByRole,
24
- getByRole = _render.getByRole;
25
-
10
+ href: "/test1",
11
+ active: true
12
+ }, "Tab 1"), /*#__PURE__*/_react["default"].createElement(_NavTabs["default"].Tab, {
13
+ href: "/test2",
14
+ disabled: true
15
+ }, "Tab 2"), /*#__PURE__*/_react["default"].createElement(_NavTabs["default"].Tab, {
16
+ href: "/test3"
17
+ }, "Tab 3"))),
18
+ getByText = _render.getByText,
19
+ getAllByRole = _render.getAllByRole,
20
+ getByRole = _render.getByRole;
26
21
  expect(getByRole("tablist")).toBeTruthy();
27
22
  expect(getByRole("tablist").getAttribute("aria-label")).toBe("Navigation tabs");
28
23
  expect(getByText("Tab 1")).toBeTruthy();
@@ -41,21 +36,20 @@ describe("Tabs component tests", function () {
41
36
  });
42
37
  test("Tabs render with correct labels, badges and icons", function () {
43
38
  var _render2 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NavTabs["default"], null, /*#__PURE__*/_react["default"].createElement(_NavTabs["default"].Tab, {
44
- href: "/test1",
45
- active: true,
46
- notificationNumber: 10
47
- }, "Tab 1"), /*#__PURE__*/_react["default"].createElement(_NavTabs["default"].Tab, {
48
- href: "/test2",
49
- disabled: true,
50
- notificationNumber: 20
51
- }, "Tab 2"), /*#__PURE__*/_react["default"].createElement(_NavTabs["default"].Tab, {
52
- href: "/test3",
53
- notificationNumber: 1000,
54
- icon: "/testIcon.png"
55
- }, "Tab 3"))),
56
- getByText = _render2.getByText,
57
- getByRole = _render2.getByRole;
58
-
39
+ href: "/test1",
40
+ active: true,
41
+ notificationNumber: 10
42
+ }, "Tab 1"), /*#__PURE__*/_react["default"].createElement(_NavTabs["default"].Tab, {
43
+ href: "/test2",
44
+ disabled: true,
45
+ notificationNumber: 20
46
+ }, "Tab 2"), /*#__PURE__*/_react["default"].createElement(_NavTabs["default"].Tab, {
47
+ href: "/test3",
48
+ notificationNumber: 1000,
49
+ icon: "/testIcon.png"
50
+ }, "Tab 3"))),
51
+ getByText = _render2.getByText,
52
+ getByRole = _render2.getByRole;
59
53
  expect(getByText("10")).toBeTruthy();
60
54
  expect(getByText("20")).toBeTruthy();
61
55
  expect(getByText("+99")).toBeTruthy();
@@ -63,18 +57,17 @@ describe("Tabs component tests", function () {
63
57
  });
64
58
  test("Tabs render with correct tab index", function () {
65
59
  var _render3 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_NavTabs["default"], {
66
- tabIndex: 3
67
- }, /*#__PURE__*/_react["default"].createElement(_NavTabs["default"].Tab, {
68
- href: "/test1"
69
- }, "Tab 1"), /*#__PURE__*/_react["default"].createElement(_NavTabs["default"].Tab, {
70
- href: "/test2",
71
- disabled: true
72
- }, "Tab 2"), /*#__PURE__*/_react["default"].createElement(_NavTabs["default"].Tab, {
73
- href: "/test3",
74
- active: true
75
- }, "Tab 3"))),
76
- getAllByRole = _render3.getAllByRole;
77
-
60
+ tabIndex: 3
61
+ }, /*#__PURE__*/_react["default"].createElement(_NavTabs["default"].Tab, {
62
+ href: "/test1"
63
+ }, "Tab 1"), /*#__PURE__*/_react["default"].createElement(_NavTabs["default"].Tab, {
64
+ href: "/test2",
65
+ disabled: true
66
+ }, "Tab 2"), /*#__PURE__*/_react["default"].createElement(_NavTabs["default"].Tab, {
67
+ href: "/test3",
68
+ active: true
69
+ }, "Tab 3"))),
70
+ getAllByRole = _render3.getAllByRole;
78
71
  var tabs = getAllByRole("link");
79
72
  expect(tabs[0].getAttribute("tabindex")).toBe("-1");
80
73
  expect(tabs[1].getAttribute("tabindex")).toBe("3");
package/nav-tabs/Tab.js CHANGED
@@ -1,70 +1,48 @@
1
1
  "use strict";
2
2
 
3
3
  var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
-
5
4
  var _typeof = require("@babel/runtime/helpers/typeof");
6
-
7
5
  Object.defineProperty(exports, "__esModule", {
8
6
  value: true
9
7
  });
10
8
  exports["default"] = void 0;
11
-
12
9
  var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
13
-
14
10
  var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
15
-
16
11
  var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
17
-
18
12
  var _react = _interopRequireWildcard(require("react"));
19
-
20
13
  var _styledComponents = _interopRequireDefault(require("styled-components"));
21
-
22
14
  var _Badge = _interopRequireDefault(require("../badge/Badge"));
23
-
24
15
  var _Flex = _interopRequireDefault(require("../flex/Flex"));
25
-
26
16
  var _NavTabs = require("./NavTabs");
27
-
28
17
  var _BaseTypography = _interopRequireDefault(require("../utils/BaseTypography"));
29
-
30
18
  var _useTheme = _interopRequireDefault(require("../useTheme"));
31
-
32
19
  var _templateObject, _templateObject2, _templateObject3;
33
-
34
20
  var _excluded = ["href", "active", "icon", "disabled", "notificationNumber", "children"];
35
-
36
- function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
37
-
38
- function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
39
-
21
+ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
22
+ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
40
23
  var DxcTab = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, _ref2) {
41
24
  var href = _ref.href,
42
- _ref$active = _ref.active,
43
- active = _ref$active === void 0 ? false : _ref$active,
44
- icon = _ref.icon,
45
- _ref$disabled = _ref.disabled,
46
- disabled = _ref$disabled === void 0 ? false : _ref$disabled,
47
- _ref$notificationNumb = _ref.notificationNumber,
48
- notificationNumber = _ref$notificationNumb === void 0 ? false : _ref$notificationNumb,
49
- children = _ref.children,
50
- otherProps = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
25
+ _ref$active = _ref.active,
26
+ active = _ref$active === void 0 ? false : _ref$active,
27
+ icon = _ref.icon,
28
+ _ref$disabled = _ref.disabled,
29
+ disabled = _ref$disabled === void 0 ? false : _ref$disabled,
30
+ _ref$notificationNumb = _ref.notificationNumber,
31
+ notificationNumber = _ref$notificationNumb === void 0 ? false : _ref$notificationNumb,
32
+ children = _ref.children,
33
+ otherProps = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
51
34
  var tabRef = (0, _react.useRef)();
52
35
  var colorsTheme = (0, _useTheme["default"])();
53
-
54
36
  var _useContext = (0, _react.useContext)(_NavTabs.NavTabsContext),
55
- iconPosition = _useContext.iconPosition,
56
- tabIndex = _useContext.tabIndex,
57
- focusedLabel = _useContext.focusedLabel;
58
-
37
+ iconPosition = _useContext.iconPosition,
38
+ tabIndex = _useContext.tabIndex,
39
+ focusedLabel = _useContext.focusedLabel;
59
40
  (0, _react.useEffect)(function () {
60
41
  var _tabRef$current;
61
-
62
42
  focusedLabel === children.toString() && (tabRef === null || tabRef === void 0 ? void 0 : (_tabRef$current = tabRef.current) === null || _tabRef$current === void 0 ? void 0 : _tabRef$current.focus());
63
43
  }, [focusedLabel]);
64
-
65
44
  var handleOnKeyDown = function handleOnKeyDown(event) {
66
45
  var _tabRef$current2;
67
-
68
46
  switch (event.key) {
69
47
  case " ":
70
48
  case "Enter":
@@ -73,7 +51,6 @@ var DxcTab = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, _ref2) {
73
51
  break;
74
52
  }
75
53
  };
76
-
77
54
  return /*#__PURE__*/_react["default"].createElement(TabContainer, {
78
55
  active: active,
79
56
  role: "tab",
@@ -87,7 +64,6 @@ var DxcTab = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, _ref2) {
87
64
  hasIcon: icon != null ? true : false,
88
65
  ref: function ref(anchorRef) {
89
66
  tabRef.current = anchorRef;
90
-
91
67
  if (_ref2) {
92
68
  if (typeof _ref2 === "function") _ref2(anchorRef);else _ref2.current = anchorRef;
93
69
  }
@@ -115,7 +91,6 @@ var DxcTab = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, _ref2) {
115
91
  disabled: disabled
116
92
  }))));
117
93
  });
118
-
119
94
  var TabContainer = _styledComponents["default"].div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n align-items: stretch;\n border-bottom: 2px solid ", ";\n padding: 0.5rem;\n\n svg {\n color: ", ";\n }\n &[aria-selected=\"true\"] {\n svg {\n color: ", ";\n }\n }\n &[aria-disabled=\"true\"] {\n svg {\n color: ", ";\n }\n }\n"])), function (props) {
120
95
  return props.active ? props.theme.selectedUnderlineColor : props.theme.dividerColor;
121
96
  }, function (props) {
@@ -125,8 +100,7 @@ var TabContainer = _styledComponents["default"].div(_templateObject || (_templat
125
100
  }, function (props) {
126
101
  return props.theme.disabledIconColor;
127
102
  });
128
-
129
- var Tab = _styledComponents["default"].a(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["\n box-sizing: border-box;\n display: flex;\n flex-direction: ", ";\n justify-content: center;\n align-items: center;\n gap: ", ";\n height: ", ";\n min-width: 176px;\n min-height: 44px;\n padding: 0.375rem;\n border-radius: 4px;\n background: ", ";\n text-decoration-color: transparent;\n cursor: ", ";\n\n ", "\n"])), function (props) {
103
+ var Tab = _styledComponents["default"].a(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["\n box-sizing: border-box;\n display: flex;\n flex-direction: ", ";\n justify-content: center;\n align-items: center;\n gap: ", ";\n height: ", ";\n min-width: 176px;\n min-height: 44px;\n padding: 0.375rem;\n border-radius: 4px;\n background: ", ";\n text-decoration-color: transparent;\n text-decoration-line: none;\n cursor: ", ";\n\n ", "\n"])), function (props) {
130
104
  return props.hasIcon && props.iconPosition === "top" ? "column" : "row";
131
105
  }, function (props) {
132
106
  return props.hasIcon && props.iconPosition === "top" ? "0.375rem" : "0.625rem";
@@ -139,8 +113,5 @@ var Tab = _styledComponents["default"].a(_templateObject2 || (_templateObject2 =
139
113
  }, function (props) {
140
114
  return !props.disabled && "\n :hover {\n background: ".concat(props.theme.hoverBackgroundColor, ";\n }\n :focus {\n outline: 2px solid ").concat(props.theme.focusOutline, ";\n }\n :active {\n background: ").concat(props.theme.pressedBackgroundColor, ";\n outline: 2px solid #33aaff};\n }\n ");
141
115
  });
142
-
143
116
  var TabIconContainer = _styledComponents["default"].div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])(["\n display: flex;\n\n img,\n svg {\n height: 24px;\n width: 24px;\n }\n"])));
144
-
145
- var _default = DxcTab;
146
- exports["default"] = _default;
117
+ var _default = exports["default"] = DxcTab;
@@ -1,11 +1,11 @@
1
1
  /// <reference types="react" />
2
- declare type SVG = React.ReactNode & React.SVGProps<SVGSVGElement>;
3
- export declare type NavTabsContextProps = {
2
+ type SVG = React.ReactNode & React.SVGProps<SVGSVGElement>;
3
+ export type NavTabsContextProps = {
4
4
  iconPosition: "top" | "left";
5
5
  tabIndex: number;
6
6
  focusedLabel: string;
7
7
  };
8
- export declare type TabProps = {
8
+ export type TabProps = {
9
9
  /**
10
10
  * Whether the tab is active or not.
11
11
  */
@@ -31,22 +31,22 @@ export declare type TabProps = {
31
31
  */
32
32
  notificationNumber?: boolean | number;
33
33
  /**
34
- * Contains one or more DxcNavTabs.Tab.
34
+ * Tab text label.
35
35
  */
36
36
  children: string;
37
37
  };
38
- declare type Props = {
38
+ type Props = {
39
39
  /**
40
40
  * Whether the icon should appear above or to the left of the label.
41
41
  */
42
42
  iconPosition?: "top" | "left";
43
43
  /**
44
- * Value of the tabindex for each tab.
44
+ * Contains one or more DxcNavTabs.Tab.
45
45
  */
46
- tabIndex?: number;
46
+ children: React.ReactNode;
47
47
  /**
48
- * Content of the tabs nav.
48
+ * Value of the tabindex attribute applied to each tab.
49
49
  */
50
- children: React.ReactNode;
50
+ tabIndex?: number;
51
51
  };
52
52
  export default Props;
@@ -1,6 +1,6 @@
1
1
  import React from "react";
2
2
  import NumberInputPropsType from "./types";
3
- declare type NumberInputContextProps = {
3
+ type NumberInputContextProps = {
4
4
  typeNumber?: string;
5
5
  minNumber?: number;
6
6
  maxNumber?: number;