@stokr/components-library 2.3.65-beta.10 → 2.3.65-beta.12

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 (208) hide show
  1. package/dist/components/Chips/Chip.styles.js +3 -2
  2. package/dist/components/Input/MultiSelect.js +10 -8
  3. package/dist/components/Input/TableFilterDropdown.js +210 -0
  4. package/dist/components/Payment/PaymentDetailsCard.js +5 -2
  5. package/dist/components/Snackbar/Snackbar.js +3 -0
  6. package/dist/components/Snackbar/Snackbar.styles.js +18 -9
  7. package/dist/components/StatusTag/StatusTag.js +19 -9
  8. package/dist/components/StatusTag/StatusTag.styles.js +4 -4
  9. package/dist/components/Timeline/Timeline.styles.js +1 -1
  10. package/dist/components/Timeline/TimelineStep.js +0 -1
  11. package/dist/static/images/filter-icon.svg +6 -0
  12. package/package.json +3 -2
  13. package/dist/components/2FA/EnterCode.stories.js +0 -35
  14. package/dist/components/2FA/disable-2fa-flow.stories.js +0 -31
  15. package/dist/components/2FA/enable-2fa-flow.stories.js +0 -31
  16. package/dist/components/2FA/login-with-otp-flow.stories.js +0 -31
  17. package/dist/components/2FA/main-flow.stories.js +0 -162
  18. package/dist/components/AccountBalance/AccountBalance.stories.js +0 -83
  19. package/dist/components/AdminDashboard/Table/ReactTable.stories.js +0 -913
  20. package/dist/components/AgreementItem/AgreementItem.stories.js +0 -105
  21. package/dist/components/AnalyticGraphs/Analytic.js +0 -541
  22. package/dist/components/AnalyticGraphs/Analytic.styles.js +0 -25
  23. package/dist/components/BackButton/BackButton.stories.js +0 -32
  24. package/dist/components/Background/Background.stories.js +0 -75
  25. package/dist/components/BarChart/BarChart.js +0 -263
  26. package/dist/components/BarChart/BarChart.stories.js +0 -66
  27. package/dist/components/BarChart/BarChart.styles.js +0 -26
  28. package/dist/components/BarChartLegend/BarChartLegend.js +0 -79
  29. package/dist/components/BarChartLegend/BarChartLegend.styles.js +0 -21
  30. package/dist/components/BasicTable/BasicTable.stories.js +0 -59
  31. package/dist/components/BlogPost/BlogPost.stories.js +0 -160
  32. package/dist/components/Button/Button.stories.js +0 -146
  33. package/dist/components/Button/GlareButton.stories.js +0 -132
  34. package/dist/components/CapitalRaisedSummary/CapitalRaisedSummery.stories.js +0 -42
  35. package/dist/components/ChartBox/ChartBox.js +0 -41
  36. package/dist/components/ChartBox/ChartBox.stories.js +0 -17
  37. package/dist/components/ChartBox/ChartBox.styles.js +0 -27
  38. package/dist/components/ChartBox/ChartBoxDistribution.js +0 -27
  39. package/dist/components/ChartBox/ChartBoxDistribution.stories.js +0 -18
  40. package/dist/components/ChartLegend/ChartLegend.stories.js +0 -90
  41. package/dist/components/Checkbox/Checkbox.stories.js +0 -88
  42. package/dist/components/Checklist/ChecklistCard.stories.js +0 -102
  43. package/dist/components/Checklist/UserChecklist.js +0 -184
  44. package/dist/components/Checklist/UserChecklist.stories.js +0 -317
  45. package/dist/components/Chips/Chip.stories.js +0 -36
  46. package/dist/components/Chips/ChipsWrapper.stories.js +0 -47
  47. package/dist/components/ComponentScroll/ComponentScroll.stories.js +0 -111
  48. package/dist/components/CryptoAddress/CryptoAddress.stories.js +0 -205
  49. package/dist/components/CryptoAddressDetails/CryptoAddressDetails.stories.js +0 -70
  50. package/dist/components/DonutChart/DonutChart.stories.js +0 -54
  51. package/dist/components/FAQ/FAQ.stories.js +0 -76
  52. package/dist/components/Footer/Footer.stories.js +0 -49
  53. package/dist/components/Footer/FooterLayout.stories.js +0 -26
  54. package/dist/components/Footer/FooterMenu.stories.js +0 -113
  55. package/dist/components/Footer/mangopay.png +0 -0
  56. package/dist/components/Footer/mangopay.svg +0 -20
  57. package/dist/components/ForgotPasswordModal/ForgotPasswordModal.stories.js +0 -69
  58. package/dist/components/Form/Form.stories.js +0 -32
  59. package/dist/components/FullscreenCard/FullscreenCard.styles.js +0 -27
  60. package/dist/components/Header/Header.stories.js +0 -192
  61. package/dist/components/Icon/Icon.stories.js +0 -108
  62. package/dist/components/InfoIcon/InfoIcon.stories.js +0 -299
  63. package/dist/components/InfoPanel/InfoPanel.js +0 -124
  64. package/dist/components/Input/DatePickerInput.stories.js +0 -87
  65. package/dist/components/Input/Input.stories.js +0 -217
  66. package/dist/components/Input/InputPassword.stories.js +0 -80
  67. package/dist/components/Input/InputWithButton.stories.js +0 -75
  68. package/dist/components/Input/MultiSelect.stories.js +0 -264
  69. package/dist/components/Input/OtpInput.stories.js +0 -57
  70. package/dist/components/Input/RangeInput.stories.js +0 -58
  71. package/dist/components/Input/SearchInput.stories.js +0 -366
  72. package/dist/components/Input/Select.stories.js +0 -478
  73. package/dist/components/InvestCalculator/InvestCalculator.stories.js +0 -135
  74. package/dist/components/InvestmentStat/InvestmentStat.stories.js +0 -52
  75. package/dist/components/KYCFlow/BasicInfo.js +0 -448
  76. package/dist/components/KYCFlow/Confirmation.js +0 -46
  77. package/dist/components/KYCFlow/DocumentFileUpload.js +0 -263
  78. package/dist/components/KYCFlow/DocumentScan.js +0 -75
  79. package/dist/components/KYCFlow/DocumentScanUpload.js +0 -251
  80. package/dist/components/KYCFlow/DocumentSelect.js +0 -118
  81. package/dist/components/KYCFlow/DocumentSuccess.js +0 -63
  82. package/dist/components/KYCFlow/DocumentUpload.js +0 -53
  83. package/dist/components/KYCFlow/DocumentVerificationType.js +0 -131
  84. package/dist/components/KYCFlow/FaceScan.js +0 -54
  85. package/dist/components/KYCFlow/FaceScanRecognition.js +0 -61
  86. package/dist/components/KYCFlow/FaceScanSuccess.js +0 -56
  87. package/dist/components/KYCFlow/Terms.js +0 -119
  88. package/dist/components/KYCFlow/_styles.js +0 -111
  89. package/dist/components/KYCFlow/index.js +0 -97
  90. package/dist/components/KYCSelectBox/KYCSelectBox.styles.js +0 -29
  91. package/dist/components/LatestUpdate/LatestUpdate.stories.js +0 -58
  92. package/dist/components/Layout/Layout.stories.js +0 -60
  93. package/dist/components/LearnMoreCarousel/LearnMoreCarousel.stories.js +0 -66
  94. package/dist/components/LearnMorePage/LearnMore.stories.js +0 -48
  95. package/dist/components/LearnMorePage/LearnMoreItem.stories.js +0 -62
  96. package/dist/components/LearnMoreSection/LearnMore.stories.js +0 -30
  97. package/dist/components/LearnMoreSection/LearnMoreItem.stories.js +0 -59
  98. package/dist/components/LoginModal/LoginModal.stories.js +0 -74
  99. package/dist/components/MatomoConnect/Matomo.js +0 -228
  100. package/dist/components/MatomoConnect/Matomo_fuckup.js +0 -387
  101. package/dist/components/Modal/Modal.stories.js +0 -75
  102. package/dist/components/Modal/NewVentureModal/NewVentureModal.stories.js +0 -150
  103. package/dist/components/Modal/PaymentModal.stories.js +0 -57
  104. package/dist/components/Modal/SideModal.stories.js +0 -342
  105. package/dist/components/MultiProgressBar/MultiProgressBar.stories.js +0 -67
  106. package/dist/components/Newsletter/Newsletter.stories.js +0 -16
  107. package/dist/components/NotificationContext/NotificationContext.js +0 -141
  108. package/dist/components/Number/Number.stories.js +0 -92
  109. package/dist/components/Pagination/Pagination.stories.js +0 -83
  110. package/dist/components/Pagination/PaginationControls.stories.js +0 -112
  111. package/dist/components/Payment/PaymentDetailsCard.stories.js +0 -198
  112. package/dist/components/Payment/PaymentDisplay.stories.js +0 -302
  113. package/dist/components/Payment/TimerComponent.stories.js +0 -236
  114. package/dist/components/Process/Process.stories.js +0 -42
  115. package/dist/components/ProfileBadge/ProfileBadge.stories.js +0 -45
  116. package/dist/components/ProfileBox/ProfileBox.stories.js +0 -35
  117. package/dist/components/ProfileHeader/ProfileHeader.js +0 -252
  118. package/dist/components/ProfileHeader/ProfileHeader.styles.js +0 -65
  119. package/dist/components/ProfileStat/ProfileStat.stories.js +0 -66
  120. package/dist/components/ProofOfAddress/ProofOfAddress.styles.js +0 -53
  121. package/dist/components/QRCode/QRCode.stories.js +0 -104
  122. package/dist/components/Radio/Radio.stories.js +0 -73
  123. package/dist/components/RefreshButton/RefreshButton.stories.js +0 -38
  124. package/dist/components/RegisterAlgorand/AlgoAddressName.js +0 -138
  125. package/dist/components/RegisterAlgorand/AlgoAdressSelect.js +0 -443
  126. package/dist/components/RegisterAlgorand/AlgoConnectWallet.js +0 -47
  127. package/dist/components/RegisterAlgorand/AlgoSuccess.js +0 -38
  128. package/dist/components/RegisterAlgorand/Algorand.stories.js +0 -80
  129. package/dist/components/RegisterAlgorand/ChooseWallet.js +0 -97
  130. package/dist/components/RegisterAlgorand/SelectProject.js +0 -89
  131. package/dist/components/RegisterAlgorand/_styles.js +0 -28
  132. package/dist/components/RegisterAlgorand/flow.js +0 -409
  133. package/dist/components/RegisterAlgorand/flowWithMemo.js +0 -410
  134. package/dist/components/RegisterAlgorand/index.js +0 -48
  135. package/dist/components/RegisterConfirmModal/RegisterConfirmModal.stories.js +0 -41
  136. package/dist/components/RegisterEthereum/EthAddressLedger.js +0 -226
  137. package/dist/components/RegisterEthereum/EthAddressMetamask.js +0 -204
  138. package/dist/components/RegisterEthereum/EthAddressName.js +0 -135
  139. package/dist/components/RegisterEthereum/EthConnectLedger.js +0 -194
  140. package/dist/components/RegisterEthereum/EthConnectMetamask.js +0 -35
  141. package/dist/components/RegisterEthereum/EthFinish.js +0 -41
  142. package/dist/components/RegisterEthereum/EthIntro.js +0 -95
  143. package/dist/components/RegisterEthereum/_styles.js +0 -28
  144. package/dist/components/RegisterEthereum/index.js +0 -68
  145. package/dist/components/RegisterModal/RegisterModal.stories.js +0 -49
  146. package/dist/components/RequestDataBox/RequestDataBox.stories.js +0 -37
  147. package/dist/components/RiskQuestionnaire/RiskQuestionnaireContext.js +0 -185
  148. package/dist/components/RiskQuestionnaire/_styles.js +0 -15
  149. package/dist/components/SEO/SEO.stories.js +0 -60
  150. package/dist/components/SideLine/SideLine.stories.js +0 -28
  151. package/dist/components/SigningSubflow/SignSubAddressMetamask.js +0 -137
  152. package/dist/components/SigningSubflow/SignSubConnectLedger.js +0 -150
  153. package/dist/components/SigningSubflow/SignSubConnectMetamask.js +0 -137
  154. package/dist/components/SigningSubflow/SignSubIntro.js +0 -55
  155. package/dist/components/SigningSubflow/SignSubSendLedger.js +0 -150
  156. package/dist/components/SigningSubflow/SignSubSendMetamask.js +0 -62
  157. package/dist/components/SigningSubflow/SignSubTransactionLedger.js +0 -161
  158. package/dist/components/SigningSubflow/SignSubTransactionMetamask.js +0 -166
  159. package/dist/components/SigningSubflow/_styles.js +0 -34
  160. package/dist/components/SigningSubflow/index.js +0 -32
  161. package/dist/components/Slider/Slider.stories.js +0 -68
  162. package/dist/components/Snackbar/Snackbar.stories.js +0 -292
  163. package/dist/components/StatusTag/StatusTag.stories.js +0 -262
  164. package/dist/components/StepController/StepController.stories.js +0 -60
  165. package/dist/components/StepController/StepControllerProgress.stories.js +0 -49
  166. package/dist/components/StepsProgress/StepIndicator.stories.js +0 -153
  167. package/dist/components/StepsProgress/StepsProgress.stories.js +0 -49
  168. package/dist/components/Switch/Switch.stories.js +0 -81
  169. package/dist/components/Tabs/Tabs.stories.js +0 -36
  170. package/dist/components/TabsNav/TabNav.stories.js +0 -40
  171. package/dist/components/TabsNav/TabsNav.stories.js +0 -37
  172. package/dist/components/TeamOverview/TeamOverview.stories.js +0 -76
  173. package/dist/components/TermsModal/TermsModal.stories.js +0 -31
  174. package/dist/components/Text/Headline.stories.js +0 -48
  175. package/dist/components/Text/Text.stories.js +0 -70
  176. package/dist/components/TextLink/TextLink.stories.js +0 -35
  177. package/dist/components/Timeline/Timeline.stories.js +0 -393
  178. package/dist/components/ToDoList/ToDoList.stories.js +0 -133
  179. package/dist/components/ToDoList/ToDoListTask.stories.js +0 -70
  180. package/dist/components/TransactionDetails/TransactionDetails.stories.js +0 -55
  181. package/dist/components/TransactionDetails/TransactionDetailsTable.stories.js +0 -305
  182. package/dist/components/TransactionInfo/TransactionInfo.stories.js +0 -61
  183. package/dist/components/TwoFactorModal/TwoFactorModal.js +0 -100
  184. package/dist/components/VerifyEmailModal/VerifyEmailModal.stories.js +0 -59
  185. package/dist/components/headerHo/HeaderHo.stories.js +0 -35
  186. package/dist/components/icons/Arrow.stories.js +0 -42
  187. package/dist/components/icons/ArrowSimple.stories.js +0 -48
  188. package/dist/components/icons/Check.stories.js +0 -22
  189. package/dist/components/icons/Facebook.stories.js +0 -21
  190. package/dist/components/icons/Facebook_Logo.png +0 -0
  191. package/dist/components/icons/Info.stories.js +0 -16
  192. package/dist/components/icons/Instagram.stories.js +0 -21
  193. package/dist/components/icons/LI-In-Bug.png +0 -0
  194. package/dist/components/icons/LinkIcon.stories.js +0 -21
  195. package/dist/components/icons/LinkedIn.stories.js +0 -16
  196. package/dist/components/icons/Medium.stories.js +0 -16
  197. package/dist/components/icons/Reddit.stories.js +0 -21
  198. package/dist/components/icons/Share.stories.js +0 -16
  199. package/dist/components/icons/Telegram-Logo.png +0 -0
  200. package/dist/components/icons/Telegram.stories.js +0 -16
  201. package/dist/components/icons/Twitter.stories.js +0 -21
  202. package/dist/components/icons/X-logo-black.png +0 -0
  203. package/dist/components/icons/X.stories.js +0 -16
  204. package/dist/components/icons/Youtube.stories.js +0 -21
  205. package/dist/components/icons/youtube_social_circle_red.png +0 -0
  206. package/dist/components/logo/Logo.stories.js +0 -260
  207. package/dist/components/taxId/TaxId.stories.js +0 -50
  208. package/dist/components/video/Video.stories.js +0 -52
