@dxc-technology/halstack-react 0.0.0-7604f1d → 0.0.0-76b7408

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 (309) hide show
  1. package/BackgroundColorContext.d.ts +10 -0
  2. package/BackgroundColorContext.js +1 -4
  3. package/HalstackContext.d.ts +12 -0
  4. package/HalstackContext.js +343 -0
  5. package/accordion/Accordion.d.ts +1 -1
  6. package/accordion/Accordion.js +119 -138
  7. package/accordion/Accordion.stories.tsx +395 -0
  8. package/accordion/Accordion.test.js +71 -0
  9. package/accordion/types.d.ts +12 -11
  10. package/accordion-group/AccordionGroup.d.ts +1 -1
  11. package/accordion-group/AccordionGroup.js +16 -37
  12. package/accordion-group/AccordionGroup.stories.tsx +251 -0
  13. package/accordion-group/AccordionGroup.test.js +126 -0
  14. package/accordion-group/types.d.ts +17 -10
  15. package/alert/Alert.js +7 -4
  16. package/alert/Alert.stories.tsx +28 -0
  17. package/alert/Alert.test.js +92 -0
  18. package/alert/types.d.ts +1 -1
  19. package/badge/Badge.d.ts +4 -0
  20. package/badge/Badge.js +6 -4
  21. package/badge/types.d.ts +5 -0
  22. package/bleed/Bleed.d.ts +3 -0
  23. package/bleed/Bleed.js +51 -0
  24. package/bleed/Bleed.stories.tsx +341 -0
  25. package/bleed/types.d.ts +37 -0
  26. package/bleed/types.js +5 -0
  27. package/box/Box.js +25 -35
  28. package/box/Box.stories.tsx +15 -0
  29. package/box/Box.test.js +18 -0
  30. package/box/types.d.ts +1 -0
  31. package/bulleted-list/BulletedList.d.ts +7 -0
  32. package/bulleted-list/BulletedList.js +123 -0
  33. package/bulleted-list/BulletedList.stories.tsx +200 -0
  34. package/bulleted-list/types.d.ts +11 -0
  35. package/bulleted-list/types.js +5 -0
  36. package/button/Button.d.ts +1 -1
  37. package/button/Button.js +59 -82
  38. package/button/Button.stories.tsx +163 -14
  39. package/button/Button.test.js +35 -0
  40. package/button/types.d.ts +10 -14
  41. package/card/Card.js +26 -30
  42. package/card/Card.stories.tsx +201 -0
  43. package/card/Card.test.js +50 -0
  44. package/card/ice-cream.jpg +0 -0
  45. package/card/types.d.ts +5 -6
  46. package/checkbox/Checkbox.d.ts +2 -2
  47. package/checkbox/Checkbox.js +108 -111
  48. package/checkbox/Checkbox.stories.tsx +198 -130
  49. package/checkbox/Checkbox.test.js +155 -0
  50. package/checkbox/types.d.ts +15 -7
  51. package/chip/Chip.d.ts +4 -0
  52. package/chip/Chip.js +22 -88
  53. package/chip/Chip.stories.tsx +98 -13
  54. package/chip/Chip.test.js +56 -0
  55. package/chip/types.d.ts +45 -0
  56. package/chip/types.js +5 -0
  57. package/common/variables.js +536 -575
  58. package/date-input/Calendar.d.ts +4 -0
  59. package/date-input/Calendar.js +258 -0
  60. package/date-input/DateInput.js +174 -266
  61. package/date-input/DateInput.stories.tsx +199 -33
  62. package/date-input/DateInput.test.js +835 -0
  63. package/date-input/DatePicker.d.ts +4 -0
  64. package/date-input/DatePicker.js +146 -0
  65. package/date-input/Icons.d.ts +6 -0
  66. package/date-input/Icons.js +75 -0
  67. package/date-input/YearPicker.d.ts +4 -0
  68. package/date-input/YearPicker.js +126 -0
  69. package/date-input/types.d.ts +67 -9
  70. package/dialog/Dialog.js +79 -95
  71. package/dialog/Dialog.stories.tsx +230 -123
  72. package/dialog/Dialog.test.js +369 -0
  73. package/dialog/types.d.ts +3 -2
  74. package/dropdown/Dropdown.d.ts +1 -1
  75. package/dropdown/Dropdown.js +248 -277
  76. package/dropdown/Dropdown.stories.tsx +438 -0
  77. package/dropdown/Dropdown.test.js +585 -0
  78. package/dropdown/DropdownMenu.d.ts +4 -0
  79. package/dropdown/DropdownMenu.js +70 -0
  80. package/dropdown/DropdownMenuItem.d.ts +4 -0
  81. package/dropdown/DropdownMenuItem.js +81 -0
  82. package/dropdown/types.d.ts +30 -19
  83. package/file-input/FileInput.d.ts +2 -2
  84. package/file-input/FileInput.js +179 -142
  85. package/file-input/FileInput.stories.tsx +618 -0
  86. package/file-input/FileInput.test.js +457 -0
  87. package/file-input/FileItem.d.ts +4 -14
  88. package/file-input/FileItem.js +47 -67
  89. package/file-input/types.d.ts +49 -7
  90. package/flex/Flex.d.ts +4 -0
  91. package/flex/Flex.js +69 -0
  92. package/flex/Flex.stories.tsx +103 -0
  93. package/flex/types.d.ts +32 -0
  94. package/flex/types.js +5 -0
  95. package/footer/Footer.d.ts +1 -1
  96. package/footer/Footer.js +32 -113
  97. package/footer/Footer.stories.tsx +228 -0
  98. package/footer/Footer.test.js +109 -0
  99. package/footer/Icons.d.ts +2 -0
  100. package/footer/Icons.js +4 -4
  101. package/footer/types.d.ts +22 -17
  102. package/header/Header.js +109 -130
  103. package/header/Header.stories.tsx +189 -36
  104. package/header/Header.test.js +79 -0
  105. package/header/Icons.d.ts +2 -0
  106. package/header/Icons.js +2 -2
  107. package/header/types.d.ts +7 -4
  108. package/heading/Heading.js +1 -1
  109. package/heading/Heading.stories.tsx +54 -0
  110. package/heading/Heading.test.js +186 -0
  111. package/inset/Inset.d.ts +3 -0
  112. package/inset/Inset.js +51 -0
  113. package/inset/Inset.stories.tsx +229 -0
  114. package/inset/types.d.ts +37 -0
  115. package/inset/types.js +5 -0
  116. package/layout/ApplicationLayout.d.ts +20 -0
  117. package/layout/ApplicationLayout.js +71 -135
  118. package/layout/ApplicationLayout.stories.tsx +162 -0
  119. package/layout/Icons.d.ts +5 -0
  120. package/layout/Icons.js +13 -2
  121. package/layout/SidenavContext.d.ts +5 -0
  122. package/layout/SidenavContext.js +19 -0
  123. package/layout/types.d.ts +42 -0
  124. package/layout/types.js +5 -0
  125. package/link/Link.d.ts +3 -2
  126. package/link/Link.js +62 -87
  127. package/link/Link.stories.tsx +159 -52
  128. package/link/Link.test.js +83 -0
  129. package/link/types.d.ts +9 -29
  130. package/main.d.ts +12 -12
  131. package/main.js +64 -58
  132. package/nav-tabs/NavTabs.d.ts +8 -0
  133. package/nav-tabs/NavTabs.js +125 -0
  134. package/nav-tabs/NavTabs.stories.tsx +260 -0
  135. package/nav-tabs/NavTabs.test.js +82 -0
  136. package/nav-tabs/Tab.d.ts +4 -0
  137. package/nav-tabs/Tab.js +150 -0
  138. package/nav-tabs/types.d.ts +53 -0
  139. package/nav-tabs/types.js +5 -0
  140. package/number-input/NumberInput.js +14 -24
  141. package/number-input/NumberInput.stories.tsx +5 -5
  142. package/number-input/NumberInput.test.js +542 -0
  143. package/number-input/NumberInputContext.d.ts +4 -0
  144. package/number-input/NumberInputContext.js +5 -2
  145. package/number-input/numberInputContextTypes.d.ts +19 -0
  146. package/number-input/numberInputContextTypes.js +5 -0
  147. package/number-input/types.d.ts +17 -10
  148. package/package.json +21 -22
  149. package/paginator/Icons.d.ts +5 -0
  150. package/paginator/Icons.js +16 -28
  151. package/paginator/Paginator.js +21 -54
  152. package/paginator/Paginator.stories.tsx +24 -0
  153. package/paginator/Paginator.test.js +315 -0
  154. package/paragraph/Paragraph.d.ts +6 -0
  155. package/paragraph/Paragraph.js +38 -0
  156. package/paragraph/Paragraph.stories.tsx +44 -0
  157. package/password-input/PasswordInput.js +23 -19
  158. package/password-input/PasswordInput.stories.tsx +3 -3
  159. package/password-input/PasswordInput.test.js +181 -0
  160. package/password-input/types.d.ts +29 -19
  161. package/progress-bar/ProgressBar.d.ts +2 -2
  162. package/progress-bar/ProgressBar.js +62 -56
  163. package/progress-bar/ProgressBar.stories.jsx +47 -12
  164. package/progress-bar/ProgressBar.test.js +110 -0
  165. package/progress-bar/types.d.ts +3 -4
  166. package/quick-nav/QuickNav.d.ts +4 -0
  167. package/quick-nav/QuickNav.js +117 -0
  168. package/quick-nav/QuickNav.stories.tsx +356 -0
  169. package/quick-nav/types.d.ts +21 -0
  170. package/quick-nav/types.js +5 -0
  171. package/radio-group/Radio.d.ts +4 -0
  172. package/radio-group/Radio.js +156 -0
  173. package/radio-group/RadioGroup.d.ts +4 -0
  174. package/radio-group/RadioGroup.js +283 -0
  175. package/radio-group/RadioGroup.stories.tsx +214 -0
  176. package/radio-group/RadioGroup.test.js +722 -0
  177. package/radio-group/types.d.ts +114 -0
  178. package/radio-group/types.js +5 -0
  179. package/resultsetTable/Icons.d.ts +7 -0
  180. package/resultsetTable/Icons.js +51 -0
  181. package/resultsetTable/ResultsetTable.d.ts +4 -0
  182. package/resultsetTable/ResultsetTable.js +53 -132
  183. package/resultsetTable/ResultsetTable.stories.tsx +300 -0
  184. package/resultsetTable/ResultsetTable.test.js +325 -0
  185. package/resultsetTable/types.d.ts +67 -0
  186. package/resultsetTable/types.js +5 -0
  187. package/select/Icons.d.ts +10 -0
  188. package/select/Icons.js +93 -0
  189. package/select/Listbox.d.ts +4 -0
  190. package/select/Listbox.js +169 -0
  191. package/select/Option.d.ts +4 -0
  192. package/select/Option.js +97 -0
  193. package/select/Select.d.ts +4 -0
  194. package/select/Select.js +196 -397
  195. package/select/Select.stories.tsx +600 -201
  196. package/select/Select.test.js +2228 -0
  197. package/select/types.d.ts +210 -0
  198. package/select/types.js +5 -0
  199. package/sidenav/Sidenav.d.ts +6 -5
  200. package/sidenav/Sidenav.js +184 -54
  201. package/sidenav/Sidenav.stories.tsx +282 -0
  202. package/sidenav/Sidenav.test.js +44 -0
  203. package/sidenav/types.d.ts +50 -27
  204. package/slider/Slider.d.ts +2 -2
  205. package/slider/Slider.js +123 -97
  206. package/slider/Slider.stories.tsx +72 -9
  207. package/slider/Slider.test.js +250 -0
  208. package/slider/types.d.ts +10 -2
  209. package/spinner/Spinner.js +5 -5
  210. package/spinner/Spinner.stories.jsx +27 -0
  211. package/spinner/Spinner.test.js +64 -0
  212. package/switch/Switch.d.ts +2 -2
  213. package/switch/Switch.js +152 -69
  214. package/switch/Switch.stories.tsx +54 -43
  215. package/switch/Switch.test.js +225 -0
  216. package/switch/types.d.ts +12 -4
  217. package/table/Table.js +4 -4
  218. package/table/Table.stories.jsx +81 -1
  219. package/table/Table.test.js +26 -0
  220. package/tabs/Tab.d.ts +4 -0
  221. package/tabs/Tab.js +133 -0
  222. package/tabs/Tabs.d.ts +1 -1
  223. package/tabs/Tabs.js +364 -108
  224. package/tabs/Tabs.stories.tsx +226 -0
  225. package/tabs/Tabs.test.js +351 -0
  226. package/tabs/types.d.ts +41 -20
  227. package/tag/Tag.d.ts +1 -1
  228. package/tag/Tag.js +19 -29
  229. package/tag/Tag.stories.tsx +38 -28
  230. package/tag/Tag.test.js +60 -0
  231. package/tag/types.d.ts +23 -14
  232. package/text-input/Icons.d.ts +8 -0
  233. package/text-input/Icons.js +60 -0
  234. package/text-input/Suggestion.d.ts +4 -0
  235. package/text-input/Suggestion.js +84 -0
  236. package/text-input/Suggestions.d.ts +4 -0
  237. package/text-input/Suggestions.js +134 -0
  238. package/text-input/TextInput.d.ts +4 -0
  239. package/text-input/TextInput.js +233 -385
  240. package/text-input/TextInput.stories.tsx +569 -0
  241. package/text-input/TextInput.test.js +1724 -0
  242. package/text-input/types.d.ts +197 -0
  243. package/text-input/types.js +5 -0
  244. package/textarea/Textarea.d.ts +4 -0
  245. package/textarea/Textarea.js +39 -79
  246. package/textarea/Textarea.stories.jsx +96 -15
  247. package/textarea/Textarea.test.js +437 -0
  248. package/textarea/types.d.ts +137 -0
  249. package/textarea/types.js +5 -0
  250. package/toggle-group/ToggleGroup.d.ts +4 -0
  251. package/toggle-group/ToggleGroup.js +18 -46
  252. package/toggle-group/ToggleGroup.stories.tsx +69 -32
  253. package/toggle-group/ToggleGroup.test.js +156 -0
  254. package/toggle-group/types.d.ts +105 -0
  255. package/toggle-group/types.js +5 -0
  256. package/typography/Typography.d.ts +4 -0
  257. package/typography/Typography.js +131 -0
  258. package/typography/Typography.stories.tsx +198 -0
  259. package/typography/types.d.ts +18 -0
  260. package/typography/types.js +5 -0
  261. package/useTheme.d.ts +2 -0
  262. package/useTheme.js +2 -2
  263. package/useTranslatedLabels.d.ts +2 -0
  264. package/useTranslatedLabels.js +20 -0
  265. package/utils/FocusLock.d.ts +13 -0
  266. package/utils/FocusLock.js +139 -0
  267. package/wizard/Wizard.d.ts +1 -1
  268. package/wizard/Wizard.js +112 -58
  269. package/wizard/{Wizard.stories.jsx → Wizard.stories.tsx} +48 -19
  270. package/wizard/Wizard.test.js +141 -0
  271. package/wizard/types.d.ts +13 -12
  272. package/ThemeContext.js +0 -246
  273. package/V3Select/V3Select.js +0 -455
  274. package/V3Select/index.d.ts +0 -27
  275. package/V3Textarea/V3Textarea.js +0 -260
  276. package/V3Textarea/index.d.ts +0 -27
  277. package/chip/index.d.ts +0 -22
  278. package/common/RequiredComponent.js +0 -32
  279. package/date/Date.js +0 -373
  280. package/date/index.d.ts +0 -27
  281. package/footer/Footer.stories.jsx +0 -151
  282. package/input-text/Icons.js +0 -22
  283. package/input-text/InputText.js +0 -611
  284. package/input-text/index.d.ts +0 -36
  285. package/radio/Radio.d.ts +0 -4
  286. package/radio/Radio.js +0 -174
  287. package/radio/Radio.stories.tsx +0 -192
  288. package/radio/types.d.ts +0 -54
  289. package/resultsetTable/index.d.ts +0 -19
  290. package/select/index.d.ts +0 -131
  291. package/text-input/index.d.ts +0 -135
  292. package/textarea/index.d.ts +0 -117
  293. package/toggle/Toggle.js +0 -186
  294. package/toggle/index.d.ts +0 -21
  295. package/toggle-group/index.d.ts +0 -21
  296. package/upload/Upload.js +0 -201
  297. package/upload/buttons-upload/ButtonsUpload.js +0 -111
  298. package/upload/buttons-upload/Icons.js +0 -40
  299. package/upload/dragAndDropArea/DragAndDropArea.js +0 -225
  300. package/upload/dragAndDropArea/Icons.js +0 -39
  301. package/upload/file-upload/FileToUpload.js +0 -115
  302. package/upload/file-upload/Icons.js +0 -66
  303. package/upload/files-upload/FilesToUpload.js +0 -109
  304. package/upload/index.d.ts +0 -15
  305. package/upload/transaction/Icons.js +0 -160
  306. package/upload/transaction/Transaction.js +0 -104
  307. package/upload/transactions/Transactions.js +0 -94
  308. package/wizard/Icons.js +0 -65
  309. /package/{radio → badge}/types.js +0 -0
