@dynamic-labs/sdk-react-core 0.18.0-RC.2 → 0.18.0-RC.20

package/src/lib/shared/assets/close.cjs

@@ -34,9 +34,9 @@ var SvgClose = function SvgClose(_ref) {
     titleId = _ref.titleId,
     props = _objectWithoutProperties(_ref, _excluded);
   return /*#__PURE__*/React__namespace.createElement("svg", _extends({
-    width: 10,
-    height: 10,
-    viewBox: "0 0 10 10",
+    width: 20,
+    height: 20,
+    viewBox: "0 0 20 20",
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg",
     "aria-labelledby": titleId
@@ -45,8 +45,8 @@ var SvgClose = function SvgClose(_ref) {
   }, title) : null, _path || (_path = /*#__PURE__*/React__namespace.createElement("path", {
     fillRule: "evenodd",
     clipRule: "evenodd",
-    d: "M.529.529c.26-.26.682-.26.942 0L5 4.057 8.529.53a.667.667 0 0 1 .942.942L5.943 5 9.47 8.529a.667.667 0 1 1-.942.942L5 5.943 1.471 9.47A.667.667 0 1 1 .53 8.53L4.057 5 .53 1.471a.667.667 0 0 1 0-.942Z",
-    fill: "currentColor"
+    d: "M4.41 4.41a.833.833 0 0 1 1.18 0L10 8.822l4.41-4.41a.833.833 0 1 1 1.18 1.178L11.178 10l4.41 4.41a.833.833 0 1 1-1.178 1.18L10 11.177 5.588 15.59a.833.833 0 1 1-1.178-1.178L8.82 10l-4.41-4.41a.833.833 0 0 1 0-1.18Z",
+    fill: "currentcolor"
   })));
 };
 

package/src/lib/shared/assets/close.js

@@ -10,9 +10,9 @@ var SvgClose = function SvgClose(_ref) {
     titleId = _ref.titleId,
     props = _objectWithoutProperties(_ref, _excluded);
   return /*#__PURE__*/React.createElement("svg", _extends({
-    width: 10,
-    height: 10,
-    viewBox: "0 0 10 10",
+    width: 20,
+    height: 20,
+    viewBox: "0 0 20 20",
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg",
     "aria-labelledby": titleId
@@ -21,8 +21,8 @@ var SvgClose = function SvgClose(_ref) {
   }, title) : null, _path || (_path = /*#__PURE__*/React.createElement("path", {
     fillRule: "evenodd",
     clipRule: "evenodd",
-    d: "M.529.529c.26-.26.682-.26.942 0L5 4.057 8.529.53a.667.667 0 0 1 .942.942L5.943 5 9.47 8.529a.667.667 0 1 1-.942.942L5 5.943 1.471 9.47A.667.667 0 1 1 .53 8.53L4.057 5 .53 1.471a.667.667 0 0 1 0-.942Z",
-    fill: "currentColor"
+    d: "M4.41 4.41a.833.833 0 0 1 1.18 0L10 8.822l4.41-4.41a.833.833 0 1 1 1.18 1.178L11.178 10l4.41 4.41a.833.833 0 1 1-1.178 1.18L10 11.177 5.588 15.59a.833.833 0 1 1-1.178-1.178L8.82 10l-4.41-4.41a.833.833 0 0 1 0-1.18Z",
+    fill: "currentcolor"
   })));
 };
 

package/src/lib/shared/assets/footer-info-icon.cjs

@@ -45,8 +45,8 @@ var SvgFooterInfoIcon = function SvgFooterInfoIcon(_ref) {
   }, title) : null, _path || (_path = /*#__PURE__*/React__namespace.createElement("path", {
     fillRule: "evenodd",
     clipRule: "evenodd",
-    d: "M10 3.333a6.667 6.667 0 1 0 0 13.334 6.667 6.667 0 0 0 0-13.334ZM1.667 10a8.333 8.333 0 1 1 16.666 0 8.333 8.333 0 0 1-16.666 0Zm7.5-3.333c0-.46.373-.834.833-.834h.008a.833.833 0 0 1 0 1.667H10a.833.833 0 0 1-.833-.833ZM8.333 10c0-.46.373-.833.834-.833H10c.46 0 .833.373.833.833v2.5a.833.833 0 0 1 0 1.667H10a.833.833 0 0 1-.833-.834v-2.5A.833.833 0 0 1 8.333 10Z",
-    fill: "currentColor"
+    d: "M10 3.333a6.667 6.667 0 1 0 0 13.334 6.667 6.667 0 0 0 0-13.334ZM1.667 10a8.333 8.333 0 1 1 16.666 0 8.333 8.333 0 0 1-16.666 0Zm7.5-3.333c0-.46.373-.834.833-.834h.008a.833.833 0 1 1 0 1.667H10a.833.833 0 0 1-.833-.833ZM8.333 10c0-.46.374-.833.834-.833H10c.46 0 .833.373.833.833v2.5a.833.833 0 1 1 0 1.667H10a.833.833 0 0 1-.833-.834v-2.5A.833.833 0 0 1 8.333 10Z",
+    fill: "currentcolor"
   })));
 };
 

