@dxc-technology/halstack-react 0.0.0-feed711 → 0.0.0-ff31c60

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 (314) hide show
  1. package/README.md +46 -0
  2. package/dist/index.d.mts +6648 -0
  3. package/dist/index.d.ts +6648 -0
  4. package/dist/index.js +18393 -0
  5. package/dist/index.mjs +18115 -0
  6. package/package.json +68 -69
  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/bulleted-list/BulletedList.d.ts +0 -7
  45. package/bulleted-list/BulletedList.js +0 -123
  46. package/bulleted-list/BulletedList.stories.tsx +0 -200
  47. package/bulleted-list/types.d.ts +0 -11
  48. package/bulleted-list/types.js +0 -5
  49. package/button/Button.d.ts +0 -4
  50. package/button/Button.js +0 -156
  51. package/button/Button.stories.tsx +0 -283
  52. package/button/Button.test.js +0 -35
  53. package/button/types.d.ts +0 -53
  54. package/button/types.js +0 -5
  55. package/card/Card.d.ts +0 -4
  56. package/card/Card.js +0 -161
  57. package/card/Card.stories.tsx +0 -201
  58. package/card/Card.test.js +0 -50
  59. package/card/ice-cream.jpg +0 -0
  60. package/card/types.d.ts +0 -67
  61. package/card/types.js +0 -5
  62. package/checkbox/Checkbox.d.ts +0 -4
  63. package/checkbox/Checkbox.js +0 -257
  64. package/checkbox/Checkbox.stories.tsx +0 -188
  65. package/checkbox/Checkbox.test.js +0 -78
  66. package/checkbox/types.d.ts +0 -64
  67. package/checkbox/types.js +0 -5
  68. package/chip/Chip.d.ts +0 -4
  69. package/chip/Chip.js +0 -161
  70. package/chip/Chip.stories.tsx +0 -119
  71. package/chip/Chip.test.js +0 -56
  72. package/chip/types.d.ts +0 -45
  73. package/chip/types.js +0 -5
  74. package/common/OpenSans.css +0 -81
  75. package/common/RequiredComponent.js +0 -32
  76. package/common/fonts/OpenSans-Bold.ttf +0 -0
  77. package/common/fonts/OpenSans-BoldItalic.ttf +0 -0
  78. package/common/fonts/OpenSans-ExtraBold.ttf +0 -0
  79. package/common/fonts/OpenSans-ExtraBoldItalic.ttf +0 -0
  80. package/common/fonts/OpenSans-Italic.ttf +0 -0
  81. package/common/fonts/OpenSans-Light.ttf +0 -0
  82. package/common/fonts/OpenSans-LightItalic.ttf +0 -0
  83. package/common/fonts/OpenSans-Regular.ttf +0 -0
  84. package/common/fonts/OpenSans-SemiBold.ttf +0 -0
  85. package/common/fonts/OpenSans-SemiBoldItalic.ttf +0 -0
  86. package/common/utils.js +0 -22
  87. package/common/variables.js +0 -1504
  88. package/date-input/DateInput.d.ts +0 -4
  89. package/date-input/DateInput.js +0 -372
  90. package/date-input/DateInput.stories.tsx +0 -138
  91. package/date-input/DateInput.test.js +0 -479
  92. package/date-input/types.d.ts +0 -107
  93. package/date-input/types.js +0 -5
  94. package/dialog/Dialog.d.ts +0 -4
  95. package/dialog/Dialog.js +0 -162
  96. package/dialog/Dialog.stories.tsx +0 -211
  97. package/dialog/Dialog.test.js +0 -70
  98. package/dialog/types.d.ts +0 -43
  99. package/dialog/types.js +0 -5
  100. package/dropdown/Dropdown.d.ts +0 -4
  101. package/dropdown/Dropdown.js +0 -387
  102. package/dropdown/Dropdown.stories.tsx +0 -312
  103. package/dropdown/Dropdown.test.js +0 -591
  104. package/dropdown/DropdownMenu.d.ts +0 -4
  105. package/dropdown/DropdownMenu.js +0 -80
  106. package/dropdown/DropdownMenuItem.d.ts +0 -4
  107. package/dropdown/DropdownMenuItem.js +0 -92
  108. package/dropdown/types.d.ts +0 -100
  109. package/dropdown/types.js +0 -5
  110. package/file-input/FileInput.d.ts +0 -4
  111. package/file-input/FileInput.js +0 -593
  112. package/file-input/FileInput.stories.tsx +0 -507
  113. package/file-input/FileInput.test.js +0 -457
  114. package/file-input/FileItem.d.ts +0 -14
  115. package/file-input/FileItem.js +0 -186
  116. package/file-input/types.d.ts +0 -112
  117. package/file-input/types.js +0 -5
  118. package/flex/Flex.d.ts +0 -4
  119. package/flex/Flex.js +0 -57
  120. package/flex/Flex.stories.tsx +0 -103
  121. package/flex/types.d.ts +0 -21
  122. package/flex/types.js +0 -5
  123. package/footer/Footer.d.ts +0 -4
  124. package/footer/Footer.js +0 -185
  125. package/footer/Footer.stories.tsx +0 -130
  126. package/footer/Footer.test.js +0 -109
  127. package/footer/Icons.d.ts +0 -2
  128. package/footer/Icons.js +0 -77
  129. package/footer/types.d.ts +0 -65
  130. package/footer/types.js +0 -5
  131. package/header/Header.d.ts +0 -7
  132. package/header/Header.js +0 -305
  133. package/header/Header.stories.tsx +0 -172
  134. package/header/Header.test.js +0 -79
  135. package/header/Icons.d.ts +0 -2
  136. package/header/Icons.js +0 -34
  137. package/header/types.d.ts +0 -47
  138. package/header/types.js +0 -5
  139. package/heading/Heading.d.ts +0 -4
  140. package/heading/Heading.js +0 -159
  141. package/heading/Heading.stories.tsx +0 -54
  142. package/heading/Heading.test.js +0 -186
  143. package/heading/types.d.ts +0 -33
  144. package/heading/types.js +0 -5
  145. package/inset/Inset.d.ts +0 -3
  146. package/inset/Inset.js +0 -51
  147. package/inset/Inset.stories.tsx +0 -229
  148. package/inset/types.d.ts +0 -37
  149. package/inset/types.js +0 -5
  150. package/layout/ApplicationLayout.d.ts +0 -20
  151. package/layout/ApplicationLayout.js +0 -171
  152. package/layout/ApplicationLayout.stories.tsx +0 -161
  153. package/layout/Icons.d.ts +0 -5
  154. package/layout/Icons.js +0 -66
  155. package/layout/SidenavContext.d.ts +0 -5
  156. package/layout/SidenavContext.js +0 -19
  157. package/layout/types.d.ts +0 -42
  158. package/layout/types.js +0 -5
  159. package/link/Link.d.ts +0 -4
  160. package/link/Link.js +0 -136
  161. package/link/Link.stories.tsx +0 -193
  162. package/link/Link.test.js +0 -83
  163. package/link/types.d.ts +0 -54
  164. package/link/types.js +0 -5
  165. package/main.d.ts +0 -44
  166. package/main.js +0 -369
  167. package/number-input/NumberInput.d.ts +0 -4
  168. package/number-input/NumberInput.js +0 -76
  169. package/number-input/NumberInput.stories.tsx +0 -115
  170. package/number-input/NumberInput.test.js +0 -506
  171. package/number-input/NumberInputContext.d.ts +0 -4
  172. package/number-input/NumberInputContext.js +0 -19
  173. package/number-input/numberInputContextTypes.d.ts +0 -19
  174. package/number-input/numberInputContextTypes.js +0 -5
  175. package/number-input/types.d.ts +0 -124
  176. package/number-input/types.js +0 -5
  177. package/paginator/Icons.js +0 -66
  178. package/paginator/Paginator.d.ts +0 -4
  179. package/paginator/Paginator.js +0 -171
  180. package/paginator/Paginator.stories.tsx +0 -63
  181. package/paginator/Paginator.test.js +0 -308
  182. package/paginator/types.d.ts +0 -38
  183. package/paginator/types.js +0 -5
  184. package/paragraph/Paragraph.d.ts +0 -6
  185. package/paragraph/Paragraph.js +0 -38
  186. package/paragraph/Paragraph.stories.tsx +0 -44
  187. package/password-input/PasswordInput.d.ts +0 -4
  188. package/password-input/PasswordInput.js +0 -166
  189. package/password-input/PasswordInput.stories.tsx +0 -131
  190. package/password-input/PasswordInput.test.js +0 -180
  191. package/password-input/types.d.ts +0 -110
  192. package/password-input/types.js +0 -5
  193. package/progress-bar/ProgressBar.d.ts +0 -4
  194. package/progress-bar/ProgressBar.js +0 -176
  195. package/progress-bar/ProgressBar.stories.jsx +0 -60
  196. package/progress-bar/ProgressBar.test.js +0 -110
  197. package/progress-bar/types.d.ts +0 -36
  198. package/progress-bar/types.js +0 -5
  199. package/quick-nav/QuickNav.d.ts +0 -4
  200. package/quick-nav/QuickNav.js +0 -118
  201. package/quick-nav/QuickNav.stories.tsx +0 -264
  202. package/quick-nav/types.d.ts +0 -21
  203. package/quick-nav/types.js +0 -5
  204. package/radio-group/Radio.d.ts +0 -4
  205. package/radio-group/Radio.js +0 -141
  206. package/radio-group/RadioGroup.d.ts +0 -4
  207. package/radio-group/RadioGroup.js +0 -281
  208. package/radio-group/RadioGroup.stories.tsx +0 -100
  209. package/radio-group/RadioGroup.test.js +0 -695
  210. package/radio-group/types.d.ts +0 -114
  211. package/radio-group/types.js +0 -5
  212. package/resultsetTable/ResultsetTable.d.ts +0 -4
  213. package/resultsetTable/ResultsetTable.js +0 -254
  214. package/resultsetTable/ResultsetTable.stories.tsx +0 -275
  215. package/resultsetTable/ResultsetTable.test.js +0 -348
  216. package/resultsetTable/types.d.ts +0 -67
  217. package/resultsetTable/types.js +0 -5
  218. package/select/Icons.d.ts +0 -10
  219. package/select/Icons.js +0 -93
  220. package/select/Listbox.d.ts +0 -4
  221. package/select/Listbox.js +0 -199
  222. package/select/Option.d.ts +0 -4
  223. package/select/Option.js +0 -110
  224. package/select/Select.d.ts +0 -4
  225. package/select/Select.js +0 -643
  226. package/select/Select.stories.tsx +0 -627
  227. package/select/Select.test.js +0 -2175
  228. package/select/types.d.ts +0 -210
  229. package/select/types.js +0 -5
  230. package/sidenav/Sidenav.d.ts +0 -10
  231. package/sidenav/Sidenav.js +0 -268
  232. package/sidenav/Sidenav.stories.tsx +0 -180
  233. package/sidenav/Sidenav.test.js +0 -44
  234. package/sidenav/types.d.ts +0 -73
  235. package/sidenav/types.js +0 -5
  236. package/slider/Slider.d.ts +0 -4
  237. package/slider/Slider.js +0 -318
  238. package/slider/Slider.stories.tsx +0 -177
  239. package/slider/Slider.test.js +0 -187
  240. package/slider/types.d.ts +0 -82
  241. package/slider/types.js +0 -5
  242. package/spinner/Spinner.d.ts +0 -4
  243. package/spinner/Spinner.js +0 -250
  244. package/spinner/Spinner.stories.jsx +0 -103
  245. package/spinner/Spinner.test.js +0 -64
  246. package/spinner/types.d.ts +0 -32
  247. package/spinner/types.js +0 -5
  248. package/switch/Switch.d.ts +0 -4
  249. package/switch/Switch.js +0 -251
  250. package/switch/Switch.stories.tsx +0 -138
  251. package/switch/Switch.test.js +0 -212
  252. package/switch/types.d.ts +0 -61
  253. package/switch/types.js +0 -5
  254. package/table/Table.d.ts +0 -4
  255. package/table/Table.js +0 -118
  256. package/table/Table.stories.jsx +0 -277
  257. package/table/Table.test.js +0 -26
  258. package/table/types.d.ts +0 -21
  259. package/table/types.js +0 -5
  260. package/tabs/Tabs.d.ts +0 -4
  261. package/tabs/Tabs.js +0 -211
  262. package/tabs/Tabs.stories.tsx +0 -112
  263. package/tabs/Tabs.test.js +0 -140
  264. package/tabs/types.d.ts +0 -82
  265. package/tabs/types.js +0 -5
  266. package/tabs-nav/NavTabs.d.ts +0 -8
  267. package/tabs-nav/NavTabs.js +0 -125
  268. package/tabs-nav/NavTabs.stories.tsx +0 -170
  269. package/tabs-nav/NavTabs.test.js +0 -82
  270. package/tabs-nav/Tab.d.ts +0 -4
  271. package/tabs-nav/Tab.js +0 -130
  272. package/tabs-nav/types.d.ts +0 -53
  273. package/tabs-nav/types.js +0 -5
  274. package/tag/Tag.d.ts +0 -4
  275. package/tag/Tag.js +0 -183
  276. package/tag/Tag.stories.tsx +0 -142
  277. package/tag/Tag.test.js +0 -60
  278. package/tag/types.d.ts +0 -69
  279. package/tag/types.js +0 -5
  280. package/text-input/Suggestion.d.ts +0 -4
  281. package/text-input/Suggestion.js +0 -55
  282. package/text-input/TextInput.d.ts +0 -4
  283. package/text-input/TextInput.js +0 -761
  284. package/text-input/TextInput.stories.tsx +0 -473
  285. package/text-input/TextInput.test.js +0 -1712
  286. package/text-input/types.d.ts +0 -178
  287. package/text-input/types.js +0 -5
  288. package/textarea/Textarea.d.ts +0 -4
  289. package/textarea/Textarea.js +0 -277
  290. package/textarea/Textarea.stories.jsx +0 -157
  291. package/textarea/Textarea.test.js +0 -437
  292. package/textarea/types.d.ts +0 -137
  293. package/textarea/types.js +0 -5
  294. package/toggle-group/ToggleGroup.d.ts +0 -4
  295. package/toggle-group/ToggleGroup.js +0 -215
  296. package/toggle-group/ToggleGroup.stories.tsx +0 -173
  297. package/toggle-group/ToggleGroup.test.js +0 -156
  298. package/toggle-group/types.d.ts +0 -105
  299. package/toggle-group/types.js +0 -5
  300. package/typography/Typography.d.ts +0 -4
  301. package/typography/Typography.js +0 -131
  302. package/typography/Typography.stories.tsx +0 -198
  303. package/typography/types.d.ts +0 -18
  304. package/typography/types.js +0 -5
  305. package/useTheme.d.ts +0 -2
  306. package/useTheme.js +0 -22
  307. package/useTranslatedLabels.d.ts +0 -2
  308. package/useTranslatedLabels.js +0 -20
  309. package/wizard/Wizard.d.ts +0 -4
  310. package/wizard/Wizard.js +0 -285
  311. package/wizard/Wizard.stories.tsx +0 -233
  312. package/wizard/Wizard.test.js +0 -141
  313. package/wizard/types.d.ts +0 -65
  314. package/wizard/types.js +0 -5
