@dxc-technology/halstack-react 0.0.0-bfa479f → 0.0.0-bfdc357

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 (370) hide show
  1. package/BackgroundColorContext.js +50 -0
  2. package/ThemeContext.js +246 -0
  3. package/V3Select/V3Select.js +455 -0
  4. package/V3Select/index.d.ts +27 -0
  5. package/V3Textarea/V3Textarea.js +260 -0
  6. package/V3Textarea/index.d.ts +27 -0
  7. package/accordion/Accordion.d.ts +4 -0
  8. package/accordion/Accordion.js +258 -0
  9. package/accordion/types.d.ts +68 -0
  10. package/accordion/types.js +5 -0
  11. package/accordion-group/AccordionGroup.d.ts +7 -0
  12. package/accordion-group/AccordionGroup.js +170 -0
  13. package/accordion-group/types.d.ts +72 -0
  14. package/accordion-group/types.js +5 -0
  15. package/alert/Alert.d.ts +4 -0
  16. package/alert/Alert.js +290 -0
  17. package/alert/Alert.stories.tsx +170 -0
  18. package/alert/types.d.ts +49 -0
  19. package/alert/types.js +5 -0
  20. package/badge/Badge.js +59 -0
  21. package/box/Box.d.ts +4 -0
  22. package/box/Box.js +126 -0
  23. package/box/Box.stories.tsx +132 -0
  24. package/box/types.d.ts +43 -0
  25. package/box/types.js +5 -0
  26. package/button/Button.d.ts +4 -0
  27. package/button/Button.js +177 -0
  28. package/button/Button.stories.tsx +276 -0
  29. package/button/types.d.ts +57 -0
  30. package/button/types.js +5 -0
  31. package/card/Card.d.ts +4 -0
  32. package/card/Card.js +164 -0
  33. package/card/types.d.ts +69 -0
  34. package/card/types.js +5 -0
  35. package/checkbox/Checkbox.d.ts +4 -0
  36. package/checkbox/Checkbox.js +253 -0
  37. package/checkbox/Checkbox.stories.tsx +192 -0
  38. package/checkbox/types.d.ts +60 -0
  39. package/checkbox/types.js +5 -0
  40. package/{dist/chip → chip}/Chip.js +74 -76
  41. package/chip/Chip.stories.tsx +121 -0
  42. package/chip/index.d.ts +22 -0
  43. package/{dist/common → common}/OpenSans.css +0 -0
  44. package/{dist/common → common}/RequiredComponent.js +3 -11
  45. package/{dist/common → common}/fonts/OpenSans-Bold.ttf +0 -0
  46. package/{dist/common → common}/fonts/OpenSans-BoldItalic.ttf +0 -0
  47. package/{dist/common → common}/fonts/OpenSans-ExtraBold.ttf +0 -0
  48. package/{dist/common → common}/fonts/OpenSans-ExtraBoldItalic.ttf +0 -0
  49. package/{dist/common → common}/fonts/OpenSans-Italic.ttf +0 -0
  50. package/{dist/common → common}/fonts/OpenSans-Light.ttf +0 -0
  51. package/{dist/common → common}/fonts/OpenSans-LightItalic.ttf +0 -0
  52. package/{dist/common → common}/fonts/OpenSans-Regular.ttf +0 -0
  53. package/{dist/common → common}/fonts/OpenSans-SemiBold.ttf +0 -0
  54. package/{dist/common → common}/fonts/OpenSans-SemiBoldItalic.ttf +0 -0
  55. package/{dist/common → common}/utils.js +0 -0
  56. package/common/variables.js +1577 -0
  57. package/{dist/date → date}/Date.js +71 -55
  58. package/date/index.d.ts +27 -0
  59. package/date-input/DateInput.d.ts +4 -0
  60. package/date-input/DateInput.js +361 -0
  61. package/date-input/DateInput.stories.tsx +138 -0
  62. package/date-input/types.d.ts +100 -0
  63. package/date-input/types.js +5 -0
  64. package/dialog/Dialog.d.ts +4 -0
  65. package/dialog/Dialog.js +165 -0
  66. package/dialog/Dialog.stories.tsx +212 -0
  67. package/dialog/types.d.ts +43 -0
  68. package/dialog/types.js +5 -0
  69. package/dropdown/Dropdown.d.ts +4 -0
  70. package/dropdown/Dropdown.js +417 -0
  71. package/dropdown/types.d.ts +89 -0
  72. package/dropdown/types.js +5 -0
  73. package/file-input/FileInput.d.ts +4 -0
  74. package/file-input/FileInput.js +511 -0
  75. package/file-input/FileItem.d.ts +14 -0
  76. package/file-input/FileItem.js +182 -0
  77. package/file-input/types.d.ts +87 -0
  78. package/file-input/types.js +5 -0
  79. package/footer/Footer.d.ts +4 -0
  80. package/footer/Footer.js +266 -0
  81. package/footer/Footer.stories.jsx +151 -0
  82. package/footer/Icons.js +77 -0
  83. package/footer/types.d.ts +61 -0
  84. package/footer/types.js +5 -0
  85. package/header/Header.d.ts +7 -0
  86. package/header/Header.js +324 -0
  87. package/header/Header.stories.tsx +162 -0
  88. package/header/Icons.js +34 -0
  89. package/header/types.d.ts +45 -0
  90. package/header/types.js +5 -0
  91. package/heading/Heading.d.ts +4 -0
  92. package/heading/Heading.js +159 -0
  93. package/heading/types.d.ts +33 -0
  94. package/heading/types.js +5 -0
  95. package/input-text/Icons.js +22 -0
  96. package/input-text/InputText.js +611 -0
  97. package/input-text/index.d.ts +36 -0
  98. package/{dist/layout → layout}/ApplicationLayout.js +35 -131
  99. package/layout/Icons.js +55 -0
  100. package/link/Link.d.ts +3 -0
  101. package/link/Link.js +161 -0
  102. package/link/Link.stories.tsx +146 -0
  103. package/link/types.d.ts +74 -0
  104. package/link/types.js +5 -0
  105. package/main.d.ts +44 -0
  106. package/{dist/main.js → main.js} +121 -69
  107. package/number-input/NumberInput.d.ts +4 -0
  108. package/number-input/NumberInput.js +86 -0
  109. package/number-input/NumberInput.stories.tsx +115 -0
  110. package/number-input/NumberInputContext.js +16 -0
  111. package/number-input/types.d.ts +117 -0
  112. package/number-input/types.js +5 -0
  113. package/package.json +32 -23
  114. package/paginator/Icons.js +66 -0
  115. package/paginator/Paginator.d.ts +4 -0
  116. package/paginator/Paginator.js +198 -0
  117. package/paginator/Paginator.stories.tsx +63 -0
  118. package/paginator/types.d.ts +38 -0
  119. package/paginator/types.js +5 -0
  120. package/password-input/PasswordInput.d.ts +4 -0
  121. package/password-input/PasswordInput.js +162 -0
  122. package/password-input/PasswordInput.stories.tsx +131 -0
  123. package/password-input/types.d.ts +100 -0
  124. package/password-input/types.js +5 -0
  125. package/progress-bar/ProgressBar.d.ts +4 -0
  126. package/progress-bar/ProgressBar.js +170 -0
  127. package/progress-bar/ProgressBar.stories.jsx +58 -0
  128. package/progress-bar/types.d.ts +37 -0
  129. package/progress-bar/types.js +5 -0
  130. package/radio/Radio.d.ts +4 -0
  131. package/radio/Radio.js +174 -0
  132. package/radio/Radio.stories.tsx +192 -0
  133. package/radio/types.d.ts +54 -0
  134. package/radio/types.js +5 -0
  135. package/{dist/resultsetTable → resultsetTable}/ResultsetTable.js +77 -135
  136. package/resultsetTable/index.d.ts +19 -0
  137. package/select/Select.js +865 -0
  138. package/select/Select.stories.tsx +572 -0
  139. package/select/index.d.ts +131 -0
  140. package/sidenav/Sidenav.d.ts +9 -0
  141. package/sidenav/Sidenav.js +136 -0
  142. package/sidenav/types.d.ts +50 -0
  143. package/sidenav/types.js +5 -0
  144. package/slider/Slider.d.ts +4 -0
  145. package/slider/Slider.js +317 -0
  146. package/slider/Slider.stories.tsx +177 -0
  147. package/slider/types.d.ts +78 -0
  148. package/slider/types.js +5 -0
  149. package/spinner/Spinner.d.ts +4 -0
  150. package/spinner/Spinner.js +250 -0
  151. package/spinner/Spinner.stories.jsx +102 -0
  152. package/spinner/types.d.ts +32 -0
  153. package/spinner/types.js +5 -0
  154. package/switch/Switch.d.ts +4 -0
  155. package/switch/Switch.js +179 -0
  156. package/switch/Switch.stories.tsx +160 -0
  157. package/switch/types.d.ts +58 -0
  158. package/switch/types.js +5 -0
  159. package/table/Table.d.ts +4 -0
  160. package/table/Table.js +118 -0
  161. package/table/Table.stories.jsx +276 -0
  162. package/table/types.d.ts +21 -0
  163. package/table/types.js +5 -0
  164. package/tabs/Tabs.d.ts +4 -0
  165. package/tabs/Tabs.js +211 -0
  166. package/tabs/types.d.ts +71 -0
  167. package/tabs/types.js +5 -0
  168. package/tag/Tag.d.ts +4 -0
  169. package/tag/Tag.js +193 -0
  170. package/tag/Tag.stories.tsx +145 -0
  171. package/tag/types.d.ts +60 -0
  172. package/tag/types.js +5 -0
  173. package/text-input/TextInput.js +825 -0
  174. package/text-input/index.d.ts +135 -0
  175. package/textarea/Textarea.js +317 -0
  176. package/textarea/Textarea.stories.jsx +135 -0
  177. package/textarea/index.d.ts +117 -0
  178. package/{dist/toggle → toggle}/Toggle.js +15 -49
  179. package/toggle/index.d.ts +21 -0
  180. package/toggle-group/ToggleGroup.js +243 -0
  181. package/toggle-group/ToggleGroup.stories.tsx +178 -0
  182. package/toggle-group/index.d.ts +21 -0
  183. package/{dist/upload → upload}/Upload.js +11 -19
  184. package/upload/buttons-upload/ButtonsUpload.js +111 -0
  185. package/upload/buttons-upload/Icons.js +40 -0
  186. package/upload/dragAndDropArea/DragAndDropArea.js +225 -0
  187. package/upload/dragAndDropArea/Icons.js +39 -0
  188. package/upload/file-upload/FileToUpload.js +115 -0
  189. package/upload/file-upload/Icons.js +66 -0
  190. package/{dist/upload → upload}/files-upload/FilesToUpload.js +14 -28
  191. package/upload/index.d.ts +15 -0
  192. package/upload/transaction/Icons.js +160 -0
  193. package/upload/transaction/Transaction.js +104 -0
  194. package/upload/transactions/Transactions.js +94 -0
  195. package/{dist/useTheme.js → useTheme.js} +0 -0
  196. package/wizard/Icons.js +65 -0
  197. package/wizard/Wizard.d.ts +4 -0
  198. package/wizard/Wizard.js +231 -0
  199. package/wizard/Wizard.stories.jsx +224 -0
  200. package/wizard/types.d.ts +64 -0
  201. package/wizard/types.js +5 -0
  202. package/README.md +0 -66
  203. package/babel.config.js +0 -8
  204. package/dist/BackgroundColorContext.js +0 -46
  205. package/dist/ThemeContext.js +0 -216
  206. package/dist/accordion/Accordion.js +0 -284
  207. package/dist/accordion/Accordion.stories.js +0 -207
  208. package/dist/accordion/readme.md +0 -96
  209. package/dist/accordion-group/AccordionGroup.js +0 -154
  210. package/dist/accordion-group/AccordionGroup.stories.js +0 -207
  211. package/dist/accordion-group/readme.md +0 -70
  212. package/dist/alert/Alert.js +0 -318
  213. package/dist/alert/Alert.stories.js +0 -158
  214. package/dist/alert/close.svg +0 -4
  215. package/dist/alert/error.svg +0 -4
  216. package/dist/alert/info.svg +0 -4
  217. package/dist/alert/readme.md +0 -43
  218. package/dist/alert/success.svg +0 -4
  219. package/dist/alert/warning.svg +0 -4
  220. package/dist/badge/Badge.js +0 -40
  221. package/dist/box/Box.js +0 -147
  222. package/dist/button/Button.js +0 -219
  223. package/dist/button/Button.stories.js +0 -224
  224. package/dist/button/readme.md +0 -93
  225. package/dist/card/Card.js +0 -247
  226. package/dist/checkbox/Checkbox.js +0 -233
  227. package/dist/checkbox/Checkbox.stories.js +0 -144
  228. package/dist/checkbox/readme.md +0 -116
  229. package/dist/common/variables.js +0 -521
  230. package/dist/date/Date.stories.js +0 -205
  231. package/dist/date/calendar.svg +0 -1
  232. package/dist/date/calendar_dark.svg +0 -1
  233. package/dist/date/readme.md +0 -73
  234. package/dist/dialog/Dialog.js +0 -203
  235. package/dist/dialog/Dialog.stories.js +0 -217
  236. package/dist/dialog/readme.md +0 -32
  237. package/dist/dropdown/Dropdown.js +0 -456
  238. package/dist/dropdown/Dropdown.stories.js +0 -249
  239. package/dist/dropdown/baseline-arrow_drop_down.svg +0 -1
  240. package/dist/dropdown/baseline-arrow_drop_down_wh.svg +0 -4
  241. package/dist/dropdown/baseline-arrow_drop_up.svg +0 -1
  242. package/dist/dropdown/baseline-arrow_drop_up_wh.svg +0 -4
  243. package/dist/dropdown/readme.md +0 -69
  244. package/dist/footer/Footer.js +0 -367
  245. package/dist/footer/Footer.stories.js +0 -94
  246. package/dist/footer/dxc_logo_wht.png +0 -0
  247. package/dist/footer/readme.md +0 -41
  248. package/dist/header/Header.js +0 -385
  249. package/dist/header/Header.stories.js +0 -176
  250. package/dist/header/close_icon.svg +0 -1
  251. package/dist/header/dxc_logo_black.png +0 -0
  252. package/dist/header/dxc_logo_blk_rgb.svg +0 -6
  253. package/dist/header/dxc_logo_white.png +0 -0
  254. package/dist/header/hamb_menu_black.svg +0 -1
  255. package/dist/header/hamb_menu_white.svg +0 -1
  256. package/dist/header/readme.md +0 -33
  257. package/dist/heading/Heading.js +0 -163
  258. package/dist/input-text/InputText.js +0 -609
  259. package/dist/input-text/InputText.stories.js +0 -209
  260. package/dist/input-text/error.svg +0 -1
  261. package/dist/input-text/readme.md +0 -91
  262. package/dist/layout/facebook.svg +0 -45
  263. package/dist/layout/linkedin.svg +0 -50
  264. package/dist/layout/twitter.svg +0 -53
  265. package/dist/link/Link.js +0 -200
  266. package/dist/link/readme.md +0 -51
  267. package/dist/paginator/Paginator.js +0 -261
  268. package/dist/paginator/images/next.svg +0 -3
  269. package/dist/paginator/images/nextPage.svg +0 -3
  270. package/dist/paginator/images/previous.svg +0 -3
  271. package/dist/paginator/images/previousPage.svg +0 -3
  272. package/dist/paginator/readme.md +0 -50
  273. package/dist/progress-bar/ProgressBar.js +0 -192
  274. package/dist/progress-bar/ProgressBar.stories.js +0 -280
  275. package/dist/progress-bar/readme.md +0 -63
  276. package/dist/radio/Radio.js +0 -190
  277. package/dist/radio/Radio.stories.js +0 -166
  278. package/dist/radio/readme.md +0 -70
  279. package/dist/resultsetTable/arrow_downward-24px_wht.svg +0 -1
  280. package/dist/resultsetTable/arrow_upward-24px_wht.svg +0 -1
  281. package/dist/resultsetTable/unfold_more-24px_wht.svg +0 -1
  282. package/dist/select/Select.js +0 -490
  283. package/dist/select/Select.stories.js +0 -235
  284. package/dist/select/readme.md +0 -72
  285. package/dist/sidenav/Sidenav.js +0 -155
  286. package/dist/slider/Slider.js +0 -267
  287. package/dist/slider/Slider.stories.js +0 -241
  288. package/dist/slider/readme.md +0 -64
  289. package/dist/spinner/Spinner.js +0 -198
  290. package/dist/spinner/Spinner.stories.js +0 -183
  291. package/dist/spinner/readme.md +0 -65
  292. package/dist/switch/Switch.js +0 -194
  293. package/dist/switch/Switch.stories.js +0 -134
  294. package/dist/switch/readme.md +0 -133
  295. package/dist/table/Table.js +0 -98
  296. package/dist/tabs/Tabs.js +0 -325
  297. package/dist/tabs/Tabs.stories.js +0 -130
  298. package/dist/tabs/readme.md +0 -78
  299. package/dist/tabs-for-sections/TabsForSections.js +0 -92
  300. package/dist/tabs-for-sections/readme.md +0 -78
  301. package/dist/tag/Tag.js +0 -268
  302. package/dist/textarea/Textarea.js +0 -238
  303. package/dist/toggle/Toggle.stories.js +0 -297
  304. package/dist/toggle/readme.md +0 -80
  305. package/dist/toggle-group/ToggleGroup.js +0 -223
  306. package/dist/toggle-group/readme.md +0 -82
  307. package/dist/upload/Upload.stories.js +0 -72
  308. package/dist/upload/buttons-upload/ButtonsUpload.js +0 -123
  309. package/dist/upload/buttons-upload/drag-drop-icon.svg +0 -4
  310. package/dist/upload/buttons-upload/upload-button.svg +0 -1
  311. package/dist/upload/dragAndDropArea/DragAndDropArea.js +0 -293
  312. package/dist/upload/dragAndDropArea/upload_drop.svg +0 -4
  313. package/dist/upload/dragAndDropArea/upload_file.svg +0 -4
  314. package/dist/upload/file-upload/FileToUpload.js +0 -162
  315. package/dist/upload/file-upload/audio-icon.svg +0 -4
  316. package/dist/upload/file-upload/close.svg +0 -4
  317. package/dist/upload/file-upload/file-icon.svg +0 -4
  318. package/dist/upload/file-upload/video-icon.svg +0 -4
  319. package/dist/upload/readme.md +0 -37
  320. package/dist/upload/transaction/Transaction.js +0 -152
  321. package/dist/upload/transaction/audio-icon-err.svg +0 -4
  322. package/dist/upload/transaction/audio-icon.svg +0 -4
  323. package/dist/upload/transaction/error-icon.svg +0 -4
  324. package/dist/upload/transaction/file-icon-err.svg +0 -4
  325. package/dist/upload/transaction/file-icon.svg +0 -4
  326. package/dist/upload/transaction/image-icon-err.svg +0 -4
  327. package/dist/upload/transaction/image-icon.svg +0 -4
  328. package/dist/upload/transaction/success-icon.svg +0 -4
  329. package/dist/upload/transaction/video-icon-err.svg +0 -4
  330. package/dist/upload/transaction/video-icon.svg +0 -4
  331. package/dist/upload/transactions/Transactions.js +0 -122
  332. package/dist/wizard/Wizard.js +0 -355
  333. package/dist/wizard/invalid_icon.svg +0 -6
  334. package/dist/wizard/valid_icon.svg +0 -6
  335. package/dist/wizard/validation-wrong.svg +0 -6
  336. package/test/Accordion.test.js +0 -33
  337. package/test/AccordionGroup.test.js +0 -125
  338. package/test/Alert.test.js +0 -53
  339. package/test/Box.test.js +0 -10
  340. package/test/Button.test.js +0 -18
  341. package/test/Card.test.js +0 -30
  342. package/test/Checkbox.test.js +0 -45
  343. package/test/Chip.test.js +0 -25
  344. package/test/Date.test.js +0 -393
  345. package/test/Dialog.test.js +0 -23
  346. package/test/Dropdown.test.js +0 -130
  347. package/test/Footer.test.js +0 -99
  348. package/test/Header.test.js +0 -39
  349. package/test/Heading.test.js +0 -35
  350. package/test/InputText.test.js +0 -240
  351. package/test/Link.test.js +0 -42
  352. package/test/Paginator.test.js +0 -177
  353. package/test/ProgressBar.test.js +0 -35
  354. package/test/Radio.test.js +0 -37
  355. package/test/ResultsetTable.test.js +0 -330
  356. package/test/Select.test.js +0 -192
  357. package/test/Sidenav.test.js +0 -45
  358. package/test/Slider.test.js +0 -82
  359. package/test/Spinner.test.js +0 -27
  360. package/test/Switch.test.js +0 -45
  361. package/test/Table.test.js +0 -36
  362. package/test/Tabs.test.js +0 -109
  363. package/test/TabsForSections.test.js +0 -34
  364. package/test/Tag.test.js +0 -32
  365. package/test/TextArea.test.js +0 -52
  366. package/test/ToggleGroup.test.js +0 -81
  367. package/test/Upload.test.js +0 -60
  368. package/test/Wizard.test.js +0 -130
  369. package/test/mocks/pngMock.js +0 -1
  370. package/test/mocks/svgMock.js +0 -1
