@dynamic-labs/sdk-react-core 0.18.0 → 0.18.2

package/CHANGELOG.md

@@ -1,4 +1,20 @@
 
+### [0.18.2](https://github.com/dynamic-labs/DynamicAuth/compare/v0.18.1...v0.18.2) (2023-08-15)
+
+
+### Bug Fixes
+
+* fix twitter linking ([#2918](https://github.com/dynamic-labs/DynamicAuth/issues/2918)) ([#3002](https://github.com/dynamic-labs/DynamicAuth/issues/3002)) ([e75a6bb](https://github.com/dynamic-labs/DynamicAuth/commit/e75a6bbe4a3751bf246ccffa0fe728c68d16441e))
+* use ETH currency symbol for STARK chains ([#3005](https://github.com/dynamic-labs/DynamicAuth/issues/3005)) ([#3007](https://github.com/dynamic-labs/DynamicAuth/issues/3007)) ([1f4bca8](https://github.com/dynamic-labs/DynamicAuth/commit/1f4bca86ce68e37e33543d5b1cf11421d48c0aa6))
+
+### [0.18.1](https://github.com/dynamic-labs/DynamicAuth/compare/v0.18.0...v0.18.1) (2023-08-15)
+
+
+### Bug Fixes
+
+* captcha: complete sign in with magic and blocto ([#2967](https://github.com/dynamic-labs/DynamicAuth/issues/2967)) ([#2983](https://github.com/dynamic-labs/DynamicAuth/issues/2983)) ([495b9ad](https://github.com/dynamic-labs/DynamicAuth/commit/495b9adfed3bf131cceed3f8788caaa1443d8a1a))
+* sync wagmi correctly in connect-only mode ([#2990](https://github.com/dynamic-labs/DynamicAuth/issues/2990)) ([#2994](https://github.com/dynamic-labs/DynamicAuth/issues/2994)) ([d4d6450](https://github.com/dynamic-labs/DynamicAuth/commit/d4d6450247246b81702fa8bed3cc0abdd51846f3))
+
 ## [0.18.0](https://github.com/dynamic-labs/DynamicAuth/compare/v0.18.0-beta.32...v0.18.0) (2023-08-13)
 
 
@@ -10,18 +26,18 @@
 
 ### Bug Fixes
 
-* account already exist message not displaying automatically ([#2896](https://github.com/dynamic-labs/DynamicAuth/issues/2896)) ([#2906](https://github.com/dynamic-labs/DynamicAuth/issues/2906)) ([5e7478a](https://github.com/dynamic-labs/DynamicAuth/commit/5e7478acd864451a7cf7e8e62845cca7ef5439c6))
+* fix issues with mergeUserAccountsView  ([#2945](https://github.com/dynamic-labs/DynamicAuth/issues/2945)) ([2c6265e](https://github.com/dynamic-labs/DynamicAuth/commit/2c6265e3e709edb9ff1af6e6c139b85418e46d76))
+* fix connecting with cool wallet ([#2949](https://github.com/dynamic-labs/DynamicAuth/issues/2949)) ([ab22303](https://github.com/dynamic-labs/DynamicAuth/commit/ab22303294123c2a914a65f0d2c15481740647bb))
+* fix email update when user is authenticated ([#2932](https://github.com/dynamic-labs/DynamicAuth/issues/2932)) ([db33ba1](https://github.com/dynamic-labs/DynamicAuth/commit/db33ba14c317469958ce314a3822b706e20b07d0))
+* fix gas estimate in transaction confirmation ([#2938](https://github.com/dynamic-labs/DynamicAuth/issues/2938)) ([02d0f46](https://github.com/dynamic-labs/DynamicAuth/commit/02d0f46127e94e83b4decbaaf6a45dbae135c89d))
+* fix gas estimate for transactions ([#2947](https://github.com/dynamic-labs/DynamicAuth/issues/2947)) ([ad35a72](https://github.com/dynamic-labs/DynamicAuth/commit/ad35a722df6abd54b98ea491661ff4ec3e602621))
+* fix key to distinguish wallet and wallet group ([#2922](https://github.com/dynamic-labs/DynamicAuth/issues/2922)) ([f40c07c](https://github.com/dynamic-labs/DynamicAuth/commit/f40c07c65915775e99a1dbb8d07bb23824a92915)), closes [#2909](https://github.com/dynamic-labs/DynamicAuth/issues/2909)
+* automatically display account already exist message ([#2896](https://github.com/dynamic-labs/DynamicAuth/issues/2896)) ([#2906](https://github.com/dynamic-labs/DynamicAuth/issues/2906)) ([5e7478a](https://github.com/dynamic-labs/DynamicAuth/commit/5e7478acd864451a7cf7e8e62845cca7ef5439c6))
 * don't let user update email if it's tied to an embedded wallet ([#2903](https://github.com/dynamic-labs/DynamicAuth/issues/2903)) ([33c52b5](https://github.com/dynamic-labs/DynamicAuth/commit/33c52b50a880a34b4161a700b8b1805c9b01527d)), closes [#2883](https://github.com/dynamic-labs/DynamicAuth/issues/2883)
-* **GVTY-195:** issues with mergeUserAccountsView  ([#2945](https://github.com/dynamic-labs/DynamicAuth/issues/2945)) ([2c6265e](https://github.com/dynamic-labs/DynamicAuth/commit/2c6265e3e709edb9ff1af6e6c139b85418e46d76))
-* **Magic:** improve gas estimate for transactions ([#2947](https://github.com/dynamic-labs/DynamicAuth/issues/2947)) ([ad35a72](https://github.com/dynamic-labs/DynamicAuth/commit/ad35a722df6abd54b98ea491661ff4ec3e602621))
-* missing enable isVerificationInProgress  ([#2926](https://github.com/dynamic-labs/DynamicAuth/issues/2926)) ([98f54fd](https://github.com/dynamic-labs/DynamicAuth/commit/98f54fd1345713dfaf0ef837502dfaca3709d633))
-* **networks:** merge custom network after API networks ([#2949](https://github.com/dynamic-labs/DynamicAuth/issues/2949)) ([ab22303](https://github.com/dynamic-labs/DynamicAuth/commit/ab22303294123c2a914a65f0d2c15481740647bb))
-* onBeforeConnectSuccessConfirmation is being called multiple time ([#2965](https://github.com/dynamic-labs/DynamicAuth/issues/2965)) ([a276968](https://github.com/dynamic-labs/DynamicAuth/commit/a2769689bc82350dfb8123e1fe8a4e92a60b262c))
-* **QNTM-249:** broken email update when user is authenticated ([#2932](https://github.com/dynamic-labs/DynamicAuth/issues/2932)) ([db33ba1](https://github.com/dynamic-labs/DynamicAuth/commit/db33ba14c317469958ce314a3822b706e20b07d0))
+* fix isVerificationInProgress flag ([#2926](https://github.com/dynamic-labs/DynamicAuth/issues/2926)) ([98f54fd](https://github.com/dynamic-labs/DynamicAuth/commit/98f54fd1345713dfaf0ef837502dfaca3709d633))
+* de-duplicate onBeforeConnectSuccessConfirmation callback invocations ([#2965](https://github.com/dynamic-labs/DynamicAuth/issues/2965)) ([a276968](https://github.com/dynamic-labs/DynamicAuth/commit/a2769689bc82350dfb8123e1fe8a4e92a60b262c))
 * reformat social sign-in text ([#2956](https://github.com/dynamic-labs/DynamicAuth/issues/2956)) ([#2961](https://github.com/dynamic-labs/DynamicAuth/issues/2961)) ([f8d2222](https://github.com/dynamic-labs/DynamicAuth/commit/f8d2222d102f5335f95ec917cbb63bf9b55eff0b))
-* **transaction:** improve gas estimate in transaction confirmation ([#2938](https://github.com/dynamic-labs/DynamicAuth/issues/2938)) ([02d0f46](https://github.com/dynamic-labs/DynamicAuth/commit/02d0f46127e94e83b4decbaaf6a45dbae135c89d))
-* useSyncPrimaryWallet overrides views with "wallet-locked-view" ([#2921](https://github.com/dynamic-labs/DynamicAuth/issues/2921)) ([aa8c369](https://github.com/dynamic-labs/DynamicAuth/commit/aa8c369d2a713eb57ecc99b16a6b62d465789370))
-* **wallet-list:** update key to distinguish wallet and wallet group ([#2922](https://github.com/dynamic-labs/DynamicAuth/issues/2922)) ([f40c07c](https://github.com/dynamic-labs/DynamicAuth/commit/f40c07c65915775e99a1dbb8d07bb23824a92915)), closes [#2909](https://github.com/dynamic-labs/DynamicAuth/issues/2909)
+* stop overriding views ([#2921](https://github.com/dynamic-labs/DynamicAuth/issues/2921)) ([aa8c369](https://github.com/dynamic-labs/DynamicAuth/commit/aa8c369d2a713eb57ecc99b16a6b62d465789370))
 
 ## [0.18.0-beta.32](https://github.com/dynamic-labs/DynamicAuth/compare/v0.18.0-beta.31...v0.18.0-beta.32) (2023-08-09)
 

package/package.cjs

@@ -2,11 +2,11 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var version = "0.18.0";
+var version = "0.18.2";
 var dependencies = {
 	"react-focus-lock": "2.9.2",
 	"@dynamic-labs/iconic": "0.1.23",
-	"@dynamic-labs/sdk-api": "0.0.256",
+	"@dynamic-labs/sdk-api": "0.0.260",
 	"@hcaptcha/react-hcaptcha": "1.4.4",
 	"country-list": "2.3.0",
 	yup: "0.32.11",

package/package.js

@@ -1,8 +1,8 @@
-var version = "0.18.0";
+var version = "0.18.2";
 var dependencies = {
 	"react-focus-lock": "2.9.2",
 	"@dynamic-labs/iconic": "0.1.23",
-	"@dynamic-labs/sdk-api": "0.0.256",
+	"@dynamic-labs/sdk-api": "0.0.260",
 	"@hcaptcha/react-hcaptcha": "1.4.4",
 	"country-list": "2.3.0",
 	yup: "0.32.11",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dynamic-labs/sdk-react-core",
-  "version": "0.18.0",
+  "version": "0.18.2",
   "repository": {
     "type": "git",
     "url": "https://github.com/dynamic-labs/DynamicAuth.git",
@@ -9,20 +9,20 @@
   "dependencies": {
     "react-focus-lock": "2.9.2",
     "@dynamic-labs/iconic": "0.1.23",
-    "@dynamic-labs/sdk-api": "0.0.256",
+    "@dynamic-labs/sdk-api": "0.0.260",
     "@hcaptcha/react-hcaptcha": "1.4.4",
     "country-list": "2.3.0",
     "yup": "0.32.11",
     "formik": "2.2.9",
     "qrcode": "1.5.1",
     "ethers": "5.7.2",
-    "@dynamic-labs/logger": "0.18.0",
-    "@dynamic-labs/multi-wallet": "0.18.0",
-    "@dynamic-labs/rpc-providers": "0.18.0",
-    "@dynamic-labs/types": "0.18.0",
-    "@dynamic-labs/utils": "0.18.0",
-    "@dynamic-labs/wallet-book": "0.18.0",
-    "@dynamic-labs/wallet-connector-core": "0.18.0",
+    "@dynamic-labs/logger": "0.18.2",
+    "@dynamic-labs/multi-wallet": "0.18.2",
+    "@dynamic-labs/rpc-providers": "0.18.2",
+    "@dynamic-labs/types": "0.18.2",
+    "@dynamic-labs/utils": "0.18.2",
+    "@dynamic-labs/wallet-book": "0.18.2",
+    "@dynamic-labs/wallet-connector-core": "0.18.2",
     "eventemitter3": "5.0.1"
   },
   "devDependencies": {

package/src/index.cjs

@@ -14,6 +14,7 @@ var DynamicNav = require('./lib/widgets/DynamicWidget/components/DynamicNav/Dyna
 var DynamicUserProfile = require('./lib/widgets/DynamicWidget/components/DynamicUserProfile/DynamicUserProfile.cjs');
 var FundingWidget = require('./lib/widgets/FundingWidget/FundingWidget.cjs');
 var DynamicBridgeWidget = require('./lib/widgets/DynamicBridgeWidget/DynamicBridgeWidget.cjs');
+var OAuthIFrameContainer = require('./lib/widgets/OAuthIFrameContainer/OAuthIFrameContainer.cjs');
 require('react/jsx-runtime');
 require('react');
 var classNames = require('./lib/utils/functions/classNames/classNames.cjs');
@@ -147,6 +148,7 @@ exports.DynamicNav = DynamicNav.ShadowedDynamicNav;
 exports.DynamicUserProfile = DynamicUserProfile.ShadowedDynamicUserProfile;
 exports.FundingWidget = FundingWidget.FundingWidget;
 exports.DynamicBridgeWidget = DynamicBridgeWidget.DynamicBridgeWidget;
+exports.OAuthIFrameContainer = OAuthIFrameContainer.OAuthIFrameContainer;
 exports.classNames = classNames.classNames;
 exports.decodeJwt = decodeJwt.decodeJwt;
 exports.validateType = validateType.validateType;

package/src/index.js

@@ -10,6 +10,7 @@ export { ShadowedDynamicNav as DynamicNav } from './lib/widgets/DynamicWidget/co
 export { ShadowedDynamicUserProfile as DynamicUserProfile } from './lib/widgets/DynamicWidget/components/DynamicUserProfile/DynamicUserProfile.js';
 export { FundingWidget } from './lib/widgets/FundingWidget/FundingWidget.js';
 export { DynamicBridgeWidget } from './lib/widgets/DynamicBridgeWidget/DynamicBridgeWidget.js';
+export { OAuthIFrameContainer } from './lib/widgets/OAuthIFrameContainer/OAuthIFrameContainer.js';
 import 'react/jsx-runtime';
 import 'react';
 export { classNames } from './lib/utils/functions/classNames/classNames.js';

package/src/lib/components/ModalHeaderBanner/ModalHeaderBanner.cjs

@@ -13,9 +13,11 @@ var VerticalDrawerTransition = require('../Transition/VerticalDrawerTransition/V
 
 const typographyColor = {
     error: 'error-1',
+    success: 'green-1',
 };
-const ModalHeaderBanner = ({ message, type = 'error', }) => (jsxRuntime.jsx(AnimatePresence.AnimatePresence, Object.assign({ animationComponent: jsxRuntime.jsx(VerticalDrawerTransition.VerticalDrawerTransition, { style: { width: '100%' } }) }, { children: Boolean(message) && (jsxRuntime.jsx("div", Object.assign({ className: classNames.classNames('modal-header-banner', {
+const ModalHeaderBanner = ({ message, type = 'error', disableTruncate = false, }) => (jsxRuntime.jsx(AnimatePresence.AnimatePresence, Object.assign({ animationComponent: jsxRuntime.jsx(VerticalDrawerTransition.VerticalDrawerTransition, { style: { width: '100%' } }) }, { children: Boolean(message) && (jsxRuntime.jsx("div", Object.assign({ className: classNames.classNames('modal-header-banner', {
             'modal-header-banner__error': type === 'error',
-        }) }, { children: jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'body_small', color: typographyColor[type], truncate: true }, { children: message })) }))) })));
+            'modal-header-banner__success': type === 'success',
+        }) }, { children: jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'body_small', color: typographyColor[type], truncate: disableTruncate === false }, { children: message })) }))) })));
 
 exports.ModalHeaderBanner = ModalHeaderBanner;

package/src/lib/components/ModalHeaderBanner/ModalHeaderBanner.d.ts

@@ -1,8 +1,9 @@
 import { FC } from 'react';
-type ModalHeaderBannerType = 'error';
+type ModalHeaderBannerType = 'error' | 'success';
 export type ModalHeaderBannerProps = {
     message?: string;
     type?: ModalHeaderBannerType;
+    disableTruncate?: boolean;
 };
 export declare const ModalHeaderBanner: FC<ModalHeaderBannerProps>;
 export {};

package/src/lib/components/ModalHeaderBanner/ModalHeaderBanner.js

@@ -9,9 +9,11 @@ import { VerticalDrawerTransition } from '../Transition/VerticalDrawerTransition
 
 const typographyColor = {
     error: 'error-1',
+    success: 'green-1',
 };
-const ModalHeaderBanner = ({ message, type = 'error', }) => (jsx(AnimatePresence, Object.assign({ animationComponent: jsx(VerticalDrawerTransition, { style: { width: '100%' } }) }, { children: Boolean(message) && (jsx("div", Object.assign({ className: classNames('modal-header-banner', {
+const ModalHeaderBanner = ({ message, type = 'error', disableTruncate = false, }) => (jsx(AnimatePresence, Object.assign({ animationComponent: jsx(VerticalDrawerTransition, { style: { width: '100%' } }) }, { children: Boolean(message) && (jsx("div", Object.assign({ className: classNames('modal-header-banner', {
             'modal-header-banner__error': type === 'error',
-        }) }, { children: jsx(Typography, Object.assign({ variant: 'body_small', color: typographyColor[type], truncate: true }, { children: message })) }))) })));
+            'modal-header-banner__success': type === 'success',
+        }) }, { children: jsx(Typography, Object.assign({ variant: 'body_small', color: typographyColor[type], truncate: disableTruncate === false }, { children: message })) }))) })));
 
 export { ModalHeaderBanner };

package/src/lib/components/OTPVerificationView/OTPVerificationView.cjs

@@ -55,10 +55,10 @@ require('yup');
 require('../InlineWidget/InlineWidget.cjs');
 require('../MenuList/Dropdown/Dropdown.cjs');
 
-const OTPVerificationView = ({ onClickBack, onClickEditEmail, isLoading, email, onPinComplete, isValid, error, onPinChange, onClickClose, displayPoweredByDynamic = false, }) => {
+const OTPVerificationView = ({ onClickBack, onClickEditEmail, isLoading, email, onPinComplete, isValid, error, onPinChange, onClickClose, displayPoweredByDynamic = false, successBannerText, }) => {
     const backButton = onClickBack && (jsxRuntime.jsx(IconButton.IconButton, Object.assign({ type: 'button', onClick: onClickBack, "data-testid": 'back-button' }, { children: jsxRuntime.jsx(chevronLeft.ReactComponent, {}) })));
     const closeButton = (jsxRuntime.jsx(IconButton.IconButton, Object.assign({ onClick: onClickClose, type: 'button', "data-testid": 'close-button' }, { children: jsxRuntime.jsx(close.ReactComponent, {}) })));
-    return (jsxRuntime.jsxs("div", Object.assign({ className: 'otp-verification-view' }, { children: [jsxRuntime.jsx(ModalHeaderBanner.ModalHeaderBanner, { type: 'error', message: error === null || error === void 0 ? void 0 : error.message }), jsxRuntime.jsx(ModalHeader.ModalHeader, Object.assign({ alignContent: 'bottom', leading: onClickBack && backButton, trailing: onClickClose && closeButton }, { children: jsxRuntime.jsxs("div", Object.assign({ className: 'otp-verification-view__status-header' }, { children: [isValid && (jsxRuntime.jsx(IconWithStatus.IconWithStatus, { Icon: iconic.SignInWithEmailIcon, iconSize: 50, InnerIcon: check.ReactComponent })), !isValid && (jsxRuntime.jsx(IconWithSpinner.IconWithSpinner, { Icon: iconic.SignInWithEmailIcon, iconSize: 80, isSpinning: isLoading }))] })) })), jsxRuntime.jsx(Typography.Typography, Object.assign({ weight: 'medium', variant: 'title', color: 'primary', className: 'otp-verification-view__title' }, { children: isValid ? 'Verification code confirmed' : 'Confirm verification code' })), jsxRuntime.jsxs("div", Object.assign({ className: 'otp-verification-view__body' }, { children: [isValid && (jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'body_normal', weight: 'regular', color: 'secondary' }, { children: "Hang tight while we get things ready for you" }))), !isValid && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'body_normal', weight: 'regular', color: 'secondary' }, { children: "We\u2019ve sent a verification code to" })), jsxRuntime.jsxs("div", Object.assign({ className: 'otp-verification-view__email-container' }, { children: [jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'body_normal', weight: 'bold', color: 'secondary' }, { children: shortenEmail.shortenEmail(email) })), onClickEditEmail && (jsxRuntime.jsx(IconButton.IconButton, Object.assign({ onClick: onClickEditEmail, "data-testid": 'otp-verification-view__edit-button' }, { children: jsxRuntime.jsx(Icon.Icon, Object.assign({ color: 'text-tertiary' }, { children: jsxRuntime.jsx(pencilAltIcon.ReactComponent, {}) })) })))] }))] }))] })), jsxRuntime.jsx(PinField.PinField, { initialValue: Array(6).join('.').split('.'), isLoading: isLoading, handleComplete: onPinComplete, isValidated: isValid, inputMode: 'numeric', pattern: '[0-9]*', hasError: Boolean(error), onChange: onPinChange }), jsxRuntime.jsx("div", Object.assign({ className: 'otp-verification-view__footer' }, { children: displayPoweredByDynamic && jsxRuntime.jsx(PoweredByDynamic.PoweredByDynamic, {}) }))] })));
+    return (jsxRuntime.jsxs("div", Object.assign({ className: 'otp-verification-view' }, { children: [successBannerText && (jsxRuntime.jsx(ModalHeaderBanner.ModalHeaderBanner, { type: 'success', message: successBannerText, disableTruncate: true })), jsxRuntime.jsx(ModalHeaderBanner.ModalHeaderBanner, { type: 'error', message: error === null || error === void 0 ? void 0 : error.message }), jsxRuntime.jsx(ModalHeader.ModalHeader, Object.assign({ alignContent: 'bottom', leading: onClickBack && backButton, trailing: onClickClose && closeButton }, { children: jsxRuntime.jsxs("div", Object.assign({ className: 'otp-verification-view__status-header' }, { children: [isValid && (jsxRuntime.jsx(IconWithStatus.IconWithStatus, { Icon: iconic.SignInWithEmailIcon, iconSize: 50, InnerIcon: check.ReactComponent })), !isValid && (jsxRuntime.jsx(IconWithSpinner.IconWithSpinner, { Icon: iconic.SignInWithEmailIcon, iconSize: 80, isSpinning: isLoading }))] })) })), jsxRuntime.jsx(Typography.Typography, Object.assign({ weight: 'medium', variant: 'title', color: 'primary', className: 'otp-verification-view__title' }, { children: isValid ? 'Verification code confirmed' : 'Confirm verification code' })), jsxRuntime.jsxs("div", Object.assign({ className: 'otp-verification-view__body' }, { children: [isValid && (jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'body_normal', weight: 'regular', color: 'secondary' }, { children: "Hang tight while we get things ready for you" }))), !isValid && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'body_normal', weight: 'regular', color: 'secondary' }, { children: "We\u2019ve sent a verification code to" })), jsxRuntime.jsxs("div", Object.assign({ className: 'otp-verification-view__email-container' }, { children: [jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'body_normal', weight: 'bold', color: 'secondary' }, { children: shortenEmail.shortenEmail(email) })), onClickEditEmail && (jsxRuntime.jsx(IconButton.IconButton, Object.assign({ onClick: onClickEditEmail, "data-testid": 'otp-verification-view__edit-button' }, { children: jsxRuntime.jsx(Icon.Icon, Object.assign({ color: 'text-tertiary' }, { children: jsxRuntime.jsx(pencilAltIcon.ReactComponent, {}) })) })))] }))] }))] })), jsxRuntime.jsx(PinField.PinField, { initialValue: Array(6).join('.').split('.'), isLoading: isLoading, handleComplete: onPinComplete, isValidated: isValid, inputMode: 'numeric', pattern: '[0-9]*', hasError: Boolean(error), onChange: onPinChange }), jsxRuntime.jsx("div", Object.assign({ className: 'otp-verification-view__footer' }, { children: displayPoweredByDynamic && jsxRuntime.jsx(PoweredByDynamic.PoweredByDynamic, {}) }))] })));
 };
 
 exports.OTPVerificationView = OTPVerificationView;

package/src/lib/components/OTPVerificationView/OTPVerificationView.d.ts

@@ -10,6 +10,7 @@ type OtpVerificationLayoutProps = {
     onClickEditEmail?: MouseEventHandler<HTMLButtonElement>;
     onPinChange?: (value: string) => void;
     onPinComplete: (value: string) => void;
+    successBannerText?: string;
 };
 export declare const OTPVerificationView: FC<OtpVerificationLayoutProps>;
 export {};

package/src/lib/components/OTPVerificationView/OTPVerificationView.js

@@ -51,10 +51,10 @@ import 'yup';
 import '../InlineWidget/InlineWidget.js';
 import '../MenuList/Dropdown/Dropdown.js';
 
-const OTPVerificationView = ({ onClickBack, onClickEditEmail, isLoading, email, onPinComplete, isValid, error, onPinChange, onClickClose, displayPoweredByDynamic = false, }) => {
+const OTPVerificationView = ({ onClickBack, onClickEditEmail, isLoading, email, onPinComplete, isValid, error, onPinChange, onClickClose, displayPoweredByDynamic = false, successBannerText, }) => {
     const backButton = onClickBack && (jsx(IconButton, Object.assign({ type: 'button', onClick: onClickBack, "data-testid": 'back-button' }, { children: jsx(SvgChevronLeft, {}) })));
     const closeButton = (jsx(IconButton, Object.assign({ onClick: onClickClose, type: 'button', "data-testid": 'close-button' }, { children: jsx(SvgClose, {}) })));
-    return (jsxs("div", Object.assign({ className: 'otp-verification-view' }, { children: [jsx(ModalHeaderBanner, { type: 'error', message: error === null || error === void 0 ? void 0 : error.message }), jsx(ModalHeader, Object.assign({ alignContent: 'bottom', leading: onClickBack && backButton, trailing: onClickClose && closeButton }, { children: jsxs("div", Object.assign({ className: 'otp-verification-view__status-header' }, { children: [isValid && (jsx(IconWithStatus, { Icon: SignInWithEmailIcon, iconSize: 50, InnerIcon: SvgCheck })), !isValid && (jsx(IconWithSpinner, { Icon: SignInWithEmailIcon, iconSize: 80, isSpinning: isLoading }))] })) })), jsx(Typography, Object.assign({ weight: 'medium', variant: 'title', color: 'primary', className: 'otp-verification-view__title' }, { children: isValid ? 'Verification code confirmed' : 'Confirm verification code' })), jsxs("div", Object.assign({ className: 'otp-verification-view__body' }, { children: [isValid && (jsx(Typography, Object.assign({ variant: 'body_normal', weight: 'regular', color: 'secondary' }, { children: "Hang tight while we get things ready for you" }))), !isValid && (jsxs(Fragment, { children: [jsx(Typography, Object.assign({ variant: 'body_normal', weight: 'regular', color: 'secondary' }, { children: "We\u2019ve sent a verification code to" })), jsxs("div", Object.assign({ className: 'otp-verification-view__email-container' }, { children: [jsx(Typography, Object.assign({ variant: 'body_normal', weight: 'bold', color: 'secondary' }, { children: shortenEmail(email) })), onClickEditEmail && (jsx(IconButton, Object.assign({ onClick: onClickEditEmail, "data-testid": 'otp-verification-view__edit-button' }, { children: jsx(Icon, Object.assign({ color: 'text-tertiary' }, { children: jsx(SvgPencilAltIcon, {}) })) })))] }))] }))] })), jsx(PinField, { initialValue: Array(6).join('.').split('.'), isLoading: isLoading, handleComplete: onPinComplete, isValidated: isValid, inputMode: 'numeric', pattern: '[0-9]*', hasError: Boolean(error), onChange: onPinChange }), jsx("div", Object.assign({ className: 'otp-verification-view__footer' }, { children: displayPoweredByDynamic && jsx(PoweredByDynamic, {}) }))] })));
+    return (jsxs("div", Object.assign({ className: 'otp-verification-view' }, { children: [successBannerText && (jsx(ModalHeaderBanner, { type: 'success', message: successBannerText, disableTruncate: true })), jsx(ModalHeaderBanner, { type: 'error', message: error === null || error === void 0 ? void 0 : error.message }), jsx(ModalHeader, Object.assign({ alignContent: 'bottom', leading: onClickBack && backButton, trailing: onClickClose && closeButton }, { children: jsxs("div", Object.assign({ className: 'otp-verification-view__status-header' }, { children: [isValid && (jsx(IconWithStatus, { Icon: SignInWithEmailIcon, iconSize: 50, InnerIcon: SvgCheck })), !isValid && (jsx(IconWithSpinner, { Icon: SignInWithEmailIcon, iconSize: 80, isSpinning: isLoading }))] })) })), jsx(Typography, Object.assign({ weight: 'medium', variant: 'title', color: 'primary', className: 'otp-verification-view__title' }, { children: isValid ? 'Verification code confirmed' : 'Confirm verification code' })), jsxs("div", Object.assign({ className: 'otp-verification-view__body' }, { children: [isValid && (jsx(Typography, Object.assign({ variant: 'body_normal', weight: 'regular', color: 'secondary' }, { children: "Hang tight while we get things ready for you" }))), !isValid && (jsxs(Fragment, { children: [jsx(Typography, Object.assign({ variant: 'body_normal', weight: 'regular', color: 'secondary' }, { children: "We\u2019ve sent a verification code to" })), jsxs("div", Object.assign({ className: 'otp-verification-view__email-container' }, { children: [jsx(Typography, Object.assign({ variant: 'body_normal', weight: 'bold', color: 'secondary' }, { children: shortenEmail(email) })), onClickEditEmail && (jsx(IconButton, Object.assign({ onClick: onClickEditEmail, "data-testid": 'otp-verification-view__edit-button' }, { children: jsx(Icon, Object.assign({ color: 'text-tertiary' }, { children: jsx(SvgPencilAltIcon, {}) })) })))] }))] }))] })), jsx(PinField, { initialValue: Array(6).join('.').split('.'), isLoading: isLoading, handleComplete: onPinComplete, isValidated: isValid, inputMode: 'numeric', pattern: '[0-9]*', hasError: Boolean(error), onChange: onPinChange }), jsx("div", Object.assign({ className: 'otp-verification-view__footer' }, { children: displayPoweredByDynamic && jsx(PoweredByDynamic, {}) }))] })));
 };
 
 export { OTPVerificationView };

package/src/lib/components/Typography/Typography.cjs

@@ -29,6 +29,7 @@ const Typography = (_a) => {
         'brand-primary': 'typography--brand-primary',
         'error-1': 'typography--dynamic-error-1',
         'error-2': 'typography--dynamic-error-2',
+        'green-1': 'typography--connection-green-1',
         link: 'typography--link',
         primary: 'typography--primary',
         secondary: 'typography--secondary',

package/src/lib/components/Typography/Typography.js

@@ -25,6 +25,7 @@ const Typography = (_a) => {
         'brand-primary': 'typography--brand-primary',
         'error-1': 'typography--dynamic-error-1',
         'error-2': 'typography--dynamic-error-2',
+        'green-1': 'typography--connection-green-1',
         link: 'typography--link',
         primary: 'typography--primary',
         secondary: 'typography--secondary',

package/src/lib/components/Typography/Typography.types.d.ts

@@ -1,7 +1,7 @@
 import { ComponentPropsWithoutRef, ElementType, ReactElement } from 'react';
 export type TypographyTag = ElementType;
 export type TypographyVariant = 'title' | 'body_normal' | 'body_small' | 'body_mini' | 'button_primary' | 'button_secondary' | 'button_tertiary' | 'numbers_big' | 'numbers_medium' | 'numbers_small';
-export type TypographyColor = 'primary' | 'secondary' | 'brand-primary' | 'tertiary' | 'link' | 'error-1' | 'error-2' | 'tooltip';
+export type TypographyColor = 'primary' | 'secondary' | 'brand-primary' | 'tertiary' | 'link' | 'error-1' | 'error-2' | 'tooltip' | 'green-1';
 export type TypographyWeight = 'regular' | 'medium' | 'bold';
 export type TypographyTransform = 'uppercase';
 export type TypographyProps<TAG extends ElementType = 'p'> = {

package/src/lib/context/DynamicContext/DynamicContext.cjs

@@ -79,6 +79,7 @@ require('../../views/CollectUserDataView/fieldsConfig.cjs');
 require('../../components/UserProfile/parts/UserProfileField/components/VerifiedEmailIcon/VerifiedEmailIcon.cjs');
 var FundingWidget = require('../../widgets/FundingWidget/FundingWidget.cjs');
 var DynamicBridgeWidgetContext = require('../../widgets/DynamicBridgeWidget/context/DynamicBridgeWidgetContext/DynamicBridgeWidgetContext.cjs');
+var OAuthIFrameContainer = require('../../widgets/OAuthIFrameContainer/OAuthIFrameContainer.cjs');
 var EmailVerificationContext = require('../EmailVerificationContext/EmailVerificationContext.cjs');
 var FundingContext = require('../FundingContext/FundingContext.cjs');
 var SendBalanceContext = require('../SendBalanceContext/SendBalanceContext.cjs');
@@ -673,7 +674,7 @@ const DynamicContextProvider = ({ children, theme, settings, }) => {
                             isBridgeFlow,
                             isFullyConnected,
                             loginWithEmail,
-                        }) }, { children: jsxRuntime.jsx(AccountExistsContext.AccountExistsContextProvider, { children: jsxRuntime.jsx(WalletContext.WalletContextProvider, Object.assign({ canSync: didConnectedStateLoad }, { children: jsxRuntime.jsx(QrCodeContext.QrCodeContextProvider, { children: jsxRuntime.jsx(EmailVerificationContext.EmailVerificationContextProvider, { children: jsxRuntime.jsx(ErrorContext.ErrorContextProvider, { children: jsxRuntime.jsx(DynamicWidgetContext.DynamicWidgetContextProvider, { children: jsxRuntime.jsx(DynamicBridgeWidgetContext.DynamicBridgeWidgetContextProvider, { children: jsxRuntime.jsx(CaptchaContext.CaptchaContextProvider, { children: jsxRuntime.jsx(FundingContext.FundingContextProvider, { children: jsxRuntime.jsx(AccessDeniedContext.AccessDeniedContextProvider, { children: jsxRuntime.jsx(SendBalanceContext.SendBalanceContextProvider, { children: jsxRuntime.jsxs(WalletGroupContext.WalletGroupContextProvider, { children: [jsxRuntime.jsx(app.DynamicAuthFlow, {}), jsxRuntime.jsx(Toolkit.Toolkit, {}), jsxRuntime.jsx(FundingWidget.FundingWidget, {}), confirmationModal, children] }) }) }) }) }) }) }) }) }) }) })) }) })) }) })) })) })));
+                        }) }, { children: jsxRuntime.jsx(AccountExistsContext.AccountExistsContextProvider, { children: jsxRuntime.jsx(WalletContext.WalletContextProvider, Object.assign({ canSync: didConnectedStateLoad }, { children: jsxRuntime.jsx(QrCodeContext.QrCodeContextProvider, { children: jsxRuntime.jsx(EmailVerificationContext.EmailVerificationContextProvider, { children: jsxRuntime.jsx(ErrorContext.ErrorContextProvider, { children: jsxRuntime.jsx(DynamicWidgetContext.DynamicWidgetContextProvider, { children: jsxRuntime.jsx(DynamicBridgeWidgetContext.DynamicBridgeWidgetContextProvider, { children: jsxRuntime.jsx(CaptchaContext.CaptchaContextProvider, { children: jsxRuntime.jsx(FundingContext.FundingContextProvider, { children: jsxRuntime.jsx(AccessDeniedContext.AccessDeniedContextProvider, { children: jsxRuntime.jsx(SendBalanceContext.SendBalanceContextProvider, { children: jsxRuntime.jsxs(WalletGroupContext.WalletGroupContextProvider, { children: [jsxRuntime.jsx(app.DynamicAuthFlow, {}), jsxRuntime.jsx(Toolkit.Toolkit, {}), jsxRuntime.jsx(FundingWidget.FundingWidget, {}), jsxRuntime.jsx(OAuthIFrameContainer.OAuthIFrameContainer, {}), confirmationModal, children] }) }) }) }) }) }) }) }) }) }) })) }) })) }) })) })) })));
 };
 
 exports.DynamicContext = DynamicContext;

