@dxc-technology/halstack-react 0.0.0-f6d6be5 → 0.0.0-f70a97e

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 (270) hide show
  1. package/BackgroundColorContext.d.ts +1 -10
  2. package/BackgroundColorContext.js +4 -21
  3. package/HalstackContext.d.ts +43 -138
  4. package/HalstackContext.js +10 -35
  5. package/accordion/Accordion.js +23 -63
  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/action-icon/ActionIcon.d.ts +4 -0
  15. package/action-icon/ActionIcon.js +47 -0
  16. package/action-icon/ActionIcon.stories.tsx +41 -0
  17. package/action-icon/ActionIcon.test.js +64 -0
  18. package/action-icon/types.d.ts +26 -0
  19. package/alert/Alert.js +15 -50
  20. package/alert/Alert.test.js +28 -45
  21. package/alert/types.d.ts +5 -5
  22. package/badge/Badge.d.ts +1 -1
  23. package/badge/Badge.js +141 -43
  24. package/badge/Badge.stories.tsx +210 -0
  25. package/badge/Badge.test.js +30 -0
  26. package/badge/types.d.ts +52 -3
  27. package/bleed/Bleed.js +13 -21
  28. package/bleed/types.d.ts +2 -2
  29. package/box/Box.js +11 -33
  30. package/box/Box.test.js +1 -6
  31. package/box/types.d.ts +3 -3
  32. package/bulleted-list/BulletedList.js +18 -54
  33. package/bulleted-list/BulletedList.stories.tsx +1 -92
  34. package/bulleted-list/types.d.ts +5 -5
  35. package/button/Button.js +36 -59
  36. package/button/Button.stories.tsx +33 -132
  37. package/button/Button.test.js +13 -21
  38. package/button/types.d.ts +5 -5
  39. package/card/Card.js +21 -44
  40. package/card/Card.test.js +10 -21
  41. package/card/types.d.ts +5 -5
  42. package/checkbox/Checkbox.js +85 -120
  43. package/checkbox/Checkbox.stories.tsx +16 -54
  44. package/checkbox/Checkbox.test.js +107 -63
  45. package/checkbox/types.d.ts +8 -4
  46. package/chip/Chip.js +12 -31
  47. package/chip/Chip.stories.tsx +1 -1
  48. package/chip/Chip.test.js +15 -28
  49. package/chip/types.d.ts +4 -4
  50. package/common/coreTokens.d.ts +105 -14
  51. package/common/coreTokens.js +40 -23
  52. package/common/utils.js +2 -8
  53. package/common/variables.d.ts +44 -139
  54. package/common/variables.js +55 -157
  55. package/container/Container.d.ts +4 -0
  56. package/container/Container.js +194 -0
  57. package/container/Container.stories.tsx +214 -0
  58. package/container/types.d.ts +74 -0
  59. package/container/types.js +5 -0
  60. package/contextual-menu/ContextualMenu.d.ts +7 -0
  61. package/contextual-menu/ContextualMenu.js +71 -0
  62. package/contextual-menu/ContextualMenu.stories.tsx +182 -0
  63. package/contextual-menu/ContextualMenu.test.js +71 -0
  64. package/contextual-menu/MenuItemAction.d.ts +4 -0
  65. package/contextual-menu/MenuItemAction.js +46 -0
  66. package/contextual-menu/types.d.ts +22 -0
  67. package/contextual-menu/types.js +5 -0
  68. package/date-input/Calendar.js +13 -57
  69. package/date-input/DateInput.js +50 -96
  70. package/date-input/DateInput.stories.tsx +11 -30
  71. package/date-input/DateInput.test.js +674 -701
  72. package/date-input/DatePicker.js +11 -42
  73. package/date-input/Icons.d.ts +6 -6
  74. package/date-input/Icons.js +6 -23
  75. package/date-input/YearPicker.js +8 -34
  76. package/date-input/types.d.ts +28 -22
  77. package/dialog/Dialog.js +13 -40
  78. package/dialog/Dialog.stories.tsx +170 -0
  79. package/dialog/Dialog.test.js +125 -187
  80. package/dialog/types.d.ts +18 -13
  81. package/divider/Divider.d.ts +4 -0
  82. package/divider/Divider.js +36 -0
  83. package/divider/Divider.stories.tsx +223 -0
  84. package/divider/Divider.test.js +38 -0
  85. package/divider/types.d.ts +19 -0
  86. package/divider/types.js +5 -0
  87. package/dropdown/Dropdown.js +48 -100
  88. package/dropdown/Dropdown.test.js +391 -378
  89. package/dropdown/DropdownMenu.js +8 -19
  90. package/dropdown/DropdownMenuItem.js +5 -17
  91. package/dropdown/types.d.ts +18 -20
  92. package/file-input/FileInput.js +180 -248
  93. package/file-input/FileInput.stories.tsx +1 -1
  94. package/file-input/FileInput.test.js +356 -354
  95. package/file-input/FileItem.js +12 -39
  96. package/file-input/types.d.ts +9 -9
  97. package/flex/Flex.js +25 -39
  98. package/flex/types.d.ts +6 -6
  99. package/footer/Footer.d.ts +1 -1
  100. package/footer/Footer.js +38 -65
  101. package/footer/Footer.stories.tsx +19 -0
  102. package/footer/Footer.test.js +18 -32
  103. package/footer/Icons.d.ts +3 -2
  104. package/footer/Icons.js +66 -7
  105. package/footer/types.d.ts +16 -16
  106. package/grid/Grid.js +1 -16
  107. package/grid/types.d.ts +10 -10
  108. package/header/Header.d.ts +1 -1
  109. package/header/Header.js +28 -84
  110. package/header/Header.test.js +12 -25
  111. package/header/Icons.d.ts +2 -2
  112. package/header/Icons.js +2 -7
  113. package/header/types.d.ts +7 -8
  114. package/heading/Heading.js +9 -31
  115. package/heading/Heading.test.js +70 -87
  116. package/heading/types.d.ts +7 -7
  117. package/icon/Icon.d.ts +4 -0
  118. package/icon/Icon.js +33 -0
  119. package/icon/Icon.stories.tsx +26 -0
  120. package/icon/types.d.ts +4 -0
  121. package/icon/types.js +5 -0
  122. package/image/Image.d.ts +2 -2
  123. package/image/Image.js +17 -32
  124. package/image/Image.stories.tsx +3 -1
  125. package/image/types.d.ts +2 -2
  126. package/inset/Inset.js +13 -21
  127. package/inset/types.d.ts +2 -2
  128. package/layout/ApplicationLayout.d.ts +2 -2
  129. package/layout/ApplicationLayout.js +14 -54
  130. package/layout/Icons.d.ts +5 -5
  131. package/layout/Icons.js +1 -5
  132. package/layout/SidenavContext.d.ts +1 -1
  133. package/layout/SidenavContext.js +3 -9
  134. package/layout/types.d.ts +3 -3
  135. package/link/Link.js +21 -42
  136. package/link/Link.test.js +23 -41
  137. package/link/types.d.ts +14 -14
  138. package/main.d.ts +7 -4
  139. package/main.js +32 -60
  140. package/nav-tabs/NavTabs.js +17 -46
  141. package/nav-tabs/NavTabs.stories.tsx +7 -5
  142. package/nav-tabs/NavTabs.test.js +38 -44
  143. package/nav-tabs/Tab.js +22 -50
  144. package/nav-tabs/types.d.ts +9 -9
  145. package/number-input/NumberInput.d.ts +1 -1
  146. package/number-input/NumberInput.js +45 -37
  147. package/number-input/NumberInput.stories.tsx +42 -26
  148. package/number-input/NumberInput.test.js +839 -575
  149. package/number-input/types.d.ts +11 -5
  150. package/package.json +29 -27
  151. package/paginator/Icons.d.ts +5 -5
  152. package/paginator/Icons.js +5 -19
  153. package/paginator/Paginator.js +15 -43
  154. package/paginator/Paginator.test.js +224 -207
  155. package/paginator/types.d.ts +3 -3
  156. package/paragraph/Paragraph.js +3 -19
  157. package/paragraph/Paragraph.stories.tsx +0 -17
  158. package/password-input/Icons.d.ts +3 -3
  159. package/password-input/Icons.js +1 -5
  160. package/password-input/PasswordInput.js +26 -48
  161. package/password-input/PasswordInput.stories.tsx +1 -34
  162. package/password-input/PasswordInput.test.js +153 -129
  163. package/password-input/types.d.ts +8 -7
  164. package/progress-bar/ProgressBar.js +21 -53
  165. package/progress-bar/{ProgressBar.stories.jsx → ProgressBar.stories.tsx} +1 -1
  166. package/progress-bar/ProgressBar.test.js +35 -52
  167. package/progress-bar/types.d.ts +3 -3
  168. package/quick-nav/QuickNav.js +4 -27
  169. package/quick-nav/QuickNav.stories.tsx +1 -1
  170. package/quick-nav/types.d.ts +10 -10
  171. package/radio-group/Radio.d.ts +1 -1
  172. package/radio-group/Radio.js +22 -54
  173. package/radio-group/RadioGroup.js +37 -83
  174. package/radio-group/RadioGroup.stories.tsx +10 -10
  175. package/radio-group/RadioGroup.test.js +504 -470
  176. package/radio-group/types.d.ts +8 -8
  177. package/resultset-table/Icons.d.ts +7 -0
  178. package/{resultsetTable → resultset-table}/Icons.js +1 -5
  179. package/resultset-table/ResultsetTable.d.ts +7 -0
  180. package/{resultsetTable → resultset-table}/ResultsetTable.js +35 -64
  181. package/{resultsetTable → resultset-table}/ResultsetTable.stories.tsx +102 -5
  182. package/{resultsetTable → resultset-table}/ResultsetTable.test.js +138 -92
  183. package/{resultsetTable → resultset-table}/types.d.ts +13 -7
  184. package/resultset-table/types.js +5 -0
  185. package/select/Icons.d.ts +7 -7
  186. package/select/Icons.js +1 -5
  187. package/select/Listbox.js +13 -39
  188. package/select/Option.js +17 -27
  189. package/select/Select.js +87 -163
  190. package/select/Select.test.js +1942 -1800
  191. package/select/types.d.ts +14 -15
  192. package/sidenav/Icons.d.ts +4 -4
  193. package/sidenav/Icons.js +1 -5
  194. package/sidenav/Sidenav.js +28 -69
  195. package/sidenav/Sidenav.test.js +3 -10
  196. package/sidenav/types.d.ts +18 -18
  197. package/slider/Slider.js +68 -125
  198. package/slider/Slider.test.js +107 -103
  199. package/slider/types.d.ts +4 -4
  200. package/spinner/Spinner.js +16 -54
  201. package/spinner/Spinner.test.js +25 -34
  202. package/spinner/types.d.ts +3 -3
  203. package/status-light/StatusLight.d.ts +4 -0
  204. package/status-light/StatusLight.js +51 -0
  205. package/status-light/StatusLight.stories.tsx +74 -0
  206. package/status-light/StatusLight.test.js +25 -0
  207. package/status-light/types.d.ts +17 -0
  208. package/status-light/types.js +5 -0
  209. package/switch/Switch.js +49 -97
  210. package/switch/Switch.stories.tsx +0 -34
  211. package/switch/Switch.test.js +51 -96
  212. package/switch/types.d.ts +4 -4
  213. package/table/DropdownTheme.js +62 -0
  214. package/table/Table.d.ts +6 -2
  215. package/table/Table.js +85 -33
  216. package/table/{Table.stories.jsx → Table.stories.tsx} +304 -2
  217. package/table/Table.test.js +93 -6
  218. package/table/types.d.ts +48 -6
  219. package/tabs/Tab.js +17 -33
  220. package/tabs/Tabs.js +52 -129
  221. package/tabs/Tabs.stories.tsx +1 -1
  222. package/tabs/Tabs.test.js +62 -118
  223. package/tabs/types.d.ts +19 -19
  224. package/tag/Tag.js +21 -51
  225. package/tag/Tag.test.js +19 -30
  226. package/tag/types.d.ts +7 -7
  227. package/text-input/Icons.d.ts +5 -5
  228. package/text-input/Icons.js +1 -5
  229. package/text-input/Suggestion.js +9 -26
  230. package/text-input/Suggestions.d.ts +1 -1
  231. package/text-input/Suggestions.js +15 -65
  232. package/text-input/TextInput.js +192 -284
  233. package/text-input/TextInput.stories.tsx +48 -152
  234. package/text-input/TextInput.test.js +1227 -1194
  235. package/text-input/types.d.ts +25 -17
  236. package/textarea/Textarea.js +67 -109
  237. package/textarea/{Textarea.stories.jsx → Textarea.stories.tsx} +58 -100
  238. package/textarea/Textarea.test.js +150 -179
  239. package/textarea/types.d.ts +9 -5
  240. package/toggle-group/ToggleGroup.js +21 -61
  241. package/toggle-group/ToggleGroup.stories.tsx +1 -1
  242. package/toggle-group/ToggleGroup.test.js +48 -81
  243. package/toggle-group/types.d.ts +10 -10
  244. package/typography/Typography.js +4 -13
  245. package/typography/types.d.ts +1 -1
  246. package/useTheme.d.ts +41 -136
  247. package/useTheme.js +1 -8
  248. package/useTranslatedLabels.js +1 -7
  249. package/utils/BaseTypography.d.ts +2 -2
  250. package/utils/BaseTypography.js +16 -30
  251. package/utils/FocusLock.js +25 -39
  252. package/wizard/Wizard.js +14 -49
  253. package/wizard/Wizard.test.js +53 -80
  254. package/wizard/types.d.ts +7 -7
  255. package/common/OpenSans.css +0 -69
  256. package/common/fonts/OpenSans-Bold.ttf +0 -0
  257. package/common/fonts/OpenSans-BoldItalic.ttf +0 -0
  258. package/common/fonts/OpenSans-ExtraBold.ttf +0 -0
  259. package/common/fonts/OpenSans-ExtraBoldItalic.ttf +0 -0
  260. package/common/fonts/OpenSans-Italic.ttf +0 -0
  261. package/common/fonts/OpenSans-Light.ttf +0 -0
  262. package/common/fonts/OpenSans-LightItalic.ttf +0 -0
  263. package/common/fonts/OpenSans-Regular.ttf +0 -0
  264. package/common/fonts/OpenSans-SemiBold.ttf +0 -0
  265. package/common/fonts/OpenSans-SemiBoldItalic.ttf +0 -0
  266. package/resultsetTable/Icons.d.ts +0 -7
  267. package/resultsetTable/ResultsetTable.d.ts +0 -4
  268. package/slider/Slider.stories.tsx +0 -240
  269. /package/{resultsetTable → action-icon}/types.js +0 -0
  270. /package/spinner/{Spinner.stories.jsx → Spinner.stories.tsx} +0 -0
