@stokr/components-library 2.3.65-beta.9 → 2.3.66

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 (256) hide show
  1. package/dist/analytics/index.js +162 -0
  2. package/dist/components/2FA/login-with-otp-flow.js +1 -1
  3. package/dist/components/2FA/main-flow.js +40 -12
  4. package/dist/components/Chips/Chip.js +1 -2
  5. package/dist/components/Chips/Chip.styles.js +3 -2
  6. package/dist/components/ConfirmModal/ConfirmModal.js +240 -0
  7. package/dist/components/ConfirmModal/ConfirmModal.styles.js +26 -0
  8. package/dist/components/CryptoAddress/CryptoAddress.js +10 -4
  9. package/dist/components/CryptoAddress/CryptoAddress.styles.js +1 -1
  10. package/dist/components/Footer/FooterLayout.js +13 -4
  11. package/dist/components/Footer/FooterMenu.js +19 -3
  12. package/dist/components/Footer/FooterMenu.styles.js +14 -2
  13. package/dist/components/Header/Header.styles.js +1 -1
  14. package/dist/components/Input/DatePickerInput.js +134 -30
  15. package/dist/components/Input/DatePickerInput.styles.js +16 -3
  16. package/dist/components/Input/MultiSelect.js +10 -8
  17. package/dist/components/Input/TableFilterDropdown.js +228 -0
  18. package/dist/components/Input/Textarea.js +59 -0
  19. package/dist/components/Input/Textarea.styles.js +18 -0
  20. package/dist/components/Modal/Modal.js +39 -6
  21. package/dist/components/Modal/Modal.styles.js +2 -2
  22. package/dist/components/Modal/SideModal.js +44 -2
  23. package/dist/components/Modal/SuccessModal/SuccessModal.js +173 -0
  24. package/dist/components/Modal/SuccessModal/SuccessModal.styles.js +29 -0
  25. package/dist/components/Modal/SuccessModal/index.js +37 -0
  26. package/dist/components/Payment/PaymentDetailsCard.js +14 -11
  27. package/dist/components/Payment/PaymentDisplay.js +2 -12
  28. package/dist/components/Snackbar/Snackbar.js +3 -0
  29. package/dist/components/Snackbar/Snackbar.styles.js +18 -9
  30. package/dist/components/StatusTag/StatusTag.js +38 -71
  31. package/dist/components/StatusTag/StatusTag.styles.js +4 -16
  32. package/dist/components/Timeline/Timeline.styles.js +1 -1
  33. package/dist/components/Timeline/TimelineStep.js +0 -1
  34. package/dist/context/AuthContext.js +5 -0
  35. package/dist/favicon.ico +0 -0
  36. package/dist/index.css +1 -0
  37. package/dist/index.js +55 -0
  38. package/dist/index.js.map +1 -0
  39. package/dist/index.umd.cjs +10371 -0
  40. package/dist/index.umd.cjs.map +1 -0
  41. package/dist/logo192.png +0 -0
  42. package/dist/logo512.png +0 -0
  43. package/dist/manifest.json +25 -0
  44. package/dist/robots.txt +3 -0
  45. package/dist/static/animations/checked.lottie +0 -0
  46. package/dist/static/animations/progress.lottie +0 -0
  47. package/dist/static/images/add-folder-icon.svg +5 -0
  48. package/dist/static/images/background3.png +0 -0
  49. package/dist/static/images/bmn2-logo.svg +9 -9
  50. package/dist/static/images/checkmark-circle-icon.svg +4 -0
  51. package/dist/static/images/close-circle-icon.svg +3 -0
  52. package/dist/static/images/doc-icon.svg +4 -0
  53. package/dist/static/images/filter-icon.svg +6 -0
  54. package/dist/styles/colors.js +2 -1
  55. package/dist/styles/global.js +1 -1
  56. package/dist/utils/customHooks.js +24 -2
  57. package/dist/utils/formatCurrencyValue.js +9 -2
  58. package/package.json +5 -2
  59. package/dist/components/2FA/EnterCode.stories.js +0 -35
  60. package/dist/components/2FA/disable-2fa-flow.stories.js +0 -31
  61. package/dist/components/2FA/enable-2fa-flow.stories.js +0 -31
  62. package/dist/components/2FA/login-with-otp-flow.stories.js +0 -31
  63. package/dist/components/2FA/main-flow.stories.js +0 -162
  64. package/dist/components/AccountBalance/AccountBalance.stories.js +0 -83
  65. package/dist/components/AdminDashboard/Table/ReactTable.stories.js +0 -913
  66. package/dist/components/AgreementItem/AgreementItem.stories.js +0 -105
  67. package/dist/components/AnalyticGraphs/Analytic.js +0 -541
  68. package/dist/components/AnalyticGraphs/Analytic.styles.js +0 -25
  69. package/dist/components/BackButton/BackButton.stories.js +0 -32
  70. package/dist/components/Background/Background.stories.js +0 -75
  71. package/dist/components/BarChart/BarChart.js +0 -263
  72. package/dist/components/BarChart/BarChart.stories.js +0 -66
  73. package/dist/components/BarChart/BarChart.styles.js +0 -26
  74. package/dist/components/BarChartLegend/BarChartLegend.js +0 -79
  75. package/dist/components/BarChartLegend/BarChartLegend.styles.js +0 -21
  76. package/dist/components/BasicTable/BasicTable.stories.js +0 -59
  77. package/dist/components/BlogPost/BlogPost.stories.js +0 -160
  78. package/dist/components/Button/Button.stories.js +0 -146
  79. package/dist/components/Button/GlareButton.stories.js +0 -132
  80. package/dist/components/CapitalRaisedSummary/CapitalRaisedSummery.stories.js +0 -42
  81. package/dist/components/ChartBox/ChartBox.js +0 -41
  82. package/dist/components/ChartBox/ChartBox.stories.js +0 -17
  83. package/dist/components/ChartBox/ChartBox.styles.js +0 -27
  84. package/dist/components/ChartBox/ChartBoxDistribution.js +0 -27
  85. package/dist/components/ChartBox/ChartBoxDistribution.stories.js +0 -18
  86. package/dist/components/ChartLegend/ChartLegend.stories.js +0 -90
  87. package/dist/components/Checkbox/Checkbox.stories.js +0 -88
  88. package/dist/components/Checklist/ChecklistCard.stories.js +0 -102
  89. package/dist/components/Checklist/UserChecklist.js +0 -184
  90. package/dist/components/Checklist/UserChecklist.stories.js +0 -317
  91. package/dist/components/Chips/Chip.stories.js +0 -36
  92. package/dist/components/Chips/ChipsWrapper.stories.js +0 -47
  93. package/dist/components/ComponentScroll/ComponentScroll.stories.js +0 -111
  94. package/dist/components/CryptoAddress/CryptoAddress.stories.js +0 -205
  95. package/dist/components/CryptoAddressDetails/CryptoAddressDetails.stories.js +0 -70
  96. package/dist/components/DonutChart/DonutChart.stories.js +0 -54
  97. package/dist/components/FAQ/FAQ.stories.js +0 -76
  98. package/dist/components/Footer/Footer.stories.js +0 -49
  99. package/dist/components/Footer/FooterLayout.stories.js +0 -26
  100. package/dist/components/Footer/FooterMenu.stories.js +0 -113
  101. package/dist/components/Footer/mangopay.png +0 -0
  102. package/dist/components/Footer/mangopay.svg +0 -20
  103. package/dist/components/ForgotPasswordModal/ForgotPasswordModal.stories.js +0 -69
  104. package/dist/components/Form/Form.stories.js +0 -32
  105. package/dist/components/FullscreenCard/FullscreenCard.styles.js +0 -27
  106. package/dist/components/Header/Header.stories.js +0 -192
  107. package/dist/components/Icon/Icon.stories.js +0 -108
  108. package/dist/components/InfoIcon/InfoIcon.stories.js +0 -299
  109. package/dist/components/InfoPanel/InfoPanel.js +0 -124
  110. package/dist/components/Input/DatePickerInput.stories.js +0 -87
  111. package/dist/components/Input/Input.stories.js +0 -217
  112. package/dist/components/Input/InputPassword.stories.js +0 -80
  113. package/dist/components/Input/InputWithButton.stories.js +0 -75
  114. package/dist/components/Input/MultiSelect.stories.js +0 -264
  115. package/dist/components/Input/OtpInput.stories.js +0 -57
  116. package/dist/components/Input/RangeInput.stories.js +0 -58
  117. package/dist/components/Input/SearchInput.stories.js +0 -366
  118. package/dist/components/Input/Select.stories.js +0 -478
  119. package/dist/components/InvestCalculator/InvestCalculator.stories.js +0 -135
  120. package/dist/components/InvestmentStat/InvestmentStat.stories.js +0 -52
  121. package/dist/components/KYCFlow/BasicInfo.js +0 -448
  122. package/dist/components/KYCFlow/Confirmation.js +0 -46
  123. package/dist/components/KYCFlow/DocumentFileUpload.js +0 -263
  124. package/dist/components/KYCFlow/DocumentScan.js +0 -75
  125. package/dist/components/KYCFlow/DocumentScanUpload.js +0 -251
  126. package/dist/components/KYCFlow/DocumentSelect.js +0 -118
  127. package/dist/components/KYCFlow/DocumentSuccess.js +0 -63
  128. package/dist/components/KYCFlow/DocumentUpload.js +0 -53
  129. package/dist/components/KYCFlow/DocumentVerificationType.js +0 -131
  130. package/dist/components/KYCFlow/FaceScan.js +0 -54
  131. package/dist/components/KYCFlow/FaceScanRecognition.js +0 -61
  132. package/dist/components/KYCFlow/FaceScanSuccess.js +0 -56
  133. package/dist/components/KYCFlow/Terms.js +0 -119
  134. package/dist/components/KYCFlow/_styles.js +0 -111
  135. package/dist/components/KYCFlow/index.js +0 -97
  136. package/dist/components/KYCSelectBox/KYCSelectBox.styles.js +0 -29
  137. package/dist/components/LatestUpdate/LatestUpdate.stories.js +0 -58
  138. package/dist/components/Layout/Layout.stories.js +0 -60
  139. package/dist/components/LearnMoreCarousel/LearnMoreCarousel.stories.js +0 -66
  140. package/dist/components/LearnMorePage/LearnMore.stories.js +0 -48
  141. package/dist/components/LearnMorePage/LearnMoreItem.stories.js +0 -62
  142. package/dist/components/LearnMoreSection/LearnMore.stories.js +0 -30
  143. package/dist/components/LearnMoreSection/LearnMoreItem.stories.js +0 -59
  144. package/dist/components/LoginModal/LoginModal.stories.js +0 -74
  145. package/dist/components/MatomoConnect/Matomo.js +0 -228
  146. package/dist/components/MatomoConnect/Matomo_fuckup.js +0 -387
  147. package/dist/components/Modal/Modal.stories.js +0 -75
  148. package/dist/components/Modal/NewVentureModal/NewVentureModal.stories.js +0 -150
  149. package/dist/components/Modal/PaymentModal.stories.js +0 -57
  150. package/dist/components/Modal/SideModal.stories.js +0 -342
  151. package/dist/components/MultiProgressBar/MultiProgressBar.stories.js +0 -67
  152. package/dist/components/Newsletter/Newsletter.stories.js +0 -16
  153. package/dist/components/NotificationContext/NotificationContext.js +0 -141
  154. package/dist/components/Number/Number.stories.js +0 -92
  155. package/dist/components/Pagination/Pagination.stories.js +0 -83
  156. package/dist/components/Pagination/PaginationControls.stories.js +0 -112
  157. package/dist/components/Payment/PaymentDetailsCard.stories.js +0 -198
  158. package/dist/components/Payment/PaymentDisplay.stories.js +0 -302
  159. package/dist/components/Payment/TimerComponent.stories.js +0 -236
  160. package/dist/components/Process/Process.stories.js +0 -42
  161. package/dist/components/ProfileBadge/ProfileBadge.stories.js +0 -45
  162. package/dist/components/ProfileBox/ProfileBox.stories.js +0 -35
  163. package/dist/components/ProfileHeader/ProfileHeader.js +0 -252
  164. package/dist/components/ProfileHeader/ProfileHeader.styles.js +0 -65
  165. package/dist/components/ProfileStat/ProfileStat.stories.js +0 -66
  166. package/dist/components/ProofOfAddress/ProofOfAddress.styles.js +0 -53
  167. package/dist/components/QRCode/QRCode.stories.js +0 -104
  168. package/dist/components/Radio/Radio.stories.js +0 -73
  169. package/dist/components/RefreshButton/RefreshButton.stories.js +0 -38
  170. package/dist/components/RegisterAlgorand/AlgoAddressName.js +0 -138
  171. package/dist/components/RegisterAlgorand/AlgoAdressSelect.js +0 -443
  172. package/dist/components/RegisterAlgorand/AlgoConnectWallet.js +0 -47
  173. package/dist/components/RegisterAlgorand/AlgoSuccess.js +0 -38
  174. package/dist/components/RegisterAlgorand/Algorand.stories.js +0 -80
  175. package/dist/components/RegisterAlgorand/ChooseWallet.js +0 -97
  176. package/dist/components/RegisterAlgorand/SelectProject.js +0 -89
  177. package/dist/components/RegisterAlgorand/_styles.js +0 -28
  178. package/dist/components/RegisterAlgorand/flow.js +0 -409
  179. package/dist/components/RegisterAlgorand/flowWithMemo.js +0 -410
  180. package/dist/components/RegisterAlgorand/index.js +0 -48
  181. package/dist/components/RegisterConfirmModal/RegisterConfirmModal.stories.js +0 -41
  182. package/dist/components/RegisterEthereum/EthAddressLedger.js +0 -226
  183. package/dist/components/RegisterEthereum/EthAddressMetamask.js +0 -204
  184. package/dist/components/RegisterEthereum/EthAddressName.js +0 -135
  185. package/dist/components/RegisterEthereum/EthConnectLedger.js +0 -194
  186. package/dist/components/RegisterEthereum/EthConnectMetamask.js +0 -35
  187. package/dist/components/RegisterEthereum/EthFinish.js +0 -41
  188. package/dist/components/RegisterEthereum/EthIntro.js +0 -95
  189. package/dist/components/RegisterEthereum/_styles.js +0 -28
  190. package/dist/components/RegisterEthereum/index.js +0 -68
  191. package/dist/components/RegisterModal/RegisterModal.stories.js +0 -49
  192. package/dist/components/RequestDataBox/RequestDataBox.stories.js +0 -37
  193. package/dist/components/RiskQuestionnaire/RiskQuestionnaireContext.js +0 -185
  194. package/dist/components/RiskQuestionnaire/_styles.js +0 -15
  195. package/dist/components/SEO/SEO.stories.js +0 -60
  196. package/dist/components/SideLine/SideLine.stories.js +0 -28
  197. package/dist/components/SigningSubflow/SignSubAddressMetamask.js +0 -137
  198. package/dist/components/SigningSubflow/SignSubConnectLedger.js +0 -150
  199. package/dist/components/SigningSubflow/SignSubConnectMetamask.js +0 -137
  200. package/dist/components/SigningSubflow/SignSubIntro.js +0 -55
  201. package/dist/components/SigningSubflow/SignSubSendLedger.js +0 -150
  202. package/dist/components/SigningSubflow/SignSubSendMetamask.js +0 -62
  203. package/dist/components/SigningSubflow/SignSubTransactionLedger.js +0 -161
  204. package/dist/components/SigningSubflow/SignSubTransactionMetamask.js +0 -166
  205. package/dist/components/SigningSubflow/_styles.js +0 -34
  206. package/dist/components/SigningSubflow/index.js +0 -32
  207. package/dist/components/Slider/Slider.stories.js +0 -68
  208. package/dist/components/Snackbar/Snackbar.stories.js +0 -292
  209. package/dist/components/StatusTag/StatusTag.stories.js +0 -262
  210. package/dist/components/StepController/StepController.stories.js +0 -60
  211. package/dist/components/StepController/StepControllerProgress.stories.js +0 -49
  212. package/dist/components/StepsProgress/StepIndicator.stories.js +0 -153
  213. package/dist/components/StepsProgress/StepsProgress.stories.js +0 -49
  214. package/dist/components/Switch/Switch.stories.js +0 -81
  215. package/dist/components/Tabs/Tabs.stories.js +0 -36
  216. package/dist/components/TabsNav/TabNav.stories.js +0 -40
  217. package/dist/components/TabsNav/TabsNav.stories.js +0 -37
  218. package/dist/components/TeamOverview/TeamOverview.stories.js +0 -76
  219. package/dist/components/TermsModal/TermsModal.stories.js +0 -31
  220. package/dist/components/Text/Headline.stories.js +0 -48
  221. package/dist/components/Text/Text.stories.js +0 -70
  222. package/dist/components/TextLink/TextLink.stories.js +0 -35
  223. package/dist/components/Timeline/Timeline.stories.js +0 -393
  224. package/dist/components/ToDoList/ToDoList.stories.js +0 -133
  225. package/dist/components/ToDoList/ToDoListTask.stories.js +0 -70
  226. package/dist/components/TransactionDetails/TransactionDetails.stories.js +0 -55
  227. package/dist/components/TransactionDetails/TransactionDetailsTable.stories.js +0 -305
  228. package/dist/components/TransactionInfo/TransactionInfo.stories.js +0 -61
  229. package/dist/components/TwoFactorModal/TwoFactorModal.js +0 -100
  230. package/dist/components/VerifyEmailModal/VerifyEmailModal.stories.js +0 -59
  231. package/dist/components/headerHo/HeaderHo.stories.js +0 -35
  232. package/dist/components/icons/Arrow.stories.js +0 -42
  233. package/dist/components/icons/ArrowSimple.stories.js +0 -48
  234. package/dist/components/icons/Check.stories.js +0 -22
  235. package/dist/components/icons/Facebook.stories.js +0 -21
  236. package/dist/components/icons/Facebook_Logo.png +0 -0
  237. package/dist/components/icons/Info.stories.js +0 -16
  238. package/dist/components/icons/Instagram.stories.js +0 -21
  239. package/dist/components/icons/LI-In-Bug.png +0 -0
  240. package/dist/components/icons/LinkIcon.stories.js +0 -21
  241. package/dist/components/icons/LinkedIn.stories.js +0 -16
  242. package/dist/components/icons/Medium.stories.js +0 -16
  243. package/dist/components/icons/Reddit.stories.js +0 -21
  244. package/dist/components/icons/Share.stories.js +0 -16
  245. package/dist/components/icons/Telegram-Logo.png +0 -0
  246. package/dist/components/icons/Telegram.stories.js +0 -16
  247. package/dist/components/icons/Twitter.stories.js +0 -21
  248. package/dist/components/icons/X-logo-black.png +0 -0
  249. package/dist/components/icons/X.stories.js +0 -16
  250. package/dist/components/icons/Youtube.stories.js +0 -21
  251. package/dist/components/icons/youtube_social_circle_red.png +0 -0
  252. package/dist/components/logo/Logo.stories.js +0 -260
  253. package/dist/components/taxId/TaxId.stories.js +0 -50
  254. package/dist/components/video/Video.stories.js +0 -52
  255. package/dist/static/images/document-icon.svg +0 -3
  256. package/dist/static/images/sent-icon.svg +0 -10