package/date/Date.js DELETED
@@ -1,373 +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 _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
13
-
14
- var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
15
-
16
- var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
17
-
18
- var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
19
-
20
- var _react = _interopRequireWildcard(require("react"));
21
-
22
- var _pickers = require("@material-ui/pickers");
23
-
24
- var _core = require("@material-ui/core");
25
-
26
- var _ClickAwayListener = _interopRequireDefault(require("@material-ui/core/ClickAwayListener"));
27
-
28
- var _Popover = _interopRequireDefault(require("@material-ui/core/Popover"));
29
-
30
- var _moment = _interopRequireDefault(require("moment"));
31
-
32
- var _dateFns = _interopRequireDefault(require("@date-io/date-fns"));
33
-
34
- var _styledComponents = _interopRequireWildcard(require("styled-components"));
35
-
36
- var _propTypes = _interopRequireDefault(require("prop-types"));
37
-
38
- var _InputText = _interopRequireDefault(require("../input-text/InputText"));
39
-
40
- var _variables = require("../common/variables.js");
41
-
42
- var _useTheme = _interopRequireDefault(require("../useTheme.js"));
43
-
44
- var _templateObject, _DxcDate$propTypes;
45
-
46
- 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); }
47
-
48
- 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; }
49
-
50
- var DxcDate = function DxcDate(_ref) {
51
- var value = _ref.value,
52
- _ref$format = _ref.format,
53
- format = _ref$format === void 0 ? "dd-MM-yyyy" : _ref$format,
54
- _ref$label = _ref.label,
55
- label = _ref$label === void 0 ? "" : _ref$label,
56
- name = _ref.name,
57
- _ref$disabled = _ref.disabled,
58
- disabled = _ref$disabled === void 0 ? false : _ref$disabled,
59
- _ref$required = _ref.required,
60
- required = _ref$required === void 0 ? false : _ref$required,
61
- _ref$assistiveText = _ref.assistiveText,
62
- assistiveText = _ref$assistiveText === void 0 ? "" : _ref$assistiveText,
63
- _ref$invalid = _ref.invalid,
64
- invalid = _ref$invalid === void 0 ? false : _ref$invalid,
65
- onChange = _ref.onChange,
66
- _ref$placeholder = _ref.placeholder,
67
- placeholder = _ref$placeholder === void 0 ? false : _ref$placeholder,
68
- _ref$onBlur = _ref.onBlur,
69
- onBlur = _ref$onBlur === void 0 ? "" : _ref$onBlur,
70
- margin = _ref.margin,
71
- _ref$size = _ref.size,
72
- size = _ref$size === void 0 ? "medium" : _ref$size,
73
- _ref$tabIndex = _ref.tabIndex,
74
- tabIndex = _ref$tabIndex === void 0 ? 0 : _ref$tabIndex;
75
-
76
- var _useState = (0, _react.useState)(""),
77
- _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
78
- innerValue = _useState2[0],
79
- setInnerValue = _useState2[1];
80
-
81
- var _useState3 = (0, _react.useState)(false),
82
- _useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
83
- isOpen = _useState4[0],
84
- setIsOpen = _useState4[1];
85
-
86
- var _useState5 = (0, _react.useState)(null),
87
- _useState6 = (0, _slicedToArray2["default"])(_useState5, 2),
88
- anchorEl = _useState6[0],
89
- setAnchorEl = _useState6[1];
90
-
91
- var colorsTheme = (0, _useTheme["default"])();
92
-
93
- var handleMenuItemClick = function handleMenuItemClick(date) {
94
- var stringValue = (0, _moment["default"])(date).format(format.toUpperCase());
95
- if (value == null) setInnerValue(stringValue);
96
- if (typeof onChange === "function") onChange({
97
- stringValue: stringValue,
98
- dateValue: date && date.toJSON() ? date : null
99
- });
100
- };
101
-
102
- var onChangeInput = function onChangeInput(string) {
103
- var momentDate = (0, _moment["default"])(string, format.toUpperCase(), true);
104
-
105
- if (value == null) {
106
- setInnerValue(string);
107
- }
108
-
109
- if (typeof onChange === "function") {
110
- onChange({
111
- stringValue: string,
112
- dateValue: momentDate.isValid() ? momentDate._d : null
113
- });
114
- }
115
- };
116
-
117
- var handlerInputBlur = function handlerInputBlur(inputString) {
118
- setInnerValue(inputString);
119
- if (onBlur) onBlur(inputString);
120
- };
121
-
122
- var getValueForPicker = function getValueForPicker() {
123
- return (0, _moment["default"])(value == null ? innerValue : value, format.toUpperCase(), true).format();
124
- };
125
-
126
- var openCalendar = function openCalendar(event) {
127
- if (event) {
128
- setIsOpen(!isOpen);
129
- setAnchorEl(event.currentTarget);
130
- }
131
- };
132
-
133
- var handlerPickerClose = function handlerPickerClose() {
134
- setIsOpen(false);
135
- handlerInputBlur(value == null ? innerValue : value);
136
- };
137
-
138
- var calendarSVG = function calendarSVG() {
139
- return /*#__PURE__*/_react["default"].createElement("svg", {
140
- xmlns: "http://www.w3.org/2000/svg",
141
- height: "24",
142
- viewBox: "0 0 24 24",
143
- width: "24",
144
- fill: "currentColor"
145
- }, /*#__PURE__*/_react["default"].createElement("path", {
146
- "data-testid": "calendarIcon",
147
- d: "M17 12h-5v5h5v-5zM16 1v2H8V1H6v2H5c-1.11 0-1.99.9-1.99 2L3 19c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2h-1V1h-2zm3 18H5V8h14v11z"
148
- }), /*#__PURE__*/_react["default"].createElement("path", {
149
- d: "M0 0h24v24H0z",
150
- fill: "none"
151
- }));
152
- };
153
-
154
- var dateTheme = (0, _core.createMuiTheme)({
155
- overrides: {
156
- MuiTypography: {
157
- root: {
158
- fontFamily: "".concat(colorsTheme.date.fontFamily, " !important")
159
- }
160
- },
161
- MuiPickersYearSelection: {
162
- container: {
163
- color: colorsTheme.date.pickerYearColor,
164
- "&::-webkit-scrollbar": {
165
- width: "3px"
166
- },
167
- "&::-webkit-scrollbar-track": {
168
- backgroundColor: "#D9D9D9",
169
- borderRadius: "3px"
170
- },
171
- "&::-webkit-scrollbar-thumb": {
172
- backgroundColor: "#666666",
173
- borderRadius: "3px"
174
- }
175
- }
176
- },
177
- MuiPickersToolbar: {
178
- toolbar: {
179
- backgroundColor: colorsTheme.date.pickerBackgroundColor,
180
- color: colorsTheme.date.pickerFontColor
181
- }
182
- },
183
- MuiIconButton: {
184
- root: {
185
- height: "36px",
186
- width: "36px",
187
- padding: "0px"
188
- }
189
- },
190
- MuiTouchRipple: {
191
- child: {
192
- opacity: "0"
193
- }
194
- },
195
- MuiButtonBase: {
196
- root: {
197
- "&:focus": {
198
- outline: colorsTheme.date.focusColor + " solid 2px"
199
- }
200
- }
201
- },
202
- MuiPickersBasePicker: {
203
- pickerView: {
204
- minWidth: "unset",
205
- maxWidth: "unset",
206
- minHeight: "unset",
207
- padding: "0px 10px",
208
- height: colorsTheme.date.pickerHeight,
209
- width: colorsTheme.date.pickerWidth,
210
- backgroundColor: colorsTheme.date.pickerBackgroundColor,
211
- fontFamily: colorsTheme.date.fontFamily
212
- }
213
- },
214
- MuiPickersToolbarText: {
215
- toolbarTxt: {
216
- color: colorsTheme.date.pickerActualDateColor,
217
- fontFamily: colorsTheme.date.fontFamily,
218
- fontSize: "2rem"
219
- },
220
- toolbarBtnSelected: {
221
- color: colorsTheme.date.pickerActualDateColor
222
- }
223
- },
224
- MuiPickersCalendarHeader: {
225
- transitionContainer: {
226
- color: colorsTheme.date.pickerMonthColor
227
- },
228
- dayLabel: {
229
- color: colorsTheme.date.pickerWeekLabelColor,
230
- fontFamily: colorsTheme.date.fontFamily
231
- },
232
- switchHeader: {
233
- backgroundColor: colorsTheme.white,
234
- color: colorsTheme.date.pickerFontColor
235
- },
236
- iconButton: {
237
- backgroundColor: colorsTheme.date.pickerBackgroundColorMonthArrows,
238
- "&:hover": {
239
- backgroundColor: colorsTheme.date.pickerBackgroundColorMonthArrows
240
- }
241
- }
242
- },
243
- MuiPickersCalendar: {
244
- week: {
245
- marginBottom: "2px"
246
- }
247
- },
248
- MuiPickersDay: {
249
- current: {
250
- border: colorsTheme.date.pickerActualDateColor + " 2px solid",
251
- color: colorsTheme.date.pickerFontColor
252
- },
253
- day: {
254
- fontFamily: colorsTheme.date.fontFamily,
255
- color: colorsTheme.date.pickerFontColor,
256
- "&:hover": {
257
- backgroundColor: colorsTheme.date.pickerHoverDateBackgroundColor,
258
- color: colorsTheme.date.pickerHoverDateFontColor
259
- }
260
- },
261
- daySelected: {
262
- backgroundColor: colorsTheme.date.pickerSelectedDateBackgroundColor,
263
- color: colorsTheme.date.pickerSelectedDateColor,
264
- "&:hover": {
265
- backgroundColor: colorsTheme.date.pickerSelectedDateBackgroundColor,
266
- color: colorsTheme.date.pickerSelectedDateColor,
267
- opacity: "1"
268
- }
269
- }
270
- },
271
- MuiPickersYear: {
272
- yearSelected: {
273
- color: colorsTheme.date.pickerSelectedDateColor,
274
- backgroundColor: colorsTheme.date.pickerSelectedDateBackgroundColor,
275
- margin: "0px 100px",
276
- borderRadius: "20px"
277
- },
278
- root: {
279
- "&:focus": {
280
- color: colorsTheme.date.pickerHoverDateFontColor,
281
- backgroundColor: colorsTheme.date.pickerHoverDateBackgroundColor
282
- }
283
- }
284
- },
285
- MuiPickersModal: {
286
- dialogAction: {
287
- color: "pink"
288
- }
289
- }
290
- }
291
- });
292
- return /*#__PURE__*/_react["default"].createElement(_styledComponents.ThemeProvider, {
293
- theme: colorsTheme
294
- }, /*#__PURE__*/_react["default"].createElement(_core.MuiThemeProvider, {
295
- theme: dateTheme
296
- }, /*#__PURE__*/_react["default"].createElement(_pickers.MuiPickersUtilsProvider, {
297
- utils: _dateFns["default"]
298
- }, /*#__PURE__*/_react["default"].createElement(StyledDPicker, {
299
- margin: margin
300
- }, /*#__PURE__*/_react["default"].createElement(_InputText["default"], {
301
- label: label,
302
- name: name,
303
- suffixIcon: calendarSVG,
304
- required: required,
305
- invalid: invalid,
306
- disabled: disabled,
307
- assistiveText: assistiveText,
308
- margin: margin,
309
- size: size,
310
- placeholder: placeholder ? format.toUpperCase() : null,
311
- value: value == null ? innerValue : value,
312
- onClickSuffix: openCalendar,
313
- onChange: onChangeInput,
314
- onBlur: onBlur && handlerInputBlur || null,
315
- tabIndex: tabIndex
316
- }), /*#__PURE__*/_react["default"].createElement(_Popover["default"], {
317
- open: isOpen,
318
- anchorEl: anchorEl,
319
- anchorOrigin: {
320
- vertical: "bottom",
321
- horizontal: "left"
322
- },
323
- transformOrigin: {
324
- vertical: "top",
325
- horizontal: "center"
326
- },
327
- PaperProps: {
328
- style: {
329
- marginTop: "10px"
330
- }
331
- }
332
- }, /*#__PURE__*/_react["default"].createElement(_ClickAwayListener["default"], {
333
- onClickAway: handlerPickerClose
334
- }, /*#__PURE__*/_react["default"].createElement(_core.Paper, null, /*#__PURE__*/_react["default"].createElement(_pickers.DatePicker, {
335
- variant: "static",
336
- value: getValueForPicker(),
337
- onChange: function onChange(date) {
338
- return handleMenuItemClick(date);
339
- },
340
- format: format,
341
- disabled: disabled
342
- }))))))));
343
- };
344
-
345
- var sizes = {
346
- medium: "240px",
347
- large: "480px",
348
- fillParent: "100%"
349
- };
350
-
351
- var StyledDPicker = _styledComponents["default"].div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])([""])));
352
-
353
- DxcDate.propTypes = (_DxcDate$propTypes = {
354
- value: _propTypes["default"].string,
355
- format: _propTypes["default"].string,
356
- label: _propTypes["default"].string,
357
- theme: _propTypes["default"].oneOf(["light", "dark", ""]),
358
- name: _propTypes["default"].string,
359
- disabled: _propTypes["default"].bool,
360
- required: _propTypes["default"].bool,
361
- placeholder: _propTypes["default"].bool,
362
- assistiveText: _propTypes["default"].string,
363
- invalid: _propTypes["default"].bool,
364
- onChange: _propTypes["default"].func,
365
- onBlur: _propTypes["default"].func
366
- }, (0, _defineProperty2["default"])(_DxcDate$propTypes, "onChange", _propTypes["default"].func), (0, _defineProperty2["default"])(_DxcDate$propTypes, "size", _propTypes["default"].oneOf((0, _toConsumableArray2["default"])(Object.keys(sizes)))), (0, _defineProperty2["default"])(_DxcDate$propTypes, "margin", _propTypes["default"].oneOfType([_propTypes["default"].shape({
367
- top: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
368
- bottom: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
369
- left: _propTypes["default"].oneOf(Object.keys(_variables.spaces)),
370
- right: _propTypes["default"].oneOf(Object.keys(_variables.spaces))
371
- }), _propTypes["default"].oneOf((0, _toConsumableArray2["default"])(Object.keys(_variables.spaces)))])), (0, _defineProperty2["default"])(_DxcDate$propTypes, "tabIndex", _propTypes["default"].number), _DxcDate$propTypes);
372
- var _default = DxcDate;
373
- exports["default"] = _default;
package/date/index.d.ts DELETED
@@ -1,27 +0,0 @@
1
- type Size = "small" | "medium" | "large" | "fillParent";
2
- type Space = "xxsmall" | "xsmall" | "small" | "medium" | "large" | "xlarge" | "xxlarge";
3
- type Margin = {
4
- top?: Space;
5
- bottom?: Space;
6
- left?: Space;
7
- right?: Space;
8
- };
9
-
10
- type Props = {
11
- value?: string;
12
- format?: string;
13
- label?: string;
14
- name?: string,
15
- disabled?: boolean;
16
- required?: boolean;
17
- assistiveText?: string;
18
- invalid?: boolean;
19
- onChange?: void;
20
- placeholder?: string;
21
- onBlur?: void;
22
- margin?: Space | Margin;
23
- size?: Size;
24
- tabIndex?: number;
25
- };
26
-
27
- export default function DxcDate(props: Props): JSX.Element;
@@ -1,151 +0,0 @@
1
- import React from "react";
2
- import DxcFooter from "./Footer";
3
- import Title from "../../.storybook/components/Title";
4
- import ExampleContainer from "../../.storybook/components/ExampleContainer";
5
-
6
- const social = [
7
- {
8
- href: "https://www.linkedin.com/company/dxctechnology",
9
- logo: (
10
- <svg version="1.1" id="Capa_1" x="0px" y="0px" viewBox="0 0 438.536 438.536" fill="currentColor">
11
- <g>
12
- <path
13
- d="M414.41,24.123C398.333,8.042,378.963,0,356.315,0H82.228C59.58,0,40.21,8.042,24.126,24.123
14
- C8.045,40.207,0.003,59.576,0.003,82.225v274.084c0,22.647,8.042,42.018,24.123,58.102c16.084,16.084,35.454,24.126,58.102,24.126
15
- h274.084c22.648,0,42.018-8.042,58.095-24.126c16.084-16.084,24.126-35.454,24.126-58.102V82.225
16
- C438.532,59.576,430.49,40.204,414.41,24.123z M133.618,367.157H67.666V169.016h65.952V367.157z M127.626,132.332
17
- c-6.851,6.567-15.893,9.851-27.124,9.851h-0.288c-10.848,0-19.648-3.284-26.407-9.851c-6.76-6.567-10.138-14.703-10.138-24.41
18
- c0-9.897,3.476-18.083,10.421-24.556c6.95-6.471,15.942-9.708,26.98-9.708c11.039,0,19.89,3.237,26.553,9.708
19
- c6.661,6.473,10.088,14.659,10.277,24.556C137.899,117.625,134.477,125.761,127.626,132.332z M370.873,367.157h-65.952v-105.92
20
- c0-29.879-11.036-44.823-33.116-44.823c-8.374,0-15.42,2.331-21.128,6.995c-5.715,4.661-9.996,10.324-12.847,16.991
21
- c-1.335,3.422-1.999,8.75-1.999,15.981v110.775h-65.952c0.571-119.529,0.571-185.579,0-198.142h65.952v27.974
22
- c13.867-21.681,33.558-32.544,59.101-32.544c22.84,0,41.21,7.52,55.104,22.554c13.895,15.037,20.841,37.214,20.841,66.519v113.64
23
- H370.873z"
24
- />
25
- </g>
26
- </svg>
27
- ),
28
- },
29
- {
30
- href: "https://twitter.com/dxctechnology",
31
- logo: (
32
- <svg version="1.1" id="Capa_1" x="0px" y="0px" viewBox="0 0 438.536 438.536" fill="currentColor">
33
- <g>
34
- <path
35
- d="M414.41,24.123C398.333,8.042,378.963,0,356.315,0H82.228C59.58,0,40.21,8.042,24.126,24.123
36
- C8.045,40.207,0.003,59.576,0.003,82.225v274.084c0,22.647,8.042,42.018,24.123,58.102c16.084,16.084,35.454,24.126,58.102,24.126
37
- h274.084c22.648,0,42.018-8.042,58.095-24.126c16.084-16.084,24.126-35.454,24.126-58.102V82.225
38
- C438.532,59.576,430.49,40.204,414.41,24.123z M335.471,168.735c0.191,1.713,0.288,4.278,0.288,7.71
39
- c0,15.989-2.334,32.025-6.995,48.104c-4.661,16.087-11.8,31.504-21.416,46.254c-9.606,14.749-21.074,27.791-34.396,39.115
40
- c-13.325,11.32-29.311,20.365-47.968,27.117c-18.648,6.762-38.637,10.143-59.953,10.143c-33.116,0-63.76-8.952-91.931-26.836
41
- c4.568,0.568,9.329,0.855,14.275,0.855c27.6,0,52.439-8.565,74.519-25.7c-12.941-0.185-24.506-4.179-34.688-11.991
42
- c-10.185-7.803-17.273-17.699-21.271-29.691c4.947,0.76,8.658,1.137,11.132,1.137c4.187,0,9.042-0.76,14.56-2.279
43
- c-13.894-2.669-25.598-9.562-35.115-20.697c-9.519-11.136-14.277-23.84-14.277-38.114v-0.571
44
- c10.085,4.755,19.602,7.229,28.549,7.422c-17.321-11.613-25.981-28.265-25.981-49.963c0-10.66,2.758-20.747,8.278-30.264
45
- c15.035,18.464,33.311,33.213,54.816,44.252c21.507,11.038,44.54,17.227,69.092,18.558c-0.95-3.616-1.427-8.186-1.427-13.704
46
- c0-16.562,5.853-30.692,17.56-42.399c11.703-11.706,25.837-17.561,42.394-17.561c17.515,0,32.079,6.283,43.688,18.846
47
- c13.134-2.474,25.892-7.33,38.26-14.56c-4.757,14.652-13.613,25.788-26.55,33.402c12.368-1.716,23.88-4.95,34.537-9.708
48
- C357.458,149.793,347.462,160.166,335.471,168.735z"
49
- />
50
- </g>
51
- </svg>
52
- ),
53
- },
54
- {
55
- href: "https://www.facebook.com/DXCTechnology/",
56
- logo: (
57
- <svg
58
- version="1.1"
59
- id="Capa_1"
60
- x="0px"
61
- y="0px"
62
- viewBox="0 0 438.536 438.536"
63
- fill="currentColor"
64
- width="1000px"
65
- height="500px"
66
- >
67
- <g>
68
- <path
69
- d="M414.41,24.123C398.333,8.042,378.963,0,356.315,0H82.228C59.58,0,40.21,8.042,24.126,24.123
70
- C8.045,40.207,0.003,59.576,0.003,82.225v274.084c0,22.647,8.042,42.018,24.123,58.102c16.084,16.084,35.454,24.126,58.102,24.126
71
- h274.084c22.648,0,42.018-8.042,58.095-24.126c16.084-16.084,24.126-35.454,24.126-58.102V82.225
72
- C438.532,59.576,430.49,40.204,414.41,24.123z M373.155,225.548h-49.963V406.84h-74.802V225.548H210.99V163.02h37.401v-37.402
73
- c0-26.838,6.283-47.107,18.843-60.813c12.559-13.706,33.304-20.555,62.242-20.555h49.963v62.526h-31.401
74
- c-10.663,0-17.467,1.853-20.417,5.568c-2.949,3.711-4.428,10.23-4.428,19.558v31.119h56.534L373.155,225.548z"
75
- />
76
- </g>
77
- </svg>
78
- ),
79
- },
80
- ];
81
-
82
- const bottom = [
83
- {
84
- href: "https://www.linkedin.com/company/dxctechnology",
85
- text: "Linkedin",
86
- },
87
- {
88
- href: "https://twitter.com/dxctechnology",
89
- text: "Twitter",
90
- },
91
- {
92
- href: "https://www.facebook.com/DXCTechnology/",
93
- text: "Facebook",
94
- },
95
- ];
96
-
97
- export default {
98
- title: "Footer",
99
- component: DxcFooter,
100
- };
101
-
102
- export const Chromatic = () => (
103
- <>
104
- <ExampleContainer>
105
- <Title title="Default" theme="light" level={4} />
106
- <DxcFooter />
107
- </ExampleContainer>
108
- <ExampleContainer>
109
- <Title title="With children, copyright, bottom links and social links" theme="light" level={4} />
110
- <DxcFooter copyright="Copyright" socialLinks={social} bottomLinks={bottom}>
111
- <div>
112
- <a href="https://www.linkedin.com/company/dxctechnology">Linkedin</a>
113
- </div>
114
- </DxcFooter>
115
- </ExampleContainer>
116
- <Title title="Margins" theme="light" level={2} />
117
- <ExampleContainer>
118
- <Title title="Xxsmall margin" theme="light" level={4} />
119
- <DxcFooter margin="xxsmall"></DxcFooter>
120
- <Title title="Xsmall margin" theme="light" level={4} />
121
- <DxcFooter margin="xsmall"></DxcFooter>
122
- <Title title="Small margin" theme="light" level={4} />
123
- <DxcFooter margin="small"></DxcFooter>
124
- <Title title="Medium margin" theme="light" level={4} />
125
- <DxcFooter margin="medium"></DxcFooter>
126
- <Title title="Large margin" theme="light" level={4} />
127
- <DxcFooter margin="large"></DxcFooter>
128
- <Title title="Xlarge margin" theme="light" level={4} />
129
- <DxcFooter margin="xlarge"></DxcFooter>
130
- <Title title="Xxlarge margin" theme="light" level={4} />
131
- <DxcFooter margin="xxlarge"></DxcFooter>
132
- </ExampleContainer>
133
- <Title title="Padding" theme="light" level={2} />
134
- <ExampleContainer>
135
- <Title title="Xxsmall padding" theme="light" level={4} />
136
- <DxcFooter padding="xxsmall"></DxcFooter>
137
- <Title title="Xsmall padding" theme="light" level={4} />
138
- <DxcFooter padding="xsmall"></DxcFooter>
139
- <Title title="Small padding" theme="light" level={4} />
140
- <DxcFooter padding="small"></DxcFooter>
141
- <Title title="Medium padding" theme="light" level={4} />
142
- <DxcFooter padding="medium"></DxcFooter>
143
- <Title title="Large padding" theme="light" level={4} />
144
- <DxcFooter padding="large"></DxcFooter>
145
- <Title title="Xlarge padding" theme="light" level={4} />
146
- <DxcFooter padding="xlarge"></DxcFooter>
147
- <Title title="Xxlarge padding" theme="light" level={4} />
148
- <DxcFooter padding="xxlarge"></DxcFooter>
149
- </ExampleContainer>
150
- </>
151
- );
@@ -1,22 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
-
5
- Object.defineProperty(exports, "__esModule", {
6
- value: true
7
- });
8
- exports["default"] = void 0;
9
-
10
- var _react = _interopRequireDefault(require("react"));
11
-
12
- var _default = /*#__PURE__*/_react["default"].createElement("svg", {
13
- xmlns: "http://www.w3.org/2000/svg",
14
- height: "24px",
15
- viewBox: "0 0 24 24",
16
- width: "24px",
17
- fill: "currentColor"
18
- }, /*#__PURE__*/_react["default"].createElement("path", {
19
- d: "M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-2h2v2zm0-4h-2V7h2v6z"
20
- }));
21
-
22
- exports["default"] = _default;