@@ -1,55 +1,37 @@
1
1
  "use strict";
2
2
 
3
3
  var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
-
5
4
  var _typeof3 = 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 _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
13
-
14
10
  var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
15
-
16
11
  var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
17
-
18
12
  var _react = _interopRequireWildcard(require("react"));
19
-
20
13
  var _styledComponents = _interopRequireWildcard(require("styled-components"));
21
-
22
14
  var _variables = require("../common/variables");
23
-
24
15
  var _useTheme = _interopRequireDefault(require("../useTheme"));
25
-
26
- var _BackgroundColorContext = _interopRequireDefault(require("../BackgroundColorContext"));
27
-
28
16
  var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8;
29
-
30
- 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); }
31
-
32
- function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof3(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; }
33
-
17
+ 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); }
18
+ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof3(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; }
34
19
  var DxcProgressBar = function DxcProgressBar(_ref) {
35
20
  var _ref$label = _ref.label,
36
- label = _ref$label === void 0 ? "" : _ref$label,
37
- _ref$helperText = _ref.helperText,
38
- helperText = _ref$helperText === void 0 ? "" : _ref$helperText,
39
- _ref$overlay = _ref.overlay,
40
- overlay = _ref$overlay === void 0 ? false : _ref$overlay,
41
- value = _ref.value,
42
- _ref$showValue = _ref.showValue,
43
- showValue = _ref$showValue === void 0 ? false : _ref$showValue,
44
- margin = _ref.margin;
21
+ label = _ref$label === void 0 ? "" : _ref$label,
22
+ _ref$helperText = _ref.helperText,
23
+ helperText = _ref$helperText === void 0 ? "" : _ref$helperText,
24
+ _ref$overlay = _ref.overlay,
25
+ overlay = _ref$overlay === void 0 ? false : _ref$overlay,
26
+ value = _ref.value,
27
+ _ref$showValue = _ref.showValue,
28
+ showValue = _ref$showValue === void 0 ? false : _ref$showValue,
29
+ margin = _ref.margin;
45
30
  var colorsTheme = (0, _useTheme["default"])();
46
- var backgroundType = (0, _react.useContext)(_BackgroundColorContext["default"]);
47
-
48
31
  var _useState = (0, _react.useState)(0),
49
- _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
50
- valueProgressBar = _useState2[0],
51
- setValueProgressBar = _useState2[1];
52
-
32
+ _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
33
+ valueProgressBar = _useState2[0],
34
+ setValueProgressBar = _useState2[1];
53
35
  (0, _react.useEffect)(function () {
54
36
  setValueProgressBar(value === null || value === undefined || value < 0 ? 0 : value >= 0 && value <= 100 ? value : 100);
55
37
  }, [value]);
@@ -62,34 +44,28 @@ var DxcProgressBar = function DxcProgressBar(_ref) {
62
44
  margin: margin
63
45
  }, /*#__PURE__*/_react["default"].createElement(InfoProgressBar, null, /*#__PURE__*/_react["default"].createElement(ProgressBarLabel, {
64
46
  overlay: overlay,
65
- backgroundType: backgroundType,
66
47
  "aria-label": label || undefined
67
48
  }, label), /*#__PURE__*/_react["default"].createElement(ProgressBarProgress, {
68
49
  overlay: overlay,
69
50
  showValue: showValue,
70
- backgroundType: backgroundType,
71
51
  value: valueProgressBar
72
52
  }, valueProgressBar, " %")), /*#__PURE__*/_react["default"].createElement(LinearProgress, {
73
53
  role: "progressbar",
74
54
  helperText: helperText,
75
55
  "aria-valuenow": showValue ? valueProgressBar : undefined
76
56
  }, /*#__PURE__*/_react["default"].createElement(LinearProgressBar, {
77
- backgroundType: backgroundType,
78
57
  variant: value === null || value === undefined ? "indeterminate" : "determinate",
79
58
  container: "first",
80
59
  value: valueProgressBar
81
60
  })), helperText && /*#__PURE__*/_react["default"].createElement(HelperText, {
82
- overlay: overlay,
83
- backgroundType: backgroundType
61
+ overlay: overlay
84
62
  }, helperText))));
