@stokr/components-library 2.3.65 → 2.3.67

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.
@@ -0,0 +1,207 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.alias = alias;
7
+ exports.getAmountBucket = getAmountBucket;
8
+ exports.getTokenBucket = getTokenBucket;
9
+ exports.hasOptedIn = hasOptedIn;
10
+ exports.identify = identify;
11
+ exports.initAnalytics = initAnalytics;
12
+ exports.optIn = optIn;
13
+ exports.optOut = optOut;
14
+ exports.reset = reset;
15
+ exports.setUserProperties = setUserProperties;
16
+ exports.timeEvent = timeEvent;
17
+ exports.track = track;
18
+ var _mixpanelBrowser = _interopRequireDefault(require("mixpanel-browser"));
19
+ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
20
+ const BLOCKED_FIELDS = new Set([
21
+ // PII
22
+ 'email', 'first_name', 'last_name', 'full_name', 'name', 'phone', 'date_of_birth', 'address', 'nationality', 'passport_number',
23
+ // Blockchain
24
+ 'wallet_address', 'tx_hash', 'transaction_hash', 'block_hash', 'contract_address', 'signing_address',
25
+ // Financial precision — server sends bucketed values only
26
+ 'amount', 'exact_amount', 'investment_amount', 'token_quantity', 'token_price', 'token_value', 'price', 'value', 'balance', 'nav', 'net_asset_value',
27
+ // Banking
28
+ 'iban', 'bic', 'swift', 'bank_account', 'routing_number',
29
+ // KYC
30
+ 'kyc_data', 'kyb_data', 'document_id', 'tax_id', 'ssn']);
31
+ const BLOCKED_PATTERNS = [/address$/i,
32
+ // wallet_address, contract_address, billing_address
33
+ /hash$/i,
34
+ // tx_hash, block_hash
35
+ /^raw_/i, /password/i, /secret/i, /private.*key/i, /\bprice\b/i, /exact/i];
36
+ function sanitize(props) {
37
+ if (!props || typeof props !== 'object' || Array.isArray(props)) {
38
+ return props !== null && props !== void 0 ? props : {};
39
+ }
40
+ const cleaned = {};
41
+ for (const [key, val] of Object.entries(props)) {
42
+ const isBlocked = BLOCKED_FIELDS.has(key.toLowerCase()) || BLOCKED_PATTERNS.some(re => re.test(key));
43
+ if (isBlocked) {
44
+ if (process.env.NODE_ENV !== 'production') {
45
+ console.warn("[analytics] Blocked field stripped before sending: \"".concat(key, "\""));
46
+ }
47
+ continue;
48
+ }
49
+ cleaned[key] = val && typeof val === 'object' && !Array.isArray(val) ? sanitize(val) : val;
50
+ }
51
+ return cleaned;
52
+ }
53
+ let initialized = false;
54
+
55
+ /**
56
+ * Call once at app root.
57
+ *
58
+ * No token → all calls are silent no-ops.
59
+ * Add `.mp-sensitive` CSS class to elements that should be masked in session recordings.
60
+ *
61
+ * @param {{ token: string, app?: string, requireConsent?: boolean }} config
62
+ * requireConsent — true only for apps with a cookie banner (e.g. homepage).
63
+ * Nothing is tracked until optIn() is called.
64
+ * Default false — authenticated apps track immediately.
65
+ */
66
+ function initAnalytics() {
67
+ let {
68
+ token,
69
+ app,
70
+ requireConsent = false
71
+ } = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
72
+ if (initialized) return;
73
+ if (!token) return;
74
+ _mixpanelBrowser.default.init(token, {
75
+ api_host: 'https://api-eu.mixpanel.com',
76
+ autocapture: {
77
+ pageview: 'full-url',
78
+ click: true,
79
+ dead_click: true,
80
+ input: true,
81
+ rage_click: true,
82
+ scroll: true,
83
+ submit: true,
84
+ capture_text_content: false // never capture visible text
85
+ },
86
+ record_sessions_percent: 100,
87
+ record_heatmap_data: true,
88
+ opt_out_tracking_by_default: requireConsent,
89
+ persistence: 'localStorage',
90
+ debug: process.env.NODE_ENV !== 'production'
91
+ });
92
+ if (app) {
93
+ _mixpanelBrowser.default.register({
94
+ app
95
+ });
96
+ }
97
+ _mixpanelBrowser.default.register({
98
+ source: 'frontend'
99
+ });
100
+ initialized = true;
101
+ }
102
+
103
+ /** Call when user accepts the cookie/consent banner. */
104
+ function optIn() {
105
+ if (!initialized) return;
106
+ _mixpanelBrowser.default.opt_in_tracking();
107
+ }
108
+
109
+ /** Call when user declines the cookie/consent banner. */
110
+ function optOut() {
111
+ if (!initialized) return;
112
+ _mixpanelBrowser.default.opt_out_tracking();
113
+ }
114
+
115
+ /** Use to set the initial state of the cookie banner UI. */
116
+ function hasOptedIn() {
117
+ if (!initialized) return false;
118
+ return _mixpanelBrowser.default.has_opted_in_tracking();
119
+ }
120
+
121
+ /** Track a custom event. Props are sanitized before sending. */
122
+ function track(eventName) {
123
+ let props = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
124
+ if (!initialized) return;
125
+ _mixpanelBrowser.default.track(eventName, sanitize(props));
126
+ }
127
+
128
+ /**
129
+ * Start a duration timer. When track() is called with the same event name,
130
+ * Mixpanel automatically appends a Duration property.
131
+ *
132
+ * timeEvent('kyc.completed')
133
+ * // ... user goes through flow ...
134
+ * track('kyc.completed') // → { Duration: 142.3 }
135
+ */
136
+ function timeEvent(eventName) {
137
+ if (!initialized) return;
138
+ _mixpanelBrowser.default.time_event(eventName);
139
+ }
140
+
141
+ /**
142
+ * Called automatically by AuthContext on login — no need to call from consuming apps.
143
+ * @param {string} userId — internal UUID (_id), never email
144
+ */
145
+ function identify(userId) {
146
+ let traits = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
147
+ if (!initialized) return;
148
+ _mixpanelBrowser.default.identify(userId);
149
+ const sanitizedTraits = sanitize(traits);
150
+ if (Object.keys(sanitizedTraits).length > 0) {
151
+ _mixpanelBrowser.default.people.set(sanitizedTraits);
152
+ }
153
+ }
154
+
155
+ /**
156
+ * Update properties on the current user's Mixpanel profile.
157
+ * Call this whenever user state changes after login — KYC approval,
158
+ * tier upgrade, onboarding step completion, etc.
159
+ * Props go through the same sanitizer as track().
160
+ *
161
+ * @param {Record<string, unknown>} props — non-PII properties only
162
+ */
163
+ function setUserProperties() {
164
+ let props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
165
+ if (!initialized) return;
166
+ const sanitized = sanitize(props);
167
+ if (Object.keys(sanitized).length > 0) {
168
+ _mixpanelBrowser.default.people.set(sanitized);
169
+ }
170
+ }
171
+
172
+ /**
173
+ * Only needed for legacy Mixpanel projects (Original ID Merge).
174
+ * New projects (post-2023) handle merging automatically via identify().
175
+ */
176
+ function alias(userId) {
177
+ if (!initialized) return;
178
+ _mixpanelBrowser.default.alias(userId);
179
+ }
180
+
181
+ /** Called automatically by AuthContext on logout — no need to call from consuming apps. */
182
+ function reset() {
183
+ if (!initialized) return;
184
+ _mixpanelBrowser.default.reset();
185
+ }
186
+
187
+ /** Returns a bucket label for an investment amount (EUR/USD). */
188
+ function getAmountBucket(amount) {
189
+ if (amount < 125000) return '<125k';
190
+ if (amount < 250000) return '125k-250k';
191
+ if (amount < 500000) return '250k-500k';
192
+ if (amount < 1000000) return '500k-1M';
193
+ if (amount < 5000000) return '1M-5M';
194
+ return '5M+';
195
+ }
196
+
197
+ /** Returns a bucket label for a token quantity. */
198
+ function getTokenBucket(qty) {
199
+ if (qty <= 1) return '0-1';
200
+ if (qty <= 10) return '2-10';
201
+ if (qty <= 100) return '11-100';
202
+ if (qty <= 1000) return '101-1k';
203
+ if (qty <= 10000) return '1k-10k';
204
+ if (qty <= 100000) return '10k-100k';
205
+ if (qty <= 1000000) return '100k-1M';
206
+ return '1M+';
207
+ }
@@ -25,6 +25,7 @@ var _Grid = require("../Grid/Grid.styles");
25
25
  var _FooterLayout = require("../Footer/FooterLayout");