@@ -1,217 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
-
5
- var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
6
-
7
- var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
8
-
9
- var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
10
-
11
- var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
12
-
13
- var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
14
-
15
- var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
16
-
17
- var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
18
-
19
- var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
20
-
21
- var _react = _interopRequireDefault(require("react"));
22
-
23
- var _react2 = require("@storybook/react");
24
-
25
- var _addonActions = require("@storybook/addon-actions");
26
-
27
- require("../common/OpenSans.css");
28
-
29
- var _addonKnobs = require("@storybook/addon-knobs");
30
-
31
- var _readme = _interopRequireDefault(require("./readme.md"));
32
-
33
- var _Dialog = _interopRequireDefault(require("./Dialog"));
34
-
35
- var _Button = _interopRequireDefault(require("../button/Button"));
36
-
37
- var _Switch = _interopRequireDefault(require("../switch/Switch"));
38
-
39
- var _Date = _interopRequireDefault(require("../date/Date"));
40
-
41
- var _InputText = _interopRequireDefault(require("../input-text/InputText"));
42
-
43
- var onChange = (0, _addonActions.action)("onChange");
44
-
45
- onChange.toString = function () {
46
- return "onChangeHandler";
47
- };
48
-
49
- (0, _react2.storiesOf)("Form Components|Dialog", module).add("Component", function () {
50
- var ControlledStory =
51
- /*#__PURE__*/
52
- function (_React$Component) {
53
- (0, _inherits2["default"])(ControlledStory, _React$Component);
54
-
55
- function ControlledStory(props) {
56
- var _this;
57
-
58
- (0, _classCallCheck2["default"])(this, ControlledStory);
59
- _this = (0, _possibleConstructorReturn2["default"])(this, (0, _getPrototypeOf2["default"])(ControlledStory).call(this, props));
60
- (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "dialogHandler", function () {
61
- _this.setState({
62
- opened: !_this.state.opened
63
- });
64
- });
65
- (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "dialogHandler1", function () {
66
- _this.setState({
67
- opened1: !_this.state.opened1
68
- });
69
- });
70
- (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "dialogHandler2", function () {
71
- _this.setState({
72
- opened2: !_this.state.opened2
73
- });
74
- });
75
- (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "contentHandler", function () {
76
- _this.setState({
77
- content: !_this.state.content
78
- });
79
- });
80
- _this.state = {
81
- opened: false,
82
- opened1: false,
83
- opened2: false,
84
- content: false
85
- };
86
- return _this;
87
- }
88
-
89
- (0, _createClass2["default"])(ControlledStory, [{
90
- key: "render",
91
- value: function render() {
92
- return _react["default"].createElement("div", null, _react["default"].createElement(_Dialog["default"], {
93
- isVisible: this.state.opened,
94
- isCloseVisible: true,
95
- onClose: this.dialogHandler,
96
- overlay: true
97
- }, _react["default"].createElement("div", {
98
- style: {
99
- display: "flex",
100
- justifyContent: "center",
101
- width: "100%"
102
- }
103
- }, _react["default"].createElement(_Switch["default"], {
104
- label: "Content",
105
- checked: false,
106
- onChange: this.contentHandler
107
- })), this.state.content && _react["default"].createElement("div", {
108
- style: {
109
- fontFamily: "Open Sans, sans serif"
110
- }
111
- }, _react["default"].createElement("p", null, "Lorem ipsum dolor sit amet consectetur adipiscing elit aliquam class orci, est lectus eros praesent rhoncus dui etiam nascetur a mauris, luctus bibendum facilisis senectus sodales lobortis condimentum porta posuere. Massa varius ac imperdiet mauris quis rhoncus, nisl interdum gravida ullamcorper aliquam aptent pellentesque, consequat leo quam nec montes. Ridiculus mollis augue nam erat volutpat nibh congue, nostra habitasse dignissim pulvinar libero iaculis taciti et, bibendum morbi potenti lobortis purus laoreet."), _react["default"].createElement("p", null, "Netus justo auctor consequat enim potenti et luctus dis, felis facilisi varius conubia mollis gravida neque integer, phasellus tempus congue eu donec egestas metus. Volutpat blandit vehicula posuere montes purus leo inceptos magnis, molestie justo sodales massa laoreet pharetra cum lacus, nulla curabitur cursus per maecenas auctor iaculis. Aliquet ultricies litora lectus integer molestie sociosqu dictum sagittis vel erat porttitor quam vitae, class ultrices vestibulum fusce potenti natoque nam feugiat sapien eleifend eros nisl. Laoreet facilisi fusce est massa fames pellentesque magnis sem, eros pharetra montes ornare volutpat conubia vestibulum quisque, nisl taciti malesuada enim ridiculus venenatis sagittis."))), _react["default"].createElement(_Button["default"], {
112
- onClick: this.dialogHandler,
113
- label: "Click me"
114
- }), _react["default"].createElement(_Dialog["default"], {
115
- isVisible: this.state.opened1,
116
- isCloseVisible: true,
117
- onClose: this.dialogHandler1,
118
- overlay: false
119
- }, _react["default"].createElement("div", {
120
- style: {
121
- fontFamily: "Open Sans, sans serif"
122
- }
123
- }, _react["default"].createElement("p", null, "Lorem ipsum dolor sit amet consectetur adipiscing elit aliquam class orci, est lectus eros praesent rhoncus dui etiam nascetur a mauris, luctus bibendum facilisis senectus sodales lobortis condimentum porta posuere. Massa varius ac imperdiet mauris quis rhoncus, nisl interdum gravida ullamcorper aliquam aptent pellentesque, consequat leo quam nec montes. Ridiculus mollis augue nam erat volutpat nibh congue, nostra habitasse dignissim pulvinar libero iaculis taciti et, bibendum morbi potenti lobortis purus laoreet."), _react["default"].createElement("p", null, "Netus justo auctor consequat enim potenti et luctus dis, felis facilisi varius conubia mollis gravida neque integer, phasellus tempus congue eu donec egestas metus. Volutpat blandit vehicula posuere montes purus leo inceptos magnis, molestie justo sodales massa laoreet pharetra cum lacus, nulla curabitur cursus per maecenas auctor iaculis. Aliquet ultricies litora lectus integer molestie sociosqu dictum sagittis vel erat porttitor quam vitae, class ultrices vestibulum fusce potenti natoque nam feugiat sapien eleifend eros nisl. Laoreet facilisi fusce est massa fames pellentesque magnis sem, eros pharetra montes ornare volutpat conubia vestibulum quisque, nisl taciti malesuada enim ridiculus venenatis sagittis."), _react["default"].createElement("p", null, "Lorem ipsum dolor sit amet consectetur adipiscing elit aliquam class orci, est lectus eros praesent rhoncus dui etiam nascetur a mauris, luctus bibendum facilisis senectus sodales lobortis condimentum porta posuere. Massa varius ac imperdiet mauris quis rhoncus, nisl interdum gravida ullamcorper aliquam aptent pellentesque, consequat leo quam nec montes. Ridiculus mollis augue nam erat volutpat nibh congue, nostra habitasse dignissim pulvinar libero iaculis taciti et, bibendum morbi potenti lobortis purus laoreet."), _react["default"].createElement("p", null, "Netus justo auctor consequat enim potenti et luctus dis, felis facilisi varius conubia mollis gravida neque integer, phasellus tempus congue eu donec egestas metus. Volutpat blandit vehicula posuere montes purus leo inceptos magnis, molestie justo sodales massa laoreet pharetra cum lacus, nulla curabitur cursus per maecenas auctor iaculis. Aliquet ultricies litora lectus integer molestie sociosqu dictum sagittis vel erat porttitor quam vitae, class ultrices vestibulum fusce potenti natoque nam feugiat sapien eleifend eros nisl. Laoreet facilisi fusce est massa fames pellentesque magnis sem, eros pharetra montes ornare volutpat conubia vestibulum quisque, nisl taciti malesuada enim ridiculus venenatis sagittis."), _react["default"].createElement("p", null, "Lorem ipsum dolor sit amet consectetur adipiscing elit aliquam class orci, est lectus eros praesent rhoncus dui etiam nascetur a mauris, luctus bibendum facilisis senectus sodales lobortis condimentum porta posuere. Massa varius ac imperdiet mauris quis rhoncus, nisl interdum gravida ullamcorper aliquam aptent pellentesque, consequat leo quam nec montes. Ridiculus mollis augue nam erat volutpat nibh congue, nostra habitasse dignissim pulvinar libero iaculis taciti et, bibendum morbi potenti lobortis purus laoreet."), _react["default"].createElement("p", null, "Netus justo auctor consequat enim potenti et luctus dis, felis facilisi varius conubia mollis gravida neque integer, phasellus tempus congue eu donec egestas metus. Volutpat blandit vehicula posuere montes purus leo inceptos magnis, molestie justo sodales massa laoreet pharetra cum lacus, nulla curabitur cursus per maecenas auctor iaculis. Aliquet ultricies litora lectus integer molestie sociosqu dictum sagittis vel erat porttitor quam vitae, class ultrices vestibulum fusce potenti natoque nam feugiat sapien eleifend eros nisl. Laoreet facilisi fusce est massa fames pellentesque magnis sem, eros pharetra montes ornare volutpat conubia vestibulum quisque, nisl taciti malesuada enim ridiculus venenatis sagittis."), _react["default"].createElement("p", null, "Lorem ipsum dolor sit amet consectetur adipiscing elit aliquam class orci, est lectus eros praesent rhoncus dui etiam nascetur a mauris, luctus bibendum facilisis senectus sodales lobortis condimentum porta posuere. Massa varius ac imperdiet mauris quis rhoncus, nisl interdum gravida ullamcorper aliquam aptent pellentesque, consequat leo quam nec montes. Ridiculus mollis augue nam erat volutpat nibh congue, nostra habitasse dignissim pulvinar libero iaculis taciti et, bibendum morbi potenti lobortis purus laoreet."), _react["default"].createElement("p", null, "Netus justo auctor consequat enim potenti et luctus dis, felis facilisi varius conubia mollis gravida neque integer, phasellus tempus congue eu donec egestas metus. Volutpat blandit vehicula posuere montes purus leo inceptos magnis, molestie justo sodales massa laoreet pharetra cum lacus, nulla curabitur cursus per maecenas auctor iaculis. Aliquet ultricies litora lectus integer molestie sociosqu dictum sagittis vel erat porttitor quam vitae, class ultrices vestibulum fusce potenti natoque nam feugiat sapien eleifend eros nisl. Laoreet facilisi fusce est massa fames pellentesque magnis sem, eros pharetra montes ornare volutpat conubia vestibulum quisque, nisl taciti malesuada enim ridiculus venenatis sagittis.")), _react["default"].createElement("div", {
124
- style: {
125
- display: "flex",
126
- justifyContent: "center",
127
- width: "100%"
128
- }
129
- }, _react["default"].createElement(_Button["default"], {
130
- mode: "raised",
131
- theme: "light",
132
- label: "OK",
133
- onClick: this.dialogHandler1
134
- }), _react["default"].createElement(_Button["default"], {
135
- mode: "flat",
136
- theme: "light",
137
- label: "CANCEL",
138
- onClick: this.dialogHandler1
139
- }))), _react["default"].createElement(_Button["default"], {
140
- onClick: this.dialogHandler1,
141
- label: "Click me"
142
- }), _react["default"].createElement(_Dialog["default"], {
143
- isVisible: this.state.opened2,
144
- isCloseVisible: false,
145
- onClose: this.dialogHandler2,
146
- overlay: true
147
- }, _react["default"].createElement("div", {
148
- style: {
149
- display: "flex",
150
- justifyContent: "center",
151
- alignItems: "center",
152
- width: "100%"
153
- }
154
- }, _react["default"].createElement(_Date["default"], {
155
- name: "date",
156
- format: "dd/MM/yyyy",
157
- label: "BirthDate",
158
- theme: "light",
159
- assistiveText: "Assistive Text Here",
160
- onInputChange: function onInputChange(event) {
161
- return console.log(event);
162
- }
163
- }), _react["default"].createElement(_InputText["default"], {
164
- disabled: false,
165
- label: "Amount",
166
- multiline: false,
167
- sufix: "K",
168
- prefix: "\u20AC",
169
- theme: "light",
170
- assistiveText: "Assistive Text Here"
171
- })), _react["default"].createElement("div", {
172
- style: {
173
- display: "flex",
174
- justifyContent: "center",
175
- width: "100%"
176
- }
177
- }, _react["default"].createElement(_Button["default"], {
178
- onClick: this.dialogHandler2,
179
- label: "Close"
180
- }))), _react["default"].createElement(_Button["default"], {
181
- onClick: this.dialogHandler2,
182
- label: "Click me"
183
- }));
184
- }
185
- }]);
186
- return ControlledStory;
187
- }(_react["default"].Component);
188
-
189
- return _react["default"].createElement(ControlledStory, null);
190
- }, {
191
- notes: {
192
- markdown: _readme["default"]
193
- }
194
- });
195
-
196
- var knobProps = function knobProps() {
197
- return {
198
- isVisible: (0, _addonKnobs["boolean"])("Visible", false),
199
- isCloseVisible: (0, _addonKnobs["boolean"])("Close Visible", false),
200
- overlay: (0, _addonKnobs["boolean"])("Overlay", false)
201
- };
202
- };
203
-
204
- (0, _react2.storiesOf)("Form Components|Dialog", module).add("Knobs example", function () {
205
- var props = knobProps();
206
- return _react["default"].createElement("div", null, _react["default"].createElement("p", {
207
- style: {
208
- fontFamily: "Open Sans, sans serif"
209
- }
210
- }, "Check visible"), _react["default"].createElement(_Dialog["default"], (0, _extends2["default"])({
211
- onClose: close
212
- }, props), "This is a knobs example"));
213
- }, {
214
- notes: {
215
- markdown: _readme["default"]
216
- }
217
- });
@@ -1,32 +0,0 @@
1
- # DXC Dialog Component
2
-
3
- ## Props
4
-
5
- <table>
6
- <tr style="background-color: grey">
7
- <td>Name</td>
8
- <td>Default</td>
9
- <td>Description</td>
10
- </tr>
11
- <tr>
12
- <td>isVisible: boolean</td>
13
- <td>true</td>
14
- <td>If true, the modal should be visible</td>
15
- </tr>
16
- <tr>
17
- <td>isCloseVisible: boolean</td>
18
- <td>true</td>
19
- <td>If true, the close button should be visible</td>
20
- </tr>
21
- <tr>
22
- <td>onClose: function</td>
23
- <td></td>
24
- <td>This function will be called when the user clicks the close button. If there is no function we should close the modal by default</td>
25
- </tr>
26
- <tr>
27
- <td>overlay: boolean</td>
28
- <td>true</td>
29
- <td>If true, the modal will be over a darker background</td>
30
- </tr>
31
- </table>
32
-