85
63
  };
86
-
87
64
  var BackgroundProgressBar = _styledComponents["default"].div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n ", "\n display: flex;\n flex-wrap: wrap;\n min-width: 100px;\n width: 100%;\n"])), function (_ref2) {
88
65
  var overlay = _ref2.overlay,
89
- theme = _ref2.theme;
66
+ theme = _ref2.theme;
90
67
  return overlay ? "background-color: ".concat(theme.overlayColor, ";\n width: 100%;\n justify-content: center;\n height: 100vh;\n align-items: center;\n max-width: 100%;\n position: fixed;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n z-index: 1300;") : "background-color: \"transparent\";";
91
68
  });
92
-
93
69
  var ProgressBarContainer = _styledComponents["default"].div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["\n z-index: ", ";\n width: ", ";\n margin: ", ";\n margin-top: ", ";\n margin-right: ", ";\n margin-bottom: ", ";\n margin-left: ", ";\n"])), function (props) {
94
70
  return props.overlay === true && "100" || "0";
95
71
  }, function (props) {
@@ -105,9 +81,7 @@ var ProgressBarContainer = _styledComponents["default"].div(_templateObject2 ||
105
81
  }, function (props) {
106
82
  return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.left ? _variables.spaces[props.margin.left] : "";
107
83
  });
