@dynamic-labs/sdk-react-core 0.17.0-RC.11 → 0.17.0-RC.13

package/src/lib/views/EmailVerification/EmailVerification.cjs

@@ -43,6 +43,8 @@ var ErrorContainer = require('../../components/ErrorContainer/ErrorContainer.cjs
 var TosAndPp = require('../../components/TosAndPp/TosAndPp.cjs');
 var PinField = require('../../components/PinField/PinField.cjs');
 var IconWithStatus = require('../../components/IconWithStatus/IconWithStatus.cjs');
+require('../../components/Popper/Popper/Popper.cjs');
+require('../../components/Popper/PopperContext/PopperContext.cjs');
 var EmailVerificationContext = require('../../context/EmailVerificationContext/EmailVerificationContext.cjs');
 var LoadingContext = require('../../context/LoadingContext/LoadingContext.cjs');
 var useEmailVerificationRequest = require('../../utils/hooks/authenticationHooks/useEmailVerificationRequest/useEmailVerificationRequest.cjs');

package/src/lib/views/EmailVerification/EmailVerification.js

@@ -39,6 +39,8 @@ import { ErrorContainer } from '../../components/ErrorContainer/ErrorContainer.j
 import { TosAndPp } from '../../components/TosAndPp/TosAndPp.js';
 import { PinField } from '../../components/PinField/PinField.js';
 import { IconWithStatus } from '../../components/IconWithStatus/IconWithStatus.js';
+import '../../components/Popper/Popper/Popper.js';
+import '../../components/Popper/PopperContext/PopperContext.js';
 import { useEmailVerificationContext } from '../../context/EmailVerificationContext/EmailVerificationContext.js';
 import { useLoadingContext } from '../../context/LoadingContext/LoadingContext.js';
 import { useEmailVerificationRequest } from '../../utils/hooks/authenticationHooks/useEmailVerificationRequest/useEmailVerificationRequest.js';

package/src/lib/views/EmailWalletOTPVerificationView/EmailWalletOTPVerificationView.cjs

@@ -28,6 +28,8 @@ require('../../components/Transition/OpacityTransition/OpacityTransition.cjs');
 require('../../components/IconButton/IconButton.cjs');
 require('../../components/Alert/Alert.cjs');
 var OTPVerificationView = require('../../components/OTPVerificationView/OTPVerificationView.cjs');
+require('../../components/Popper/Popper/Popper.cjs');
+require('../../components/Popper/PopperContext/PopperContext.cjs');
 require('../../context/MockContext/MockContext.cjs');
 require('../../context/CaptchaContext/CaptchaContext.cjs');
 var useMutation = require('../../utils/hooks/useMutation/useMutation.cjs');

package/src/lib/views/EmailWalletOTPVerificationView/EmailWalletOTPVerificationView.js

@@ -24,6 +24,8 @@ import '../../components/Transition/OpacityTransition/OpacityTransition.js';
 import '../../components/IconButton/IconButton.js';
 import '../../components/Alert/Alert.js';
 import { OTPVerificationView } from '../../components/OTPVerificationView/OTPVerificationView.js';
+import '../../components/Popper/Popper/Popper.js';
+import '../../components/Popper/PopperContext/PopperContext.js';
 import '../../context/MockContext/MockContext.js';
 import '../../context/CaptchaContext/CaptchaContext.js';
 import { useMutation } from '../../utils/hooks/useMutation/useMutation.js';

package/src/lib/views/LoginWithEmailView/components/ListItemButton/ListItemButton.cjs

@@ -34,6 +34,8 @@ require('../../../../utils/hooks/useUserUpdateRequest/useUserUpdateRequest.cjs')
 require('../../../../components/IconButton/IconButton.cjs');
 var ListTile = require('../../../../components/ListTile/ListTile.cjs');
 require('../../../../components/Alert/Alert.cjs');
+require('../../../../components/Popper/Popper/Popper.cjs');
+require('../../../../components/Popper/PopperContext/PopperContext.cjs');
 var Badge = require('../../../../components/Badge/Badge.cjs');
 
 const ListItemButton = ({ text, onClick, numberOfWallets }) => {

package/src/lib/views/LoginWithEmailView/components/ListItemButton/ListItemButton.js

@@ -30,6 +30,8 @@ import '../../../../utils/hooks/useUserUpdateRequest/useUserUpdateRequest.js';
 import '../../../../components/IconButton/IconButton.js';
 import { ListTile } from '../../../../components/ListTile/ListTile.js';
 import '../../../../components/Alert/Alert.js';
+import '../../../../components/Popper/Popper/Popper.js';
+import '../../../../components/Popper/PopperContext/PopperContext.js';
 import { Badge } from '../../../../components/Badge/Badge.js';
 
 const ListItemButton = ({ text, onClick, numberOfWallets }) => {

package/src/lib/views/LoginWithEmailView/components/LoginWithEmailForm/LoginWithEmailForm.cjs

@@ -30,6 +30,8 @@ require('../../../../components/Transition/OpacityTransition/OpacityTransition.c
 var Button = require('../../../../components/Button/Button.cjs');
 require('../../../../components/IconButton/IconButton.cjs');
 require('../../../../components/Alert/Alert.cjs');
+require('../../../../components/Popper/Popper/Popper.cjs');
+require('../../../../components/Popper/PopperContext/PopperContext.cjs');
 var useWalletItemActions = require('../../../../utils/hooks/useWalletItemActions/useWalletItemActions.cjs');
 require('../../../../utils/hooks/useUserUpdateRequest/useUserUpdateRequest.cjs');
 var useConnectWithEmail = require('../../../../utils/hooks/useConnectWithEmail/useConnectWithEmail.cjs');

package/src/lib/views/LoginWithEmailView/components/LoginWithEmailForm/LoginWithEmailForm.js

@@ -26,6 +26,8 @@ import '../../../../components/Transition/OpacityTransition/OpacityTransition.js
 import { Button } from '../../../../components/Button/Button.js';
 import '../../../../components/IconButton/IconButton.js';
 import '../../../../components/Alert/Alert.js';
+import '../../../../components/Popper/Popper/Popper.js';
+import '../../../../components/Popper/PopperContext/PopperContext.js';
 import { useWalletItemActions } from '../../../../utils/hooks/useWalletItemActions/useWalletItemActions.js';
 import '../../../../utils/hooks/useUserUpdateRequest/useUserUpdateRequest.js';
 import { useConnectWithEmail } from '../../../../utils/hooks/useConnectWithEmail/useConnectWithEmail.js';

package/src/lib/views/LoginWithEmailView/components/SocialSignIn/SocialSignIn.cjs

@@ -38,6 +38,8 @@ var ModalHeader = require('../../../../components/ModalHeader/ModalHeader.cjs');
 require('../../../../components/Alert/Alert.cjs');
 var IconWithSpinner = require('../../../../components/IconWithSpinner/IconWithSpinner.cjs');
 var IconListTile = require('../../../../components/IconListTile/IconListTile.cjs');
+require('../../../../components/Popper/Popper/Popper.cjs');
+require('../../../../components/Popper/PopperContext/PopperContext.cjs');
 var SocialRedirectContext = require('../../../../context/SocialRedirectContext/SocialRedirectContext.cjs');
 var getSocialIcon = require('../../../../utils/functions/getSocialIcon/getSocialIcon.cjs');
 var OverlayCard = require('../../../../components/OverlayCard/OverlayCard.cjs');

package/src/lib/views/LoginWithEmailView/components/SocialSignIn/SocialSignIn.js

@@ -34,6 +34,8 @@ import { ModalHeader } from '../../../../components/ModalHeader/ModalHeader.js';
 import '../../../../components/Alert/Alert.js';
 import { IconWithSpinner } from '../../../../components/IconWithSpinner/IconWithSpinner.js';
 import { IconListTile } from '../../../../components/IconListTile/IconListTile.js';
+import '../../../../components/Popper/Popper/Popper.js';
+import '../../../../components/Popper/PopperContext/PopperContext.js';
 import { useSocialRedirectContext } from '../../../../context/SocialRedirectContext/SocialRedirectContext.js';
 import { getSocialIcon } from '../../../../utils/functions/getSocialIcon/getSocialIcon.js';
 import { OverlayCard } from '../../../../components/OverlayCard/OverlayCard.js';

package/src/lib/views/NetworkNotSupported/NetworkNotSupported.cjs

@@ -36,6 +36,8 @@ require('../../utils/hooks/useUserUpdateRequest/useUserUpdateRequest.cjs');
 require('../../components/IconButton/IconButton.cjs');
 require('../../components/Alert/Alert.cjs');
 var ErrorContainer = require('../../components/ErrorContainer/ErrorContainer.cjs');
+require('../../components/Popper/Popper/Popper.cjs');
+require('../../components/Popper/PopperContext/PopperContext.cjs');
 var NetworkPicker = require('../../components/NetworkPicker/NetworkPicker.cjs');
 var UserAddress = require('../../components/UserAddress/UserAddress.cjs');
 var useUpdateUserProfileByJWTCallback = require('../../utils/hooks/useUpdateUserProfileByJWTCallback/useUpdateUserProfileByJWTCallback.cjs');

package/src/lib/views/NetworkNotSupported/NetworkNotSupported.js

@@ -32,6 +32,8 @@ import '../../utils/hooks/useUserUpdateRequest/useUserUpdateRequest.js';
 import '../../components/IconButton/IconButton.js';
 import '../../components/Alert/Alert.js';
 import { ErrorContainer } from '../../components/ErrorContainer/ErrorContainer.js';
+import '../../components/Popper/Popper/Popper.js';
+import '../../components/Popper/PopperContext/PopperContext.js';
 import { NetworkPicker } from '../../components/NetworkPicker/NetworkPicker.js';
 import { UserAddress } from '../../components/UserAddress/UserAddress.js';
 import { useUpdateUserProfileByJWTCallback } from '../../utils/hooks/useUpdateUserProfileByJWTCallback/useUpdateUserProfileByJWTCallback.js';

package/src/lib/views/NetworkNotSupportedSwitchManual/NetworkNotSupportedSwitchManual.cjs

@@ -35,6 +35,8 @@ require('../../utils/hooks/useUserUpdateRequest/useUserUpdateRequest.cjs');
 require('../../components/IconButton/IconButton.cjs');
 require('../../components/Alert/Alert.cjs');
 var IconWithSpinner = require('../../components/IconWithSpinner/IconWithSpinner.cjs');
+require('../../components/Popper/Popper/Popper.cjs');
+require('../../components/Popper/PopperContext/PopperContext.cjs');
 var useUpdateUserProfileByJWTCallback = require('../../utils/hooks/useUpdateUserProfileByJWTCallback/useUpdateUserProfileByJWTCallback.cjs');
 
 //   The component notifies the user about the required manual network change,

package/src/lib/views/NetworkNotSupportedSwitchManual/NetworkNotSupportedSwitchManual.js

@@ -31,6 +31,8 @@ import '../../utils/hooks/useUserUpdateRequest/useUserUpdateRequest.js';
 import '../../components/IconButton/IconButton.js';
 import '../../components/Alert/Alert.js';
 import { IconWithSpinner, iconRatio } from '../../components/IconWithSpinner/IconWithSpinner.js';
+import '../../components/Popper/Popper/Popper.js';
+import '../../components/Popper/PopperContext/PopperContext.js';
 import { useUpdateUserProfileByJWTCallback } from '../../utils/hooks/useUpdateUserProfileByJWTCallback/useUpdateUserProfileByJWTCallback.js';
 
 //   The component notifies the user about the required manual network change,

package/src/lib/views/NoAccess/NoAccess.cjs

@@ -37,6 +37,8 @@ var Button = require('../../components/Button/Button.cjs');
 require('../../components/IconButton/IconButton.cjs');
 require('../../components/Alert/Alert.cjs');
 var IconWithStatus = require('../../components/IconWithStatus/IconWithStatus.cjs');
+require('../../components/Popper/Popper/Popper.cjs');
+require('../../components/Popper/PopperContext/PopperContext.cjs');
 var StatusDot = require('../../components/StatusDot/StatusDot.cjs');
 var getSocialNetworkIcon = require('../../utils/functions/getSocialNetworkIcon/getSocialNetworkIcon.cjs');
 var EmailVerificationContext = require('../../context/EmailVerificationContext/EmailVerificationContext.cjs');

package/src/lib/views/NoAccess/NoAccess.js

@@ -33,6 +33,8 @@ import { Button } from '../../components/Button/Button.js';
 import '../../components/IconButton/IconButton.js';
 import '../../components/Alert/Alert.js';
 import { IconWithStatus } from '../../components/IconWithStatus/IconWithStatus.js';
+import '../../components/Popper/Popper/Popper.js';
+import '../../components/Popper/PopperContext/PopperContext.js';
 import { StatusDot } from '../../components/StatusDot/StatusDot.js';
 import { getSocialNetworkIcon } from '../../utils/functions/getSocialNetworkIcon/getSocialNetworkIcon.js';
 import { useEmailVerificationContext } from '../../context/EmailVerificationContext/EmailVerificationContext.js';

package/src/lib/views/NoQrNotInstalledView/NoQrNotInstalledView.cjs

@@ -33,6 +33,8 @@ require('../../context/CaptchaContext/CaptchaContext.cjs');
 require('../../utils/hooks/useUserUpdateRequest/useUserUpdateRequest.cjs');
 require('../../components/IconButton/IconButton.cjs');
 require('../../components/Alert/Alert.cjs');
+require('../../components/Popper/Popper/Popper.cjs');
+require('../../components/Popper/PopperContext/PopperContext.cjs');
 var getBrowserIcon = require('../../shared/utils/functions/getBrowserIcon/getBrowserIcon.cjs');
 var WalletHelpLink = require('./WalletHelpLink.cjs');
 

package/src/lib/views/NoQrNotInstalledView/NoQrNotInstalledView.js

@@ -29,6 +29,8 @@ import '../../context/CaptchaContext/CaptchaContext.js';
 import '../../utils/hooks/useUserUpdateRequest/useUserUpdateRequest.js';
 import '../../components/IconButton/IconButton.js';
 import '../../components/Alert/Alert.js';
+import '../../components/Popper/Popper/Popper.js';
+import '../../components/Popper/PopperContext/PopperContext.js';
 import { getBrowserIcon } from '../../shared/utils/functions/getBrowserIcon/getBrowserIcon.js';
 import { WalletHelpLink } from './WalletHelpLink.js';
 

package/src/lib/views/NoQrNotInstalledView/WalletHelpLink.cjs

@@ -31,6 +31,8 @@ require('../../context/CaptchaContext/CaptchaContext.cjs');
 require('../../utils/hooks/useUserUpdateRequest/useUserUpdateRequest.cjs');
 require('../../components/IconButton/IconButton.cjs');
 require('../../components/Alert/Alert.cjs');
+require('../../components/Popper/Popper/Popper.cjs');
+require('../../components/Popper/PopperContext/PopperContext.cjs');
 
 const capitalize = (value) => value[0].toUpperCase() + value.slice(1);
 const WalletHelpLink = ({ name, link, Icon }) => (jsxRuntime.jsx("div", Object.assign({ className: 'wallet-help-link' }, { children: jsxRuntime.jsxs("a", Object.assign({ className: 'wallet-help-link__anchor', href: link, target: '_blank', rel: 'noreferrer' }, { children: [jsxRuntime.jsx(Icon, { style: {

package/src/lib/views/NoQrNotInstalledView/WalletHelpLink.js

@@ -27,6 +27,8 @@ import '../../context/CaptchaContext/CaptchaContext.js';
 import '../../utils/hooks/useUserUpdateRequest/useUserUpdateRequest.js';
 import '../../components/IconButton/IconButton.js';
 import '../../components/Alert/Alert.js';
+import '../../components/Popper/Popper/Popper.js';
+import '../../components/Popper/PopperContext/PopperContext.js';
 
 const capitalize = (value) => value[0].toUpperCase() + value.slice(1);
 const WalletHelpLink = ({ name, link, Icon }) => (jsx("div", Object.assign({ className: 'wallet-help-link' }, { children: jsxs("a", Object.assign({ className: 'wallet-help-link__anchor', href: link, target: '_blank', rel: 'noreferrer' }, { children: [jsx(Icon, { style: {

package/src/lib/views/PendingConnectView/PendingConnectView.cjs

@@ -36,6 +36,8 @@ require('../../components/Alert/Alert.cjs');
 var PoweredByDynamic = require('../../components/PoweredByDynamic/PoweredByDynamic.cjs');
 var IconWithSpinner = require('../../components/IconWithSpinner/IconWithSpinner.cjs');
 var TosAndPp = require('../../components/TosAndPp/TosAndPp.cjs');
+require('../../components/Popper/Popper/Popper.cjs');
+require('../../components/Popper/PopperContext/PopperContext.cjs');
 
 const PendingConnectView = () => {
     const { selectedWalletConnector: walletConnector, termsOfServiceUrl, privacyPolicyUrl, } = useInternalDynamicContext.useInternalDynamicContext();

package/src/lib/views/PendingConnectView/PendingConnectView.js

@@ -32,6 +32,8 @@ import '../../components/Alert/Alert.js';
 import { PoweredByDynamic } from '../../components/PoweredByDynamic/PoweredByDynamic.js';
 import { IconWithSpinner, iconRatio } from '../../components/IconWithSpinner/IconWithSpinner.js';
 import { TosAndPp } from '../../components/TosAndPp/TosAndPp.js';
+import '../../components/Popper/Popper/Popper.js';
+import '../../components/Popper/PopperContext/PopperContext.js';
 
 const PendingConnectView = () => {
     const { selectedWalletConnector: walletConnector, termsOfServiceUrl, privacyPolicyUrl, } = useInternalDynamicContext();

package/src/lib/views/PendingSignatureView/PendingSignatureView.cjs

@@ -41,6 +41,8 @@ require('../../components/Alert/Alert.cjs');
 var PoweredByDynamic = require('../../components/PoweredByDynamic/PoweredByDynamic.cjs');
 var IconWithSpinner = require('../../components/IconWithSpinner/IconWithSpinner.cjs');
 var TosAndPp = require('../../components/TosAndPp/TosAndPp.cjs');
+require('../../components/Popper/Popper/Popper.cjs');
+require('../../components/Popper/PopperContext/PopperContext.cjs');
 
 const PendingSignatureView = () => {
     const [loading, setLoading] = React.useState(false);

package/src/lib/views/PendingSignatureView/PendingSignatureView.js

@@ -37,6 +37,8 @@ import '../../components/Alert/Alert.js';
 import { PoweredByDynamic } from '../../components/PoweredByDynamic/PoweredByDynamic.js';
 import { IconWithSpinner, iconRatio } from '../../components/IconWithSpinner/IconWithSpinner.js';
 import { TosAndPp } from '../../components/TosAndPp/TosAndPp.js';
+import '../../components/Popper/Popper/Popper.js';
+import '../../components/Popper/PopperContext/PopperContext.js';
 
 const PendingSignatureView = () => {
     const [loading, setLoading] = useState(false);

package/src/lib/views/QrCodeView/QrCodeContainer/QrCodeContainer.cjs

@@ -38,6 +38,8 @@ var CopyButton = require('../../../components/CopyButton/CopyButton.cjs');
 require('../../../components/IconButton/IconButton.cjs');
 var TextButton = require('../../../components/TextButton/TextButton.cjs');
 require('../../../components/Alert/Alert.cjs');
+require('../../../components/Popper/Popper/Popper.cjs');
+require('../../../components/Popper/PopperContext/PopperContext.cjs');
 
 const QrCodeContainer = ({ accentColor, walletName, qrcodeValue, Icon: WalletIcon, privacyPolicyUrl, termsOfServiceUrl, showCopyToClipboardButton = false, desktopUri, }) => (jsxRuntime.jsxs("div", Object.assign({ className: 'qrcode-container__container' }, { children: [jsxRuntime.jsxs("div", Object.assign({ className: 'qrcode-container__top' }, { children: [qrcodeValue ? (jsxRuntime.jsx(QRCode.QRCode, { Icon: WalletIcon, accentColor: accentColor, value: qrcodeValue, logoSize: 50, walletName: walletConnectorCore.normalizeWalletName(walletName) })) : (
                 // this div exists to give the parent a child, so that the parent

package/src/lib/views/QrCodeView/QrCodeContainer/QrCodeContainer.js

@@ -34,6 +34,8 @@ import { CopyButton } from '../../../components/CopyButton/CopyButton.js';
 import '../../../components/IconButton/IconButton.js';
 import { TextButton } from '../../../components/TextButton/TextButton.js';
 import '../../../components/Alert/Alert.js';
+import '../../../components/Popper/Popper/Popper.js';
+import '../../../components/Popper/PopperContext/PopperContext.js';
 
 const QrCodeContainer = ({ accentColor, walletName, qrcodeValue, Icon: WalletIcon, privacyPolicyUrl, termsOfServiceUrl, showCopyToClipboardButton = false, desktopUri, }) => (jsxs("div", Object.assign({ className: 'qrcode-container__container' }, { children: [jsxs("div", Object.assign({ className: 'qrcode-container__top' }, { children: [qrcodeValue ? (jsx(QRCode, { Icon: WalletIcon, accentColor: accentColor, value: qrcodeValue, logoSize: 50, walletName: normalizeWalletName(walletName) })) : (
                 // this div exists to give the parent a child, so that the parent

package/src/lib/views/QrCodeView/QrCodeView.cjs

@@ -33,6 +33,8 @@ require('../../utils/hooks/useUserUpdateRequest/useUserUpdateRequest.cjs');
 require('../../components/IconButton/IconButton.cjs');
 require('../../components/Alert/Alert.cjs');
 var PoweredByDynamic = require('../../components/PoweredByDynamic/PoweredByDynamic.cjs');
+require('../../components/Popper/Popper/Popper.cjs');
+require('../../components/Popper/PopperContext/PopperContext.cjs');
 var QrCodeContext = require('../../context/QrCodeContext/QrCodeContext.cjs');
 var QrCodeContainer = require('./QrCodeContainer/QrCodeContainer.cjs');
 

package/src/lib/views/QrCodeView/QrCodeView.js

@@ -29,6 +29,8 @@ import '../../utils/hooks/useUserUpdateRequest/useUserUpdateRequest.js';
 import '../../components/IconButton/IconButton.js';
 import '../../components/Alert/Alert.js';
 import { PoweredByDynamic } from '../../components/PoweredByDynamic/PoweredByDynamic.js';
+import '../../components/Popper/Popper/Popper.js';
+import '../../components/Popper/PopperContext/PopperContext.js';
 import { useQrCodeContext } from '../../context/QrCodeContext/QrCodeContext.js';
 import { QrCodeContainer } from './QrCodeContainer/QrCodeContainer.js';
 

package/src/lib/views/SocialRedirectView/SocialRedirectView.cjs

@@ -33,6 +33,8 @@ require('../../components/IconButton/IconButton.cjs');
 require('../../components/Alert/Alert.cjs');
 var IconWithSpinner = require('../../components/IconWithSpinner/IconWithSpinner.cjs');
 var TosAndPp = require('../../components/TosAndPp/TosAndPp.cjs');
+require('../../components/Popper/Popper/Popper.cjs');
+require('../../components/Popper/PopperContext/PopperContext.cjs');
 var SocialRedirectContext = require('../../context/SocialRedirectContext/SocialRedirectContext.cjs');
 var getSocialIcon = require('../../utils/functions/getSocialIcon/getSocialIcon.cjs');
 

package/src/lib/views/SocialRedirectView/SocialRedirectView.js

@@ -29,6 +29,8 @@ import '../../components/IconButton/IconButton.js';
 import '../../components/Alert/Alert.js';
 import { IconWithSpinner } from '../../components/IconWithSpinner/IconWithSpinner.js';
 import { TosAndPp } from '../../components/TosAndPp/TosAndPp.js';
+import '../../components/Popper/Popper/Popper.js';
+import '../../components/Popper/PopperContext/PopperContext.js';
 import { useSocialRedirectContext } from '../../context/SocialRedirectContext/SocialRedirectContext.js';
 import { getSocialIcon } from '../../utils/functions/getSocialIcon/getSocialIcon.js';
 

package/src/lib/views/WalletList/SearchInstead/SearchInstead.cjs

@@ -31,6 +31,8 @@ require('../../../context/CaptchaContext/CaptchaContext.cjs');
 require('../../../utils/hooks/useUserUpdateRequest/useUserUpdateRequest.cjs');
 require('../../../components/IconButton/IconButton.cjs');
 require('../../../components/Alert/Alert.cjs');
+require('../../../components/Popper/Popper/Popper.cjs');
+require('../../../components/Popper/PopperContext/PopperContext.cjs');
 
 const SearchInstead = () => (jsxRuntime.jsxs("div", Object.assign({ className: 'search-instead__container' }, { children: [jsxRuntime.jsx(Typography.Typography, Object.assign({ color: 'secondary', variant: 'body_small', weight: 'regular' }, { children: "Don't see your wallet?" })), jsxRuntime.jsx(Typography.Typography, Object.assign({ color: 'primary', variant: 'button_primary', weight: 'regular' }, { children: "Try search instead" }))] })));
 

package/src/lib/views/WalletList/SearchInstead/SearchInstead.js

@@ -27,6 +27,8 @@ import '../../../context/CaptchaContext/CaptchaContext.js';
 import '../../../utils/hooks/useUserUpdateRequest/useUserUpdateRequest.js';
 import '../../../components/IconButton/IconButton.js';
 import '../../../components/Alert/Alert.js';
+import '../../../components/Popper/Popper/Popper.js';
+import '../../../components/Popper/PopperContext/PopperContext.js';
 
 const SearchInstead = () => (jsxs("div", Object.assign({ className: 'search-instead__container' }, { children: [jsx(Typography, Object.assign({ color: 'secondary', variant: 'body_small', weight: 'regular' }, { children: "Don't see your wallet?" })), jsx(Typography, Object.assign({ color: 'primary', variant: 'button_primary', weight: 'regular' }, { children: "Try search instead" }))] })));
 

package/src/lib/views/WalletList/WalletListItem/WalletListItem.cjs

@@ -37,6 +37,8 @@ require('../../../utils/hooks/useUserUpdateRequest/useUserUpdateRequest.cjs');
 require('../../../components/IconButton/IconButton.cjs');
 var ListTile = require('../../../components/ListTile/ListTile.cjs');
 require('../../../components/Alert/Alert.cjs');
+require('../../../components/Popper/Popper/Popper.cjs');
+require('../../../components/Popper/PopperContext/PopperContext.cjs');
 var Badge = require('../../../components/Badge/Badge.cjs');
 
 const WalletListItem = ({ usingMultiWallet, wallet, onResetSearchValue, tile = ({ leading, name, onClick, trailing }) => (jsxRuntime.jsx(ListTile.ListTile, Object.assign({ leading: leading, trailing: trailing, onClick: onClick, className: 'wallet-list-item__tile' }, { children: name }))), }) => {

package/src/lib/views/WalletList/WalletListItem/WalletListItem.js

@@ -33,6 +33,8 @@ import '../../../utils/hooks/useUserUpdateRequest/useUserUpdateRequest.js';
 import '../../../components/IconButton/IconButton.js';
 import { ListTile } from '../../../components/ListTile/ListTile.js';
 import '../../../components/Alert/Alert.js';
+import '../../../components/Popper/Popper/Popper.js';
+import '../../../components/Popper/PopperContext/PopperContext.js';
 import { Badge } from '../../../components/Badge/Badge.js';
 
 const WalletListItem = ({ usingMultiWallet, wallet, onResetSearchValue, tile = ({ leading, name, onClick, trailing }) => (jsx(ListTile, Object.assign({ leading: leading, trailing: trailing, onClick: onClick, className: 'wallet-list-item__tile' }, { children: name }))), }) => {

package/src/lib/views/WalletSignSpinnerView/WalletSignSpinnerView.cjs

@@ -37,6 +37,8 @@ var Button = require('../../components/Button/Button.cjs');
 require('../../components/IconButton/IconButton.cjs');
 require('../../components/Alert/Alert.cjs');
 var IconWithSpinner = require('../../components/IconWithSpinner/IconWithSpinner.cjs');
+require('../../components/Popper/Popper/Popper.cjs');
+require('../../components/Popper/PopperContext/PopperContext.cjs');
 
 const WalletSignSpinnerView = () => {
     const { setView } = ViewContext.useViewContext();

package/src/lib/views/WalletSignSpinnerView/WalletSignSpinnerView.js

@@ -33,6 +33,8 @@ import { Button } from '../../components/Button/Button.js';
 import '../../components/IconButton/IconButton.js';
 import '../../components/Alert/Alert.js';
 import { IconWithSpinner, iconRatio } from '../../components/IconWithSpinner/IconWithSpinner.js';
+import '../../components/Popper/Popper/Popper.js';
+import '../../components/Popper/PopperContext/PopperContext.js';
 
 const WalletSignSpinnerView = () => {
     const { setView } = useViewContext();

package/src/lib/views/WalletUsedView/WalletUsedView.cjs

@@ -43,6 +43,8 @@ require('../../utils/hooks/useUserUpdateRequest/useUserUpdateRequest.cjs');
 var Button = require('../../components/Button/Button.cjs');
 require('../../components/IconButton/IconButton.cjs');
 require('../../components/Alert/Alert.cjs');
+require('../../components/Popper/Popper/Popper.cjs');
+require('../../components/Popper/PopperContext/PopperContext.cjs');
 var LoadingContext = require('../../context/LoadingContext/LoadingContext.cjs');
 
 const WalletUsedView = () => {

package/src/lib/views/WalletUsedView/WalletUsedView.js

@@ -39,6 +39,8 @@ import '../../utils/hooks/useUserUpdateRequest/useUserUpdateRequest.js';
 import { Button } from '../../components/Button/Button.js';
 import '../../components/IconButton/IconButton.js';
 import '../../components/Alert/Alert.js';
+import '../../components/Popper/Popper/Popper.js';
+import '../../components/Popper/PopperContext/PopperContext.js';
 import { useLoadingContext } from '../../context/LoadingContext/LoadingContext.js';
 
 const WalletUsedView = () => {

package/src/lib/widgets/DynamicWidget/DynamicWidget.cjs

@@ -32,6 +32,8 @@ require('../../utils/hooks/useUserUpdateRequest/useUserUpdateRequest.cjs');
 var DynamicConnectButton = require('../../components/DynamicConnectButton/DynamicConnectButton.cjs');
 require('../../components/IconButton/IconButton.cjs');
 require('../../components/Alert/Alert.cjs');
+require('../../components/Popper/Popper/Popper.cjs');
+require('../../components/Popper/PopperContext/PopperContext.cjs');
 var IsBrowser = require('../../components/IsBrowser/IsBrowser.cjs');
 var DynamicNav = require('./components/DynamicNav/DynamicNav.cjs');
 var DynamicUserProfile = require('./components/DynamicUserProfile/DynamicUserProfile.cjs');

package/src/lib/widgets/DynamicWidget/DynamicWidget.js

@@ -28,6 +28,8 @@ import '../../utils/hooks/useUserUpdateRequest/useUserUpdateRequest.js';
 import { DynamicConnectButton } from '../../components/DynamicConnectButton/DynamicConnectButton.js';
 import '../../components/IconButton/IconButton.js';
 import '../../components/Alert/Alert.js';
+import '../../components/Popper/Popper/Popper.js';
+import '../../components/Popper/PopperContext/PopperContext.js';
 import { IsBrowser } from '../../components/IsBrowser/IsBrowser.js';
 import { DynamicNav } from './components/DynamicNav/DynamicNav.js';
 import { DynamicUserProfile } from './components/DynamicUserProfile/DynamicUserProfile.js';

package/src/lib/widgets/DynamicWidget/components/AccountControl/AccountControl.cjs

@@ -37,6 +37,8 @@ require('../../../../context/CaptchaContext/CaptchaContext.cjs');
 require('../../../../utils/hooks/useUserUpdateRequest/useUserUpdateRequest.cjs');
 require('../../../../components/IconButton/IconButton.cjs');
 require('../../../../components/Alert/Alert.cjs');
+require('../../../../components/Popper/Popper/Popper.cjs');
+require('../../../../components/Popper/PopperContext/PopperContext.cjs');
 var useFetchNameService = require('../../hooks/useFetchNameService/useFetchNameService.cjs');
 
 const AccountControl = ({ className }) => {

package/src/lib/widgets/DynamicWidget/components/AccountControl/AccountControl.js

@@ -33,6 +33,8 @@ import '../../../../context/CaptchaContext/CaptchaContext.js';
 import '../../../../utils/hooks/useUserUpdateRequest/useUserUpdateRequest.js';
 import '../../../../components/IconButton/IconButton.js';
 import '../../../../components/Alert/Alert.js';
+import '../../../../components/Popper/Popper/Popper.js';
+import '../../../../components/Popper/PopperContext/PopperContext.js';
 import { useFetchNameService } from '../../hooks/useFetchNameService/useFetchNameService.js';
 
 const AccountControl = ({ className }) => {

package/src/lib/widgets/DynamicWidget/components/Balance/Balance.cjs

@@ -33,6 +33,8 @@ require('../../../../context/CaptchaContext/CaptchaContext.cjs');
 require('../../../../utils/hooks/useUserUpdateRequest/useUserUpdateRequest.cjs');
 require('../../../../components/IconButton/IconButton.cjs');
 require('../../../../components/Alert/Alert.cjs');
+require('../../../../components/Popper/Popper/Popper.cjs');
+require('../../../../components/Popper/PopperContext/PopperContext.cjs');
 var helpers = require('../../helpers/helpers.cjs');
 
 const Balance = ({ connector, address, network, className }) => {

package/src/lib/widgets/DynamicWidget/components/Balance/Balance.js

@@ -29,6 +29,8 @@ import '../../../../context/CaptchaContext/CaptchaContext.js';
 import '../../../../utils/hooks/useUserUpdateRequest/useUserUpdateRequest.js';
 import '../../../../components/IconButton/IconButton.js';
 import '../../../../components/Alert/Alert.js';
+import '../../../../components/Popper/Popper/Popper.js';
+import '../../../../components/Popper/PopperContext/PopperContext.js';
 import { roundBalance } from '../../helpers/helpers.js';
 
 const Balance = ({ connector, address, network, className }) => {

package/src/lib/widgets/DynamicWidget/components/DefaultPendingSignModalContent/DefaultPendingSignModalContent.cjs

@@ -35,6 +35,8 @@ var Button = require('../../../../components/Button/Button.cjs');
 require('../../../../components/IconButton/IconButton.cjs');
 require('../../../../components/Alert/Alert.cjs');
 var IconWithSpinner = require('../../../../components/IconWithSpinner/IconWithSpinner.cjs');
+require('../../../../components/Popper/Popper/Popper.cjs');
+require('../../../../components/Popper/PopperContext/PopperContext.cjs');
 var helpers = require('../../helpers/helpers.cjs');
 
 const DefaultPendingSignModalContent = ({ walletConnector, onClickToSign }) => {

package/src/lib/widgets/DynamicWidget/components/DefaultPendingSignModalContent/DefaultPendingSignModalContent.js

@@ -31,6 +31,8 @@ import { Button } from '../../../../components/Button/Button.js';
 import '../../../../components/IconButton/IconButton.js';
 import '../../../../components/Alert/Alert.js';
 import { IconWithSpinner } from '../../../../components/IconWithSpinner/IconWithSpinner.js';
+import '../../../../components/Popper/Popper/Popper.js';
+import '../../../../components/Popper/PopperContext/PopperContext.js';
 import { capitalize } from '../../helpers/helpers.js';
 
 const DefaultPendingSignModalContent = ({ walletConnector, onClickToSign }) => {

package/src/lib/widgets/DynamicWidget/components/DotsMenu/DotsMenu.cjs

@@ -4,15 +4,16 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
+var utils = require('@dynamic-labs/utils');
 require('@dynamic-labs/sdk-api');
 require('../../../../shared/logger.cjs');
 require('@dynamic-labs/iconic');
 require('@dynamic-labs/wallet-connector-core');
 require('../../../../context/ViewContext/ViewContext.cjs');
 var threeDots = require('../../../../shared/assets/three-dots.cjs');
-require('@dynamic-labs/utils');
 require('../../../../utils/constants/colors.cjs');
 require('ethers');
+var index = require('../../../../shared/utils/hooks/useOnClickOutside/index.cjs');
 require('../../../../shared/consts/index.cjs');
 require('../../../../context/DynamicContext/DynamicContext.cjs');
 require('@dynamic-labs/multi-wallet');
@@ -32,37 +33,16 @@ require('../../../../context/CaptchaContext/CaptchaContext.cjs');
 require('../../../../utils/hooks/useUserUpdateRequest/useUserUpdateRequest.cjs');
 var IconButton = require('../../../../components/IconButton/IconButton.cjs');
 require('../../../../components/Alert/Alert.cjs');
-var DotsMenuWrapper = require('../DotsMenuWrapper/DotsMenuWrapper.cjs');
+var Popper = require('../../../../components/Popper/Popper/Popper.cjs');
+require('../../../../components/Popper/PopperContext/PopperContext.cjs');
 var DotsMenuDropdown = require('../DotsMenuDropdown/DotsMenuDropdown.cjs');
-var DynamicWidgetContext = require('../../context/DynamicWidgetContext.cjs');
 
-const MENU_HEIGHT = 90;
 const DotsMenu = ({ options, title, buttonClassName }) => {
     const dotsMenuRef = React.useRef(null);
+    const popperContentRef = React.useRef(null);
     const [showMenu, setShowMenu] = React.useState(false);
-    const [alignment, setAlignment] = React.useState('bottom');
-    const { availableWalletsContainerRef } = DynamicWidgetContext.useWidgetContext();
-    const onClose = () => {
-        setShowMenu(false);
-    };
-    const handleOpenClick = (event) => {
-        var _a, _b;
-        event.stopPropagation();
-        const availableWalletsContainerBouding = (_a = availableWalletsContainerRef === null || availableWalletsContainerRef === void 0 ? void 0 : availableWalletsContainerRef.current) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect();
-        const dotsMenuBounding = (_b = dotsMenuRef === null || dotsMenuRef === void 0 ? void 0 : dotsMenuRef.current) === null || _b === void 0 ? void 0 : _b.getBoundingClientRect();
-        if (availableWalletsContainerBouding && dotsMenuBounding) {
-            if (dotsMenuBounding.top + MENU_HEIGHT <
-                availableWalletsContainerBouding.bottom) {
-                setAlignment('bottom');
-            }
-            else if (dotsMenuBounding.top + MENU_HEIGHT >
-                availableWalletsContainerBouding.top) {
-                setAlignment('top');
-            }
-        }
-        setShowMenu(!showMenu);
-    };
-    return (jsxRuntime.jsx(DotsMenuWrapper.DotsMenuWrapper, Object.assign({ onClose: onClose, showMenu: showMenu, title: title, content: jsxRuntime.jsx(DotsMenuDropdown.DotsMenuDropdown, { options: options }), alignment: alignment }, { children: jsxRuntime.jsx(IconButton.IconButton, Object.assign({ ref: dotsMenuRef, onClick: handleOpenClick, "data-testid": 'dotsMenu', className: buttonClassName }, { children: jsxRuntime.jsx(Icon.Icon, Object.assign({ color: 'text-primary' }, { children: jsxRuntime.jsx(threeDots.ReactComponent, {}) })) })) })));
+    index.useOnClickOutside(popperContentRef, () => setShowMenu(false));
+    return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(IconButton.IconButton, Object.assign({ ref: dotsMenuRef, onClick: () => setShowMenu(true), "data-testid": 'dotsMenu', className: showMenu ? undefined : buttonClassName }, { children: jsxRuntime.jsx(Icon.Icon, Object.assign({ color: 'text-primary' }, { children: jsxRuntime.jsx(threeDots.ReactComponent, {}) })) })), jsxRuntime.jsx(Popper.Popper, Object.assign({ isOpen: showMenu, setIsOpen: setShowMenu, anchorRef: dotsMenuRef, ref: popperContentRef, anchorOrigin: utils.isMobile() ? 'bottom-left' : 'top-left', transformOrigin: utils.isMobile() ? 'bottom-right' : 'top-right' }, { children: jsxRuntime.jsx(DotsMenuDropdown.DotsMenuDropdown, { options: options }) }))] }));
 };
 
 exports.DotsMenu = DotsMenu;