26
26
  var _globalVariables = require("../../constants/globalVariables");
27
27
  var _rwd = require("../../styles/rwd");
28
+ var _analytics = require("../../analytics");
28
29
  const _excluded = ["activeMenu", "activateMenu", "user", "userPhoto", "logoutUser", "onLoginClick", "onSignUpClick", "useRelativePathForMenu", "useRelativePathForUserMenu", "progress", "withSidebar", "isSidebarExpanded", "sidebarHandler", "signupFlow", "noFixedPosition", "withoutLoginSignupButton"]; //import { Wrapper } from '../Input/Input.styles'
29
30
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
30
31
  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); }
@@ -32,20 +33,40 @@ function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i
32
33
  function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
33
34
  const productMenuItems = [{
34
35
  name: 'End-to-End Tokenization',
35
- onClick: () => window.location.href = "".concat(_globalVariables.platformURL, "/solutions/asset-tokenization"),
36
+ onClick: () => {
37
+ (0, _analytics.track)('header_link_clicked', {
38
+ link: 'end-to-end tokenization'
39
+ });
40
+ window.location.href = "".concat(_globalVariables.platformURL, "/solutions/asset-tokenization");
41
+ },
36
42
  link: '/solutions/asset-tokenization'
37
43
  }, {
38
44
  name: 'Tokenization-as-a-Service',
39
- onClick: () => window.location.href = "".concat(_globalVariables.platformURL, "/solutions/tokenization-as-service"),
45
+ onClick: () => {
46
+ (0, _analytics.track)('header_link_clicked', {
47
+ link: 'tokenization-as-a-service'
48
+ });
49
+ window.location.href = "".concat(_globalVariables.platformURL, "/solutions/tokenization-as-service");
50
+ },
40
51
  link: '/solutions/tokenization-as-service'
41
52
  }];
