@dxc-technology/halstack-react 0.0.0-dcd93c4 → 0.0.0-dd6acd7

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 (315) hide show
  1. package/README.md +46 -0
  2. package/dist/index.d.mts +6518 -0
  3. package/dist/index.d.ts +6518 -0
  4. package/dist/index.js +13484 -0
  5. package/dist/index.mjs +13427 -0
  6. package/package.json +69 -72
  7. package/BackgroundColorContext.d.ts +0 -10
  8. package/BackgroundColorContext.js +0 -47
  9. package/HalstackContext.d.ts +0 -12
  10. package/HalstackContext.js +0 -295
  11. package/accordion/Accordion.d.ts +0 -4
  12. package/accordion/Accordion.js +0 -226
  13. package/accordion/Accordion.stories.tsx +0 -307
  14. package/accordion/Accordion.test.js +0 -72
  15. package/accordion/types.d.ts +0 -68
  16. package/accordion/types.js +0 -5
  17. package/accordion-group/AccordionGroup.d.ts +0 -7
  18. package/accordion-group/AccordionGroup.js +0 -169
  19. package/accordion-group/AccordionGroup.stories.tsx +0 -225
  20. package/accordion-group/AccordionGroup.test.js +0 -151
  21. package/accordion-group/types.d.ts +0 -72
  22. package/accordion-group/types.js +0 -5
  23. package/alert/Alert.d.ts +0 -4
  24. package/alert/Alert.js +0 -293
  25. package/alert/Alert.stories.tsx +0 -170
  26. package/alert/Alert.test.js +0 -92
  27. package/alert/types.d.ts +0 -49
  28. package/alert/types.js +0 -5
  29. package/badge/Badge.d.ts +0 -4
  30. package/badge/Badge.js +0 -61
  31. package/badge/types.d.ts +0 -5
  32. package/badge/types.js +0 -5
  33. package/bleed/Bleed.d.ts +0 -3
  34. package/bleed/Bleed.js +0 -51
  35. package/bleed/Bleed.stories.tsx +0 -341
  36. package/bleed/types.d.ts +0 -37
  37. package/bleed/types.js +0 -5
  38. package/box/Box.d.ts +0 -4
  39. package/box/Box.js +0 -116
  40. package/box/Box.stories.tsx +0 -132
  41. package/box/Box.test.js +0 -18
  42. package/box/types.d.ts +0 -43
  43. package/box/types.js +0 -5
  44. package/button/Button.d.ts +0 -4
  45. package/button/Button.js +0 -174
  46. package/button/Button.stories.tsx +0 -274
  47. package/button/Button.test.js +0 -35
  48. package/button/types.d.ts +0 -53
  49. package/button/types.js +0 -5
  50. package/card/Card.d.ts +0 -4
  51. package/card/Card.js +0 -161
  52. package/card/Card.stories.tsx +0 -201
  53. package/card/Card.test.js +0 -50
  54. package/card/ice-cream.jpg +0 -0
  55. package/card/types.d.ts +0 -67
  56. package/card/types.js +0 -5
  57. package/checkbox/Checkbox.d.ts +0 -4
  58. package/checkbox/Checkbox.js +0 -257
  59. package/checkbox/Checkbox.stories.tsx +0 -188
  60. package/checkbox/Checkbox.test.js +0 -78
  61. package/checkbox/types.d.ts +0 -64
  62. package/checkbox/types.js +0 -5
  63. package/chip/Chip.d.ts +0 -4
  64. package/chip/Chip.js +0 -161
  65. package/chip/Chip.stories.tsx +0 -119
  66. package/chip/Chip.test.js +0 -56
  67. package/chip/types.d.ts +0 -45
  68. package/chip/types.js +0 -5
  69. package/common/OpenSans.css +0 -81
  70. package/common/RequiredComponent.js +0 -32
  71. package/common/fonts/OpenSans-Bold.ttf +0 -0
  72. package/common/fonts/OpenSans-BoldItalic.ttf +0 -0
  73. package/common/fonts/OpenSans-ExtraBold.ttf +0 -0
  74. package/common/fonts/OpenSans-ExtraBoldItalic.ttf +0 -0
  75. package/common/fonts/OpenSans-Italic.ttf +0 -0
  76. package/common/fonts/OpenSans-Light.ttf +0 -0
  77. package/common/fonts/OpenSans-LightItalic.ttf +0 -0
  78. package/common/fonts/OpenSans-Regular.ttf +0 -0
  79. package/common/fonts/OpenSans-SemiBold.ttf +0 -0
  80. package/common/fonts/OpenSans-SemiBoldItalic.ttf +0 -0
  81. package/common/utils.js +0 -22
  82. package/common/variables.js +0 -1470
  83. package/date-input/DateInput.d.ts +0 -4
  84. package/date-input/DateInput.js +0 -372
  85. package/date-input/DateInput.stories.tsx +0 -138
  86. package/date-input/DateInput.test.js +0 -479
  87. package/date-input/types.d.ts +0 -107
  88. package/date-input/types.js +0 -5
  89. package/dialog/Dialog.d.ts +0 -4
  90. package/dialog/Dialog.js +0 -138
  91. package/dialog/Dialog.stories.tsx +0 -212
  92. package/dialog/Dialog.test.js +0 -40
  93. package/dialog/types.d.ts +0 -43
  94. package/dialog/types.js +0 -5
  95. package/dropdown/Dropdown.d.ts +0 -4
  96. package/dropdown/Dropdown.js +0 -391
  97. package/dropdown/Dropdown.stories.tsx +0 -249
  98. package/dropdown/Dropdown.test.js +0 -189
  99. package/dropdown/types.d.ts +0 -80
  100. package/dropdown/types.js +0 -5
  101. package/file-input/FileInput.d.ts +0 -4
  102. package/file-input/FileInput.js +0 -593
  103. package/file-input/FileInput.stories.tsx +0 -507
  104. package/file-input/FileInput.test.js +0 -457
  105. package/file-input/FileItem.d.ts +0 -14
  106. package/file-input/FileItem.js +0 -186
  107. package/file-input/types.d.ts +0 -112
  108. package/file-input/types.js +0 -5
  109. package/footer/Footer.d.ts +0 -4
  110. package/footer/Footer.js +0 -185
  111. package/footer/Footer.stories.tsx +0 -130
  112. package/footer/Footer.test.js +0 -109
  113. package/footer/Icons.d.ts +0 -2
  114. package/footer/Icons.js +0 -77
  115. package/footer/types.d.ts +0 -65
  116. package/footer/types.js +0 -5
  117. package/header/Header.d.ts +0 -7
  118. package/header/Header.js +0 -303
  119. package/header/Header.stories.tsx +0 -172
  120. package/header/Header.test.js +0 -79
  121. package/header/Icons.d.ts +0 -2
  122. package/header/Icons.js +0 -34
  123. package/header/types.d.ts +0 -47
  124. package/header/types.js +0 -5
  125. package/heading/Heading.d.ts +0 -4
  126. package/heading/Heading.js +0 -159
  127. package/heading/Heading.stories.tsx +0 -54
  128. package/heading/Heading.test.js +0 -186
  129. package/heading/types.d.ts +0 -33
  130. package/heading/types.js +0 -5
  131. package/inline/Inline.d.ts +0 -4
  132. package/inline/Inline.js +0 -60
  133. package/inline/Inline.stories.tsx +0 -319
  134. package/inline/types.d.ts +0 -36
  135. package/inline/types.js +0 -5
  136. package/inset/Inset.d.ts +0 -3
  137. package/inset/Inset.js +0 -51
  138. package/inset/Inset.stories.tsx +0 -229
  139. package/inset/types.d.ts +0 -37
  140. package/inset/types.js +0 -5
  141. package/layout/ApplicationLayout.d.ts +0 -11
  142. package/layout/ApplicationLayout.js +0 -199
  143. package/layout/ApplicationLayout.stories.tsx +0 -126
  144. package/layout/Icons.d.ts +0 -5
  145. package/layout/Icons.js +0 -66
  146. package/layout/SidenavContext.d.ts +0 -5
  147. package/layout/SidenavContext.js +0 -19
  148. package/layout/types.d.ts +0 -52
  149. package/layout/types.js +0 -5
  150. package/link/Link.d.ts +0 -4
  151. package/link/Link.js +0 -136
  152. package/link/Link.stories.tsx +0 -186
  153. package/link/Link.test.js +0 -83
  154. package/link/types.d.ts +0 -54
  155. package/link/types.js +0 -5
  156. package/list/List.d.ts +0 -4
  157. package/list/List.js +0 -47
  158. package/list/List.stories.tsx +0 -89
  159. package/list/types.d.ts +0 -7
  160. package/list/types.js +0 -5
  161. package/main.d.ts +0 -48
  162. package/main.js +0 -401
  163. package/number-input/NumberInput.d.ts +0 -4
  164. package/number-input/NumberInput.js +0 -76
  165. package/number-input/NumberInput.stories.tsx +0 -115
  166. package/number-input/NumberInput.test.js +0 -506
  167. package/number-input/NumberInputContext.d.ts +0 -4
  168. package/number-input/NumberInputContext.js +0 -19
  169. package/number-input/numberInputContextTypes.d.ts +0 -19
  170. package/number-input/numberInputContextTypes.js +0 -5
  171. package/number-input/types.d.ts +0 -124
  172. package/number-input/types.js +0 -5
  173. package/paginator/Icons.js +0 -66
  174. package/paginator/Paginator.d.ts +0 -4
  175. package/paginator/Paginator.js +0 -171
  176. package/paginator/Paginator.stories.tsx +0 -63
  177. package/paginator/Paginator.test.js +0 -308
  178. package/paginator/types.d.ts +0 -38
  179. package/paginator/types.js +0 -5
  180. package/password-input/PasswordInput.d.ts +0 -4
  181. package/password-input/PasswordInput.js +0 -166
  182. package/password-input/PasswordInput.stories.tsx +0 -131
  183. package/password-input/PasswordInput.test.js +0 -180
  184. package/password-input/types.d.ts +0 -110
  185. package/password-input/types.js +0 -5
  186. package/progress-bar/ProgressBar.d.ts +0 -4
  187. package/progress-bar/ProgressBar.js +0 -170
  188. package/progress-bar/ProgressBar.stories.jsx +0 -58
  189. package/progress-bar/ProgressBar.test.js +0 -65
  190. package/progress-bar/types.d.ts +0 -37
  191. package/progress-bar/types.js +0 -5
  192. package/quick-nav/QuickNav.d.ts +0 -4
  193. package/quick-nav/QuickNav.js +0 -116
  194. package/quick-nav/QuickNav.stories.tsx +0 -237
  195. package/quick-nav/types.d.ts +0 -21
  196. package/quick-nav/types.js +0 -5
  197. package/radio-group/Radio.d.ts +0 -4
  198. package/radio-group/Radio.js +0 -141
  199. package/radio-group/RadioGroup.d.ts +0 -4
  200. package/radio-group/RadioGroup.js +0 -283
  201. package/radio-group/RadioGroup.stories.tsx +0 -100
  202. package/radio-group/RadioGroup.test.js +0 -695
  203. package/radio-group/types.d.ts +0 -114
  204. package/radio-group/types.js +0 -5
  205. package/resultsetTable/ResultsetTable.d.ts +0 -4
  206. package/resultsetTable/ResultsetTable.js +0 -254
  207. package/resultsetTable/ResultsetTable.stories.tsx +0 -275
  208. package/resultsetTable/ResultsetTable.test.js +0 -348
  209. package/resultsetTable/types.d.ts +0 -67
  210. package/resultsetTable/types.js +0 -5
  211. package/row/Row.d.ts +0 -3
  212. package/row/Row.js +0 -127
  213. package/row/Row.stories.tsx +0 -237
  214. package/row/types.d.ts +0 -28
  215. package/row/types.js +0 -5
  216. package/select/Icons.d.ts +0 -10
  217. package/select/Icons.js +0 -93
  218. package/select/Listbox.d.ts +0 -4
  219. package/select/Listbox.js +0 -175
  220. package/select/Option.d.ts +0 -4
  221. package/select/Option.js +0 -110
  222. package/select/Select.d.ts +0 -4
  223. package/select/Select.js +0 -660
  224. package/select/Select.stories.tsx +0 -626
  225. package/select/Select.test.js +0 -2162
  226. package/select/types.d.ts +0 -212
  227. package/select/types.js +0 -5
  228. package/sidenav/Sidenav.d.ts +0 -9
  229. package/sidenav/Sidenav.js +0 -147
  230. package/sidenav/Sidenav.stories.tsx +0 -182
  231. package/sidenav/Sidenav.test.js +0 -56
  232. package/sidenav/types.d.ts +0 -50
  233. package/sidenav/types.js +0 -5
  234. package/slider/Slider.d.ts +0 -4
  235. package/slider/Slider.js +0 -318
  236. package/slider/Slider.stories.tsx +0 -177
  237. package/slider/Slider.test.js +0 -150
  238. package/slider/types.d.ts +0 -82
  239. package/slider/types.js +0 -5
  240. package/spinner/Spinner.d.ts +0 -4
  241. package/spinner/Spinner.js +0 -250
  242. package/spinner/Spinner.stories.jsx +0 -103
  243. package/spinner/Spinner.test.js +0 -64
  244. package/spinner/types.d.ts +0 -32
  245. package/spinner/types.js +0 -5
  246. package/stack/Stack.d.ts +0 -4
  247. package/stack/Stack.js +0 -56
  248. package/stack/Stack.stories.tsx +0 -263
  249. package/stack/types.d.ts +0 -32
  250. package/stack/types.js +0 -5
  251. package/switch/Switch.d.ts +0 -4
  252. package/switch/Switch.js +0 -195
  253. package/switch/Switch.stories.tsx +0 -160
  254. package/switch/Switch.test.js +0 -98
  255. package/switch/types.d.ts +0 -62
  256. package/switch/types.js +0 -5
  257. package/table/Table.d.ts +0 -4
  258. package/table/Table.js +0 -118
  259. package/table/Table.stories.jsx +0 -277
  260. package/table/Table.test.js +0 -26
  261. package/table/types.d.ts +0 -21
  262. package/table/types.js +0 -5
  263. package/tabs/Tabs.d.ts +0 -4
  264. package/tabs/Tabs.js +0 -211
  265. package/tabs/Tabs.stories.tsx +0 -112
  266. package/tabs/Tabs.test.js +0 -140
  267. package/tabs/types.d.ts +0 -82
  268. package/tabs/types.js +0 -5
  269. package/tabs-nav/NavTabs.d.ts +0 -8
  270. package/tabs-nav/NavTabs.js +0 -125
  271. package/tabs-nav/NavTabs.stories.tsx +0 -170
  272. package/tabs-nav/NavTabs.test.js +0 -82
  273. package/tabs-nav/Tab.d.ts +0 -4
  274. package/tabs-nav/Tab.js +0 -132
  275. package/tabs-nav/types.d.ts +0 -53
  276. package/tabs-nav/types.js +0 -5
  277. package/tag/Tag.d.ts +0 -4
  278. package/tag/Tag.js +0 -183
  279. package/tag/Tag.stories.tsx +0 -142
  280. package/tag/Tag.test.js +0 -60
  281. package/tag/types.d.ts +0 -69
  282. package/tag/types.js +0 -5
  283. package/text/Text.d.ts +0 -7
  284. package/text/Text.js +0 -30
  285. package/text/Text.stories.tsx +0 -19
  286. package/text-input/Suggestion.d.ts +0 -4
  287. package/text-input/Suggestion.js +0 -55
  288. package/text-input/TextInput.d.ts +0 -4
  289. package/text-input/TextInput.js +0 -770
  290. package/text-input/TextInput.stories.tsx +0 -474
  291. package/text-input/TextInput.test.js +0 -1712
  292. package/text-input/types.d.ts +0 -178
  293. package/text-input/types.js +0 -5
  294. package/textarea/Textarea.d.ts +0 -4
  295. package/textarea/Textarea.js +0 -277
  296. package/textarea/Textarea.stories.jsx +0 -157
  297. package/textarea/Textarea.test.js +0 -437
  298. package/textarea/types.d.ts +0 -137
  299. package/textarea/types.js +0 -5
  300. package/toggle-group/ToggleGroup.d.ts +0 -4
  301. package/toggle-group/ToggleGroup.js +0 -215
  302. package/toggle-group/ToggleGroup.stories.tsx +0 -173
  303. package/toggle-group/ToggleGroup.test.js +0 -156
  304. package/toggle-group/types.d.ts +0 -105
  305. package/toggle-group/types.js +0 -5
  306. package/useTheme.d.ts +0 -2
  307. package/useTheme.js +0 -22
  308. package/useTranslatedLabels.d.ts +0 -2
  309. package/useTranslatedLabels.js +0 -20
  310. package/wizard/Wizard.d.ts +0 -4
  311. package/wizard/Wizard.js +0 -292
  312. package/wizard/Wizard.stories.tsx +0 -214
  313. package/wizard/Wizard.test.js +0 -141
  314. package/wizard/types.d.ts +0 -64
  315. package/wizard/types.js +0 -5