package/src/lib/context/DynamicContext/DynamicContext.js

@@ -75,6 +75,7 @@ import '../../views/CollectUserDataView/fieldsConfig.js';
 import '../../components/UserProfile/parts/UserProfileField/components/VerifiedEmailIcon/VerifiedEmailIcon.js';
 import { FundingWidget } from '../../widgets/FundingWidget/FundingWidget.js';
 import { DynamicBridgeWidgetContextProvider } from '../../widgets/DynamicBridgeWidget/context/DynamicBridgeWidgetContext/DynamicBridgeWidgetContext.js';
+import { OAuthIFrameContainer } from '../../widgets/OAuthIFrameContainer/OAuthIFrameContainer.js';
 import { EmailVerificationContextProvider } from '../EmailVerificationContext/EmailVerificationContext.js';
 import { FundingContextProvider } from '../FundingContext/FundingContext.js';
 import { SendBalanceContextProvider } from '../SendBalanceContext/SendBalanceContext.js';
@@ -669,7 +670,7 @@ const DynamicContextProvider = ({ children, theme, settings, }) => {
                             isBridgeFlow,
                             isFullyConnected,
                             loginWithEmail,
-                        }) }, { children: jsx(AccountExistsContextProvider, { children: jsx(WalletContextProvider, Object.assign({ canSync: didConnectedStateLoad }, { children: jsx(QrCodeContextProvider, { children: jsx(EmailVerificationContextProvider, { children: jsx(ErrorContextProvider, { children: jsx(DynamicWidgetContextProvider, { children: jsx(DynamicBridgeWidgetContextProvider, { children: jsx(CaptchaContextProvider, { children: jsx(FundingContextProvider, { children: jsx(AccessDeniedContextProvider, { children: jsx(SendBalanceContextProvider, { children: jsxs(WalletGroupContextProvider, { children: [jsx(DynamicAuthFlow, {}), jsx(Toolkit, {}), jsx(FundingWidget, {}), confirmationModal, children] }) }) }) }) }) }) }) }) }) }) })) }) })) }) })) })) })));
+                        }) }, { children: jsx(AccountExistsContextProvider, { children: jsx(WalletContextProvider, Object.assign({ canSync: didConnectedStateLoad }, { children: jsx(QrCodeContextProvider, { children: jsx(EmailVerificationContextProvider, { children: jsx(ErrorContextProvider, { children: jsx(DynamicWidgetContextProvider, { children: jsx(DynamicBridgeWidgetContextProvider, { children: jsx(CaptchaContextProvider, { children: jsx(FundingContextProvider, { children: jsx(AccessDeniedContextProvider, { children: jsx(SendBalanceContextProvider, { children: jsxs(WalletGroupContextProvider, { children: [jsx(DynamicAuthFlow, {}), jsx(Toolkit, {}), jsx(FundingWidget, {}), jsx(OAuthIFrameContainer, {}), confirmationModal, children] }) }) }) }) }) }) }) }) }) }) })) }) })) }) })) })) })));
 };
 
 export { DynamicContext, DynamicContextProvider, PUBLIC_PROJECT_LIVE_ENVIRONMENT_ID };

