@dynamic-labs/sdk-react-core 0.17.0-RC.15 → 0.17.0-RC.17

package/CHANGELOG.md

@@ -1,4 +1,36 @@
 
+## [0.17.0-RC.17](https://github.com/dynamic-labs/DynamicAuth/compare/v0.17.0-RC.16...v0.17.0-RC.17) (2023-05-17)
+
+
+### Features
+
+* distinguish walletconnect deeplink types ([#2093](https://github.com/dynamic-labs/DynamicAuth/issues/2093)) ([dcd29f7](https://github.com/dynamic-labs/DynamicAuth/commit/dcd29f7cfc5e6481aaaae502b3fc4e4d225f1fc1))
+* **social:** pass did token to verify request ([#2124](https://github.com/dynamic-labs/DynamicAuth/issues/2124)) ([60d73a5](https://github.com/dynamic-labs/DynamicAuth/commit/60d73a5f432d488979f33fe29666d1afa8fc0e8e))
+* support optional priority and stalltimeout for customer provided rpc urls ([#2091](https://github.com/dynamic-labs/DynamicAuth/issues/2091)) ([eebacda](https://github.com/dynamic-labs/DynamicAuth/commit/eebacda6a9d6ba583eff4e4e5a38eb9945c4825e))
+
+
+### Bug Fixes
+
+* add and remove event listeners for Solflare ([#2127](https://github.com/dynamic-labs/DynamicAuth/issues/2127)) ([978c7ba](https://github.com/dynamic-labs/DynamicAuth/commit/978c7ba0e3745e26d9dfc9b7c46a24adc913f02f))
+* get publicKey from provider if no address and publicKey are returned on connect ([#2126](https://github.com/dynamic-labs/DynamicAuth/issues/2126)) ([c9c9b2a](https://github.com/dynamic-labs/DynamicAuth/commit/c9c9b2af81f660aa651fc4b0e01cd3c823bb0229))
+* remove detect known secondary wallet modal ([#2117](https://github.com/dynamic-labs/DynamicAuth/issues/2117)) ([0e8bbd8](https://github.com/dynamic-labs/DynamicAuth/commit/0e8bbd8c385fe528a7af3ccc037812df9d6e0c84))
+* revert changes for select wallet to work with solflare ([#2120](https://github.com/dynamic-labs/DynamicAuth/issues/2120)) ([76cf228](https://github.com/dynamic-labs/DynamicAuth/commit/76cf228c495d6592da4c88b8a0d5a5fc480861ae))
+* setIsVerifying to false when selecting a connector ([#2133](https://github.com/dynamic-labs/DynamicAuth/issues/2133)) ([8ddeba3](https://github.com/dynamic-labs/DynamicAuth/commit/8ddeba377f35dfb4a104cd6bd7ee6315d574710f))
+* setPrimaryWallet and useSyncPrimaryWallet updates ([#2128](https://github.com/dynamic-labs/DynamicAuth/issues/2128)) ([fb47b17](https://github.com/dynamic-labs/DynamicAuth/commit/fb47b17ddc7f41c29f140a1a85a1e47dbf017fff))
+* update text color and add close button on extension not installed prompt ([#2122](https://github.com/dynamic-labs/DynamicAuth/issues/2122)) ([b4848a0](https://github.com/dynamic-labs/DynamicAuth/commit/b4848a0a8094b4ceac67e2667d277a9aa5e2e137))
+
+## [0.17.0-RC.16](https://github.com/dynamic-labs/DynamicAuth/compare/v0.17.0-RC.15...v0.17.0-RC.16) (2023-05-15)
+
+
+### Features
+
+* add social oauth result to verify request ([#2081](https://github.com/dynamic-labs/DynamicAuth/issues/2081)) ([4da650a](https://github.com/dynamic-labs/DynamicAuth/commit/4da650affe9c96e0ab9e446f58c91b9b13db3651))
+
+
+### Bug Fixes
+
+* **DYN-2327:** user profile is not loaded properly on the first load ([#2113](https://github.com/dynamic-labs/DynamicAuth/issues/2113)) ([c05834e](https://github.com/dynamic-labs/DynamicAuth/commit/c05834ed89ecc12d586baa97bcaf2bd3c1919f59))
+
 ## [0.17.0-RC.15](https://github.com/dynamic-labs/DynamicAuth/compare/v0.17.0-RC.14...v0.17.0-RC.15) (2023-05-15)
 
 

package/package.cjs

@@ -2,11 +2,11 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var version = "0.17.0-RC.15";
+var version = "0.17.0-RC.17";
 var dependencies = {
 	"react-focus-lock": "^2.9.2",
 	"@dynamic-labs/iconic": "^0.1.19",
-	"@dynamic-labs/sdk-api": "0.0.192",
+	"@dynamic-labs/sdk-api": "0.0.195",
 	"@dynamic-labs/wallet-book": "^0.0.15",
 	"@hcaptcha/react-hcaptcha": "~1.4.4",
 	"country-list": "^2.3.0",

package/package.js

@@ -1,8 +1,8 @@
-var version = "0.17.0-RC.15";
+var version = "0.17.0-RC.17";
 var dependencies = {
 	"react-focus-lock": "^2.9.2",
 	"@dynamic-labs/iconic": "^0.1.19",
-	"@dynamic-labs/sdk-api": "0.0.192",
+	"@dynamic-labs/sdk-api": "0.0.195",
 	"@dynamic-labs/wallet-book": "^0.0.15",
 	"@hcaptcha/react-hcaptcha": "~1.4.4",
 	"country-list": "^2.3.0",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dynamic-labs/sdk-react-core",
-  "version": "0.17.0-RC.15",
+  "version": "0.17.0-RC.17",
   "repository": {
     "type": "git",
     "url": "https://github.com/dynamic-labs/DynamicAuth.git",
@@ -9,7 +9,7 @@
   "dependencies": {
     "react-focus-lock": "^2.9.2",
     "@dynamic-labs/iconic": "^0.1.19",
-    "@dynamic-labs/sdk-api": "0.0.192",
+    "@dynamic-labs/sdk-api": "0.0.195",
     "@dynamic-labs/wallet-book": "^0.0.15",
     "@hcaptcha/react-hcaptcha": "~1.4.4",
     "country-list": "^2.3.0",
@@ -17,12 +17,12 @@
     "formik": "^2.2.9",
     "qrcode": "1.5.1",
     "ethers": "^5.7.2",
-    "@dynamic-labs/logger": "0.17.0-RC.15",
-    "@dynamic-labs/multi-wallet": "0.17.0-RC.15",
-    "@dynamic-labs/rpc-providers": "0.17.0-RC.15",
-    "@dynamic-labs/types": "0.17.0-RC.15",
-    "@dynamic-labs/utils": "0.17.0-RC.15",
-    "@dynamic-labs/wallet-connector-core": "0.17.0-RC.15"
+    "@dynamic-labs/logger": "0.17.0-RC.17",
+    "@dynamic-labs/multi-wallet": "0.17.0-RC.17",
+    "@dynamic-labs/rpc-providers": "0.17.0-RC.17",
+    "@dynamic-labs/types": "0.17.0-RC.17",
+    "@dynamic-labs/utils": "0.17.0-RC.17",
+    "@dynamic-labs/wallet-connector-core": "0.17.0-RC.17"
   },
   "devDependencies": {
     "semver": "^7.3.8"

package/src/lib/components/Divider/Divider.cjs

@@ -18,6 +18,7 @@ require('../../context/DynamicContext/DynamicContext.cjs');
 require('@dynamic-labs/multi-wallet');
 require('../ShadowDOM/ShadowDOM.cjs');
 require('../../context/ThemeContext/ThemeContext.cjs');
+var classNames = require('../../utils/functions/classNames/classNames.cjs');
 require('react-dom');
 require('react-focus-lock');
 require('../Transition/ZoomTransition/ZoomTransition.cjs');
@@ -34,6 +35,8 @@ require('../Alert/Alert.cjs');
 require('../Popper/Popper/Popper.cjs');
 require('../Popper/PopperContext/PopperContext.cjs');
 
-const Divider = ({ text }) => (jsxRuntime.jsxs("div", Object.assign({ className: 'divider' }, { children: [jsxRuntime.jsx("div", { className: 'divider__dash' }), jsxRuntime.jsx(Typography.Typography, Object.assign({ className: 'divider__text', variant: 'body_small', color: 'secondary' }, { children: text })), jsxRuntime.jsx("div", { className: 'divider__dash' })] })));
+const Divider = ({ text, className = '', fullWidth = false }) => (jsxRuntime.jsxs("div", Object.assign({ className: classNames.classNames('divider', className, {
+        'divider__full-width': fullWidth,
+    }) }, { children: [jsxRuntime.jsx("div", { className: 'divider__dash' }), jsxRuntime.jsx(Typography.Typography, Object.assign({ className: 'divider__text', variant: 'body_small', color: 'secondary' }, { children: text })), jsxRuntime.jsx("div", { className: 'divider__dash' })] })));
 
 exports.Divider = Divider;

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

@@ -1,4 +1,8 @@
 /// <reference types="react" />
-export declare const Divider: ({ text }: {
+type Props = {
+    className?: string;
+    fullWidth?: boolean;
     text: string;
-}) => JSX.Element;
+};
+export declare const Divider: ({ text, className, fullWidth }: Props) => JSX.Element;
+export {};

package/src/lib/components/Divider/Divider.js

@@ -14,6 +14,7 @@ import '../../context/DynamicContext/DynamicContext.js';
 import '@dynamic-labs/multi-wallet';
 import '../ShadowDOM/ShadowDOM.js';
 import '../../context/ThemeContext/ThemeContext.js';
+import { classNames } from '../../utils/functions/classNames/classNames.js';
 import 'react-dom';
 import 'react-focus-lock';
 import '../Transition/ZoomTransition/ZoomTransition.js';
@@ -30,6 +31,8 @@ import '../Alert/Alert.js';
 import '../Popper/Popper/Popper.js';
 import '../Popper/PopperContext/PopperContext.js';
 
-const Divider = ({ text }) => (jsxs("div", Object.assign({ className: 'divider' }, { children: [jsx("div", { className: 'divider__dash' }), jsx(Typography, Object.assign({ className: 'divider__text', variant: 'body_small', color: 'secondary' }, { children: text })), jsx("div", { className: 'divider__dash' })] })));
+const Divider = ({ text, className = '', fullWidth = false }) => (jsxs("div", Object.assign({ className: classNames('divider', className, {
+        'divider__full-width': fullWidth,
+    }) }, { children: [jsx("div", { className: 'divider__dash' }), jsx(Typography, Object.assign({ className: 'divider__text', variant: 'body_small', color: 'secondary' }, { children: text })), jsx("div", { className: 'divider__dash' })] })));
 
 export { Divider };

package/src/lib/components/TransactionConfirmationPageLayout/TransactionConfirmationPageLayout.cjs

@@ -0,0 +1,40 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var ModalHeader = require('../ModalHeader/ModalHeader.cjs');
+var IconWithSpinner = require('../IconWithSpinner/IconWithSpinner.cjs');
+var Icon = require('../Icon/Icon.cjs');
+require('@dynamic-labs/sdk-api');
+require('../../shared/logger.cjs');
+require('@dynamic-labs/iconic');
+require('@dynamic-labs/wallet-connector-core');
+require('../../context/ViewContext/ViewContext.cjs');
+require('react');
+var close = require('../../shared/assets/close.cjs');
+var chevronLeft = require('../../shared/assets/chevron-left.cjs');
+var signCircle = require('../../shared/assets/sign-circle.cjs');
+require('@dynamic-labs/utils');
+require('../../utils/constants/colors.cjs');
+require('ethers');
+require('../../shared/consts/index.cjs');
+var IconButton = require('../IconButton/IconButton.cjs');
+var Typography = require('../Typography/Typography.cjs');
+var AnimatePresence = require('../AnimatePresence/AnimatePresence.cjs');
+require('../Transition/ZoomTransition/ZoomTransition.cjs');
+require('../Transition/SlideInUpTransition/SlideInUpTransition.cjs');
+require('../Transition/OpacityTransition/OpacityTransition.cjs');
+var VerticalDrawerTransition = require('../Transition/VerticalDrawerTransition/VerticalDrawerTransition.cjs');
+var Alert = require('../Alert/Alert.cjs');
+var AppOriginTile = require('../AppOriginTile/AppOriginTile.cjs');
+var Button = require('../Button/Button.cjs');
+var PoweredByDynamic = require('../PoweredByDynamic/PoweredByDynamic.cjs');
+
+const TransactionConfirmationPageLayout = ({ onClickClose, isLoading, onClickBack, title, error, appOrigin, appLogoUrl, appName, onClickSend, disableSendButton, displayPoweredByDynamicFooter = false, warningMessage, children, }) => {
+    const closeButton = onClickClose && (jsxRuntime.jsx(IconButton.IconButton, Object.assign({ type: 'button', onClick: onClickClose, "data-testid": 'close', disabled: isLoading }, { children: jsxRuntime.jsx(close.ReactComponent, {}) })));
+    const backButton = onClickBack && (jsxRuntime.jsx(IconButton.IconButton, Object.assign({ type: 'button', onClick: onClickBack, "data-testid": 'back-button' }, { children: jsxRuntime.jsx(chevronLeft.ReactComponent, {}) })));
+    return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(ModalHeader.ModalHeader, Object.assign({ trailing: closeButton, leading: backButton, alignContent: 'bottom' }, { children: jsxRuntime.jsx(IconWithSpinner.IconWithSpinner, { Icon: (props) => (jsxRuntime.jsx(Icon.Icon, Object.assign({ color: 'brand-primary' }, { children: jsxRuntime.jsx(signCircle.ReactComponent, Object.assign({}, props)) }))), iconSize: 64, isSpinning: true }) })), jsxRuntime.jsxs("div", Object.assign({ className: 'transaction-confirmation__body' }, { children: [jsxRuntime.jsx(Typography.Typography, Object.assign({ variant: 'title', color: 'primary', className: 'transaction-confirmation__title' }, { children: title })), jsxRuntime.jsx(AnimatePresence.AnimatePresence, Object.assign({ animationComponent: jsxRuntime.jsx(VerticalDrawerTransition.VerticalDrawerTransition, {}) }, { children: error && (jsxRuntime.jsx("div", Object.assign({ className: 'transaction-confirmation__error' }, { children: jsxRuntime.jsx(Alert.Alert, Object.assign({ icon: 'error', variant: 'error' }, { children: error })) }))) })), jsxRuntime.jsxs("div", Object.assign({ className: 'transaction-confirmation__content' }, { children: [jsxRuntime.jsx("div", Object.assign({ className: 'transaction-confirmation__app-origin-tile' }, { children: jsxRuntime.jsx(AppOriginTile.AppOriginTile, { appLogoUrl: appLogoUrl, appName: appName, appOrigin: appOrigin }) })), jsxRuntime.jsx("div", Object.assign({ className: 'transaction-confirmation__rows' }, { children: children }))] })), jsxRuntime.jsx(AnimatePresence.AnimatePresence, Object.assign({ animationComponent: jsxRuntime.jsx(VerticalDrawerTransition.VerticalDrawerTransition, {}) }, { children: warningMessage && (jsxRuntime.jsx("div", Object.assign({ className: 'transaction-confirmation__warning' }, { children: jsxRuntime.jsx(Alert.Alert, Object.assign({ icon: 'error', variant: 'warning', contentDataTestId: 'warning_content' }, { children: warningMessage })) }))) })), jsxRuntime.jsxs("div", Object.assign({ className: 'transaction-confirmation__actions' }, { children: [onClickClose && (jsxRuntime.jsx(Button.Button, Object.assign({ buttonVariant: 'secondary', onClick: onClickClose, expanded: true, buttonPadding: 'large', buttonRounded: 'default', disabled: isLoading }, { children: "Cancel" }))), jsxRuntime.jsx(Button.Button, Object.assign({ buttonVariant: 'primary', buttonPadding: 'large', onClick: onClickSend, expanded: true, buttonRounded: 'default', loading: isLoading, disabled: disableSendButton }, { children: "Send" }))] })), displayPoweredByDynamicFooter && (jsxRuntime.jsx("div", Object.assign({ className: 'transaction-confirmation__footer' }, { children: jsxRuntime.jsx(PoweredByDynamic.PoweredByDynamic, {}) })))] }))] }));
+};
+
+exports.TransactionConfirmationPageLayout = TransactionConfirmationPageLayout;

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

@@ -0,0 +1,17 @@
+import { FC, MouseEventHandler, PropsWithChildren, ReactNode } from 'react';
+type TransactionConfirmationPageLayoutProps = {
+    appLogoUrl?: string;
+    appName?: string;
+    appOrigin: string;
+    disableSendButton?: boolean;
+    displayPoweredByDynamicFooter?: boolean;
+    error?: string;
+    isLoading: boolean;
+    onClickBack?: MouseEventHandler<HTMLButtonElement>;
+    onClickClose?: MouseEventHandler<HTMLButtonElement>;
+    onClickSend: MouseEventHandler<HTMLButtonElement>;
+    title?: ReactNode;
+    warningMessage?: string;
+};
+export declare const TransactionConfirmationPageLayout: FC<PropsWithChildren<TransactionConfirmationPageLayoutProps>>;
+export {};

package/src/lib/components/TransactionConfirmationPageLayout/TransactionConfirmationPageLayout.js

@@ -0,0 +1,36 @@
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import { ModalHeader } from '../ModalHeader/ModalHeader.js';
+import { IconWithSpinner } from '../IconWithSpinner/IconWithSpinner.js';
+import { Icon } from '../Icon/Icon.js';
+import '@dynamic-labs/sdk-api';
+import '../../shared/logger.js';
+import '@dynamic-labs/iconic';
+import '@dynamic-labs/wallet-connector-core';
+import '../../context/ViewContext/ViewContext.js';
+import 'react';
+import { ReactComponent as SvgClose } from '../../shared/assets/close.js';
+import { ReactComponent as SvgChevronLeft } from '../../shared/assets/chevron-left.js';
+import { ReactComponent as SvgSignCircle } from '../../shared/assets/sign-circle.js';
+import '@dynamic-labs/utils';
+import '../../utils/constants/colors.js';
+import 'ethers';
+import '../../shared/consts/index.js';
+import { IconButton } from '../IconButton/IconButton.js';
+import { Typography } from '../Typography/Typography.js';
+import { AnimatePresence } from '../AnimatePresence/AnimatePresence.js';
+import '../Transition/ZoomTransition/ZoomTransition.js';
+import '../Transition/SlideInUpTransition/SlideInUpTransition.js';
+import '../Transition/OpacityTransition/OpacityTransition.js';
+import { VerticalDrawerTransition } from '../Transition/VerticalDrawerTransition/VerticalDrawerTransition.js';
+import { Alert } from '../Alert/Alert.js';
+import { AppOriginTile } from '../AppOriginTile/AppOriginTile.js';
+import { Button } from '../Button/Button.js';
+import { PoweredByDynamic } from '../PoweredByDynamic/PoweredByDynamic.js';
+
+const TransactionConfirmationPageLayout = ({ onClickClose, isLoading, onClickBack, title, error, appOrigin, appLogoUrl, appName, onClickSend, disableSendButton, displayPoweredByDynamicFooter = false, warningMessage, children, }) => {
+    const closeButton = onClickClose && (jsx(IconButton, Object.assign({ type: 'button', onClick: onClickClose, "data-testid": 'close', disabled: isLoading }, { children: jsx(SvgClose, {}) })));
+    const backButton = onClickBack && (jsx(IconButton, Object.assign({ type: 'button', onClick: onClickBack, "data-testid": 'back-button' }, { children: jsx(SvgChevronLeft, {}) })));
+    return (jsxs(Fragment, { children: [jsx(ModalHeader, Object.assign({ trailing: closeButton, leading: backButton, alignContent: 'bottom' }, { children: jsx(IconWithSpinner, { Icon: (props) => (jsx(Icon, Object.assign({ color: 'brand-primary' }, { children: jsx(SvgSignCircle, Object.assign({}, props)) }))), iconSize: 64, isSpinning: true }) })), jsxs("div", Object.assign({ className: 'transaction-confirmation__body' }, { children: [jsx(Typography, Object.assign({ variant: 'title', color: 'primary', className: 'transaction-confirmation__title' }, { children: title })), jsx(AnimatePresence, Object.assign({ animationComponent: jsx(VerticalDrawerTransition, {}) }, { children: error && (jsx("div", Object.assign({ className: 'transaction-confirmation__error' }, { children: jsx(Alert, Object.assign({ icon: 'error', variant: 'error' }, { children: error })) }))) })), jsxs("div", Object.assign({ className: 'transaction-confirmation__content' }, { children: [jsx("div", Object.assign({ className: 'transaction-confirmation__app-origin-tile' }, { children: jsx(AppOriginTile, { appLogoUrl: appLogoUrl, appName: appName, appOrigin: appOrigin }) })), jsx("div", Object.assign({ className: 'transaction-confirmation__rows' }, { children: children }))] })), jsx(AnimatePresence, Object.assign({ animationComponent: jsx(VerticalDrawerTransition, {}) }, { children: warningMessage && (jsx("div", Object.assign({ className: 'transaction-confirmation__warning' }, { children: jsx(Alert, Object.assign({ icon: 'error', variant: 'warning', contentDataTestId: 'warning_content' }, { children: warningMessage })) }))) })), jsxs("div", Object.assign({ className: 'transaction-confirmation__actions' }, { children: [onClickClose && (jsx(Button, Object.assign({ buttonVariant: 'secondary', onClick: onClickClose, expanded: true, buttonPadding: 'large', buttonRounded: 'default', disabled: isLoading }, { children: "Cancel" }))), jsx(Button, Object.assign({ buttonVariant: 'primary', buttonPadding: 'large', onClick: onClickSend, expanded: true, buttonRounded: 'default', loading: isLoading, disabled: disableSendButton }, { children: "Send" }))] })), displayPoweredByDynamicFooter && (jsx("div", Object.assign({ className: 'transaction-confirmation__footer' }, { children: jsx(PoweredByDynamic, {}) })))] }))] }));
+};
+
+export { TransactionConfirmationPageLayout };

package/src/lib/components/TransactionConfirmationPageLayout/components/TransactionRow/TransactionRow.cjs

@@ -0,0 +1,11 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var Typography = require('../../../Typography/Typography.cjs');
+var Skeleton = require('../../../Skeleton/Skeleton.cjs');
+
+const TransactionRow = ({ label, title, children, isEmpty = false, isLoading = false, suffix, dataTestId, icon, }) => (jsxRuntime.jsxs("div", Object.assign({ className: 'transaction-row' }, { children: [jsxRuntime.jsx(Typography.Typography, Object.assign({ color: 'secondary', variant: 'body_normal', weight: 'regular', className: 'transaction-row__label' }, { children: label })), jsxRuntime.jsxs("div", Object.assign({ className: 'transaction-row__content', "data-testid": dataTestId }, { children: [isLoading && (jsxRuntime.jsx(Skeleton.Skeleton, { count: 1, className: 'transaction-row__skeleton' })), isLoading === false && children !== undefined && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(Typography.Typography, Object.assign({ title: title, color: isEmpty ? 'secondary' : 'primary', variant: 'body_normal', weight: isEmpty ? 'regular' : 'medium', truncate: true }, { children: children })), suffix && (jsxRuntime.jsx(Typography.Typography, Object.assign({ as: 'span', color: 'secondary', weight: 'regular' }, { children: suffix }))), icon] }))] }))] })));
+
+exports.TransactionRow = TransactionRow;

package/src/lib/components/TransactionConfirmationPageLayout/components/TransactionRow/TransactionRow.d.ts

@@ -0,0 +1,12 @@
+import { FC, PropsWithChildren, ReactNode } from 'react';
+type TransactionRowProps = {
+    dataTestId?: string;
+    icon?: ReactNode;
+    isEmpty?: boolean;
+    isLoading?: boolean;
+    label: ReactNode;
+    suffix?: ReactNode;
+    title?: string;
+};
+export declare const TransactionRow: FC<PropsWithChildren<TransactionRowProps>>;
+export {};

package/src/lib/components/TransactionConfirmationPageLayout/components/TransactionRow/TransactionRow.js

@@ -0,0 +1,7 @@
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+import { Typography } from '../../../Typography/Typography.js';
+import { Skeleton } from '../../../Skeleton/Skeleton.js';
+
+const TransactionRow = ({ label, title, children, isEmpty = false, isLoading = false, suffix, dataTestId, icon, }) => (jsxs("div", Object.assign({ className: 'transaction-row' }, { children: [jsx(Typography, Object.assign({ color: 'secondary', variant: 'body_normal', weight: 'regular', className: 'transaction-row__label' }, { children: label })), jsxs("div", Object.assign({ className: 'transaction-row__content', "data-testid": dataTestId }, { children: [isLoading && (jsx(Skeleton, { count: 1, className: 'transaction-row__skeleton' })), isLoading === false && children !== undefined && (jsxs(Fragment, { children: [jsx(Typography, Object.assign({ title: title, color: isEmpty ? 'secondary' : 'primary', variant: 'body_normal', weight: isEmpty ? 'regular' : 'medium', truncate: true }, { children: children })), suffix && (jsx(Typography, Object.assign({ as: 'span', color: 'secondary', weight: 'regular' }, { children: suffix }))), icon] }))] }))] })));
+
+export { TransactionRow };

package/src/lib/components/TransactionConfirmationPageLayout/components/TransactionRow/index.d.ts

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

package/src/lib/components/TransactionConfirmationPageLayout/components/index.d.ts

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

package/src/lib/components/TransactionConfirmationPageLayout/index.d.ts

@@ -0,0 +1,2 @@
+export { TransactionConfirmationPageLayout } from './TransactionConfirmationPageLayout';
+export { TransactionRow } from './components';

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

@@ -35,3 +35,4 @@ export * from './OTPVerificationView';
 export * from './IconListTile';
 export * from './Transition';
 export * from './Popper';
+export * from './TransactionConfirmationPageLayout';

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

@@ -35,9 +35,9 @@ var ApiEndpoint = require('../../config/ApiEndpoint.cjs');
 var ThemeContext = require('../ThemeContext/ThemeContext.cjs');
 var useFetchNetworkConfigurations = require('../../utils/hooks/useFetchNetworkConfigurations/useFetchNetworkConfigurations.cjs');
 var useMultiWalletWidgetState = require('../../utils/hooks/multiWallet/useMultiWalletWidgetState/useMultiWalletWidgetState.cjs');
+var useSyncPrimaryWallet = require('../../utils/hooks/multiWallet/useSyncPrimaryWallet/useSyncPrimaryWallet.cjs');
 var useWalletEventListeners = require('../../utils/hooks/useWalletEventListeners/useWalletEventListeners.cjs');
 var LoadingContext = require('../LoadingContext/LoadingContext.cjs');
-var useSyncPrimaryWallet = require('../../utils/hooks/multiWallet/useSyncPrimaryWallet/useSyncPrimaryWallet.cjs');
 var useFetchWalletsForChainsMap = require('../../utils/hooks/useFetchWalletsForChainsMap/useFetchWalletsForChainsMap.cjs');
 var useHandleUnlinkWallet = require('../../utils/hooks/useHandleUnlinkWallet/useHandleUnlinkWallet.cjs');
 var app = require('../../app.cjs');
@@ -98,6 +98,8 @@ const DynamicContextProvider = ({ settings: { accessDeniedMessagePrimary, access
     const [isVerifying, setIsVerifying] = React.useState(false);
     const { projectSettings, isLoading: isProjectSettingsLoading } = useFetchProjectSettings.useFetchProjectSettings({ authToken: getAuthToken.getAuthToken(), environmentId });
     const multiWallet = (_c = deprecatedMultiWallet !== null && deprecatedMultiWallet !== void 0 ? deprecatedMultiWallet : (_b = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.sdk) === null || _b === void 0 ? void 0 : _b.multiWallet) !== null && _c !== void 0 ? _c : false;
+    // ensures that when user comes back to site and primary wallet is out of sync, we don't show widget popup
+    const [showWidgetStatePopup, setShowWidgetStatePopup] = React.useState(!multiWallet);
     const { configurations: serverNetworkConfigurations, handleRemoveLsNetworks, } = useFetchNetworkConfigurations.useFetchNetworkConfigurations({
         authToken: getAuthToken.getAuthToken(),
         environmentId,
@@ -152,11 +154,6 @@ const DynamicContextProvider = ({ settings: { accessDeniedMessagePrimary, access
         currentWallet: primaryWallet !== null && primaryWallet !== void 0 ? primaryWallet : connectedWallet,
     });
     const walletForUserFacingContext = authMode === 'connect-and-sign' || user ? primaryWallet : connectedWallet;
-    useSyncPrimaryWallet.useSyncPrimaryWallet({
-        multiWalletWidgetState,
-        primaryWallet,
-        setMultiWalletWidgetState,
-    });
     const { clearAllWalletConnectSessions, clearOphanedWalletConnectSessions } = useClearWalletConnectSessions.useClearWalletConnectSessions({
         connectors: walletConnectors,
     });
@@ -200,6 +197,17 @@ const DynamicContextProvider = ({ settings: { accessDeniedMessagePrimary, access
         environmentId,
         walletConnectors,
     ]);
+    useSyncPrimaryWallet.useSyncPrimaryWallet({
+        computeConnectedStateForWallets,
+        handleLogOut,
+        multiWalletWidgetState,
+        primaryWallet,
+        secondaryWallets,
+        setMultiWalletWidgetState,
+        setPrimaryWallet,
+        setShowWidgetStatePopup,
+        showWidgetStatePopup,
+    });
     const handleUnlinkWallet = useHandleUnlinkWallet.useHandleUnlinkWallet({
         environmentId,
         primaryWalletId,
@@ -350,11 +358,13 @@ const DynamicContextProvider = ({ settings: { accessDeniedMessagePrimary, access
             setShowAuthFlow,
             setShowDynamicUserProfile,
             setShowQrcodeModal,
+            setShowWidgetStatePopup,
             setUser,
             shadowDOMEnabled,
             showAuthFlow,
             showDynamicUserProfile,
             showQrcodeModal,
+            showWidgetStatePopup,
             signWithEmailWalletName,
             siweStatement,
             socialMediaIconUrl: ((_a = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.general) === null || _a === void 0 ? void 0 : _a.supportUrls) || socialMediaIconUrl,
@@ -437,6 +447,7 @@ const DynamicContextProvider = ({ settings: { accessDeniedMessagePrimary, access
         showAuthFlow,
         showDynamicUserProfile,
         showQrcodeModal,
+        showWidgetStatePopup,
         signWithEmailWalletName,
         siweStatement,
         socialMediaIconUrl,
@@ -470,8 +481,9 @@ const DynamicContextProvider = ({ settings: { accessDeniedMessagePrimary, access
     // DYN-1140 - Opens Widget when multiWalletWidgetState changes
     React.useEffect(() => {
         // If statement to secure SingleWallet widget
-        if (!multiWallet)
+        if (!multiWallet && multiWalletWidgetState !== 'awaiting_account_switch') {
             return;
+        }
         // We need to make sure that the user is logged in so that we do not try to display the widget before authorization
         if (user && multiWalletWidgetState !== 'idle' && !showDynamicUserProfile) {
             setShowDynamicUserProfile(true);

package/src/lib/context/DynamicContext/DynamicContext.d.ts

@@ -79,11 +79,13 @@ export interface IDynamicContext {
     setShowAuthFlow: Dispatch<SetStateAction<boolean>>;
     setShowDynamicUserProfile: Dispatch<SetStateAction<boolean>>;
     setShowQrcodeModal: Dispatch<SetStateAction<boolean>>;
+    setShowWidgetStatePopup: Dispatch<SetStateAction<boolean>>;
     setUser: Dispatch<SetStateAction<UserProfile | undefined>>;
     shadowDOMEnabled: boolean;
     showAuthFlow: boolean;
     showDynamicUserProfile: boolean;
     showQrcodeModal: boolean;
+    showWidgetStatePopup: boolean;
     signWithEmailWalletName?: string;
     siweStatement?: string;
     socialMediaIconUrl?: Record<string, string> | Record<SocialNetworkIconType, string>;

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

@@ -31,9 +31,9 @@ import ApiEndpoint from '../../config/ApiEndpoint.js';
 import { ThemeContextProvider } from '../ThemeContext/ThemeContext.js';
 import { useFetchNetworkConfigurations } from '../../utils/hooks/useFetchNetworkConfigurations/useFetchNetworkConfigurations.js';
 import { useMultiWalletWidgetState } from '../../utils/hooks/multiWallet/useMultiWalletWidgetState/useMultiWalletWidgetState.js';
+import { useSyncPrimaryWallet } from '../../utils/hooks/multiWallet/useSyncPrimaryWallet/useSyncPrimaryWallet.js';
 import { useWalletEventListeners } from '../../utils/hooks/useWalletEventListeners/useWalletEventListeners.js';
 import { LoadingContextProvider } from '../LoadingContext/LoadingContext.js';
-import { useSyncPrimaryWallet } from '../../utils/hooks/multiWallet/useSyncPrimaryWallet/useSyncPrimaryWallet.js';
 import { useFetchWalletsForChainsMap } from '../../utils/hooks/useFetchWalletsForChainsMap/useFetchWalletsForChainsMap.js';
 import { useHandleUnlinkWallet } from '../../utils/hooks/useHandleUnlinkWallet/useHandleUnlinkWallet.js';
 import { DynamicAuthFlow } from '../../app.js';
@@ -94,6 +94,8 @@ const DynamicContextProvider = ({ settings: { accessDeniedMessagePrimary, access
     const [isVerifying, setIsVerifying] = useState(false);
     const { projectSettings, isLoading: isProjectSettingsLoading } = useFetchProjectSettings({ authToken: getAuthToken(), environmentId });
     const multiWallet = (_c = deprecatedMultiWallet !== null && deprecatedMultiWallet !== void 0 ? deprecatedMultiWallet : (_b = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.sdk) === null || _b === void 0 ? void 0 : _b.multiWallet) !== null && _c !== void 0 ? _c : false;
+    // ensures that when user comes back to site and primary wallet is out of sync, we don't show widget popup
+    const [showWidgetStatePopup, setShowWidgetStatePopup] = useState(!multiWallet);
     const { configurations: serverNetworkConfigurations, handleRemoveLsNetworks, } = useFetchNetworkConfigurations({
         authToken: getAuthToken(),
         environmentId,
@@ -148,11 +150,6 @@ const DynamicContextProvider = ({ settings: { accessDeniedMessagePrimary, access
         currentWallet: primaryWallet !== null && primaryWallet !== void 0 ? primaryWallet : connectedWallet,
     });
     const walletForUserFacingContext = authMode === 'connect-and-sign' || user ? primaryWallet : connectedWallet;
-    useSyncPrimaryWallet({
-        multiWalletWidgetState,
-        primaryWallet,
-        setMultiWalletWidgetState,
-    });
     const { clearAllWalletConnectSessions, clearOphanedWalletConnectSessions } = useClearWalletConnectSessions({
         connectors: walletConnectors,
     });
@@ -196,6 +193,17 @@ const DynamicContextProvider = ({ settings: { accessDeniedMessagePrimary, access
         environmentId,
         walletConnectors,
     ]);
+    useSyncPrimaryWallet({
+        computeConnectedStateForWallets,
+        handleLogOut,
+        multiWalletWidgetState,
+        primaryWallet,
+        secondaryWallets,
+        setMultiWalletWidgetState,
+        setPrimaryWallet,
+        setShowWidgetStatePopup,
+        showWidgetStatePopup,
+    });
     const handleUnlinkWallet = useHandleUnlinkWallet({
         environmentId,
         primaryWalletId,
@@ -346,11 +354,13 @@ const DynamicContextProvider = ({ settings: { accessDeniedMessagePrimary, access
             setShowAuthFlow,
             setShowDynamicUserProfile,
             setShowQrcodeModal,
+            setShowWidgetStatePopup,
             setUser,
             shadowDOMEnabled,
             showAuthFlow,
             showDynamicUserProfile,
             showQrcodeModal,
+            showWidgetStatePopup,
             signWithEmailWalletName,
             siweStatement,
             socialMediaIconUrl: ((_a = projectSettings === null || projectSettings === void 0 ? void 0 : projectSettings.general) === null || _a === void 0 ? void 0 : _a.supportUrls) || socialMediaIconUrl,
@@ -433,6 +443,7 @@ const DynamicContextProvider = ({ settings: { accessDeniedMessagePrimary, access
         showAuthFlow,
         showDynamicUserProfile,
         showQrcodeModal,
+        showWidgetStatePopup,
         signWithEmailWalletName,
         siweStatement,
         socialMediaIconUrl,
@@ -466,8 +477,9 @@ const DynamicContextProvider = ({ settings: { accessDeniedMessagePrimary, access
     // DYN-1140 - Opens Widget when multiWalletWidgetState changes
     useEffect(() => {
         // If statement to secure SingleWallet widget
-        if (!multiWallet)
+        if (!multiWallet && multiWalletWidgetState !== 'awaiting_account_switch') {
             return;
+        }
         // We need to make sure that the user is logged in so that we do not try to display the widget before authorization
         if (user && multiWalletWidgetState !== 'idle' && !showDynamicUserProfile) {
             setShowDynamicUserProfile(true);

package/src/lib/context/SocialRedirectContext/SocialRedirectContext.cjs

@@ -73,13 +73,18 @@ const SocialRedirectContextProvider = ({ children, }) => {
             setShowAuthFlow(true);
             setSelectedWalletConnector(socialWalletConnector);
             (_a = socialWalletConnector
-                .getSession) === null || _a === void 0 ? void 0 : _a.call(socialWalletConnector).then(() => _tslib.__awaiter(void 0, void 0, void 0, function* () {
+                .getSession) === null || _a === void 0 ? void 0 : _a.call(socialWalletConnector).then((session) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
                 const address = yield socialWalletConnector.fetchPublicAddress();
                 if (!address) {
                     return;
                 }
                 walletUiUtils.enableInternalSign();
                 yield verifyWallet({
+                    oauth: {
+                        accessToken: session.accessToken,
+                        didToken: session.didToken,
+                        provider: providerFromParams,
+                    },
                     publicWalletAddress: address,
                     walletConnector: socialWalletConnector,
                 });

package/src/lib/context/SocialRedirectContext/SocialRedirectContext.js

@@ -69,13 +69,18 @@ const SocialRedirectContextProvider = ({ children, }) => {
             setShowAuthFlow(true);
             setSelectedWalletConnector(socialWalletConnector);
             (_a = socialWalletConnector
-                .getSession) === null || _a === void 0 ? void 0 : _a.call(socialWalletConnector).then(() => __awaiter(void 0, void 0, void 0, function* () {
+                .getSession) === null || _a === void 0 ? void 0 : _a.call(socialWalletConnector).then((session) => __awaiter(void 0, void 0, void 0, function* () {
                 const address = yield socialWalletConnector.fetchPublicAddress();
                 if (!address) {
                     return;
                 }
                 walletUiUtils.enableInternalSign();
                 yield verifyWallet({
+                    oauth: {
+                        accessToken: session.accessToken,
+                        didToken: session.didToken,
+                        provider: providerFromParams,
+                    },
                     publicWalletAddress: address,
                     walletConnector: socialWalletConnector,
                 });

package/src/lib/data/api.cjs

@@ -227,12 +227,13 @@ const createVisit = ({ authMode, chain, environmentId, walletProvider, publicWal
         logger.logger.error(error);
     }
 });
-const verifyWallet = (environmentId, { messageToSign, signedMessage, publicWalletAddress, chain, walletName, walletProvider, captchaToken, network, }) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
+const verifyWallet = (environmentId, { messageToSign, signedMessage, publicWalletAddress, chain, walletName, walletProvider, captchaToken, network, oauth, }) => _tslib.__awaiter(void 0, void 0, void 0, function* () {
     const verifyRequest = sdkApi$1.VerifyRequestFromJSON({
         captchaToken,
         chain,
         messageToSign,
         network,
+        oauth,
         publicWalletAddress,
         signedMessage,
         walletName,

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

@@ -42,7 +42,7 @@ export declare const createVisit: ({ authMode, chain, environmentId, walletProvi
     walletName: string;
     walletProvider: string;
 }) => Promise<void | undefined>;
-export declare const verifyWallet: (environmentId: string, { messageToSign, signedMessage, publicWalletAddress, chain, walletName, walletProvider, captchaToken, network, }: VerifyWallet) => Promise<string | undefined>;
+export declare const verifyWallet: (environmentId: string, { messageToSign, signedMessage, publicWalletAddress, chain, walletName, walletProvider, captchaToken, network, oauth, }: VerifyWallet) => Promise<string | undefined>;
 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>;

package/src/lib/data/api.js

@@ -223,12 +223,13 @@ const createVisit = ({ authMode, chain, environmentId, walletProvider, publicWal
         logger.error(error);
     }
 });
-const verifyWallet = (environmentId, { messageToSign, signedMessage, publicWalletAddress, chain, walletName, walletProvider, captchaToken, network, }) => __awaiter(void 0, void 0, void 0, function* () {
+const verifyWallet = (environmentId, { messageToSign, signedMessage, publicWalletAddress, chain, walletName, walletProvider, captchaToken, network, oauth, }) => __awaiter(void 0, void 0, void 0, function* () {
     const verifyRequest = VerifyRequestFromJSON({
         captchaToken,
         chain,
         messageToSign,
         network,
+        oauth,
         publicWalletAddress,
         signedMessage,
         walletName,