@@ -1,305 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.default = exports.WithoutBorders = exports.WithIcons = exports.WithCustomStyling = exports.WithContainerStyling = exports.SingleRow = exports.MultipleRows = exports.LongTextContent = exports.EmptyState = exports.CustomWidth = exports.ComplexExample = exports.Basic = void 0;
7
- var _react = _interopRequireDefault(require("react"));
8
- var _TransactionDetailsTable = require("./TransactionDetailsTable");
9
- var _ComponentWrapper = require("../ComponentWrapper/ComponentWrapper.styles");
10
- var _global = _interopRequireDefault(require("../../styles/global"));
11
- var _InfoIcon = require("../InfoIcon/InfoIcon");
12
- var _Info = require("../icons/Info");
13
- var _colors = _interopRequireDefault(require("../../styles/colors"));
14
- function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
15
- var _default = exports.default = {
16
- title: 'Components Library/TransactionDetails/TransactionDetailsTable',
17
- component: _TransactionDetailsTable.TransactionDetailsTable,
18
- argTypes: {
19
- data: {
20
- control: 'object',
21
- description: 'Array of objects with label, value, labelIcon, and valueIcon properties'
22
- },
23
- showBorders: {
24
- control: 'boolean',
25
- description: 'Show borders around the table and rows',
26
- defaultValue: true
27
- },
28
- maxWidth: {
29
- control: 'text',
30
- description: 'Maximum width of the table container'
31
- },
32
- labelCellStyle: {
33
- control: false,
34
- description: 'Function that returns style object for label cells: (index, item) => style'
35
- },
36
- valueCellStyle: {
37
- control: false,
38
- description: 'Function that returns style object for value cells: (index, item) => style'
39
- },
40
- rowStyle: {
41
- control: false,
42
- description: 'Function that returns style object for rows: (index, item) => style'
43
- },
44
- containerStyle: {
45
- control: 'object',
46
- description: 'Style object for the table container'
47
- },
48
- className: {
49
- control: 'text',
50
- description: 'CSS class name for the table container'
51
- },
52
- labelCellClassName: {
53
- control: false,
54
- description: 'Function that returns className for label cells: (index, item) => className'
55
- },
56
- valueCellClassName: {
57
- control: false,
58
- description: 'Function that returns className for value cells: (index, item) => className'
59
- },
60
- rowClassName: {
61
- control: false,
62
- description: 'Function that returns className for rows: (index, item) => className'
63
- }
64
- },
65
- decorators: [Story => /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_global.default, null), /*#__PURE__*/_react.default.createElement(_ComponentWrapper.ComponentWrapper, null, /*#__PURE__*/_react.default.createElement(Story, null)))]
66
- };
67
- const Template = args => /*#__PURE__*/_react.default.createElement(_TransactionDetailsTable.TransactionDetailsTable, args);
68
-
69
- // Basic example
70
- const Basic = exports.Basic = Template.bind({});
71
- Basic.args = {
72
- data: [{
73
- label: 'Transaction ID',
74
- value: '0x1234...5678'
75
- }, {
76
- label: 'Amount',
77
- value: '1,000.00 EUR'
78
- }, {
79
- label: 'Status',
80
- value: 'Completed'
81
- }]
82
- };
83
-
84
- // Multiple rows
85
- const MultipleRows = exports.MultipleRows = Template.bind({});
86
- MultipleRows.args = {
87
- data: [{
88
- label: 'Transaction ID',
89
- value: '0x1234567890abcdef'
90
- }, {
91
- label: 'From Address',
92
- value: '0xabcd...ef01'
93
- }, {
94
- label: 'To Address',
95
- value: '0x2345...6789'
96
- }, {
97
- label: 'Amount',
98
- value: '5,000.00 EUR'
99
- }, {
100
- label: 'Gas Fee',
101
- value: '0.001 ETH'
102
- }, {
103
- label: 'Status',
104
- value: 'Completed'
105
- }, {
106
- label: 'Date',
107
- value: '2024-01-15 14:30:00'
108
- }]
109
- };
110
-
111
- // With icons
112
- const WithIcons = exports.WithIcons = Template.bind({});
113
- WithIcons.args = {
114
- data: [{
115
- label: 'Transaction ID',
116
- value: '0x1234...5678',
117
- labelIcon: /*#__PURE__*/_react.default.createElement(_InfoIcon.InfoIcon, {
118
- title: "This is the unique identifier for your transaction",
119
- position: "right"
120
- })
121
- }, {
122
- label: 'Amount',
123
- value: '1,000.00 EUR',
124
- valueIcon: /*#__PURE__*/_react.default.createElement(_Info.Info, {
125
- style: {
126
- marginRight: '8px',
127
- display: 'inline-block'
128
- }
129
- })
130
- }, {
131
- label: 'Status',
132
- value: 'Completed'
133
- }]
134
- };
135
-
136
- // Without borders
137
- const WithoutBorders = exports.WithoutBorders = Template.bind({});
138
- WithoutBorders.args = {
139
- data: [{
140
- label: 'Transaction ID',
141
- value: '0x1234...5678'
142
- }, {
143
- label: 'Amount',
144
- value: '1,000.00 EUR'
145
- }, {
146
- label: 'Status',
147
- value: 'Completed'
148
- }],
149
- showBorders: false
150
- };
151
-
152
- // Custom width
153
- const CustomWidth = exports.CustomWidth = Template.bind({});
154
- CustomWidth.args = {
155
- data: [{
156
- label: 'Transaction ID',
157
- value: '0x1234...5678'
158
- }, {
159
- label: 'Amount',
160
- value: '1,000.00 EUR'
161
- }, {
162
- label: 'Status',
163
- value: 'Completed'
164
- }],
165
- maxWidth: '800px'
166
- };
167
-
168
- // With custom styling
169
- const WithCustomStyling = exports.WithCustomStyling = Template.bind({});
170
- WithCustomStyling.args = {
171
- data: [{
172
- label: 'Transaction ID',
173
- value: '0x1234...5678'
174
- }, {
175
- label: 'Amount',
176
- value: '1,000.00 EUR'
177
- }, {
178
- label: 'Status',
179
- value: 'Completed'
180
- }, {
181
- label: 'Priority',
182
- value: 'High'
183
- }],
184
- rowStyle: (index, item) => {
185
- if (item.value === 'Completed') {
186
- return {
187
- backgroundColor: _colors.default.veryLightGreen
188
- };
189
- }
190
- if (item.value === 'High') {
191
- return {
192
- backgroundColor: _colors.default.lightPeach
193
- };
194
- }
195
- return {};
196
- },
197
- valueCellStyle: (index, item) => {
198
- if (item.value === 'Completed') {
199
- return {
200
- color: _colors.default.freshGreen,
201
- fontWeight: 'bold'
202
- };
203
- }
204
- return {};
205
- }
206
- };
207
-
208
- // Long text content
209
- const LongTextContent = exports.LongTextContent = Template.bind({});
210
- LongTextContent.args = {
211
- data: [{
212
- label: 'Transaction Hash',
213
- value: '0x1234567890abcdef1234567890abcdef1234567890abcdef1234567890abcdef'
214
- }, {
215
- label: 'Description',
216
- value: 'This is a very long description that should wrap properly within the table cell and demonstrate how the component handles word wrapping and text overflow scenarios.'
217
- }, {
218
- label: 'Short Label',
219
- value: 'Short value'
220
- }]
221
- };
222
-
223
- // Empty state (edge case)
224
- const EmptyState = exports.EmptyState = Template.bind({});
225
- EmptyState.args = {
226
- data: []
227
- };
228
-
229
- // Single row
230
- const SingleRow = exports.SingleRow = Template.bind({});
231
- SingleRow.args = {
232
- data: [{
233
- label: 'Total Amount',
234
- value: '10,000.00 EUR'
235
- }]
236
- };
237
-
238
- // With container styling
239
- const WithContainerStyling = exports.WithContainerStyling = Template.bind({});
240
- WithContainerStyling.args = {
241
- data: [{
242
- label: 'Transaction ID',
243
- value: '0x1234...5678'
244
- }, {
245
- label: 'Amount',
246
- value: '1,000.00 EUR'
247
- }, {
248
- label: 'Status',
249
- value: 'Completed'
250
- }],
251
- containerStyle: {
252
- borderRadius: '8px',
253
- padding: '20px',
254
- backgroundColor: _colors.default.grey3
255
- }
256
- };
257
-
258
- // Complex example with all features
259
- const ComplexExample = exports.ComplexExample = Template.bind({});
260
- ComplexExample.args = {
261
- data: [{
262
- label: 'Transaction ID',
263
- value: '0x1234...5678',
264
- labelIcon: /*#__PURE__*/_react.default.createElement(_InfoIcon.InfoIcon, {
265
- title: "Unique transaction identifier",
266
- position: "right",
267
- noMarginLeft: true
268
- })
269
- }, {
270
- label: 'Amount',
271
- value: '5,000.00 EUR',
272
- valueIcon: /*#__PURE__*/_react.default.createElement(_Info.Info, {
273
- style: {
274
- marginRight: '8px',
275
- display: 'inline-block'
276
- }
277
- })
278
- }, {
279
- label: 'Status',
280
- value: 'Pending'
281
- }, {
282
- label: 'Gas Fee',
283
- value: '0.002 ETH'
284
- }, {
285
- label: 'Network',
286
- value: 'Ethereum Mainnet'
287
- }],
288
- maxWidth: '700px',
289
- rowStyle: (index, item) => {
290
- if (item.value === 'Pending') {
291
- return {
292
- backgroundColor: _colors.default.yellowLight
293
- };
294
- }
295
- return {};
296
- },
297
- valueCellStyle: (index, item) => {
298
- if (item.value === 'Pending') {
299
- return {
300
- color: _colors.default.warningOrange
301
- };
302
- }
303
- return {};
304
- }
305
- };
@@ -1,61 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.default = exports.TransactionInfoExample = void 0;
7
- var _react = _interopRequireDefault(require("react"));
8
- var _TransactionInfo = require("./TransactionInfo");
9
- var _ComponentWrapper = require("../ComponentWrapper/ComponentWrapper.styles");
10
- var _global = _interopRequireDefault(require("../../styles/global"));
11
- function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
12
- var _default = exports.default = {
13
- title: 'Components Library/TransactionInfo',
14
- component: _TransactionInfo.TransactionInfo,
15
- argTypes: {
16
- value1: {
17
- type: 'string',
18
- defaultValue: ''
19
- },
20
- unit1: {
21
- type: 'string',
22
- defaultValue: ''
23
- },
24
- name1: {
25
- type: 'string',
26
- defaultValue: ''
27
- },
28
- owner1: {
29
- type: 'string',
30
- defaultValue: ''
31
- },
32
- value2: {
33
- type: 'string',
34
- defaultValue: ''
35
- },
36
- unit2: {
37
- type: 'string',
38
- defaultValue: ''
39
- },
40
- name2: {
41
- type: 'string',
42
- defaultValue: ''
43
- },
44
- owner2: {
45
- type: 'string',
46
- defaultValue: ''
47
- }
48
- }
49
- };
50
- const Template = args => /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_global.default, null), /*#__PURE__*/_react.default.createElement(_ComponentWrapper.ComponentWrapper, null, /*#__PURE__*/_react.default.createElement(_TransactionInfo.TransactionInfo, args)));
51
- const TransactionInfoExample = exports.TransactionInfoExample = Template.bind({});
52
- TransactionInfoExample.args = {
53
- value1: 'value 1',
54
- unit1: 'unit 1',
55
- name1: 'name 1',
56
- owner1: 'owner 1',
57
- value2: 'value 2',
58
- unit2: 'unit 2',
59
- name2: 'name 2',
60
- owner2: 'owner 2'
61
- };
@@ -1,100 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.default = exports.TwoFactorModal = void 0;
7
- var _react = _interopRequireWildcard(require("react"));
8
- var _propTypes = _interopRequireDefault(require("prop-types"));
9
- var _formik = require("formik");
10
- var Yup = _interopRequireWildcard(require("yup"));
11
- var _Modal = require("../Modal/Modal");
12
- var _Form = _interopRequireWildcard(require("../Form/Form"));
13
- var _Text = _interopRequireDefault(require("../Text/Text.styles"));
14
- var _Input = _interopRequireDefault(require("../Input/Input"));
15
- var _Button = _interopRequireDefault(require("../Button/Button.styles"));
16
- var _Grid = require("../Grid/Grid.styles");
17
- var _ComponentWrapper = _interopRequireDefault(require("../ComponentWrapper/ComponentWrapper.styles"));
18
- function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
19
- function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
20
- function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
21
- function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
22
- function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
23
- class TwoFactorModal extends _react.PureComponent {
24
- constructor() {
25
- super(...arguments);
26
- _defineProperty(this, "initialValues", {
27
- fa2code: ''
28
- });
29
- _defineProperty(this, "validationSchema", Yup.object().shape({
30
- fa2code: Yup.string().required('Token is required')
31
- }));
32
- }
33
- render() {
34
- const {
35
- isModalOpen,
36
- onModalClose,
37
- onFormSend
38
- } = this.props;
39
- return /*#__PURE__*/_react.default.createElement(_Modal.Modal, {
40
- isOpen: isModalOpen,
41
- onClose: onModalClose
42
- }, /*#__PURE__*/_react.default.createElement(_Grid.Row, null, /*#__PURE__*/_react.default.createElement(_Grid.Column, {
43
- part: 8
44
- }, /*#__PURE__*/_react.default.createElement(_Modal.ModalInner, {
45
- modalTop: true
46
- }, /*#__PURE__*/_react.default.createElement(_Text.default, null, /*#__PURE__*/_react.default.createElement("h3", null, "Two Factor Authentication"), /*#__PURE__*/_react.default.createElement("p", null, 'Please log in to engage in our community & invest in exciting opportunities.'))), /*#__PURE__*/_react.default.createElement(_Modal.ModalInner, {
47
- modalBot: true
48
- })), /*#__PURE__*/_react.default.createElement(_Grid.Column, {
49
- part: 8
50
- }, /*#__PURE__*/_react.default.createElement(_Modal.ModalInner, null, /*#__PURE__*/_react.default.createElement(_formik.Formik, {
51
- initialValues: this.initialValues,
52
- validationSchema: this.validationSchema,
53
- onSubmit: onFormSend
54
- }, _ref => {
55
- let {
56
- values,
57
- errors,
58
- touched,
59
- handleBlur,
60
- setFieldValue,
61
- setFieldTouched
62
- } = _ref;
63
- const onChangeWithTouch = e => {
64
- const field = e.target;
65
- setFieldValue(field.name, field.value, false);
66
- setFieldTouched(field.name);
67
- };
68
- const submitDisabled = !touched.fa2code || !!errors.fa2code;
69
- return /*#__PURE__*/_react.default.createElement(_Form.default, null, /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
70
- noPadding: true
71
- }, /*#__PURE__*/_react.default.createElement(_Form.FormField, null, /*#__PURE__*/_react.default.createElement(_Input.default, {
72
- id: "two-factor",
73
- name: "fa2code",
74
- type: "text",
75
- label: "Token",
76
- value: values.fa2code,
77
- onChange: onChangeWithTouch,
78
- onBlur: handleBlur,
79
- error: !!errors.fa2code,
80
- touched: !!touched.fa2code
81
- }), /*#__PURE__*/_react.default.createElement(_Form.FormError, {
82
- show: errors.fa2code && touched.fa2code
83
- }, errors.fa2code))), /*#__PURE__*/_react.default.createElement(_ComponentWrapper.default, {
84
- noPaddingBottom: true,
85
- noPaddingHorizontal: true
86
- }, /*#__PURE__*/_react.default.createElement(_Button.default, {
87
- type: "submit",
88
- fluid: true,
89
- disabled: submitDisabled
90
- }, "Login")));
91
- })))));
92
- }
93
- }
94
- exports.TwoFactorModal = TwoFactorModal;
95
- TwoFactorModal.propTypes = {
96
- isModalOpen: _propTypes.default.bool.isRequired,
97
- onModalClose: _propTypes.default.func.isRequired,
98
- onFormSend: _propTypes.default.func.isRequired
99
- };
100
- var _default = exports.default = TwoFactorModal;
@@ -1,59 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.default = exports.VerifyEmailSuccess = exports.VerifyEmailError = void 0;
7
- var _react = _interopRequireDefault(require("react"));
8
- var _VerifyEmailModal = require("./VerifyEmailModal");
9
- var _ComponentWrapper = require("../ComponentWrapper/ComponentWrapper.styles");
10
- var _global = _interopRequireDefault(require("../../styles/global"));
11
- var _reactRouterDom = require("react-router-dom");
12
- function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
13
- var _default = exports.default = {
14
- title: 'Components Library/Verify Email Modal',
15
- component: _VerifyEmailModal.VerifyEmailModal,
16
- argTypes: {
17
- isModalOpen: {
18
- type: 'boolean',
19
- defaultValue: true,
20
- required: true
21
- },
22
- onModalClose: {
23
- type: 'function',
24
- action: 'onModalClose',
25
- required: true
26
- },
27
- popupError: {
28
- type: 'object',
29
- defaultValue: {}
30
- },
31
- isSuccess: {
32
- type: 'boolean',
33
- defaultValue: true,
34
- required: true
35
- }
36
- }
37
- };
38
- const Template = args => /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_reactRouterDom.BrowserRouter, null, /*#__PURE__*/_react.default.createElement(_global.default, null), /*#__PURE__*/_react.default.createElement(_ComponentWrapper.ComponentWrapper, null, /*#__PURE__*/_react.default.createElement(_VerifyEmailModal.VerifyEmailModal, args))));
39
- const VerifyEmailError = exports.VerifyEmailError = Template.bind({});
40
- VerifyEmailError.args = {
41
- popupError: {},
42
- isModalOpen: true,
43
- popupSuccess: {},
44
- error: {
45
- message: 'This link has expired. Please try verifying email again.'
46
- },
47
- isSuccess: false,
48
- onResend: data => {
49
- console.log(data);
50
- }
51
- };
52
- const VerifyEmailSuccess = exports.VerifyEmailSuccess = Template.bind({});
53
- VerifyEmailSuccess.args = {
54
- popupError: {},
55
- isModalOpen: true,
56
- popupSuccess: {},
57
- isSuccess: true,
58
- continueUrl: 'https://www.stokr.info'
59
- };
@@ -1,35 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.default = exports.HeaderHoOverview = void 0;
7
- var _react = _interopRequireDefault(require("react"));
8
- var _HeaderHo = _interopRequireDefault(require("./HeaderHo"));
9
- var _ComponentWrapper = require("../ComponentWrapper/ComponentWrapper.styles");
10
- var _global = _interopRequireDefault(require("../../styles/global"));
11
- var _AuthContext = require("../../context/AuthContext");
12
- var _reactRouterDom = require("react-router-dom");
13
- function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
14
- var _default = exports.default = {
15
- title: 'Components Library/Header Ho',
16
- component: _HeaderHo.default,
17
- argTypes: {
18
- // isModalOpen: { type: 'boolean', defaultValue: true },
19
- // onModalClose: { type: 'function', action: 'onModalClose', required: true },
20
- // onFormSend: { type: 'function', action: 'onFormSend', required: true },
21
- // onModalSwitch: {
22
- // type: 'function',
23
- // action: 'onModalSwitch',
24
- // required: true,
25
- // },
26
- }
27
- };
28
- const Template = args => /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_global.default, null), /*#__PURE__*/_react.default.createElement(_reactRouterDom.BrowserRouter, null, /*#__PURE__*/_react.default.createElement(_AuthContext.AuthProvider, null, /*#__PURE__*/_react.default.createElement(_HeaderHo.default, args), /*#__PURE__*/_react.default.createElement("div", {
29
- style: {
30
- height: '1700px',
31
- background: 'orange'
32
- }
33
- }))));
34
- const HeaderHoOverview = exports.HeaderHoOverview = Template.bind({});
35
- HeaderHoOverview.args = {};
@@ -1,42 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.default = exports.ArrowTop = exports.ArrowRight = exports.ArrowLeft = exports.ArrowBottom = void 0;
7
- var _react = _interopRequireDefault(require("react"));
8
- var _Arrow = require("./Arrow");
9
- function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
10
- var _default = exports.default = {
11
- title: 'Components Library/Icons/Arrow',
12
- component: _Arrow.Arrow,
13
- argTypes: {
14
- direction: {
15
- type: 'string',
16
- defaultValue: 'bottom'
17
- }
18
- },
19
- parameters: {
20
- backgrounds: {
21
- default: 'grey'
22
- }
23
- }
24
- }; //making default background grey in story as the element is white
25
- const Template = args => /*#__PURE__*/_react.default.createElement(_Arrow.Arrow, args);
26
- const ArrowBottom = exports.ArrowBottom = Template.bind({});
27
- ArrowBottom.args = {};
28
- const ArrowRight = exports.ArrowRight = Template.bind({});
29
- ArrowRight.args = {
30
- direction: 'right'
31
- };
32
- const ArrowLeft = exports.ArrowLeft = Template.bind({});
33
- ArrowLeft.args = {
34
- direction: 'left'
35
- };
36
- const ArrowTop = exports.ArrowTop = Template.bind({});
37
- ArrowTop.args = {
38
- direction: 'top'
39
- };
40
-
41
- //doublecheck:
42
- //make variants from directions?
@@ -1,48 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.default = exports.ArrowSimpleTop = exports.ArrowSimpleRight = exports.ArrowSimpleLeft = exports.ArrowSimpleBottom = void 0;
7
- var _react = _interopRequireDefault(require("react"));
8
- var _ArrowSimple = require("./ArrowSimple");
9
- function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
10
- var _default = exports.default = {
11
- title: 'Components Library/Icons/ArrowSimple',
12
- component: _ArrowSimple.ArrowSimple
13
- };
14
- const Template = args => /*#__PURE__*/_react.default.createElement(_ArrowSimple.ArrowSimple, args);
15
- const ArrowSimpleBottom = exports.ArrowSimpleBottom = Template.bind({});
16
- ArrowSimpleBottom.args = {
17
- direction: 'bottom',
18
- children: 'ArrowSimpleBottom'
19
- };
20
- const ArrowSimpleRight = exports.ArrowSimpleRight = Template.bind({});
21
- ArrowSimpleRight.args = {
22
- direction: 'right',
23
- children: 'ArrowSimpleRight'
24
- };
25
- const ArrowSimpleLeft = exports.ArrowSimpleLeft = Template.bind({});
26
- ArrowSimpleLeft.args = {
27
- direction: 'left',
28
- children: 'ArrowSimpleLeft'
29
- };
30
- const ArrowSimpleTop = exports.ArrowSimpleTop = Template.bind({});
31
- ArrowSimpleTop.args = {
32
- direction: 'top',
33
- children: 'ArrowSimpleTop'
34
- };
35
-
36
- //before
37
- // export const arrowsimple = () => <ArrowSimple />
38
-
39
- // export const ArrowSimpleBottom = () => (
40
- // <ArrowSimple direction="bottom"></ArrowSimple>
41
- // )
42
- // export const ArrowSimpleRight = () => (
43
- // <ArrowSimple direction="right"></ArrowSimple>
44
- // )
45
- // export const ArrowSimpleLeft = () => (
46
- // <ArrowSimple direction="left"></ArrowSimple>
47
- // )
48
- // export const ArrowSimpleTop = () => <ArrowSimple direction="top"></ArrowSimple>
@@ -1,22 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.default = exports.check = void 0;
7
- var _react = _interopRequireDefault(require("react"));
8
- var _Check = require("./Check");
9
- function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
10
- var _default = exports.default = {
11
- title: 'Components Library/Icons/Check',
12
- component: _Check.Check,
13
- parameters: {
14
- backgrounds: {
15
- default: 'grey'
16
- }
17
- }
18
- };
19
- const check = () => /*#__PURE__*/_react.default.createElement(_Check.Check, null);
20
-
21
- //making default background grey in story as the element is white
22
- exports.check = check;