package/src/lib/shared/assets/footer-info-icon.js

@@ -21,8 +21,8 @@ var SvgFooterInfoIcon = function SvgFooterInfoIcon(_ref) {
   }, title) : null, _path || (_path = /*#__PURE__*/React.createElement("path", {
     fillRule: "evenodd",
     clipRule: "evenodd",
-    d: "M10 3.333a6.667 6.667 0 1 0 0 13.334 6.667 6.667 0 0 0 0-13.334ZM1.667 10a8.333 8.333 0 1 1 16.666 0 8.333 8.333 0 0 1-16.666 0Zm7.5-3.333c0-.46.373-.834.833-.834h.008a.833.833 0 0 1 0 1.667H10a.833.833 0 0 1-.833-.833ZM8.333 10c0-.46.373-.833.834-.833H10c.46 0 .833.373.833.833v2.5a.833.833 0 0 1 0 1.667H10a.833.833 0 0 1-.833-.834v-2.5A.833.833 0 0 1 8.333 10Z",
-    fill: "currentColor"
+    d: "M10 3.333a6.667 6.667 0 1 0 0 13.334 6.667 6.667 0 0 0 0-13.334ZM1.667 10a8.333 8.333 0 1 1 16.666 0 8.333 8.333 0 0 1-16.666 0Zm7.5-3.333c0-.46.373-.834.833-.834h.008a.833.833 0 1 1 0 1.667H10a.833.833 0 0 1-.833-.833ZM8.333 10c0-.46.374-.833.834-.833H10c.46 0 .833.373.833.833v2.5a.833.833 0 1 1 0 1.667H10a.833.833 0 0 1-.833-.834v-2.5A.833.833 0 0 1 8.333 10Z",
+    fill: "currentcolor"
   })));
 };
 

package/src/lib/shared/assets/index.d.ts

@@ -21,6 +21,7 @@ export { ReactComponent as InfoIcon } from './footer-info-icon.svg';
 export { ReactComponent as EyeIcon } from './footer-eye-icon.svg';
 export { ReactComponent as GasIcon } from './footer-gas-icon.svg';
 export { ReactComponent as KeyIcon } from './footer-key-icon.svg';
+export { ReactComponent as KeyOutlineIcon } from './key.svg';
 export { ReactComponent as PuzzleIcon } from './puzzle.svg';
 export { ReactComponent as LinkIcon } from './link.svg';
 export { ReactComponent as ExternalLinkIcon } from './externalLink.svg';
@@ -32,3 +33,4 @@ export { ReactComponent as TooltipArrow } from './tooltip-arrow.svg';
 export { ReactComponent as SwitchHorizontalIcon } from './switch-horizontal.svg';
 export { ReactComponent as DotsHorizontalIcon } from './dots-horizontal.svg';
 export { ReactComponent as SendIcon } from './send.svg';
+export { ReactComponent as QuestionMarkIcon } from './question-mark.svg';

package/src/lib/shared/assets/key.cjs