108
-
109
84
  var InfoProgressBar = _styledComponents["default"].div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])(["\n display: flex;\n flex-direction: row;\n width: 685px;\n flex-wrap: wrap;\n width: 100%;\n margin-bottom: 8px;\n align-items: baseline;\n justify-content: space-between;\n"])));
110
-
111
85
  var ProgressBarLabel = _styledComponents["default"].div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2["default"])(["\n font-family: ", ";\n font-style: ", ";\n font-size: ", ";\n font-weight: ", ";\n text-transform: ", ";\n color: ", ";\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n text-overflow: ellipsis;\n"])), function (props) {
112
86
  return props.theme.labelFontFamily;
113
87
  }, function (props) {
@@ -119,9 +93,8 @@ var ProgressBarLabel = _styledComponents["default"].div(_templateObject4 || (_te
119
93
  }, function (props) {
120
94
  return props.theme.labelFontTextTransform;
121
95
  }, function (props) {
122
- return props.backgroundType === "dark" ? props.theme.labelFontColorOnDark : props.overlay === true ? props.theme.overlayFontColor : props.theme.labelFontColor;
96
+ return props.overlay === true ? props.theme.overlayFontColor : props.theme.labelFontColor;
123
97
  });
124
-
125
98
  var ProgressBarProgress = _styledComponents["default"].div(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2["default"])(["\n font-family: ", ";\n font-style: ", ";\n font-size: ", ";\n font-weight: ", ";\n text-transform: ", ";\n color: ", ";\n display: ", ";\n flex-shrink: 0;\n"])), function (props) {
126
99
  return props.theme.valueFontFamily;
127
100
  }, function (props) {
@@ -133,13 +106,12 @@ var ProgressBarProgress = _styledComponents["default"].div(_templateObject5 || (
133
106
  }, function (props) {
134
107
  return props.theme.valueFontTextTransform;
135
108
  }, function (props) {
136
- return props.backgroundType === "dark" ? props.theme.valueFontColorOnDark : props.overlay === true ? props.theme.overlayFontColor : props.theme.valueFontColor;
109
+ return props.overlay === true ? props.theme.overlayFontColor : props.theme.valueFontColor;
137
110
  }, function (props) {
138
111
  return props.value !== undefined && props.value !== null && props.showValue === true && "block" || "none";
139
112
  });
140
-
141
113
  var HelperText = _styledComponents["default"].span(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2["default"])(["\n color: ", ";\n font-family: ", ";\n font-size: ", ";\n font-style: ", ";\n font-weight: ", ";\n line-height: 1.5em;\n"])), function (props) {
142
- return props.backgroundType === "dark" ? props.theme.helperTextFontColorOnDark : props.overlay === true ? props.theme.overlayFontColor : props.theme.helperTextFontColor;
114
+ return props.overlay === true ? props.theme.overlayFontColor : props.theme.helperTextFontColor;
143
115
  }, function (props) {
144
116
  return props.theme.helperTextFontFamily;
145
117
  }, function (props) {
@@ -149,7 +121,6 @@ var HelperText = _styledComponents["default"].span(_templateObject6 || (_templat
149
121
  }, function (props) {
150
122
  return props.theme.helperTextFontWeight;
151
123
  });
152
-
153
124
  var LinearProgress = _styledComponents["default"].div(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2["default"])(["\n height: ", ";\n background-color: ", ";\n border-radius: ", ";\n margin-bottom: ", ";\n overflow: hidden;\n position: relative;\n"])), function (props) {
154
125
  return props.theme.thickness;
155
126
  }, function (props) {
@@ -159,9 +130,8 @@ var LinearProgress = _styledComponents["default"].div(_templateObject7 || (_temp
159
130
  }, function (props) {
160
131
  return props.helperText !== "" && "8px";
161
132
  });
162
-
163
133
  var LinearProgressBar = _styledComponents["default"].span(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2["default"])(["\n background-color: ", ";\n transform: ", ";\n top: 0;\n left: 0;\n width: 100%;\n bottom: 0;\n position: absolute;\n transition: ", ";\n transform-origin: left;\n ", ";\n ", ";\n\n @keyframes keyframes-indeterminate-first {\n 0% {\n left: -35%;\n right: 100%;\n }\n 60% {\n left: 100%;\n right: -90%;\n }\n 100% {\n left: 100%;\n right: -90%;\n }\n }\n\n @keyframes keyframes-indeterminate-second {\n 0% {\n left: -200%;\n right: 100%;\n }\n 60% {\n left: 107%;\n right: -8%;\n }\n 100% {\n left: 107%;\n right: -8%;\n }\n }\n"])), function (props) {
164
- return props.backgroundType === "dark" ? props.theme.trackLineColorOnDark : props.theme.trackLineColor;
134
+ return props.theme.trackLineColor;
165
135
  }, function (props) {
166
136
  return "translateX(-".concat(props.variant === "determinate" ? 100 - props.value : 0, "%)");
167
137
  }, function (props) {
@@ -171,6 +141,4 @@ var LinearProgressBar = _styledComponents["default"].span(_templateObject8 || (_
171
141
  }, function (props) {
172
142
  return props.variant === "indeterminate" ? props.container === "first" ? "animation: keyframes-indeterminate-first 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite;" : "animation: keyframes-indeterminate-second 2.1s cubic-bezier(0.165, 0.84, 0.44, 1) 1.15s infinite;" : "";
173
143
  });
174
-
175
- var _default = DxcProgressBar;
176
- exports["default"] = _default;
144
+ var _default = exports["default"] = DxcProgressBar;
@@ -5,7 +5,7 @@ import ExampleContainer from "../../.storybook/components/ExampleContainer";
5
5
  import { HalstackProvider } from "../HalstackContext";
6
6
 
7
7
  export default {
8
- title: "ProgressBar",
8
+ title: "Progress Bar",
9
9
  component: DxcProgressBar,
10
10
  };
11
11
 
@@ -1,108 +1,91 @@
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 _ProgressBar = _interopRequireDefault(require("./ProgressBar.tsx"));
10
-
11
7
  describe("ProgressBar component tests", function () {
12
8
  test("ProgressBar renders with label and helperText", function () {
13
9
  var _render = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_ProgressBar["default"], {
14
- label: "test-label",
15
- helperText: "helper-text"
16
- })),
17
- getByText = _render.getByText;
18
-
10
+ label: "test-label",
11
+ helperText: "helper-text"
12
+ })),
13
+ getByText = _render.getByText;
19
14
  expect(getByText("test-label")).toBeTruthy();