@@ -1,57 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.default = exports.PaymentModalOpen = void 0;
7
- var _react = _interopRequireDefault(require("react"));
8
- var _PaymentModal = require("./PaymentModal");
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/Modal',
14
- component: _PaymentModal.PaymentModal,
15
- argTypes: {
16
- data: {
17
- type: 'object',
18
- defaultValue: false
19
- },
20
- isModalOpen: {
21
- type: 'boolean',
22
- defaultValue: false
23
- },
24
- onClose: {
25
- type: 'function',
26
- action: 'onClose'
27
- }
28
- }
29
- };
30
- 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(_PaymentModal.PaymentModal, args)));
31
- const PaymentModalOpen = exports.PaymentModalOpen = Template.bind({});
32
- PaymentModalOpen.args = {
33
- //children: 'I am the Child Element',
34
- isModalOpen: true,
35
- formatAmountInLink: true,
36
- data: {
37
- projectData: {
38
- companyWallet: 'something'
39
- },
40
- tokeDecimals: 2,
41
- currencyAmount: 32,
42
- tokenAmount: '67',
43
- tokenPrice: '345',
44
- tokenSymbol: '$',
45
- createdAt: Date.now(),
46
- GAID: 'some gaid',
47
- currencyType: 'lbtc'
48
- }
49
- };
50
-
51
- // export const PaymentModalFullscreen = Template.bind({})
52
- // ModalFullscreen.args = {
53
- // //children: 'I am the Child Element and I am Fullscreen',
54
- // isOpen: true,
55
- // //fullscreen: true,
56
-
57
- // }
@@ -1,342 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.default = exports.WithoutCloseButton = exports.WithContent = exports.NoDimmerClose = exports.LongContent = exports.DifferentWidths = exports.Basic = void 0;
7
- var _react = _interopRequireWildcard(require("react"));
8
- var _SideModal = _interopRequireDefault(require("./SideModal"));
9
- var _ComponentWrapper = require("../ComponentWrapper/ComponentWrapper.styles");
10
- var _Button = _interopRequireDefault(require("../Button/Button.styles"));
11
- var _global = _interopRequireDefault(require("../../styles/global"));
12
- var _colors = _interopRequireDefault(require("../../styles/colors"));
13
- function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
14
- 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); }
15
- var _default = exports.default = {
16
- title: 'Components Library/Modal/SideModal',
17
- component: _SideModal.default,
18
- decorators: [Story => /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_global.default, null), /*#__PURE__*/_react.default.createElement(Story, null))],
19
- argTypes: {
20
- isOpen: {
21
- control: 'boolean',
22
- description: 'Controls modal visibility'
23
- },
24
- width: {
25
- control: {
26
- type: 'range',
27
- min: 20,
28
- max: 90,
29
- step: 5
30
- },
31
- description: 'Width as percentage of screen',
32
- defaultValue: 40
33
- },
34
- minWidth: {
35
- control: 'number',
36
- description: 'Minimum width in pixels',
37
- defaultValue: 400
38
- },
39
- closeOnDimmerClick: {
40
- control: 'boolean',
41
- description: 'Close modal when clicking dimmed area',
42
- defaultValue: true
43
- },
44
- showCloseButton: {
45
- control: 'boolean',
46
- description: 'Show close button',
47
- defaultValue: true
48
- }
49
- }
50
- }; // Basic example
51
- const Basic = () => {
52
- const [isOpen, setIsOpen] = (0, _react.useState)(false);
53
- return /*#__PURE__*/_react.default.createElement(_ComponentWrapper.ComponentWrapper, null, /*#__PURE__*/_react.default.createElement(_Button.default, {
54
- onClick: () => setIsOpen(true)
55
- }, "Open Side Modal"), /*#__PURE__*/_react.default.createElement(_SideModal.default, {
56
- isOpen: isOpen,
57
- onClose: () => setIsOpen(false)
58
- }, /*#__PURE__*/_react.default.createElement("div", {
59
- style: {
60
- padding: '40px'
61
- }
62
- }, /*#__PURE__*/_react.default.createElement("h2", {
63
- style: {
64
- marginBottom: '20px'
65
- }
66
- }, "Basic Side Modal"), /*#__PURE__*/_react.default.createElement("p", {
67
- style: {
68
- marginBottom: '16px',
69
- lineHeight: '1.6'
70
- }
71
- }, "This is a basic side modal that slides in from the right. It takes 40% of the screen width by default."), /*#__PURE__*/_react.default.createElement("p", {
72
- style: {
73
- marginBottom: '16px',
74
- lineHeight: '1.6'
75
- }
76
- }, "You can close it by clicking the X button, clicking outside, or pressing Escape."), /*#__PURE__*/_react.default.createElement(_Button.default, {
77
- onClick: () => setIsOpen(false)
78
- }, "Close Modal"))));
79
- };
80
-
81
- // Different widths
82
- exports.Basic = Basic;
83
- const DifferentWidths = () => {
84
- const [isOpen30, setIsOpen30] = (0, _react.useState)(false);
85
- const [isOpen40, setIsOpen40] = (0, _react.useState)(false);
86
- const [isOpen60, setIsOpen60] = (0, _react.useState)(false);
87
- return /*#__PURE__*/_react.default.createElement(_ComponentWrapper.ComponentWrapper, null, /*#__PURE__*/_react.default.createElement("div", {
88
- style: {
89
- display: 'flex',
90
- flexDirection: 'column',
91
- gap: '16px'
92
- }
93
- }, /*#__PURE__*/_react.default.createElement(_Button.default, {
94
- onClick: () => setIsOpen30(true)
95
- }, "Open 30% Width"), /*#__PURE__*/_react.default.createElement(_Button.default, {
96
- onClick: () => setIsOpen40(true)
97
- }, "Open 40% Width"), /*#__PURE__*/_react.default.createElement(_Button.default, {
98
- onClick: () => setIsOpen60(true)
99
- }, "Open 60% Width")), /*#__PURE__*/_react.default.createElement(_SideModal.default, {
100
- isOpen: isOpen30,
101
- onClose: () => setIsOpen30(false),
102
- width: 30,
103
- minWidth: 300
104
- }, /*#__PURE__*/_react.default.createElement("div", {
105
- style: {
106
- padding: '40px'
107
- }
108
- }, /*#__PURE__*/_react.default.createElement("h2", null, "30% Width Modal"), /*#__PURE__*/_react.default.createElement("p", null, "This modal takes 30% of the screen width."))), /*#__PURE__*/_react.default.createElement(_SideModal.default, {
109
- isOpen: isOpen40,
110
- onClose: () => setIsOpen40(false),
111
- width: 40,
112
- minWidth: 400
113
- }, /*#__PURE__*/_react.default.createElement("div", {
114
- style: {
115
- padding: '40px'
116
- }
117
- }, /*#__PURE__*/_react.default.createElement("h2", null, "40% Width Modal"), /*#__PURE__*/_react.default.createElement("p", null, "This modal takes 40% of the screen width (default)."))), /*#__PURE__*/_react.default.createElement(_SideModal.default, {
118
- isOpen: isOpen60,
119
- onClose: () => setIsOpen60(false),
120
- width: 60,
121
- minWidth: 500
122
- }, /*#__PURE__*/_react.default.createElement("div", {
123
- style: {
124
- padding: '40px'
125
- }
126
- }, /*#__PURE__*/_react.default.createElement("h2", null, "60% Width Modal"), /*#__PURE__*/_react.default.createElement("p", null, "This modal takes 60% of the screen width."))));
127
- };
128
-
129
- // With content example (like payout details)
130
- exports.DifferentWidths = DifferentWidths;
131
- const WithContent = () => {
132
- const [isOpen, setIsOpen] = (0, _react.useState)(false);
133
- return /*#__PURE__*/_react.default.createElement(_ComponentWrapper.ComponentWrapper, null, /*#__PURE__*/_react.default.createElement(_Button.default, {
134
- onClick: () => setIsOpen(true)
135
- }, "View Payout Details"), /*#__PURE__*/_react.default.createElement(_SideModal.default, {
136
- isOpen: isOpen,
137
- onClose: () => setIsOpen(false)
138
- }, /*#__PURE__*/_react.default.createElement("div", {
139
- style: {
140
- padding: '40px'
141
- }
142
- }, /*#__PURE__*/_react.default.createElement("h1", {
143
- style: {
144
- fontSize: '24px',
145
- fontWeight: 'bold',
146
- marginBottom: '8px',
147
- textTransform: 'uppercase'
148
- }
149
- }, "PAYOUT DETAILS"), /*#__PURE__*/_react.default.createElement("p", {
150
- style: {
151
- color: _colors.default.grey2,
152
- marginBottom: '32px'
153
- }
154
- }, "View all payout information here."), /*#__PURE__*/_react.default.createElement("div", {
155
- style: {
156
- marginBottom: '32px'
157
- }
158
- }, /*#__PURE__*/_react.default.createElement("h3", {
159
- style: {
160
- marginBottom: '16px',
161
- fontSize: '16px'
162
- }
163
- }, "Status"), /*#__PURE__*/_react.default.createElement("div", {
164
- style: {
165
- display: 'flex',
166
- flexDirection: 'column',
167
- gap: '16px'
168
- }
169
- }, /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("div", {
170
- style: {
171
- display: 'flex',
172
- alignItems: 'center',
173
- gap: '8px'
174
- }
175
- }, /*#__PURE__*/_react.default.createElement("span", {
176
- style: {
177
- color: _colors.default.freshGreen
178
- }
179
- }, "\u2713"), /*#__PURE__*/_react.default.createElement("span", {
180
- style: {
181
- fontWeight: 'bold'
182
- }
183
- }, "Initiated"), /*#__PURE__*/_react.default.createElement("span", {
184
- style: {
185
- color: _colors.default.grey2,
186
- fontSize: '12px'
187
- }
188
- }, "12. AUG 2025 11:57")), /*#__PURE__*/_react.default.createElement("p", {
189
- style: {
190
- color: _colors.default.grey2,
191
- fontSize: '14px',
192
- marginLeft: '24px'
193
- }
194
- }, "Awaiting receipt of your funds.")))), /*#__PURE__*/_react.default.createElement("div", {
195
- style: {
196
- backgroundColor: _colors.default.grey3,
197
- padding: '20px',
198
- borderRadius: '8px',
199
- marginBottom: '24px'
200
- }
201
- }, /*#__PURE__*/_react.default.createElement("div", {
202
- style: {
203
- marginBottom: '16px'
204
- }
205
- }, /*#__PURE__*/_react.default.createElement("label", {
206
- style: {
207
- color: _colors.default.grey2,
208
- fontSize: '12px'
209
- }
210
- }, "Amount"), /*#__PURE__*/_react.default.createElement("div", {
211
- style: {
212
- display: 'flex',
213
- alignItems: 'center',
214
- gap: '8px'
215
- }
216
- }, /*#__PURE__*/_react.default.createElement("span", {
217
- style: {
218
- fontSize: '20px',
219
- fontWeight: 'bold'
220
- }
221
- }, "13.23145 BTC"))), /*#__PURE__*/_react.default.createElement("div", {
222
- style: {
223
- marginBottom: '16px'
224
- }
225
- }, /*#__PURE__*/_react.default.createElement("label", {
226
- style: {
227
- color: _colors.default.grey2,
228
- fontSize: '12px'
229
- }
230
- }, "Wallet address"), /*#__PURE__*/_react.default.createElement("div", {
231
- style: {
232
- fontWeight: 'bold'
233
- }
234
- }, "GAYiyo[...]LGXg")), /*#__PURE__*/_react.default.createElement("div", {
235
- style: {
236
- marginBottom: '16px'
237
- }
238
- }, /*#__PURE__*/_react.default.createElement("label", {
239
- style: {
240
- color: _colors.default.grey2,
241
- fontSize: '12px'
242
- }
243
- }, "Period"), /*#__PURE__*/_react.default.createElement("div", {
244
- style: {
245
- fontWeight: 'bold'
246
- }
247
- }, "01.10.2025. - 31.11.2025.")), /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("label", {
248
- style: {
249
- color: _colors.default.grey2,
250
- fontSize: '12px'
251
- }
252
- }, "Type"), /*#__PURE__*/_react.default.createElement("div", {
253
- style: {
254
- fontWeight: 'bold'
255
- }
256
- }, "Interest"))), /*#__PURE__*/_react.default.createElement("div", {
257
- style: {
258
- backgroundColor: _colors.default.grey3,
259
- padding: '20px',
260
- borderRadius: '8px',
261
- marginBottom: '24px'
262
- }
263
- }, /*#__PURE__*/_react.default.createElement("p", {
264
- style: {
265
- color: _colors.default.grey2,
266
- fontSize: '14px',
267
- marginBottom: '8px'
268
- }
269
- }, "To modify payout details or cancel this transaction, contact our support team at", ' ', /*#__PURE__*/_react.default.createElement("a", {
270
- href: "mailto:support@stokr.io",
271
- style: {
272
- color: _colors.default.blue,
273
- textDecoration: 'none'
274
- }
275
- }, "support@stokr.io"), ".")), /*#__PURE__*/_react.default.createElement(_Button.default, {
276
- onClick: () => setIsOpen(false)
277
- }, "Close"))));
278
- };
279
-
280
- // Without close button
281
- exports.WithContent = WithContent;
282
- const WithoutCloseButton = () => {
283
- const [isOpen, setIsOpen] = (0, _react.useState)(false);
284
- return /*#__PURE__*/_react.default.createElement(_ComponentWrapper.ComponentWrapper, null, /*#__PURE__*/_react.default.createElement(_Button.default, {
285
- onClick: () => setIsOpen(true)
286
- }, "Open Modal (No Close Button)"), /*#__PURE__*/_react.default.createElement(_SideModal.default, {
287
- isOpen: isOpen,
288
- onClose: () => setIsOpen(false),
289
- showCloseButton: false
290
- }, /*#__PURE__*/_react.default.createElement("div", {
291
- style: {
292
- padding: '40px'
293
- }
294
- }, /*#__PURE__*/_react.default.createElement("h2", null, "Modal Without Close Button"), /*#__PURE__*/_react.default.createElement("p", null, "This modal doesn't have a close button. You can only close it by:"), /*#__PURE__*/_react.default.createElement("ul", null, /*#__PURE__*/_react.default.createElement("li", null, "Clicking outside (on the dimmed area)"), /*#__PURE__*/_react.default.createElement("li", null, "Pressing Escape key"), /*#__PURE__*/_react.default.createElement("li", null, "Using the close button below")), /*#__PURE__*/_react.default.createElement(_Button.default, {
295
- onClick: () => setIsOpen(false)
296
- }, "Close Modal"))));
297
- };
298
-
299
- // Don't close on dimmer click
300
- exports.WithoutCloseButton = WithoutCloseButton;
301
- const NoDimmerClose = () => {
302
- const [isOpen, setIsOpen] = (0, _react.useState)(false);
303
- return /*#__PURE__*/_react.default.createElement(_ComponentWrapper.ComponentWrapper, null, /*#__PURE__*/_react.default.createElement(_Button.default, {
304
- onClick: () => setIsOpen(true)
305
- }, "Open Modal (No Dimmer Close)"), /*#__PURE__*/_react.default.createElement(_SideModal.default, {
306
- isOpen: isOpen,
307
- onClose: () => setIsOpen(false),
308
- closeOnDimmerClick: false
309
- }, /*#__PURE__*/_react.default.createElement("div", {
310
- style: {
311
- padding: '40px'
312
- }
313
- }, /*#__PURE__*/_react.default.createElement("h2", null, "Modal That Doesn't Close on Dimmer Click"), /*#__PURE__*/_react.default.createElement("p", null, "This modal won't close when you click outside. You must use the close button or Escape key."), /*#__PURE__*/_react.default.createElement(_Button.default, {
314
- onClick: () => setIsOpen(false)
315
- }, "Close Modal"))));
316
- };
317
-
318
- // Long content (scrollable)
319
- exports.NoDimmerClose = NoDimmerClose;
320
- const LongContent = () => {
321
- const [isOpen, setIsOpen] = (0, _react.useState)(false);
322
- return /*#__PURE__*/_react.default.createElement(_ComponentWrapper.ComponentWrapper, null, /*#__PURE__*/_react.default.createElement(_Button.default, {
323
- onClick: () => setIsOpen(true)
324
- }, "Open Modal with Long Content"), /*#__PURE__*/_react.default.createElement(_SideModal.default, {
325
- isOpen: isOpen,
326
- onClose: () => setIsOpen(false)
327
- }, /*#__PURE__*/_react.default.createElement("div", {
328
- style: {
329
- padding: '40px'
330
- }
331
- }, /*#__PURE__*/_react.default.createElement("h2", null, "Long Content Modal"), /*#__PURE__*/_react.default.createElement("p", null, "This modal has scrollable content:"), Array.from({
332
- length: 50
333
- }, (_, i) => /*#__PURE__*/_react.default.createElement("p", {
334
- key: i,
335
- style: {
336
- marginBottom: '16px'
337
- }
338
- }, "This is paragraph ", i + 1, ". The modal should be scrollable when content exceeds the viewport height.")), /*#__PURE__*/_react.default.createElement(_Button.default, {
339
- onClick: () => setIsOpen(false)
340
- }, "Close Modal"))));
341
- };
342
- exports.LongContent = LongContent;
@@ -1,67 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.default = exports.MPBarMin30 = exports.MPBarMax70Fill65 = exports.MPBarAllparts = void 0;
7
- var _react = _interopRequireDefault(require("react"));
8
- var _MultiProgressBar = _interopRequireDefault(require("./MultiProgressBar"));
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/Multi Progress Bar',
14
- component: _MultiProgressBar.default,
15
- argTypes: {
16
- backParts: {
17
- type: 'array of shape',
18
- defaultValue: [{
19
- value: 0
20
- }, {
21
- label: ''
22
- }]
23
- },
24
- fillParts: {
25
- type: 'array of shape',
26
- defaultValue: [{
27
- value: 0
28
- }, {
29
- label: ''
30
- }]
31
- },
32
- fill: {
33
- type: 'number',
34
- defaultValue: 0
35
- }
36
- }
37
- }; // backpart: minumum fill
38
- // fillparts: maximum fill
39
- // fill: fill between min and max
40
- 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(_MultiProgressBar.default, args)));
41
- const MPBarMin30 = exports.MPBarMin30 = Template.bind({});
42
- MPBarMin30.args = {
43
- backParts: [{
44
- value: 30,
45
- label: 'backparts - minumum fill'
46
- }]
47
- };
48
- const MPBarMax70Fill65 = exports.MPBarMax70Fill65 = Template.bind({});
49
- MPBarMax70Fill65.args = {
50
- fillParts: [{
51
- value: 70,
52
- label: 'fillparts - maximum fill'
53
- }],
54
- fill: 65
55
- };
56
- const MPBarAllparts = exports.MPBarAllparts = Template.bind({});
57
- MPBarAllparts.args = {
58
- backParts: [{
59
- value: 7,
60
- label: 'backparts - minumum fill'
61
- }],
62
- fillParts: [{
63
- value: 60,
64
- label: 'fillparts - maximum fill'
65
- }],
66
- fill: 50
67
- };
@@ -1,16 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.default = exports.NewsletterStokr = void 0;
7
- var _react = _interopRequireDefault(require("react"));
8
- var _Newsletter = _interopRequireDefault(require("./Newsletter"));
9
- var _global = _interopRequireDefault(require("../../styles/global"));
10
- function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
11
- var _default = exports.default = {
12
- title: 'Components Library/Newsletter',
13
- component: _Newsletter.default
14
- };
15
- const Template = args => /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_global.default, null), /*#__PURE__*/_react.default.createElement(_Newsletter.default, args));
16
- const NewsletterStokr = exports.NewsletterStokr = Template.bind({});
@@ -1,141 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.NotificationProvider = exports.NotificationConsumer = void 0;
7
- var _react = _interopRequireWildcard(require("react"));
8
- var _propTypes = _interopRequireDefault(require("prop-types"));
9
- var _socket = _interopRequireDefault(require("socket.io-client"));
10
- function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
11
- 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); }
12
- 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; }
13
- function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
14
- 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); }
15
- const NotificationContext = /*#__PURE__*/_react.default.createContext();
16
- class NotificationProvider extends _react.Component {
17
- constructor() {
18
- super(...arguments);
19
- _defineProperty(this, "socket", {});
20
- _defineProperty(this, "projectSocket", {});
21
- _defineProperty(this, "state", {
22
- notifications: [],
23
- projectNotifications: []
24
- });
25
- _defineProperty(this, "connectToSocket", () => {
26
- const {
27
- userId
28
- } = this.props;
29
- this.socket = (0, _socket.default)(process.env.REACT_APP_NOTIFICATION_API_URL, {
30
- path: '/notification'
31
- });
32
- this.setSocketEvents();
33
- this.setState({
34
- notifications: []
35
- }, () => {
36
- this.socket.emit('login_to_socket', {
37
- userId
38
- });
39
- });
40
- });
41
- _defineProperty(this, "connectToProjectSocket", () => {
42
- const {
43
- projectId
44
- } = this.props;
45
- this.projectSocket = (0, _socket.default)(process.env.REACT_APP_NOTIFICATION_API_URL, {
46
- path: '/notification'
47
- });
48
- this.setProjectSocketEvents();
49
- this.setState({
50
- projectNotifications: []
51
- }, () => {
52
- this.projectSocket.emit('login_to_socket', {
53
- userId: projectId
54
- });
55
- });
56
- });
57
- _defineProperty(this, "setSocketEvents", () => {
58
- this.socket.on('has_error', this.onHasError);
59
- this.socket.on('notification', this.onNotification);
60
- });
61
- _defineProperty(this, "setProjectSocketEvents", () => {
62
- this.projectSocket.on('has_error', this.onHasError);
63
- this.projectSocket.on('notification', this.onProjectNotification);
64
- });
65
- _defineProperty(this, "onHasError", data => {
66
- console.warn(data);
67
- });
68
- _defineProperty(this, "onNotification", notification => {
69
- this.setState(prevState => ({
70
- notifications: [notification, ...prevState.notifications]
71
- }));
72
- });
73
- _defineProperty(this, "onProjectNotification", notification => {
74
- this.setState(prevState => ({
75
- projectNotifications: [notification, ...prevState.projectNotifications]
76
- }));
77
- });
78
- _defineProperty(this, "markAsRead", userNotificationId => {
79
- const {
80
- notifications
81
- } = this.state;
82
- this.socket.emit('mark_as_read', {
83
- userNotificationId
84
- });
85
- this.setState({
86
- notifications: notifications.filter(notificationItem => notificationItem._id !== userNotificationId)
87
- });
88
- });
89
- }
90
- componentDidMount() {
91
- const {
92
- userId,
93
- projectId
94
- } = this.props;
95
- if (userId !== '') {
96
- //this.connectToSocket();
97
- }
98
- if (projectId !== '') {
99
- //this.connectToProjectSocket();
100
- }
101
- }
102
- componentDidUpdate(prevProps) {
103
- const {
104
- userId,
105
- projectId
106
- } = this.props;
107
- if (prevProps.userId === '' && userId !== '') {
108
- //this.connectToSocket()
109
- }
110
- if (prevProps.projectId === '' && projectId !== '') {
111
- this.connectToProjectSocket();
112
- }
113
- }
114
- render() {
115
- const {
116
- children
117
- } = this.props;
118
- const {
119
- notifications,
120
- projectNotifications
121
- } = this.state;
122
- return /*#__PURE__*/_react.default.createElement(NotificationContext.Provider, {
123
- value: {
124
- notifications: notifications.filter(notification => !notification.isRead),
125
- projectNotifications,
126
- markAsRead: this.markAsRead
127
- }
128
- }, children);
129
- }
130
- }
131
- exports.NotificationProvider = NotificationProvider;
132
- NotificationProvider.propTypes = {
133
- children: _propTypes.default.node.isRequired,
134
- userId: _propTypes.default.string,
135
- projectId: _propTypes.default.string
136
- };
137
- NotificationProvider.defaultProps = {
138
- userId: '',
139
- projectId: ''
140
- };
141
- const NotificationConsumer = exports.NotificationConsumer = NotificationContext.Consumer;