@@ -0,0 +1,53 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var React = require('react');
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n["default"] = e;
+  return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
+
+var _path;
+var _excluded = ["title", "titleId"];
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+var SvgKey = function SvgKey(_ref) {
+  var title = _ref.title,
+    titleId = _ref.titleId,
+    props = _objectWithoutProperties(_ref, _excluded);
+  return /*#__PURE__*/React__namespace.createElement("svg", _extends({
+    width: 18,
+    height: 18,
+    viewBox: "0 0 18 18",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    "aria-labelledby": titleId
+  }, props), title ? /*#__PURE__*/React__namespace.createElement("title", {
+    id: titleId
+  }, title) : null, _path || (_path = /*#__PURE__*/React__namespace.createElement("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M11.25 3a3.751 3.751 0 0 0-3.59 4.84.743.743 0 0 1-.187.746L3 13.062V15h1.5v-.75a.75.75 0 0 1 .75-.75H6v-.75a.75.75 0 0 1 .75-.75h1.188l1.476-1.473a.743.743 0 0 1 .746-.187A3.751 3.751 0 1 0 11.25 3ZM6 15v.75a.75.75 0 0 1-.75.75H3A1.5 1.5 0 0 1 1.5 15v-1.938c0-.398.156-.78.438-1.062l4.171-4.172A5.251 5.251 0 0 1 11.25 1.5a5.251 5.251 0 0 1 5.251 5.25 5.251 5.251 0 0 1-6.328 5.14l-1.39 1.391a.75.75 0 0 1-.532.219H7.5v.75a.75.75 0 0 1-.75.75Zm4.5-9.75a.75.75 0 0 1 .75-.75 2.25 2.25 0 0 1 2.25 2.25.75.75 0 0 1-1.5 0 .75.75 0 0 0-.75-.75.75.75 0 0 1-.75-.75Zm0 0",
+    fill: "currentColor"
+  })));
+};
+
+exports.ReactComponent = SvgKey;

package/src/lib/shared/assets/key.js

@@ -0,0 +1,29 @@
+import * as React from 'react';
+
+var _path;
+var _excluded = ["title", "titleId"];
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+var SvgKey = function SvgKey(_ref) {
+  var title = _ref.title,
+    titleId = _ref.titleId,
+    props = _objectWithoutProperties(_ref, _excluded);
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    width: 18,
+    height: 18,
+    viewBox: "0 0 18 18",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    "aria-labelledby": titleId
+  }, props), title ? /*#__PURE__*/React.createElement("title", {
+    id: titleId
+  }, title) : null, _path || (_path = /*#__PURE__*/React.createElement("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M11.25 3a3.751 3.751 0 0 0-3.59 4.84.743.743 0 0 1-.187.746L3 13.062V15h1.5v-.75a.75.75 0 0 1 .75-.75H6v-.75a.75.75 0 0 1 .75-.75h1.188l1.476-1.473a.743.743 0 0 1 .746-.187A3.751 3.751 0 1 0 11.25 3ZM6 15v.75a.75.75 0 0 1-.75.75H3A1.5 1.5 0 0 1 1.5 15v-1.938c0-.398.156-.78.438-1.062l4.171-4.172A5.251 5.251 0 0 1 11.25 1.5a5.251 5.251 0 0 1 5.251 5.25 5.251 5.251 0 0 1-6.328 5.14l-1.39 1.391a.75.75 0 0 1-.532.219H7.5v.75a.75.75 0 0 1-.75.75Zm4.5-9.75a.75.75 0 0 1 .75-.75 2.25 2.25 0 0 1 2.25 2.25.75.75 0 0 1-1.5 0 .75.75 0 0 0-.75-.75.75.75 0 0 1-.75-.75Zm0 0",
+    fill: "currentColor"
+  })));
+};
+
+export { SvgKey as ReactComponent };

package/src/lib/shared/assets/question-mark.cjs