20
15
  expect(getByText("helper-text")).toBeTruthy();
21
16
  });
22
17
  test("ProgressBar renders with default value", function () {
23
18
  var value = 0;
24
-
25
19
  var _render2 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_ProgressBar["default"], {
26
- showValue: true
27
- })),
28
- getByText = _render2.getByText,
29
- getByRole = _render2.getByRole;
30
-
20
+ showValue: true
21
+ })),
22
+ getByText = _render2.getByText,
23
+ getByRole = _render2.getByRole;
31
24
  var progressBar = getByRole("progressbar");
32
25
  expect(getByText("0 %")).toBeTruthy();
33
26
  expect(progressBar.getAttribute("aria-valuenow")).toEqual(value.toString());
34
27
  });
35
28
  test("ProgressBar renders with value", function () {
36
29
  var value = 25;
37
-
38
30
  var _render3 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_ProgressBar["default"], {
39
- showValue: true,
40
- value: value
41
- })),
42
- getByText = _render3.getByText,
43
- getByRole = _render3.getByRole;
44
-
31
+ showValue: true,
32
+ value: value
33
+ })),
34
+ getByText = _render3.getByText,
35
+ getByRole = _render3.getByRole;
45
36
  var progressBar = getByRole("progressbar");
46
37
  expect(getByText("25 %")).toBeTruthy();