package/src/lib/data/api.cjs

@@ -339,9 +339,24 @@ const updateUserProfileFields = (jwt, environmentId, fields) => _tslib.__awaiter
         throw e;
     }
 });
-const verifyOAuth = (environmentId, providerType, { code }, userJwt) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
+const getOauthLoginUrl = (environmentId, providerType, userJwt) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
+    try {
+        const { url } = yield sdkApi(userJwt).oauthLoginUrl({
+            environmentId,
+            providerType,
+        });
+        return url;
+    }
+    catch (e) {
+        logger.logger.error(e);
+        return undefined;
+    }
+});
+const verifyOAuth = (environmentId, providerType, { code, codeVerifier, state }, userJwt) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
     const oauthRequest = {
         code,
+        codeVerifier,
+        state,
     };
     try {
         const { jwt } = yield sdkApi(userJwt).oauthVerify({
@@ -419,6 +434,7 @@ exports.fetchNetworkSettings = fetchNetworkSettings;
 exports.fetchNonce = fetchNonce;
 exports.fetchProjectSettings = fetchProjectSettings;
 exports.getEmailProvider = getEmailProvider;
+exports.getOauthLoginUrl = getOauthLoginUrl;
 exports.getOnrampProviders = getOnrampProviders;
 exports.linkWallet = linkWallet;
 exports.mapAuthModeTypeToEnum = mapAuthModeTypeToEnum;

package/src/lib/data/api.d.ts

@@ -50,7 +50,8 @@ export declare const verifyWallet: (environmentId: string, { messageToSign, sign
 export declare const fetchNetworkSettings: (environmentId: string) => Promise<NetworkConfigurationResponse[] | undefined>;
 export declare const fetchProjectSettings: (environmentId: string) => Promise<ProjectSettings | undefined>;
 export declare const updateUserProfileFields: (jwt: string | undefined, environmentId: string, fields: UserFields) => Promise<UpdateSelfResponse>;
-export declare const verifyOAuth: (environmentId: string, providerType: ProviderEnum, { code }: OauthRequest, userJwt: string) => Promise<string | undefined>;
+export declare const getOauthLoginUrl: (environmentId: string, providerType: ProviderEnum, userJwt: string) => Promise<string | undefined>;
+export declare const verifyOAuth: (environmentId: string, providerType: ProviderEnum, { code, codeVerifier, state }: OauthRequest, userJwt: string) => Promise<string | undefined>;
 export declare const unlinkOAuth: ({ environmentId, verifiedCrentialId, }: {
     environmentId: string;
     verifiedCrentialId: string;

package/src/lib/data/api.js

@@ -335,9 +335,24 @@ const updateUserProfileFields = (jwt, environmentId, fields) => __awaiter(void 0
         throw e;
     }
 });
-const verifyOAuth = (environmentId, providerType, { code }, userJwt) => __awaiter(void 0, void 0, void 0, function* () {
+const getOauthLoginUrl = (environmentId, providerType, userJwt) => __awaiter(void 0, void 0, void 0, function* () {
+    try {
+        const { url } = yield sdkApi(userJwt).oauthLoginUrl({
+            environmentId,
+            providerType,
+        });
+        return url;
+    }
+    catch (e) {
+        logger.error(e);
+        return undefined;
+    }
+});
+const verifyOAuth = (environmentId, providerType, { code, codeVerifier, state }, userJwt) => __awaiter(void 0, void 0, void 0, function* () {
     const oauthRequest = {
         code,
+        codeVerifier,
+        state,
     };
     try {
         const { jwt } = yield sdkApi(userJwt).oauthVerify({
@@ -409,4 +424,4 @@ const mergeUserAccounts = (userJwt, environmentId) => __awaiter(void 0, void 0,
     }
 });
 
-export { createEmailVerification, createVisit, fetchNetworkSettings, fetchNonce, fetchProjectSettings, getEmailProvider, getOnrampProviders, linkWallet, mapAuthModeTypeToEnum, mapChainToChainEnum, mapProviderToProviderEnum, mergeUserAccounts, retryEmailVerification, revokeSession, sendDynamicProps, signInWithEmailVerification, transferWallet, unlinkOAuth, unlinkWallet, updateUserProfileFields, verifyEmail, verifyOAuth, verifyWallet };
+export { createEmailVerification, createVisit, fetchNetworkSettings, fetchNonce, fetchProjectSettings, getEmailProvider, getOauthLoginUrl, getOnrampProviders, linkWallet, mapAuthModeTypeToEnum, mapChainToChainEnum, mapProviderToProviderEnum, mergeUserAccounts, retryEmailVerification, revokeSession, sendDynamicProps, signInWithEmailVerification, transferWallet, unlinkOAuth, unlinkWallet, updateUserProfileFields, verifyEmail, verifyOAuth, verifyWallet };