@@ -0,0 +1,58 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var React = require('react');
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n["default"] = e;
+  return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
+
+var _path, _path2;
+var _excluded = ["title", "titleId"];
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+var SvgQuestionMark = function SvgQuestionMark(_ref) {
+  var title = _ref.title,
+    titleId = _ref.titleId,
+    props = _objectWithoutProperties(_ref, _excluded);
+  return /*#__PURE__*/React__namespace.createElement("svg", _extends({
+    width: 20,
+    height: 20,
+    viewBox: "0 0 20 20",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    "aria-labelledby": titleId
+  }, props), title ? /*#__PURE__*/React__namespace.createElement("title", {
+    id: titleId
+  }, title) : null, _path || (_path = /*#__PURE__*/React__namespace.createElement("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M10 3.25a6.75 6.75 0 1 0 0 13.5 6.75 6.75 0 0 0 0-13.5ZM1.667 10a8.333 8.333 0 1 1 16.666 0 8.333 8.333 0 0 1-16.666 0Z",
+    fill: "currentcolor"
+  })), _path2 || (_path2 = /*#__PURE__*/React__namespace.createElement("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M10.31 7.044a1.784 1.784 0 0 0-1.133.192 1.513 1.513 0 0 0-.699.783.792.792 0 0 1-1.481-.559c.26-.689.768-1.257 1.42-1.613a3.368 3.368 0 0 1 2.144-.367 3.262 3.262 0 0 1 1.908 1.023c.496.55.775 1.254.774 1.99 0 1.201-.948 1.972-1.587 2.369a6.63 6.63 0 0 1-1.354.635l-.028.01-.008.002h-.003l-.002.001-.235-.756.235.756A.792.792 0 0 1 9.789 10h.001m0 0 .014-.005.06-.021a5.054 5.054 0 0 0 .956-.456c.575-.357.84-.717.84-1.024 0-.332-.125-.66-.367-.928a1.68 1.68 0 0 0-.982-.521M9.265 13.77c0-.438.355-.792.792-.792h.01a.792.792 0 1 1 0 1.584h-.01a.792.792 0 0 1-.792-.792Z",
+    fill: "currentcolor"
+  })));
+};
+
+exports.ReactComponent = SvgQuestionMark;

package/src/lib/shared/assets/question-mark.js

@@ -0,0 +1,34 @@
+import * as React from 'react';
+
+var _path, _path2;
+var _excluded = ["title", "titleId"];
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+var SvgQuestionMark = function SvgQuestionMark(_ref) {
+  var title = _ref.title,
+    titleId = _ref.titleId,
+    props = _objectWithoutProperties(_ref, _excluded);
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    width: 20,
+    height: 20,
+    viewBox: "0 0 20 20",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    "aria-labelledby": titleId
+  }, props), title ? /*#__PURE__*/React.createElement("title", {
+    id: titleId
+  }, title) : null, _path || (_path = /*#__PURE__*/React.createElement("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M10 3.25a6.75 6.75 0 1 0 0 13.5 6.75 6.75 0 0 0 0-13.5ZM1.667 10a8.333 8.333 0 1 1 16.666 0 8.333 8.333 0 0 1-16.666 0Z",
+    fill: "currentcolor"
+  })), _path2 || (_path2 = /*#__PURE__*/React.createElement("path", {
+    fillRule: "evenodd",
+    clipRule: "evenodd",
+    d: "M10.31 7.044a1.784 1.784 0 0 0-1.133.192 1.513 1.513 0 0 0-.699.783.792.792 0 0 1-1.481-.559c.26-.689.768-1.257 1.42-1.613a3.368 3.368 0 0 1 2.144-.367 3.262 3.262 0 0 1 1.908 1.023c.496.55.775 1.254.774 1.99 0 1.201-.948 1.972-1.587 2.369a6.63 6.63 0 0 1-1.354.635l-.028.01-.008.002h-.003l-.002.001-.235-.756.235.756A.792.792 0 0 1 9.789 10h.001m0 0 .014-.005.06-.021a5.054 5.054 0 0 0 .956-.456c.575-.357.84-.717.84-1.024 0-.332-.125-.66-.367-.928a1.68 1.68 0 0 0-.982-.521M9.265 13.77c0-.438.355-.792.792-.792h.01a.792.792 0 1 1 0 1.584h-.01a.792.792 0 0 1-.792-.792Z",
+    fill: "currentcolor"
+  })));
+};
+
+export { SvgQuestionMark as ReactComponent };

package/src/lib/shared/types/index.d.ts