47
38
  expect(progressBar.getAttribute("aria-valuenow")).toEqual(value.toString());
48
39
  });
49
40
  test("ProgressBar renders with negative value", function () {
50
41
  var value = 0;
51
-
52
42
  var _render4 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_ProgressBar["default"], {
53
- showValue: true,
54
- value: -20
55
- })),
56
- getByText = _render4.getByText,
57
- getByRole = _render4.getByRole;
58
-
43
+ showValue: true,
44
+ value: -20
45
+ })),
46
+ getByText = _render4.getByText,
47
+ getByRole = _render4.getByRole;
59
48
  var progressBar = getByRole("progressbar");
60
49
  expect(getByText("0 %")).toBeTruthy();
61
50
  expect(progressBar.getAttribute("aria-valuenow")).toEqual(value.toString());
62
51
  });
63
52
  test("ProgressBar renders as indeterminate", function () {
64
53
  var _render5 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_ProgressBar["default"], null)),
65
- getByRole = _render5.getByRole;
66
-
54
+ getByRole = _render5.getByRole;
67
55
  var progressBar = getByRole("progressbar");
68
56
  expect(progressBar.getAttribute("aria-valuenow")).toBe(null);
69
57
  });
70
58
  test("Overlay progressBar renders with label and helperText", function () {
71
59
  var _render6 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_ProgressBar["default"], {
72
- label: "test-label",
73
- helperText: "helper-text",
74
- overlay: true
75
- })),
76
- getByText = _render6.getByText;
77
-
60
+ label: "test-label",
61
+ helperText: "helper-text",
62
+ overlay: true
63
+ })),
64
+ getByText = _render6.getByText;
78
65
  expect(getByText("test-label")).toBeTruthy();