@@ -1,170 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
-
5
- var _typeof3 = require("@babel/runtime/helpers/typeof");
6
-
7
- Object.defineProperty(exports, "__esModule", {
8
- value: true
9
- });
10
- exports["default"] = void 0;
11
-
12
- var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
13
-
14
- var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
15
-
16
- var _react = _interopRequireWildcard(require("react"));
17
-
18
- var _styledComponents = _interopRequireWildcard(require("styled-components"));
19
-
20
- var _LinearProgress = _interopRequireDefault(require("@material-ui/core/LinearProgress"));
21
-
22
- var _variables = require("../common/variables.js");
23
-
24
- var _useTheme = _interopRequireDefault(require("../useTheme"));
25
-
26
- var _BackgroundColorContext = _interopRequireDefault(require("../BackgroundColorContext"));
27
-
28
- var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
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
-
34
- var DxcProgressBar = function DxcProgressBar(_ref) {
35
- 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;
45
- var colorsTheme = (0, _useTheme["default"])();
46
- var backgroundType = (0, _react.useContext)(_BackgroundColorContext["default"]);
47
- return /*#__PURE__*/_react["default"].createElement(_styledComponents.ThemeProvider, {
48
- theme: colorsTheme.progressBar
49
- }, /*#__PURE__*/_react["default"].createElement(BackgroundProgressBar, {
50
- overlay: overlay
51
- }, /*#__PURE__*/_react["default"].createElement(DXCProgressBar, {
52
- overlay: overlay,
53
- margin: margin,
54
- backgroundType: backgroundType
55
- }, /*#__PURE__*/_react["default"].createElement(InfoProgressBar, null, /*#__PURE__*/_react["default"].createElement(ProgressBarLabel, {
56
- overlay: overlay,
57
- backgroundType: backgroundType
58
- }, label), /*#__PURE__*/_react["default"].createElement(ProgressBarProgress, {
59
- overlay: overlay,
60
- showValue: showValue,
61
- backgroundType: backgroundType
62
- }, value === null || value === undefined ? 0 : value >= 0 && value <= 100 ? value : value < 0 ? 0 : 100, " %")), /*#__PURE__*/_react["default"].createElement(_LinearProgress["default"], {
63
- variant: showValue ? "determinate" : "indeterminate",
64
- value: value === null || value === undefined ? 0 : value >= 0 && value <= 100 ? value : value < 0 ? 0 : 100
65
- }), helperText && /*#__PURE__*/_react["default"].createElement(HelperText, {
66
- overlay: overlay,
67
- backgroundType: backgroundType
68
- }, helperText))));
69
- };
70
-
71
- var BackgroundProgressBar = _styledComponents["default"].div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n background-color: ", ";\n opacity: ", ";\n width: ", ";\n display: flex;\n flex-wrap: wrap;\n justify-content: ", ";\n height: ", ";\n align-items: ", ";\n min-width: 100px;\n max-width: ", ";\n position: ", ";\n top: ", ";\n bottom: ", ";\n left: ", ";\n right: ", ";\n z-index: ", ";\n width: 100%;\n"])), function (props) {
72
- return props.overlay === true ? "".concat(props.theme.overlayColor) : "transparent";
73
- }, function (props) {
74
- return props.overlay === true && "0.8";
75
- }, function (props) {
76
- return props.overlay === true ? "100%" : "";
77
- }, function (props) {
78
- return props.overlay === true ? "center" : "";
79
- }, function (props) {
80
- return props.overlay === true ? "100vh" : "";
81
- }, function (props) {
82
- return props.overlay === true ? "center" : "";
83
- }, function (props) {
84
- return props.overlay === true ? "100%" : "";
85
- }, function (props) {
86
- return props.overlay === true ? "fixed" : "";
87
- }, function (props) {
88
- return props.overlay === true ? "0" : "";
89
- }, function (props) {
90
- return props.overlay === true ? "0" : "";
91
- }, function (props) {
92
- return props.overlay === true ? "0" : "";
93
- }, function (props) {
94
- return props.overlay === true ? "0" : "";
95
- }, function (props) {
96
- return props.overlay ? 1300 : "";
97
- });
98
-
99
- var DXCProgressBar = _styledComponents["default"].div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["\n z-index: ", ";\n width: ", ";\n .MuiLinearProgress-root {\n height: ", ";\n background-color: ", ";\n border-radius: ", ";\n margin-bottom: ", ";\n }\n .MuiLinearProgress-bar {\n background-color: ", ";\n }\n margin: ", ";\n margin-top: ", ";\n margin-right: ", ";\n margin-bottom: ", ";\n margin-left: ", ";\n"])), function (props) {
100
- return props.overlay === true && "100" || "0";
101
- }, function (props) {
102
- return props.overlay === true ? "80%" : "100%";
103
- }, function (props) {
104
- return props.theme.thickness;
105
- }, function (props) {
106
- return props.theme.totalLineColor;
107
- }, function (props) {
108
- return props.theme.borderRadius;
109
- }, function (props) {
110
- return props.helperText !== "" && "8px";
111
- }, function (props) {
112
- return props.backgroundType === "dark" ? props.theme.trackLineColorOnDark : props.theme.trackLineColor;
113
- }, function (props) {
114
- return props.margin && (0, _typeof2["default"])(props.margin) !== "object" ? _variables.spaces[props.margin] : "0px";
115
- }, function (props) {
116
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.top ? _variables.spaces[props.margin.top] : "";
117
- }, function (props) {
118
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.right ? _variables.spaces[props.margin.right] : "";
119
- }, function (props) {
120
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.bottom ? _variables.spaces[props.margin.bottom] : "";
121
- }, function (props) {
122
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.left ? _variables.spaces[props.margin.left] : "";
123
- });
124
-
125
- 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"])));
126
-
127
- 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) {
128
- return props.theme.labelFontFamily;
129
- }, function (props) {
130
- return props.theme.labelFontStyle;
131
- }, function (props) {
132
- return props.theme.labelFontSize;
133
- }, function (props) {
134
- return props.theme.labelFontWeight;
135
- }, function (props) {
136
- return props.theme.labelFontTextTransform;
137
- }, function (props) {
138
- return props.backgroundType === "dark" ? props.theme.labelFontColorOnDark : props.overlay === true ? "#FFFFFF" : props.theme.labelFontColor;
139
- });
140
-
141
- 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) {
142
- return props.theme.valueFontFamily;
143
- }, function (props) {
144
- return props.theme.valueFontStyle;
145
- }, function (props) {
146
- return props.theme.valueFontSize;
147
- }, function (props) {
148
- return props.theme.valueFontWeight;
149
- }, function (props) {
150
- return props.theme.valueFontTextTransform;
151
- }, function (props) {
152
- return props.backgroundType === "dark" ? props.theme.valueFontColorOnDark : props.overlay === true ? "#FFFFFF" : props.theme.valueFontColor;
153
- }, function (props) {
154
- return props.value !== "" && props.showValue === true && "block" || "none";
155
- });
156
-
157
- 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) {
158
- return props.backgroundType === "dark" ? props.theme.helperTextFontColorOnDark : props.overlay === true ? "#FFFFFF" : props.theme.helperTextFontColor;
159
- }, function (props) {
160
- return props.theme.helperTextFontFamily;
161
- }, function (props) {
162
- return props.theme.helperTextFontSize;
163
- }, function (props) {
164
- return props.theme.helperTextFontStyle;
165
- }, function (props) {
166
- return props.theme.helperTextFontWeight;
167
- });
168
-
169
- var _default = DxcProgressBar;
170
- exports["default"] = _default;
@@ -1,58 +0,0 @@
1
- import React from "react";
2
- import DxcProgressBar from "./ProgressBar";
3
- import Title from "../../.storybook/components/Title";
4
- import ExampleContainer from "../../.storybook/components/ExampleContainer";
5
-
6
- export default {
7
- title: "ProgressBar",
8
- component: DxcProgressBar,
9
- };
10
-
11
- export const Chromatic = () => (
12
- <>
13
- <ExampleContainer>
14
- <Title title="Without labels" theme="light" level={4} />
15
- <DxcProgressBar value={50} showValue />
16
- <Title title="With helperText" theme="light" level={4} />
17
- <DxcProgressBar helperText="Helper text" value={50} showValue />
18
- <Title title="Without default value" theme="light" level={4} />
19
- <DxcProgressBar label="Loading..." showValue />
20
- </ExampleContainer>
21
- <Title title="Margins" theme="light" level={2} />
22
- <ExampleContainer>
23
- <Title title="Xxsmall margin" theme="light" level={4} />
24
- <DxcProgressBar label="Margin xxsmall" margin="xxsmall" value={50} showValue />
25
- </ExampleContainer>
26
- <ExampleContainer>
27
- <Title title="Xsmall margin" theme="light" level={4} />
28
- <DxcProgressBar label="Margin xsmall" margin="xsmall" value={50} showValue />
29
- </ExampleContainer>
30
- <ExampleContainer>
31
- <Title title="Small margin" theme="light" level={4} />
32
- <DxcProgressBar label="Margin small" margin="small" value={50} showValue />
33
- </ExampleContainer>
34
- <ExampleContainer>
35
- <Title title="Medium margin" theme="light" level={4} />
36
- <DxcProgressBar label="Margin medium" margin="medium" value={50} showValue />
37
- </ExampleContainer>
38
- <ExampleContainer>
39
- <Title title="Large margin" theme="light" level={4} />
40
- <DxcProgressBar label="Margin large" margin="large" value={50} showValue />
41
- </ExampleContainer>
42
- <ExampleContainer>
43
- <Title title="Xlarge margin" theme="light" level={4} />
44
- <DxcProgressBar label="Margin xlarge" margin="xlarge" value={50} showValue />
45
- </ExampleContainer>
46
- <ExampleContainer>
47
- <Title title="XxLarge margin" theme="light" level={4} />
48
- <DxcProgressBar label="Margin xxlarge" margin="xxlarge" value={50} showValue />
49
- </ExampleContainer>
50
- </>
51
- );
52
-
53
- export const ProgressBarOverlay = () => (
54
- <ExampleContainer>
55
- <Title title="Overlay" theme="dark" level={4} />
56
- <DxcProgressBar label="Overlay" helperText="Helper text" overlay={true} showValue value={50} />
57
- </ExampleContainer>
58
- );
@@ -1,65 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
-
5
- var _react = _interopRequireDefault(require("react"));
6
-
7
- var _react2 = require("@testing-library/react");
8
-
9
- var _ProgressBar = _interopRequireDefault(require("./ProgressBar"));
10
-
11
- describe("ProgressBar component tests", function () {
12
- test("ProgressBar renders with label", function () {
13
- var _render = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_ProgressBar["default"], {
14
- label: "test-label"
15
- })),
16
- getByText = _render.getByText;
17
-
18
- expect(getByText("test-label")).toBeTruthy();
19
- });
20
- test("Overlay progressBar renders with label", function () {
21
- var _render2 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_ProgressBar["default"], {
22
- label: "test-label",
23
- overlay: true
24
- })),
25
- getByText = _render2.getByText;
26
-
27
- expect(getByText("test-label")).toBeTruthy();
28
- });
29
- test("ProgressBar renders with default value", function () {
30
- var _render3 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_ProgressBar["default"], {
31
- showValue: true
32
- })),
33
- getByText = _render3.getByText;
34
-
35
- expect(getByText("0 %")).toBeTruthy();
36
- });
37
- test("Overlay progressBar renders with default value", function () {
38
- var _render4 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_ProgressBar["default"], {
39
- showValue: true,
40
- overlay: true
41
- })),
42
- getByText = _render4.getByText;
43
-
44
- expect(getByText("0 %")).toBeTruthy();
45
- });
46
- test("ProgressBar renders with value", function () {
47
- var _render5 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_ProgressBar["default"], {
48
- showValue: true,
49
- value: 25
50
- })),
51
- getByText = _render5.getByText;
52
-
53
- expect(getByText("25 %")).toBeTruthy();
54
- });
55
- test("Overlay progressBar renders with value", function () {
56
- var _render6 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_ProgressBar["default"], {
57
- showValue: true,
58
- value: 25,
59
- overlay: true
60
- })),
61
- getByText = _render6.getByText;
62
-
63
- expect(getByText("25 %")).toBeTruthy();
64
- });
65
- });
@@ -1,37 +0,0 @@
1
- declare type Space = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
2
- declare type Size = {
3
- top?: Space;
4
- bottom?: Space;
5
- left?: Space;
6
- right?: Space;
7
- };
8
- declare type Props = {
9
- /**
10
- * Text to be placed above the progress bar.
11
- */
12
- label?: string;
13
- /**
14
- * Helper text to be placed under the progress bar.
15
- */
16
- helperText?: string;
17
- /**
18
- * If true, the progress bar will be displayed as a modal.
19
- */
20
- overlay?: boolean;
21
- /**
22
- * The value of the progress indicator. If it's received the component is
23
- * determinate otherwise is indeterminate.
24
- */
25
- value?: number;
26
- /**
27
- * If true, the value is displayed above the progress bar.
28
- */
29
- showValue?: boolean;
30
- /**
31
- * Size of the margin to be applied to the component. You can pass
32
- * an object with 'top', 'bottom', 'left' and 'right' properties
33
- * in order to specify different margin sizes.
34
- */
35
- margin?: Space | Size;
36
- };
37
- export default Props;
@@ -1,5 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
@@ -1,4 +0,0 @@
1
- /// <reference types="react" />
2
- import QuickNavTypes from "./types";
3
- declare const DxcQuickNav: ({ title, links }: QuickNavTypes) => JSX.Element;
4
- export default DxcQuickNav;
@@ -1,116 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
-
5
- var _typeof = require("@babel/runtime/helpers/typeof");
6
-
7
- Object.defineProperty(exports, "__esModule", {
8
- value: true
9
- });
10
- exports["default"] = void 0;
11
-
12
- var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
13
-
14
- var _react = _interopRequireDefault(require("react"));
15
-
16
- var _styledComponents = _interopRequireWildcard(require("styled-components"));
17
-
18
- var _slugify = _interopRequireDefault(require("slugify"));
19
-
20
- var _useTheme = _interopRequireDefault(require("../useTheme"));
21
-
22
- var _Heading = _interopRequireDefault(require("../heading/Heading"));
23
-
24
- var _Stack = _interopRequireDefault(require("../stack/Stack"));
25
-
26
- var _Inset = _interopRequireDefault(require("../inset/Inset"));
27
-
28
- var _Text = _interopRequireDefault(require("../text/Text"));
29
-
30
- var _useTranslatedLabels = _interopRequireDefault(require("../useTranslatedLabels"));
31
-
32
- 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
-
38
- var DxcQuickNav = function DxcQuickNav(_ref) {
39
- var title = _ref.title,
40
- links = _ref.links;
41
- var translatedLabels = (0, _useTranslatedLabels["default"])();
42
- var colorsTheme = (0, _useTheme["default"])();
43
- return /*#__PURE__*/_react["default"].createElement(_styledComponents.ThemeProvider, {
44
- theme: colorsTheme.quickNav
45
- }, /*#__PURE__*/_react["default"].createElement(QuickNavContainer, null, /*#__PURE__*/_react["default"].createElement(_Stack["default"], {
46
- gutter: "0.5rem"
47
- }, /*#__PURE__*/_react["default"].createElement(_Heading["default"], {
48
- level: 4,
49
- text: title || translatedLabels.quickNav.contentTitle
50
- }), /*#__PURE__*/_react["default"].createElement(ListColumn, null, /*#__PURE__*/_react["default"].createElement(_Stack["default"], {
51
- gutter: "0.5rem"
52
- }, links.map(function (link) {
53
- var _link$links;
54
-
55
- return /*#__PURE__*/_react["default"].createElement(ListRow, {
56
- key: link.label
57
- }, /*#__PURE__*/_react["default"].createElement(_Inset["default"], {
58
- space: "0.25rem"
59
- }, /*#__PURE__*/_react["default"].createElement(_Text["default"], null, /*#__PURE__*/_react["default"].createElement(Link, {
60
- href: "#".concat((0, _slugify["default"])(link === null || link === void 0 ? void 0 : link.label, {
61
- lower: true
62
- }))
63
- }, link === null || link === void 0 ? void 0 : link.label), /*#__PURE__*/_react["default"].createElement(ListColumn, null, (_link$links = link.links) === null || _link$links === void 0 ? void 0 : _link$links.map(function (sublink) {
64
- return /*#__PURE__*/_react["default"].createElement(ListRow, {
65
- key: sublink.label
66
- }, /*#__PURE__*/_react["default"].createElement(_Inset["default"], {
67
- horizontal: "0.5rem"
68
- }, /*#__PURE__*/_react["default"].createElement(_Text["default"], null, /*#__PURE__*/_react["default"].createElement(Link, {
69
- href: "#".concat((0, _slugify["default"])(sublink === null || sublink === void 0 ? void 0 : sublink.label, {
70
- lower: true
71
- }))
72
- }, sublink === null || sublink === void 0 ? void 0 : sublink.label))));
73
- })))));
74
- }))))));
75
- };
76
-
77
- 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) {
78
- return props.theme.paddingTop;
79
- }, function (props) {
80
- return props.theme.paddingBottom;
81
- }, function (props) {
82
- return props.theme.paddingLeft;
83
- }, function (props) {
84
- return props.theme.paddingRight;
85
- }, function (props) {
86
- return props.theme.dividerBorderColor;
87
- });
88
-
89
- var ListColumn = _styledComponents["default"].ul(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["\n list-style-type: none;\n margin: 0;\n padding: 0;\n"])));
90
-
91
- var ListRow = _styledComponents["default"].li(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])([""])));
92
-
93
- 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\n &:hover {\n color: ", ";\n }\n &:focus {\n outline-color: ", ";\n outline-style: ", ";\n outline-width: ", ";\n border-radius: ", ";\n }\n"])), function (props) {
94
- return props.theme.fontSize;
95
- }, function (props) {
96
- return props.theme.fontFamily;
97
- }, function (props) {
98
- return props.theme.fontStyle;
99
- }, function (props) {
100
- return props.theme.fontWeight;
101
- }, function (props) {
102
- return props.theme.fontColor;
103
- }, function (props) {
104
- return props.theme.hoverFontColor;
105
- }, function (props) {
106
- return props.theme.focusBorderColor;
107
- }, function (props) {
108
- return props.theme.focusBorderStyle;
109
- }, function (props) {
110
- return props.theme.focusBorderThickness;
111
- }, function (props) {
112
- return props.theme.focusBorderRadius;
113
- });
114
-
115
- var _default = DxcQuickNav;
116
- exports["default"] = _default;