@@ -10,6 +10,7 @@ export type Wallet = {
     connected: boolean;
     connector: WalletConnector;
     id: string;
+    network?: string | number;
 };
 export type WalletAction = 'select' | 'unlink';
 export type WalletWithAction = {
@@ -28,6 +29,7 @@ export type UserProfile = UserFields & {
     userId?: string;
     verifiedCredentials: JwtVerifiedCredential[];
     wallet?: string;
+    scope?: string;
 };
 export type Icon = React.FunctionComponent<React.SVGProps<SVGSVGElement> & {
     title?: string | undefined;
@@ -42,6 +44,9 @@ export interface WalletOption {
     group?: string;
     groupedWallets?: WalletOption[];
 }
+export type WalletGroupOption = WalletOption & {
+    groupedWallets: WalletOption[];
+};
 export type ErrorWithCode = Error & {
     code: string;
 };
@@ -95,8 +100,9 @@ export type OnAuthSuccess = (params: {
     walletConnector: WalletConnector | undefined;
 }) => void;
 export type OnConnectSuccess = (params: {
-    walletConnector: WalletConnector | undefined;
+    walletConnector: WalletConnector | null;
 }) => void;
+export type OnBeforeConnectSuccessConfirmation = (walletAddress: string) => Promise<boolean>;
 export type OnUserProfileUpdate = (user: UserProfile) => void;
 export type MultiWalletWidgetState = 'idle' | 'awaiting_account_switch' | 'awaiting_connection' | 'awaiting_signature' | 'detected_new_wallet';
 export type AccountSwitchState = 'idle' | 'linking_new_wallet' | 'switching_primary' | 'primary_not_connected';
@@ -140,6 +146,7 @@ export type DynamicEventsCallbacks = {
     onAuthFlowOpen?: () => void;
     onAuthSuccess?: OnAuthSuccess;
     onConnectSuccess?: OnConnectSuccess;
+    onBeforeConnectSuccessConfirmation?: OnBeforeConnectSuccessConfirmation;
     onLinkSuccess?: OnAuthSuccess;
     onLogout?: (user: UserProfile | undefined) => void;
     onUnlinkSuccess?: (unlinkedWallet: JwtVerifiedCredential) => void;

package/src/lib/shared/utils/classes/storage/localStorage.cjs

@@ -2,30 +2,54 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
+var localStorage = require('../../../../utils/constants/localStorage.cjs');
+require('../../../../utils/constants/colors.cjs');
 var logger = require('../../../logger.cjs');
 
+const connectedKeys = {
+    [localStorage.AUTH_TOKEN]: [localStorage.AUTH_USER],
+    [localStorage.AUTH_USER]: [localStorage.AUTH_TOKEN],
+};
 class LocalStorage {
     static getDynamicLSKey(key) {
         return `${key}${LocalStorage.getSuffix()}`;
     }
+    static validateRequest(key, fromAuxiliarAuthFunctions) {
+        if (key === localStorage.AUTH_TOKEN && !fromAuxiliarAuthFunctions) {
+            throw new Error('You cannot access AUTH_TOKEN through localStorage. Use getAuthToken/ storeAuthToken helper functions instead');
+        }
+    }
     static setSuffix(localStorageSuffix) {
         if (!LocalStorage.__suffix__) {
             const suffix = (localStorageSuffix && `_${localStorageSuffix}`) || '';
             LocalStorage.__suffix__ = suffix;
         }
     }
-    static getFromLS(key) {
+    /**
+     *
+     * @param key
+     * @param getAuth - verifies if the request to get AUTH_TOKEN is comming from getAuthToken and not directly
+     * @returns
+     */
+    static getFromLS(key, getAuth = false) {
         if (typeof window === 'undefined') {
             return undefined;
         }
+        LocalStorage.validateRequest(key, getAuth);
         const value = window.localStorage.getItem(LocalStorage.getDynamicLSKey(key));
+        if (!value) {
+            return undefined;
+        }
         try {
-            if (value) {
-                return JSON.parse(value);
-            }
+            return JSON.parse(value);
         }
-        catch (e) {
-            logger.logger.error(e);
+        catch (error) {
+            logger.logger.debug(`Error while parsing ${key} from local storage`, { value });
+            // keep it in case handleLogOut is not yet loaded when calling this method
+            [key]
+                .concat(connectedKeys[key] || [])
+                .forEach((_key) => LocalStorage.removeFromLS(_key));
+            window.dispatchEvent(new Event('logOut'));
         }
         return undefined;
     }
@@ -35,12 +59,26 @@ class LocalStorage {
         }
         return window.localStorage.removeItem(LocalStorage.getDynamicLSKey(key));
     }
-    static setToLS(key, value) {
+    /**
+     *
+     * @param key
+     * @param value
+     * @param storeAuth - verifies if the request to get AUTH_TOKEN is comming from getAuthToken and not directly
+     * @returns
+     */
+    static setToLS(key, value, storeAuth = false) {
         if (typeof window === 'undefined') {
             return;
         }
+        LocalStorage.validateRequest(key, storeAuth);
         window.localStorage.setItem(LocalStorage.getDynamicLSKey(key), JSON.stringify(value));
     }
+    static getKeys() {
+        if (typeof window === 'undefined') {
+            return [];
+        }
+        return Object.keys(window.localStorage);
+    }
 }
 LocalStorage.getSuffix = () => LocalStorage.__suffix__ || '';
 

package/src/lib/shared/utils/classes/storage/localStorage.d.ts

@@ -2,9 +2,24 @@ export declare class LocalStorage {
     private static __suffix__;
     static getSuffix: () => string;
     private static getDynamicLSKey;
+    private static validateRequest;
     static setSuffix(localStorageSuffix?: string): void;
-    static getFromLS<T = any>(key: string): T | undefined;
+    /**
+     *
+     * @param key
+     * @param getAuth - verifies if the request to get AUTH_TOKEN is comming from getAuthToken and not directly
+     * @returns
+     */
+    static getFromLS<T = any>(key: string, getAuth?: boolean): T | undefined;
     static removeFromLS(key: string): void;
-    static setToLS<T = any>(key: string, value: T): void;
+    /**
+     *
+     * @param key
+     * @param value
+     * @param storeAuth - verifies if the request to get AUTH_TOKEN is comming from getAuthToken and not directly
+     * @returns
+     */
+    static setToLS<T = any>(key: string, value: T, storeAuth?: boolean): void;
+    static getKeys(): string[];
 }
 export default LocalStorage;

package/src/lib/shared/utils/classes/storage/localStorage.js

@@ -1,27 +1,51 @@
+import { AUTH_TOKEN, AUTH_USER } from '../../../../utils/constants/localStorage.js';
+import '../../../../utils/constants/colors.js';
 import { logger } from '../../../logger.js';
 
+const connectedKeys = {
+    [AUTH_TOKEN]: [AUTH_USER],
+    [AUTH_USER]: [AUTH_TOKEN],
+};
 class LocalStorage {
     static getDynamicLSKey(key) {
         return `${key}${LocalStorage.getSuffix()}`;
     }
+    static validateRequest(key, fromAuxiliarAuthFunctions) {
+        if (key === AUTH_TOKEN && !fromAuxiliarAuthFunctions) {
+            throw new Error('You cannot access AUTH_TOKEN through localStorage. Use getAuthToken/ storeAuthToken helper functions instead');
+        }
+    }
     static setSuffix(localStorageSuffix) {
         if (!LocalStorage.__suffix__) {
             const suffix = (localStorageSuffix && `_${localStorageSuffix}`) || '';
             LocalStorage.__suffix__ = suffix;
         }
     }
-    static getFromLS(key) {
+    /**
+     *
+     * @param key
+     * @param getAuth - verifies if the request to get AUTH_TOKEN is comming from getAuthToken and not directly
+     * @returns
+     */
+    static getFromLS(key, getAuth = false) {
         if (typeof window === 'undefined') {
             return undefined;
         }
+        LocalStorage.validateRequest(key, getAuth);
         const value = window.localStorage.getItem(LocalStorage.getDynamicLSKey(key));
+        if (!value) {
+            return undefined;
+        }
         try {
-            if (value) {
-                return JSON.parse(value);
-            }
+            return JSON.parse(value);
         }
-        catch (e) {
-            logger.error(e);
+        catch (error) {
+            logger.debug(`Error while parsing ${key} from local storage`, { value });
+            // keep it in case handleLogOut is not yet loaded when calling this method
+            [key]
+                .concat(connectedKeys[key] || [])
+                .forEach((_key) => LocalStorage.removeFromLS(_key));
+            window.dispatchEvent(new Event('logOut'));
         }
         return undefined;
     }
@@ -31,12 +55,26 @@ class LocalStorage {
         }
         return window.localStorage.removeItem(LocalStorage.getDynamicLSKey(key));
     }
-    static setToLS(key, value) {
+    /**
+     *
+     * @param key
+     * @param value
+     * @param storeAuth - verifies if the request to get AUTH_TOKEN is comming from getAuthToken and not directly
+     * @returns
+     */
+    static setToLS(key, value, storeAuth = false) {
         if (typeof window === 'undefined') {
             return;
         }
+        LocalStorage.validateRequest(key, storeAuth);
         window.localStorage.setItem(LocalStorage.getDynamicLSKey(key), JSON.stringify(value));
     }
+    static getKeys() {
+        if (typeof window === 'undefined') {
+            return [];
+        }
+        return Object.keys(window.localStorage);
+    }
 }
 LocalStorage.getSuffix = () => LocalStorage.__suffix__ || '';
 

package/src/lib/shared/utils/hooks/index.d.ts

@@ -2,3 +2,6 @@ export { useLocalStorage } from './useLocalStorage';
 export { useOnClickOutside } from './useOnClickOutside';
 export { usePreventPageScroll } from './usePreventPageScroll';
 export { useGlobalLoading } from './useGlobalLoading';
+export { useMediaQuery } from './useMediaQuery';
+export { useEffectOnce } from './useEffectOnce';
+export { useForwardedRef } from './useForwardedRef';

package/src/lib/shared/utils/hooks/useEffectOnce/index.d.ts

@@ -0,0 +1 @@
+export { useEffectOnce } from './useEffectOnce';

package/src/lib/shared/utils/hooks/useEffectOnce/useEffectOnce.cjs

@@ -0,0 +1,27 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var React = require('react');
+
+/**
+ * Runs an effect function only once during component initialization.
+ *
+ * @param {Function} effect - The effect function to be executed.
+ * @returns {void}
+ *
+ * @example
+ * function ExampleComponent() {
+ *   useEffectOnce(() => {
+ *     console.log('Effect executed once');
+ *   });
+ *
+ *   return <div>Example Component</div>;
+ * }
+ */
+const useEffectOnce = (effect) => {
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    React.useEffect(effect, []);
+};
+
+exports.useEffectOnce = useEffectOnce;

package/src/lib/shared/utils/hooks/useEffectOnce/useEffectOnce.d.ts

@@ -0,0 +1,17 @@
+import { EffectCallback } from 'react';
+/**
+ * Runs an effect function only once during component initialization.
+ *
+ * @param {Function} effect - The effect function to be executed.
+ * @returns {void}
+ *
+ * @example
+ * function ExampleComponent() {
+ *   useEffectOnce(() => {
+ *     console.log('Effect executed once');
+ *   });
+ *
+ *   return <div>Example Component</div>;
+ * }
+ */
+export declare const useEffectOnce: (effect: EffectCallback) => void;

package/src/lib/shared/utils/hooks/useEffectOnce/useEffectOnce.js

@@ -0,0 +1,23 @@
+import { useEffect } from 'react';
+
+/**
+ * Runs an effect function only once during component initialization.
+ *
+ * @param {Function} effect - The effect function to be executed.
+ * @returns {void}
+ *
+ * @example
+ * function ExampleComponent() {
+ *   useEffectOnce(() => {
+ *     console.log('Effect executed once');
+ *   });
+ *
+ *   return <div>Example Component</div>;
+ * }
+ */
+const useEffectOnce = (effect) => {
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    useEffect(effect, []);
+};
+
+export { useEffectOnce };

package/src/lib/shared/utils/hooks/useForwardedRef/index.d.ts

@@ -0,0 +1 @@
+export * from './useForwardedRef';

package/src/lib/shared/utils/hooks/useForwardedRef/useForwardedRef.cjs

@@ -0,0 +1,25 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var React = require('react');
+
+// Allows access to a forwarded ref's "current" field
+// source: https://stackoverflow.com/questions/73015696/whats-the-difference-between-reacts-forwardedref-and-refobject
+//
+const useForwardedRef = (ref) => {
+    const innerRef = React.useRef(null);
+    React.useEffect(() => {
+        if (!ref)
+            return;
+        if (typeof ref === 'function') {
+            ref(innerRef.current);
+        }
+        else {
+            ref.current = innerRef.current;
+        }
+    }, [ref, innerRef]);
+    return innerRef;
+};
+
+exports.useForwardedRef = useForwardedRef;

package/src/lib/shared/utils/hooks/useForwardedRef/useForwardedRef.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare const useForwardedRef: <T>(ref: import("react").ForwardedRef<T>) => import("react").RefObject<T>;