@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,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;