79
66
  expect(getByText("helper-text")).toBeTruthy();
80
67
  });
81
68
  test("Overlay progressBar renders with default value", function () {
82
69
  var value = 0;
83
-
84
70
  var _render7 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_ProgressBar["default"], {
85
- showValue: true,
86
- overlay: true
87
- })),
88
- getByText = _render7.getByText,
89
- getByRole = _render7.getByRole;
90
-
71
+ showValue: true,
72
+ overlay: true
73
+ })),
74
+ getByText = _render7.getByText,
75
+ getByRole = _render7.getByRole;
91
76
  var progressBar = getByRole("progressbar");
92
77
  expect(getByText("0 %")).toBeTruthy();
93
78
  expect(progressBar.getAttribute("aria-valuenow")).toEqual(value.toString());
94
79
  });
95
80
  test("Overlay progressBar renders with value", function () {
96
81
  var value = 25;
97
-
98
82
  var _render8 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_ProgressBar["default"], {
99
- showValue: true,
100
- value: value,
101
- overlay: true
102
- })),
103
- getByText = _render8.getByText,
104
- getByRole = _render8.getByRole;
105
-
83
+ showValue: true,
84
+ value: value,
85
+ overlay: true
86
+ })),
87
+ getByText = _render8.getByText,
88
+ getByRole = _render8.getByRole;
106
89
  var progressBar = getByRole("progressbar");
107
90
  expect(getByText("25 %")).toBeTruthy();
108
91
  expect(progressBar.getAttribute("aria-valuenow")).toEqual(value.toString());
@@ -1,11 +1,11 @@
1
- declare type Space = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
2
- declare type Size = {
1
+ type Space = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
2
+ type Size = {
3
3
  top?: Space;
4
4
  bottom?: Space;
5
5
  left?: Space;
6
6
  right?: Space;
7
7
  };
8
- declare type Props = {
8
+ type Props = {
9
9
  /**
10
10
  * Text to be placed above the progress bar.
11
11
  */
@@ -1,43 +1,27 @@
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 _react = _interopRequireDefault(require("react"));
15
-
16
11
  var _styledComponents = _interopRequireWildcard(require("styled-components"));
17
-
18
12
  var _slugify = _interopRequireDefault(require("slugify"));
19
-
20
13
  var _useTheme = _interopRequireDefault(require("../useTheme"));
21
-
22
14
  var _Heading = _interopRequireDefault(require("../heading/Heading"));
23
-
24
15
  var _Flex = _interopRequireDefault(require("../flex/Flex"));
25
-
26
16
  var _Inset = _interopRequireDefault(require("../inset/Inset"));
27
-
28
17
  var _Typography = _interopRequireDefault(require("../typography/Typography"));
29
-
30
18
  var _useTranslatedLabels = _interopRequireDefault(require("../useTranslatedLabels"));
31
-
32
19
  var _templateObject, _templateObject2, _templateObject3, _templateObject4;
33
-
34
- 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); }
35
-
36
- 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; }
37
-
20
+ 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); }
21
+ 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; }
38
22
  var DxcQuickNav = function DxcQuickNav(_ref) {
39
23
  var title = _ref.title,
40
- links = _ref.links;
24
+ links = _ref.links;
41
25
  var translatedLabels = (0, _useTranslatedLabels["default"])();
42
26
  var colorsTheme = (0, _useTheme["default"])();
43
27
  return /*#__PURE__*/_react["default"].createElement(_styledComponents.ThemeProvider, {
@@ -50,7 +34,6 @@ var DxcQuickNav = function DxcQuickNav(_ref) {
50
34
  text: title || translatedLabels.quickNav.contentTitle
51
35
  }), /*#__PURE__*/_react["default"].createElement(ListColumn, null, links.map(function (link) {
52
36
  var _link$links;
53
-
54
37
  return /*#__PURE__*/_react["default"].createElement("li", {
55
38
  key: link.label
56
39
  }, /*#__PURE__*/_react["default"].createElement(_Inset["default"], {
@@ -74,7 +57,6 @@ var DxcQuickNav = function DxcQuickNav(_ref) {
74
57
  })))));
75
58
  })))));