@@ -1,110 +0,0 @@
1
- declare type Space = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
2
- declare type Margin = {
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 password.
11
- */
12
- label?: string;
13
- /**
14
- * Name attribute of the input element.
15
- */
16
- name?: string;
17
- /**
18
- * Value of the input element. If undefined, the component will be uncontrolled and the value will be managed internally by the component.
19
- */
20
- value?: string;
21
- /**
22
- * Helper text to be placed above the password.
23
- */
24
- helperText?: string;
25
- /**
26
- * If true, the password input will have an action to clear the entered value.
27
- */
28
- clearable?: boolean;
29
- /**
30
- * This function will be called when the user types within the input
31
- * element of the component. An object including the current value and
32
- * the error (if the value entered is not valid) will be passed to this
33
- * function. If there is no error, error will not be defined.
34
- * */
35
- onChange?: (val: {
36
- value: string;
37
- error?: string;
38
- }) => void;
39
- /**
40
- * This function will be called when the input element loses the focus.
41
- * An object including the input value and the error (if the value entered is
42
- * not valid) will be passed to this function. If there is no error, error will not be defined.
43
- */
44
- onBlur?: (val: {
45
- value: string;
46
- error?: string;
47
- }) => void;
48
- /**
49
- * If it is a defined value and also a truthy string, the component will
50
- * change its appearance, showing the error below the password input
51
- * component. If the defined value is an empty string, it will reserve a
52
- * space below the component for a future error, but it would not change
53
- * its look. In case of being undefined or null, both the appearance and
54
- * the space for the error message would not be modified.
55
- */
56
- error?: string;
57
- /**
58
- * Regular expression that defines the valid format allowed by the
59
- * password input. This will be checked both when the input element loses the
60
- * focus and while typing within it. If the string entered does not match
61
- * the pattern, the onBlur and onChange functions will be called with the
62
- * current value and an internal error informing that this value does not
63
- * match the pattern. If the pattern is met, the error parameter of both
64
- * events will not be defined.
65
- */
66
- pattern?: string;
67
- /**
68
- * Specifies the minimun length allowed by the password input.
69
- * This will be checked both when the input element loses the
70
- * focus and while typing within it. If the string entered does not
71
- * comply the minimum length, the onBlur and onChange functions will be called
72
- * with the current value and an internal error informing that the value
73
- * length does not comply the specified range. If a valid length is
74
- * reached, the error parameter of both events will not be defined.
75
- */
76
- minLength?: number;
77
- /**
78
- * Specifies the maximum length allowed by the password input.
79
- * This will be checked both when the input element loses the
80
- * focus and while typing within it. If the string entered does not
81
- * comply the maximum length, the onBlur and onChange functions will be called
82
- * with the current value and an internal error informing that the value
83
- * length does not comply the specified range. If a valid length is
84
- * reached, the error parameter of both events will not be defined.
85
- */
86
- maxLength?: number;
87
- /**
88
- * HTML autocomplete attribute. Lets the user specify if any permission the user agent has to provide automated assistance in filling out the input value.
89
- * Its value must be one of all the possible values of the HTML autocomplete attribute: 'on', 'off', 'email', 'username', 'new-password', ...
90
- */
91
- autocomplete?: string;
92
- /**
93
- * Size of the margin to be applied to the component ('xxsmall' | 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge').
94
- * You can pass an object with 'top', 'bottom', 'left' and 'right' properties in order to specify different margin sizes.
95
- */
96
- margin?: Space | Margin;
97
- /**
98
- * Size of the component.
99
- */
100
- size?: "small" | "medium" | "large" | "fillParent";
101
- /**
102
- * Value of the tabindex attribute.
103
- */
104
- tabIndex?: number;
105
- };
106
- /**
107
- * Reference to the component.
108
- */
109
- export declare type RefType = HTMLDivElement;
110
- 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 { Props } from "./types";
3
- declare const DxcProgressBar: ({ label, helperText, overlay, value, showValue, margin, }: Props) => JSX.Element;
4
- export default DxcProgressBar;
@@ -1,176 +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 _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
17
-
18
- var _react = _interopRequireWildcard(require("react"));
19
-
20
- var _styledComponents = _interopRequireWildcard(require("styled-components"));
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, _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
-
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
-
48
- var _useState = (0, _react.useState)(0),
49
- _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
50
- valueProgressBar = _useState2[0],
51
- setValueProgressBar = _useState2[1];
52
-
53
- (0, _react.useEffect)(function () {
54
- setValueProgressBar(value === null || value === undefined || value < 0 ? 0 : value >= 0 && value <= 100 ? value : 100);
55
- }, [value]);
56
- return /*#__PURE__*/_react["default"].createElement(_styledComponents.ThemeProvider, {
57
- theme: colorsTheme.progressBar
58
- }, /*#__PURE__*/_react["default"].createElement(BackgroundProgressBar, {
59
- overlay: overlay
60
- }, /*#__PURE__*/_react["default"].createElement(ProgressBarContainer, {
61
- overlay: overlay,
62
- margin: margin
63
- }, /*#__PURE__*/_react["default"].createElement(InfoProgressBar, null, /*#__PURE__*/_react["default"].createElement(ProgressBarLabel, {
64
- overlay: overlay,
65
- backgroundType: backgroundType,
66
- "aria-label": label || undefined
67
- }, label), /*#__PURE__*/_react["default"].createElement(ProgressBarProgress, {
68
- overlay: overlay,
69
- showValue: showValue,
70
- backgroundType: backgroundType,
71
- value: valueProgressBar
72
- }, valueProgressBar, " %")), /*#__PURE__*/_react["default"].createElement(LinearProgress, {
73
- role: "progressbar",
74
- helperText: helperText,
75
- "aria-valuenow": showValue ? valueProgressBar : undefined
76
- }, /*#__PURE__*/_react["default"].createElement(LinearProgressBar, {
77
- backgroundType: backgroundType,
78
- variant: value === null || value === undefined ? "indeterminate" : "determinate",
79
- container: "first",
80
- value: valueProgressBar
81
- })), helperText && /*#__PURE__*/_react["default"].createElement(HelperText, {
82
- overlay: overlay,
83
- backgroundType: backgroundType
84
- }, helperText))));
85
- };
86
-
87
- 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
- var overlay = _ref2.overlay,
89
- theme = _ref2.theme;
90
- return overlay ? "background-color: ".concat(theme.overlayColor, ";\n opacity: 0.8;\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
- });
92
-
93
- 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
- return props.overlay === true && "100" || "0";
95
- }, function (props) {
96
- return props.overlay === true ? "80%" : "100%";
97
- }, function (props) {
98
- return props.margin && (0, _typeof2["default"])(props.margin) !== "object" ? _variables.spaces[props.margin] : "0px";
99
- }, function (props) {
100
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.top ? _variables.spaces[props.margin.top] : "";
101
- }, function (props) {
102
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.right ? _variables.spaces[props.margin.right] : "";
103
- }, function (props) {
104
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.bottom ? _variables.spaces[props.margin.bottom] : "";
105
- }, function (props) {
106
- return props.margin && (0, _typeof2["default"])(props.margin) === "object" && props.margin.left ? _variables.spaces[props.margin.left] : "";
107
- });
108
-
109
- 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
- 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
- return props.theme.labelFontFamily;
113
- }, function (props) {
114
- return props.theme.labelFontStyle;
115
- }, function (props) {
116
- return props.theme.labelFontSize;
117
- }, function (props) {
118
- return props.theme.labelFontWeight;
119
- }, function (props) {
120
- return props.theme.labelFontTextTransform;
121
- }, function (props) {
122
- return props.backgroundType === "dark" ? props.theme.labelFontColorOnDark : props.overlay === true ? "#FFFFFF" : props.theme.labelFontColor;
123
- });
124
-
125
- 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
- return props.theme.valueFontFamily;
127
- }, function (props) {
128
- return props.theme.valueFontStyle;
129
- }, function (props) {
130
- return props.theme.valueFontSize;
131
- }, function (props) {
132
- return props.theme.valueFontWeight;
133
- }, function (props) {
134
- return props.theme.valueFontTextTransform;
135
- }, function (props) {
136
- return props.backgroundType === "dark" ? props.theme.valueFontColorOnDark : props.overlay === true ? "#FFFFFF" : props.theme.valueFontColor;
137
- }, function (props) {
138
- return props.value !== undefined && props.value !== null && props.showValue === true && "block" || "none";
139
- });
140
-
141
- 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 ? "#FFFFFF" : props.theme.helperTextFontColor;
143
- }, function (props) {
144
- return props.theme.helperTextFontFamily;
145
- }, function (props) {
146
- return props.theme.helperTextFontSize;
147
- }, function (props) {
148
- return props.theme.helperTextFontStyle;
149
- }, function (props) {
150
- return props.theme.helperTextFontWeight;
151
- });
152
-
153
- 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
- return props.theme.thickness;
155
- }, function (props) {
156
- return props.theme.totalLineColor;
157
- }, function (props) {
158
- return props.theme.borderRadius;
159
- }, function (props) {
160
- return props.helperText !== "" && "8px";
161
- });
162
-
163
- 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;
165
- }, function (props) {
166
- return "translateX(-".concat(props.variant === "determinate" ? 100 - props.value : 0, "%)");
167
- }, function (props) {
168
- return props.variant === "determinate" ? "transform .4s linear" : "transform 0.2s linear";
169
- }, function (props) {
170
- return props.variant === "indeterminate" && "width: auto;";
171
- }, function (props) {
172
- 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
- });
174
-
175
- var _default = DxcProgressBar;
176
- exports["default"] = _default;
@@ -1,60 +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={24} showValue />
18
- <Title title="Without default value" theme="light" level={4} />
19
- <DxcProgressBar label="Loading..." showValue />
20
- <Title title="With full value" theme="light" level={4} />
21
- <DxcProgressBar label="Loading..." value={100} showValue />
22
- </ExampleContainer>
23
- <Title title="Margins" theme="light" level={2} />
24
- <ExampleContainer>
25
- <Title title="Xxsmall margin" theme="light" level={4} />
26
- <DxcProgressBar label="Margin xxsmall" margin="xxsmall" value={50} showValue />
27
- </ExampleContainer>
28
- <ExampleContainer>
29
- <Title title="Xsmall margin" theme="light" level={4} />
30
- <DxcProgressBar label="Margin xsmall" margin="xsmall" value={50} showValue />
31
- </ExampleContainer>
32
- <ExampleContainer>
33
- <Title title="Small margin" theme="light" level={4} />
34
- <DxcProgressBar label="Margin small" margin="small" value={50} showValue />
35
- </ExampleContainer>
36
- <ExampleContainer>
37
- <Title title="Medium margin" theme="light" level={4} />
38
- <DxcProgressBar label="Margin medium" margin="medium" value={50} showValue />
39
- </ExampleContainer>
40
- <ExampleContainer>
41
- <Title title="Large margin" theme="light" level={4} />
42
- <DxcProgressBar label="Margin large" margin="large" value={50} showValue />
43
- </ExampleContainer>
44
- <ExampleContainer>
45
- <Title title="Xlarge margin" theme="light" level={4} />
46
- <DxcProgressBar label="Margin xlarge" margin="xlarge" value={50} showValue />
47
- </ExampleContainer>
48
- <ExampleContainer>
49
- <Title title="XxLarge margin" theme="light" level={4} />
50
- <DxcProgressBar label="Margin xxlarge" margin="xxlarge" value={50} showValue />
51
- </ExampleContainer>
52
- </>
53
- );
54
-
55
- export const ProgressBarOverlay = () => (
56
- <ExampleContainer>
57
- <Title title="Overlay" theme="dark" level={4} />
58
- <DxcProgressBar label="Overlay" helperText="Helper text" overlay={true} showValue value={50} />
59
- </ExampleContainer>
60
- );
@@ -1,110 +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 and helperText", function () {
13
- 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
-
19
- expect(getByText("test-label")).toBeTruthy();
20
- expect(getByText("helper-text")).toBeTruthy();
21
- });
22
- test("ProgressBar renders with default value", function () {
23
- var value = 0;
24
-
25
- var _render2 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_ProgressBar["default"], {
26
- showValue: true
27
- })),
28
- getByText = _render2.getByText,
29
- getByRole = _render2.getByRole;
30
-
31
- var progressBar = getByRole("progressbar");
32
- expect(getByText("0 %")).toBeTruthy();
33
- expect(progressBar.getAttribute("aria-valuenow")).toEqual(value.toString());
34
- });
35
- test("ProgressBar renders with value", function () {
36
- var value = 25;
37
-
38
- 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
-
45
- var progressBar = getByRole("progressbar");
46
- expect(getByText("25 %")).toBeTruthy();
47
- expect(progressBar.getAttribute("aria-valuenow")).toEqual(value.toString());
48
- });
49
- test("ProgressBar renders with negative value", function () {
50
- var value = 0;
51
-
52
- 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
-
59
- var progressBar = getByRole("progressbar");
60
- expect(getByText("0 %")).toBeTruthy();
61
- expect(progressBar.getAttribute("aria-valuenow")).toEqual(value.toString());
62
- });
63
- test("ProgressBar renders as indeterminate", function () {
64
- var _render5 = (0, _react2.render)( /*#__PURE__*/_react["default"].createElement(_ProgressBar["default"], null)),
65
- getByRole = _render5.getByRole;
66
-
67
- var progressBar = getByRole("progressbar");
68
- expect(progressBar.getAttribute("aria-valuenow")).toBe(null);
69
- });
70
- test("Overlay progressBar renders with label and helperText", function () {
71
- 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
-
78
- expect(getByText("test-label")).toBeTruthy();
79
- expect(getByText("helper-text")).toBeTruthy();
80
- });
81
- test("Overlay progressBar renders with default value", function () {
82
- var value = 0;
83
-
84
- 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
-
91
- var progressBar = getByRole("progressbar");
92
- expect(getByText("0 %")).toBeTruthy();
93
- expect(progressBar.getAttribute("aria-valuenow")).toEqual(value.toString());
94
- });
95
- test("Overlay progressBar renders with value", function () {
96
- var value = 25;
97
-
98
- 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
-
106
- var progressBar = getByRole("progressbar");
107
- expect(getByText("25 %")).toBeTruthy();
108
- expect(progressBar.getAttribute("aria-valuenow")).toEqual(value.toString());
109
- });
110
- });
@@ -1,36 +0,0 @@
1
- export declare type Space = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
2
- export declare type Size = {
3
- top?: Space;
4
- bottom?: Space;
5
- left?: Space;
6
- right?: Space;
7
- };
8
- export 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
- };
@@ -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,118 +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 _Flex = _interopRequireDefault(require("../flex/Flex"));
25
-
26
- var _Inset = _interopRequireDefault(require("../inset/Inset"));
27
-
28
- var _Typography = _interopRequireDefault(require("../typography/Typography"));
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(_Flex["default"], {
46
- direction: "column",
47
- gap: "0.5rem"
48
- }, /*#__PURE__*/_react["default"].createElement(_Heading["default"], {
49
- level: 4,
50
- text: title || translatedLabels.quickNav.contentTitle
51
- }), /*#__PURE__*/_react["default"].createElement(ListColumn, null, /*#__PURE__*/_react["default"].createElement(_Flex["default"], {
52
- direction: "column",
53
- gap: "0.5rem"
54
- }, links.map(function (link) {
55
- var _link$links;
56
-
57
- return /*#__PURE__*/_react["default"].createElement(ListRow, {
58
- key: link.label
59
- }, /*#__PURE__*/_react["default"].createElement(_Inset["default"], {
60
- space: "0.25rem"
61
- }, /*#__PURE__*/_react["default"].createElement(_Typography["default"], null, /*#__PURE__*/_react["default"].createElement(Link, {
62
- href: "#".concat((0, _slugify["default"])(link === null || link === void 0 ? void 0 : link.label, {
63
- lower: true
64
- }))
65
- }, link === null || link === void 0 ? void 0 : link.label), (_link$links = link.links) === null || _link$links === void 0 ? void 0 : _link$links.map(function (sublink) {
66
- return /*#__PURE__*/_react["default"].createElement(ListRow, {
67
- key: sublink.label
68
- }, /*#__PURE__*/_react["default"].createElement(_Inset["default"], {
69
- horizontal: "0.5rem"
70
- }, /*#__PURE__*/_react["default"].createElement(_Typography["default"], null, /*#__PURE__*/_react["default"].createElement(Link, {
71
- href: "#".concat((0, _slugify["default"])(sublink === null || sublink === void 0 ? void 0 : sublink.label, {
72
- lower: true
73
- }))
74
- }, sublink === null || sublink === void 0 ? void 0 : sublink.label))));
75
- }))));
76
- }))))));
77
- };
78
-
79
- 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) {
80
- return props.theme.paddingTop;
81
- }, function (props) {
82
- return props.theme.paddingBottom;
83
- }, function (props) {
84
- return props.theme.paddingLeft;
85
- }, function (props) {
86
- return props.theme.paddingRight;
87
- }, function (props) {
88
- return props.theme.dividerBorderColor;
89
- });
90
-
91
- var ListColumn = _styledComponents["default"].ul(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["\n list-style-type: none;\n margin: 0;\n padding: 0;\n width: 100%;\n"])));
92
-
93
- var ListRow = _styledComponents["default"].li(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2["default"])(["\n width: 100%;\n"])));
94
-
95
- 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) {
96
- return props.theme.fontSize;
97
- }, function (props) {
98
- return props.theme.fontFamily;
99
- }, function (props) {
100
- return props.theme.fontStyle;
101
- }, function (props) {
102
- return props.theme.fontWeight;
103
- }, function (props) {
104
- return props.theme.fontColor;
105
- }, function (props) {
106
- return props.theme.hoverFontColor;
107
- }, function (props) {
108
- return props.theme.focusBorderColor;
109
- }, function (props) {
110
- return props.theme.focusBorderStyle;
111
- }, function (props) {
112
- return props.theme.focusBorderThickness;
113
- }, function (props) {
114
- return props.theme.focusBorderRadius;
115
- });
116
-
117
- var _default = DxcQuickNav;
118
- exports["default"] = _default;