42
53
  const mediaMenuItems = [{
43
54
  name: 'Press Releases',
44
- onClick: () => window.location.href = "".concat(_globalVariables.platformURL, "/press-releases"),
55
+ onClick: () => {
56
+ (0, _analytics.track)('header_link_clicked', {
57
+ link: 'press releases'
58
+ });
59
+ window.location.href = "".concat(_globalVariables.platformURL, "/press-releases");
60
+ },
45
61
  link: '/press-releases'
46
62
  }, {
47
63
  name: 'Stoke Post',
48
- onClick: () => window.location.href = "".concat(_globalVariables.platformURL, "/stoke-post"),
64
+ onClick: () => {
65
+ (0, _analytics.track)('header_link_clicked', {
66
+ link: 'stoke post'
67
+ });
68
+ window.location.href = "".concat(_globalVariables.platformURL, "/stoke-post");
69
+ },
49
70
  link: '/stoke-post'
50
71
  }];
51
72
  const investorMenuItems = [{
@@ -217,16 +238,32 @@ const Header = _ref3 => {
217
238
  "data-cy": "logo-nav-link"
218
239
  }, /*#__PURE__*/_react.default.createElement(_SvgIcons.LogoSvg, null))), !progress && /*#__PURE__*/_react.default.createElement(_Header.HeaderMainNav, null, /*#__PURE__*/_react.default.createElement(_MenuNav.default, null, /*#__PURE__*/_react.default.createElement("ul", null, /*#__PURE__*/_react.default.createElement("li", null, /*#__PURE__*/_react.default.createElement("a", {
219
240
  href: newPlatformUrl + '/featured-assets',
220
- "data-cy": "invest-nav-link"
241
+ "data-cy": "invest-nav-link",
242
+ onClick: () => (0, _analytics.track)('header_link_clicked', {
243
+ link: 'invest'
244
+ })
221
245
  }, "Invest")), /*#__PURE__*/_react.default.createElement("li", null, /*#__PURE__*/_react.default.createElement("a", {
222
- onClick: () => toggleMenu('products'),
246
+ onClick: () => {
247
+ (0, _analytics.track)('header_link_clicked', {
248
+ link: 'solutions'
249
+ });
250
+ toggleMenu('products');
251
+ },
223
252
  "data-cy": "products-nav-link"
224
253
  }, "Solutions")), /*#__PURE__*/_react.default.createElement("li", null, /*#__PURE__*/_react.default.createElement("a", {
225
- onClick: () => toggleMenu('media'),
254
+ onClick: () => {
255
+ (0, _analytics.track)('header_link_clicked', {
256
+ link: 'media'
257
+ });
258
+ toggleMenu('media');
259
+ },
226
260
  "data-cy": "media-nav-link"
227
261
  }, "Media")), /*#__PURE__*/_react.default.createElement("li", null, /*#__PURE__*/_react.default.createElement("a", {
228
262
  href: newPlatformUrl + '/team',
229
- "data-cy": "team-nav-link"
263
+ "data-cy": "team-nav-link",
264
+ onClick: () => (0, _analytics.track)('header_link_clicked', {
265
+ link: 'team'
266
+ })
230
267
  }, "Team")))))), progress && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, signupFlow ? /*#__PURE__*/_react.default.createElement(_StepsProgress.StepsProgressSignup, {
231
268
  user: user
232
269
  }) : /*#__PURE__*/_react.default.createElement(_Header.ProgressWrap, null, /*#__PURE__*/_react.default.createElement(_StepsProgress.StepsProgressHeader, {
@@ -260,10 +297,18 @@ const Header = _ref3 => {
260
297
  })), (0, _checkTodoStatus.default)(user) > 0 && /*#__PURE__*/_react.default.createElement(_NotificationCounter.default, {
261
298
  avatar: true
262
299
  }, (0, _checkTodoStatus.default)(user))))) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, withoutLoginSignupButton ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_breakdown.default, null, /*#__PURE__*/_react.default.createElement(_Header.LoginButton, {
263
- onClick: onLoginClick,
300
+ onClick: () => {
301
+ (0, _analytics.track)('header_link_clicked', {
302
+ link: 'login'
303
+ });
304
+ onLoginClick();
305
+ },
264
306
  "data-cy": "login-nav-button"
265
307
  }, "Log in")), /*#__PURE__*/_react.default.createElement(_Header.SignupButton, {
266
- onClick: onSignUpClick,
308
+ onClick: () => {
309
+ (0, _analytics.track)('signup_cta_clicked');
310
+ onSignUpClick();
311
+ },
267
312
  "data-cy": "signup-nav-button"
268
313
  }, "Sign Up")))))), /*#__PURE__*/_react.default.createElement(_Header.MobileMenu, {
269
314
  isActive: currentActiveMenu === 'main',
@@ -331,7 +376,12 @@ const Header = _ref3 => {
331
376
  }, "log out"))) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, withoutLoginSignupButton ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_breakdown.default, {
332
377
  alignCenter: true
333
378
  }, /*#__PURE__*/_react.default.createElement(_Button.default, {
334
- onClick: onLoginClick,
379
+ onClick: () => {
380
+ (0, _analytics.track)('header_link_clicked', {
381
+ link: 'login'
382
+ });
383
+ onLoginClick();
384
+ },
335
385
  secondary: true,
336
386
  isLoginMobile: true
337
387
  }, "Log in")), /*#__PURE__*/_react.default.createElement("div", {
@@ -341,7 +391,10 @@ const Header = _ref3 => {
341
391
  paddingBottom: 30
342
392
  }
343
393
  }, /*#__PURE__*/_react.default.createElement(_Header.SignupButton, {
344
- onClick: onSignUpClick,
394
+ onClick: () => {
395
+ (0, _analytics.track)('signup_cta_clicked');
396
+ onSignUpClick();
397
+ },
345
398
  isMobile: true
346
399
  }, "Sign Up"))), socialLinks.length > 0 && /*#__PURE__*/_react.default.createElement(_Header.CTAContainer, null, /*#__PURE__*/_react.default.createElement("span", null, "FOLLOW US"), /*#__PURE__*/_react.default.createElement(_Header.SocialLinksContainer, {
347
400
  isHeader: true
@@ -13,6 +13,7 @@ var _avatarPlaceholder = _interopRequireDefault(require("../static/images/avatar
13
13
  var _auth = require("firebase/auth");
14
14
  var _firebaseConfig = require("../firebase-config");
15
15
  var _fetchData = _interopRequireDefault(require("../api/fetchData"));
16
+ var _analytics = require("../analytics");
16
17
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
17
18
  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); }
18
19
  function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
@@ -185,6 +186,7 @@ class AuthProviderClass extends _react.Component {
185
186
  (0, _auth.signOut)(_firebaseConfig.auth).then(() => {});
186
187
  _Auth.default.logout();
187
188
  delete _axios.default.defaults.headers.common.Authorization;
189
+ (0, _analytics.reset)();
188
190
  _this.setUser(null);
189
191
  _this.setState({
190
192
  firebaseUser: null,
@@ -228,6 +230,7 @@ class AuthProviderClass extends _react.Component {
228
230
  customValidateGetUser
229
231
  } = _this.props;
230
232
  try {
233
+ var _user$email$endsWith, _user$email;
231
234
  const result = await _Auth.default.getUser();
232
235
  let firebaseUser = _this.state.firebaseUser;
233
236
  if (!firebaseUser) {
@@ -250,6 +253,10 @@ class AuthProviderClass extends _react.Component {
250
253
  _this.setState({
251
254
  isFetchingUser: false
252
255
  });
256
+ (0, _analytics.identify)(user._id, {
257
+ role: user.user_type,
258
+ is_internal: (_user$email$endsWith = (_user$email = user.email) === null || _user$email === void 0 ? void 0 : _user$email.endsWith('@stokr.io')) !== null && _user$email$endsWith !== void 0 ? _user$email$endsWith : false
259
+ });
253
260
 
254
261
  //redirect to home if user is on login or signup route (affects homepage only)
255
262
  _this.replaceLocationPathName();
package/dist/index.js CHANGED
@@ -1180,6 +1180,17 @@ Object.keys(_analytics).forEach(function (key) {
1180
1180
  }
1181
1181
  });
1182
1182
  });
1183
+ var _analytics2 = require("./analytics");
1184
+ Object.keys(_analytics2).forEach(function (key) {
1185
+ if (key === "default" || key === "__esModule") return;
1186
+ if (key in exports && exports[key] === _analytics2[key]) return;
1187
+ Object.defineProperty(exports, key, {
1188
+ enumerable: true,
1189
+ get: function () {
1190
+ return _analytics2[key];
1191
+ }
1192
+ });
1193
+ });
1183
1194
  var _formatCurrencyValue = require("./utils/formatCurrencyValue");
1184
1195
  Object.keys(_formatCurrencyValue).forEach(function (key) {
1185
1196
  if (key === "default" || key === "__esModule") return;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@stokr/components-library",
3
- "version": "2.3.65",
3
+ "version": "2.3.67",
4
4
  "description": "STOKR - Components Library",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.js",
@@ -44,6 +44,7 @@
44
44
  "html-react-parser": "^5.0.6",
45
45
  "http-server": "^14.1.1",
46
46
  "js-cookie": "^3.0.5",
47
+ "mixpanel-browser": "^2.74.0",
47
48
  "mobile-detect": "^1.4.5",
48
49
  "moment": "^2.30.1",
49
50
  "moment-timezone": "^0.6.0",