76
59
  };
77
-
78
60
  var QuickNavContainer = _styledComponents["default"].div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n padding-top: ", ";\n padding-bottom: ", ";\n padding-left: ", ";\n padding-right: ", ";\n border-left: 2px solid ", ";\n"])), function (props) {
79
61
  return props.theme.paddingTop;
80
62
  }, function (props) {
@@ -86,11 +68,8 @@ var QuickNavContainer = _styledComponents["default"].div(_templateObject || (_te
86
68
  }, function (props) {
87
69
  return props.theme.dividerBorderColor;
88
70
  });
89
-
90
71
  var ListColumn = _styledComponents["default"].ul(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["\n display: flex;\n flex-direction: column;\n gap: 0.5rem;\n margin: 0;\n padding: 0;\n list-style-type: none;\n"])));
91
-
92
72
  var ListSecondColumn = _styledComponents["default"].ul(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])(["\n display: flex;\n flex-direction: column;\n margin: 0;\n padding: 0;\n list-style-type: none;\n"])));
93
-
94
73
  var Link = _styledComponents["default"].a(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2["default"])(["\n text-decoration: none;\n font-size: ", ";\n font-family: ", ";\n font-style: ", ";\n font-weight: ", ";\n color: ", ";\n display: block;\n text-overflow: ellipsis;\n white-space: nowrap;\n overflow: hidden;\n width: fit-content;\n max-width: 100%;\n\n &:hover {\n color: ", ";\n }\n &:focus {\n outline-color: ", ";\n outline-style: ", ";\n outline-width: ", ";\n border-radius: ", ";\n }\n"])), function (props) {
95
74
  return props.theme.fontSize;
96
75
  }, function (props) {
@@ -112,6 +91,4 @@ var Link = _styledComponents["default"].a(_templateObject4 || (_templateObject4
112
91
  }, function (props) {
113
92
  return props.theme.focusBorderRadius;
114
93
  });
115
-
116
- var _default = DxcQuickNav;
117
- exports["default"] = _default;
94
+ var _default = exports["default"] = DxcQuickNav;
@@ -8,7 +8,7 @@ import ExampleContainer from "../../.storybook/components/ExampleContainer";
8
8
  import { HalstackProvider } from "../HalstackContext";
9
9
 
10
10
  export default {
11
- title: "QuickNav",
11
+ title: "Quick Nav",
12
12
  component: DxcQuickNav,
13
13
  };
14
14
 
@@ -1,21 +1,21 @@
1
- declare type Props = {
1
+ type Link = {
2
2
  /**
3
- * Title of the quick nav component.
3
+ * Label to be shown in the link.
4
4
  */
5
- title?: string;
5
+ label: string;
6
6
  /**
7
- * Links to be shown inside the quick nav component.
7
+ * Sublinks of the link.
8
8
  */
9
- links: LinkType[];
9
+ links?: Link[];
10
10
  };
11
- declare type LinkType = {
11
+ type Props = {
12
12
  /**
13
- * Label to be shown in the link.
13
+ * Title of the quick nav component.
14
14
  */
15
- label: string;
15
+ title?: string;
16
16
  /**
17
- * Sublinks of the link.
17
+ * Links to be shown inside the quick nav component.
18
18
  */
19
- links?: LinkType[];
19
+ links: Link[];
20
20
  };
21
21
  export default Props;
@@ -1,4 +1,4 @@
1
1
  import React from "react";
2
2
  import { RadioProps } from "./types";
3
- declare const _default: React.MemoExoticComponent<({ label, checked, onClick, error, disabled, focused, readonly, tabIndex, }: RadioProps) => JSX.Element>;
3
+ declare const _default: React.MemoExoticComponent<({ label, checked, onClick, error, disabled, focused, readOnly, tabIndex, }: RadioProps) => JSX.Element>;
4
4
  export default _default;