@miden-sdk/miden-wallet-adapter-reactui 0.13.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (76) hide show
  1. package/dist/Button.d.ts +15 -0
  2. package/dist/Button.js +5 -0
  3. package/dist/Button.js.map +1 -0
  4. package/dist/Collapse.d.ts +6 -0
  5. package/dist/Collapse.js +61 -0
  6. package/dist/Collapse.js.map +1 -0
  7. package/dist/DiscoverMidenMessage.d.ts +1 -0
  8. package/dist/DiscoverMidenMessage.js +6 -0
  9. package/dist/DiscoverMidenMessage.js.map +1 -0
  10. package/dist/MidenSVG.d.ts +2 -0
  11. package/dist/MidenSVG.js +5 -0
  12. package/dist/MidenSVG.js.map +1 -0
  13. package/dist/WalletConnectButton.d.ts +3 -0
  14. package/dist/WalletConnectButton.js +29 -0
  15. package/dist/WalletConnectButton.js.map +1 -0
  16. package/dist/WalletDisconnectButton.d.ts +3 -0
  17. package/dist/WalletDisconnectButton.js +26 -0
  18. package/dist/WalletDisconnectButton.js.map +1 -0
  19. package/dist/WalletIcon.d.ts +6 -0
  20. package/dist/WalletIcon.js +5 -0
  21. package/dist/WalletIcon.js.map +1 -0
  22. package/dist/WalletListItem.d.ts +8 -0
  23. package/dist/WalletListItem.js +8 -0
  24. package/dist/WalletListItem.js.map +1 -0
  25. package/dist/WalletModal.d.ts +10 -0
  26. package/dist/WalletModal.js +115 -0
  27. package/dist/WalletModal.js.map +1 -0
  28. package/dist/WalletModalButton.d.ts +3 -0
  29. package/dist/WalletModalButton.js +15 -0
  30. package/dist/WalletModalButton.js.map +1 -0
  31. package/dist/WalletModalProvider.d.ts +6 -0
  32. package/dist/WalletModalProvider.js +12 -0
  33. package/dist/WalletModalProvider.js.map +1 -0
  34. package/dist/WalletMultiButton.d.ts +3 -0
  35. package/dist/WalletMultiButton.js +70 -0
  36. package/dist/WalletMultiButton.js.map +1 -0
  37. package/dist/index.d.ts +8 -0
  38. package/dist/index.js +9 -0
  39. package/dist/index.js.map +1 -0
  40. package/dist/styles.css +359 -0
  41. package/dist/useWalletModal.d.ts +6 -0
  42. package/dist/useWalletModal.js +26 -0
  43. package/dist/useWalletModal.js.map +1 -0
  44. package/docs/README.md +27 -0
  45. package/docs/functions/useWalletModal.md +13 -0
  46. package/docs/interfaces/WalletIconProps.md +3222 -0
  47. package/docs/interfaces/WalletModalContextState.md +29 -0
  48. package/docs/interfaces/WalletModalProps.md +41 -0
  49. package/docs/interfaces/WalletModalProviderProps.md +67 -0
  50. package/docs/variables/WalletConnectButton.md +9 -0
  51. package/docs/variables/WalletDisconnectButton.md +9 -0
  52. package/docs/variables/WalletIcon.md +9 -0
  53. package/docs/variables/WalletModal.md +9 -0
  54. package/docs/variables/WalletModalButton.md +9 -0
  55. package/docs/variables/WalletModalContext.md +9 -0
  56. package/docs/variables/WalletModalProvider.md +9 -0
  57. package/docs/variables/WalletMultiButton.md +9 -0
  58. package/package.json +35 -0
  59. package/src/Button.tsx +46 -0
  60. package/src/Collapse.tsx +83 -0
  61. package/src/DiscoverMidenMessage.tsx +17 -0
  62. package/src/MidenSVG.tsx +21 -0
  63. package/src/WalletConnectButton.tsx +53 -0
  64. package/src/WalletDisconnectButton.tsx +43 -0
  65. package/src/WalletIcon.tsx +22 -0
  66. package/src/WalletListItem.tsx +46 -0
  67. package/src/WalletModal.tsx +281 -0
  68. package/src/WalletModalButton.tsx +23 -0
  69. package/src/WalletModalProvider.tsx +25 -0
  70. package/src/WalletMultiButton.tsx +130 -0
  71. package/src/aleo.svg +250 -0
  72. package/src/index.ts +8 -0
  73. package/src/useWalletModal.tsx +36 -0
  74. package/styles.css +359 -0
  75. package/tsconfig.json +32 -0
  76. package/yarn-error.log +525 -0
@@ -0,0 +1,15 @@
1
+ import { AllowedPrivateData, PrivateDataPermission, WalletAdapterNetwork } from '@miden-sdk/miden-wallet-adapter-base';
2
+ import type { CSSProperties, FC, MouseEvent, PropsWithChildren, ReactElement } from 'react';
3
+ export type ButtonProps = PropsWithChildren<{
4
+ className?: string;
5
+ disabled?: boolean;
6
+ privateDataPermission?: PrivateDataPermission;
7
+ network?: WalletAdapterNetwork;
8
+ endIcon?: ReactElement;
9
+ onClick?: (e: MouseEvent<HTMLButtonElement>) => void;
10
+ startIcon?: ReactElement;
11
+ style?: CSSProperties;
12
+ tabIndex?: number;
13
+ allowedPrivateData?: AllowedPrivateData;
14
+ }>;
15
+ export declare const Button: FC<ButtonProps>;
package/dist/Button.js ADDED
@@ -0,0 +1,5 @@
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ export const Button = (props) => {
3
+ return (_jsxs("button", { className: `wallet-adapter-button ${props.className || ''}`, disabled: props.disabled, style: props.style, onClick: props.onClick, tabIndex: props.tabIndex || 0, type: "button", children: [props.startIcon && (_jsx("i", { className: "wallet-adapter-button-start-icon", children: props.startIcon })), props.children, props.endIcon && (_jsx("i", { className: "wallet-adapter-button-end-icon", children: props.endIcon }))] }));
4
+ };
5
+ //# sourceMappingURL=Button.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Button.js","sourceRoot":"","sources":["../src/Button.tsx"],"names":[],"mappings":";AA0BA,MAAM,CAAC,MAAM,MAAM,GAAoB,CAAC,KAAK,EAAE,EAAE;IAC/C,OAAO,CACL,kBACE,SAAS,EAAE,yBAAyB,KAAK,CAAC,SAAS,IAAI,EAAE,EAAE,EAC3D,QAAQ,EAAE,KAAK,CAAC,QAAQ,EACxB,KAAK,EAAE,KAAK,CAAC,KAAK,EAClB,OAAO,EAAE,KAAK,CAAC,OAAO,EACtB,QAAQ,EAAE,KAAK,CAAC,QAAQ,IAAI,CAAC,EAC7B,IAAI,EAAC,QAAQ,aAEZ,KAAK,CAAC,SAAS,IAAI,CAClB,YAAG,SAAS,EAAC,kCAAkC,YAAE,KAAK,CAAC,SAAS,GAAK,CACtE,EACA,KAAK,CAAC,QAAQ,EACd,KAAK,CAAC,OAAO,IAAI,CAChB,YAAG,SAAS,EAAC,gCAAgC,YAAE,KAAK,CAAC,OAAO,GAAK,CAClE,IACM,CACV,CAAC;AACJ,CAAC,CAAC"}
@@ -0,0 +1,6 @@
1
+ import type { FC, PropsWithChildren } from 'react';
2
+ export type CollapseProps = PropsWithChildren<{
3
+ expanded: boolean;
4
+ id: string;
5
+ }>;
6
+ export declare const Collapse: FC<CollapseProps>;
@@ -0,0 +1,61 @@
1
+ import { jsx as _jsx } from "react/jsx-runtime";
2
+ import { useLayoutEffect, useRef } from 'react';
3
+ export const Collapse = ({ id, children, expanded = false }) => {
4
+ const ref = useRef(null);
5
+ const instant = useRef(true);
6
+ const transition = 'height 250ms ease-out';
7
+ const openCollapse = () => {
8
+ const node = ref.current;
9
+ if (!node)
10
+ return;
11
+ requestAnimationFrame(() => {
12
+ node.style.height = node.scrollHeight + 'px';
13
+ });
14
+ };
15
+ const closeCollapse = () => {
16
+ const node = ref.current;
17
+ if (!node)
18
+ return;
19
+ requestAnimationFrame(() => {
20
+ node.style.height = node.offsetHeight + 'px';
21
+ node.style.overflow = 'hidden';
22
+ requestAnimationFrame(() => {
23
+ node.style.height = '0';
24
+ });
25
+ });
26
+ };
27
+ useLayoutEffect(() => {
28
+ if (expanded) {
29
+ openCollapse();
30
+ }
31
+ else {
32
+ closeCollapse();
33
+ }
34
+ }, [expanded]);
35
+ useLayoutEffect(() => {
36
+ const node = ref.current;
37
+ if (!node)
38
+ return;
39
+ function handleComplete() {
40
+ if (!node)
41
+ return;
42
+ node.style.overflow = expanded ? 'initial' : 'hidden';
43
+ if (expanded) {
44
+ node.style.height = 'auto';
45
+ }
46
+ }
47
+ function handleTransitionEnd(event) {
48
+ if (node && event.target === node && event.propertyName === 'height') {
49
+ handleComplete();
50
+ }
51
+ }
52
+ if (instant.current) {
53
+ handleComplete();
54
+ instant.current = false;
55
+ }
56
+ node.addEventListener('transitionend', handleTransitionEnd);
57
+ return () => node.removeEventListener('transitionend', handleTransitionEnd);
58
+ }, [expanded]);
59
+ return (_jsx("div", { className: "wallet-adapter-collapse", id: id, ref: ref, role: "region", style: { height: 0, transition: instant.current ? undefined : transition }, children: children }));
60
+ };
61
+ //# sourceMappingURL=Collapse.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Collapse.js","sourceRoot":"","sources":["../src/Collapse.tsx"],"names":[],"mappings":"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"}
@@ -0,0 +1 @@
1
+ export declare const DiscoverMidenMessage: () => import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,6 @@
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import { MidenSVG } from './MidenSVG';
3
+ export const DiscoverMidenMessage = () => {
4
+ return (_jsxs("div", { className: "wallet-adapter-modal-discover-miden-message", children: [_jsx(MidenSVG, {}), _jsx("h1", { children: "Discover Miden" }), _jsx("p", { children: "Experience the next evolution of blockchain technology with Miden. Install the Miden Wallet and access a seamless, decentralized ecosystem today." })] }));
5
+ };
6
+ //# sourceMappingURL=DiscoverMidenMessage.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"DiscoverMidenMessage.js","sourceRoot":"","sources":["../src/DiscoverMidenMessage.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAEtC,MAAM,CAAC,MAAM,oBAAoB,GAAG,GAAG,EAAE;IACvC,OAAO,CACL,eAAK,SAAS,EAAC,6CAA6C,aAC1D,KAAC,QAAQ,KAAG,EACZ,0CAEK,EACL,4KAII,IACA,CACP,CAAC;AACJ,CAAC,CAAC"}
@@ -0,0 +1,2 @@
1
+ import type { FC } from 'react';
2
+ export declare const MidenSVG: FC;
@@ -0,0 +1,5 @@
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ export const MidenSVG = () => {
3
+ return (_jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: "248", height: "81", viewBox: "0 0 248 81", fill: "none", children: [_jsx("path", { d: "M124.908 23.952L129.747 29.2839C130.159 29.7379 130.913 29.4457 130.913 28.8323V16.0657C130.913 15.695 131.213 15.3947 131.583 15.3947H140.478C144.38 15.3947 147.994 17.4341 149.995 20.7635L151.751 23.6863C151.988 24.0814 152.415 24.3233 152.876 24.3233H152.94C153.666 24.3233 154.254 23.7344 154.254 23.0077V9.72945C154.254 9.0032 153.666 8.41451 152.941 8.41451H132.254C131.514 8.41451 130.913 7.81346 130.913 7.07192V1.007C130.913 0.450902 130.463 0 129.908 0H125.217C124.662 0 124.211 0.450902 124.211 1.007V7.07192C124.211 7.81346 123.611 8.41451 122.871 8.41451H97.1781C96.4529 8.41451 95.8652 9.0032 95.8652 9.72945V12.861C95.8652 13.1987 95.9948 13.523 96.2268 13.7676L125.055 39.5593C125.294 39.8113 125.415 40.1352 125.416 40.4598C125.414 40.7841 125.294 41.1083 125.055 41.3602L96.2268 67.1518C95.9948 67.3965 95.8652 67.7209 95.8652 68.0583V71.1901C95.8652 71.9163 96.4529 72.5048 97.1781 72.5048H122.871C123.611 72.5048 124.211 73.1061 124.211 73.8478V79.9125C124.211 80.4686 124.662 80.9195 125.217 80.9195H129.908C130.463 80.9195 130.913 80.4689 130.913 79.9125V73.8476C130.913 73.1061 131.513 72.505 132.254 72.505H152.94C153.666 72.505 154.254 71.9161 154.254 71.1896V57.9119C154.254 57.1852 153.666 56.5963 152.94 56.5963H152.876C152.415 56.5963 151.988 56.8381 151.751 57.2333L149.995 60.156C147.994 63.4854 144.38 65.5248 140.478 65.5248H131.583C131.213 65.5248 130.913 65.2241 130.913 64.8536V52.0872C130.913 51.4738 130.159 51.1816 129.747 51.6357L124.908 56.9676C124.459 57.4621 124.21 58.1059 124.21 58.7741V64.8543C124.21 65.225 123.91 65.5253 123.54 65.5253H107.048C106.973 65.5253 106.899 65.4889 106.861 65.4237C106.814 65.3419 106.825 65.2463 106.88 65.1798L132.579 41.0098C132.58 41.008 132.582 41.0064 132.583 41.0049C132.841 40.6924 132.841 40.2269 132.583 39.9147C132.582 39.9129 132.58 39.9113 132.579 39.9097L106.88 15.7395C106.825 15.673 106.814 15.5775 106.861 15.4956C106.899 15.4305 106.973 15.394 107.048 15.394H123.54C123.91 15.394 124.21 15.6946 124.21 16.065V22.1452C124.21 22.8135 124.459 23.4575 124.908 23.952Z", fill: "#FF5500" }), _jsx("g", { opacity: "0.3", children: _jsx("path", { d: "M65.7274 34.2079L68.5979 37.3707C68.8426 37.64 69.2899 37.4667 69.2899 37.1028V29.5299C69.2899 29.31 69.4679 29.1319 69.6873 29.1319H74.9635C77.278 29.1319 79.4221 30.3416 80.6088 32.3165L81.6504 34.0503C81.7912 34.2847 82.0445 34.4281 82.3179 34.4281H82.356C82.7863 34.4281 83.135 34.0788 83.135 33.6477V25.7713C83.135 25.3405 82.7864 24.9913 82.3564 24.9913H70.0851C69.646 24.9913 69.2899 24.6348 69.2899 24.1949V20.5973C69.2899 20.2675 69.023 20 68.6935 20H65.9107C65.5814 20 65.3144 20.2675 65.3144 20.5973V24.1949C65.3144 24.6348 64.9584 24.9913 64.5194 24.9913H49.2788C48.8486 24.9913 48.5 25.3405 48.5 25.7713V27.6289C48.5 27.8292 48.5769 28.0216 48.7145 28.1667L65.8146 43.4659C65.9566 43.6153 66.0281 43.8075 66.0289 44C66.028 44.1924 65.9566 44.3847 65.8146 44.5341L48.7145 59.8332C48.5769 59.9784 48.5 60.1708 48.5 60.3709V62.2287C48.5 62.6595 48.8486 63.0085 49.2788 63.0085H64.5192C64.9584 63.0085 65.3144 63.3652 65.3144 63.8052V67.4027C65.3144 67.7325 65.5814 68 65.9107 68H68.6935C69.023 68 69.2898 67.7327 69.2898 67.4027V63.8051C69.2898 63.3652 69.6459 63.0087 70.0849 63.0087H82.356C82.7861 63.0087 83.135 62.6593 83.135 62.2284V54.3523C83.135 53.9212 82.7861 53.5719 82.356 53.5719H82.3179C82.0445 53.5719 81.7912 53.7153 81.6502 53.9497L80.6088 55.6835C79.422 57.6584 77.2778 58.8681 74.9634 58.8681H69.6873C69.4678 58.8681 69.2898 58.6897 69.2898 58.47V50.8972C69.2898 50.5333 68.8426 50.36 68.5979 50.6293L65.7274 53.7921C65.4613 54.0855 65.3137 54.4673 65.3137 54.8637V58.4704C65.3137 58.6903 65.1359 58.8684 64.9165 58.8684H55.1335C55.0888 58.8684 55.0451 58.8468 55.0226 58.8081C54.9943 58.7596 55.0013 58.7029 55.0338 58.6635L70.2778 44.3263C70.2786 44.3252 70.2796 44.3243 70.2804 44.3233C70.4333 44.138 70.4333 43.8619 70.2804 43.6767C70.2796 43.6756 70.2788 43.6747 70.2778 43.6737L55.0338 29.3364C55.0013 29.2969 54.9943 29.2403 55.0226 29.1917C55.0451 29.1531 55.0888 29.1315 55.1335 29.1315H64.9165C65.1359 29.1315 65.3137 29.3097 65.3137 29.5295V33.1361C65.3137 33.5325 65.4613 33.9145 65.7274 34.2079Z", fill: "#FF5500" }) }), _jsx("g", { opacity: "0.1", children: _jsx("path", { d: "M229.727 34.2079L232.598 37.3707C232.843 37.64 233.29 37.4667 233.29 37.1028V29.5299C233.29 29.31 233.468 29.1319 233.687 29.1319H238.964C241.278 29.1319 243.422 30.3416 244.609 32.3165L245.65 34.0503C245.791 34.2847 246.045 34.4281 246.318 34.4281H246.356C246.786 34.4281 247.135 34.0788 247.135 33.6477V25.7713C247.135 25.3405 246.786 24.9913 246.356 24.9913H234.085C233.646 24.9913 233.29 24.6348 233.29 24.1949V20.5973C233.29 20.2675 233.023 20 232.694 20H229.911C229.581 20 229.314 20.2675 229.314 20.5973V24.1949C229.314 24.6348 228.958 24.9913 228.519 24.9913H213.279C212.849 24.9913 212.5 25.3405 212.5 25.7713V27.6289C212.5 27.8292 212.577 28.0216 212.714 28.1667L229.815 43.4659C229.957 43.6153 230.028 43.8075 230.029 44C230.028 44.1924 229.957 44.3847 229.815 44.5341L212.714 59.8332C212.577 59.9784 212.5 60.1708 212.5 60.3709V62.2287C212.5 62.6595 212.849 63.0085 213.279 63.0085H228.519C228.958 63.0085 229.314 63.3652 229.314 63.8052V67.4027C229.314 67.7325 229.581 68 229.911 68H232.694C233.023 68 233.29 67.7327 233.29 67.4027V63.8051C233.29 63.3652 233.646 63.0087 234.085 63.0087H246.356C246.786 63.0087 247.135 62.6593 247.135 62.2284V54.3523C247.135 53.9212 246.786 53.5719 246.356 53.5719H246.318C246.045 53.5719 245.791 53.7153 245.65 53.9497L244.609 55.6835C243.422 57.6584 241.278 58.8681 238.963 58.8681H233.687C233.468 58.8681 233.29 58.6897 233.29 58.47V50.8972C233.29 50.5333 232.843 50.36 232.598 50.6293L229.727 53.7921C229.461 54.0855 229.314 54.4673 229.314 54.8637V58.4704C229.314 58.6903 229.136 58.8684 228.916 58.8684H219.134C219.089 58.8684 219.045 58.8468 219.023 58.8081C218.994 58.7596 219.001 58.7029 219.034 58.6635L234.278 44.3263C234.279 44.3252 234.28 44.3243 234.28 44.3233C234.433 44.138 234.433 43.8619 234.28 43.6767C234.28 43.6756 234.279 43.6747 234.278 43.6737L219.034 29.3364C219.001 29.2969 218.994 29.2403 219.023 29.1917C219.045 29.1531 219.089 29.1315 219.134 29.1315H228.916C229.136 29.1315 229.314 29.3097 229.314 29.5295V33.1361C229.314 33.5325 229.461 33.9145 229.727 34.2079Z", fill: "#FF5500" }) }), _jsx("g", { opacity: "0.1", children: _jsx("path", { d: "M18.0927 34.2079L20.9631 37.3707C21.2078 37.64 21.6552 37.4667 21.6552 37.1028V29.5299C21.6552 29.31 21.8331 29.1319 22.0525 29.1319H27.3288C29.6432 29.1319 31.7874 30.3416 32.974 32.3165L34.0156 34.0503C34.1564 34.2847 34.4098 34.4281 34.6831 34.4281H34.7212C35.1515 34.4281 35.5002 34.0788 35.5002 33.6477V25.7713C35.5002 25.3405 35.1516 24.9913 34.7216 24.9913H22.4503C22.0112 24.9913 21.6552 24.6348 21.6552 24.1949V20.5973C21.6552 20.2675 21.3882 20 21.0588 20H18.276C17.9467 20 17.6796 20.2675 17.6796 20.5973V24.1949C17.6796 24.6348 17.3237 24.9913 16.8846 24.9913H1.64399C1.21385 24.9913 0.865234 25.3405 0.865234 25.7713V27.6289C0.865234 27.8292 0.942097 28.0216 1.0797 28.1667L18.1798 43.4659C18.3218 43.6153 18.3933 43.8075 18.3941 44C18.3932 44.1924 18.3218 44.3847 18.1798 44.5341L1.0797 59.8332C0.942097 59.9784 0.865234 60.1708 0.865234 60.3709V62.2287C0.865234 62.6595 1.21385 63.0085 1.64399 63.0085H16.8845C17.3237 63.0085 17.6796 63.3652 17.6796 63.8052V67.4027C17.6796 67.7325 17.9467 68 18.276 68H21.0588C21.3882 68 21.655 67.7327 21.655 67.4027V63.8051C21.655 63.3652 22.0111 63.0087 22.4502 63.0087H34.7212C35.1514 63.0087 35.5002 62.6593 35.5002 62.2284V54.3523C35.5002 53.9212 35.1514 53.5719 34.7212 53.5719H34.6831C34.4098 53.5719 34.1564 53.7153 34.0155 53.9497L32.974 55.6835C31.7872 57.6584 29.6431 58.8681 27.3286 58.8681H22.0525C21.833 58.8681 21.655 58.6897 21.655 58.47V50.8972C21.655 50.5333 21.2078 50.36 20.9631 50.6293L18.0927 53.7921C17.8265 54.0855 17.6789 54.4673 17.6789 54.8637V58.4704C17.6789 58.6903 17.5011 58.8684 17.2817 58.8684H7.49877C7.45401 58.8684 7.41032 58.8468 7.3878 58.8081C7.35956 58.7596 7.36649 58.7029 7.39899 58.6635L22.6431 44.3263C22.6439 44.3252 22.6448 44.3243 22.6456 44.3233C22.7985 44.138 22.7985 43.8619 22.6456 43.6767C22.6448 43.6756 22.644 43.6747 22.6431 43.6737L7.39899 29.3364C7.36649 29.2969 7.35956 29.2403 7.3878 29.1917C7.41032 29.1531 7.45401 29.1315 7.49877 29.1315H17.2817C17.5011 29.1315 17.6789 29.3097 17.6789 29.5295V33.1361C17.6789 33.5325 17.8265 33.9145 18.0927 34.2079Z", fill: "#FF5500" }) }), _jsx("g", { opacity: "0.3", children: _jsx("path", { d: "M182.093 34.2079L184.963 37.3707C185.208 37.64 185.655 37.4667 185.655 37.1028V29.5299C185.655 29.31 185.833 29.1319 186.053 29.1319H191.329C193.643 29.1319 195.787 30.3416 196.974 32.3165L198.016 34.0503C198.156 34.2847 198.41 34.4281 198.683 34.4281H198.721C199.151 34.4281 199.5 34.0788 199.5 33.6477V25.7713C199.5 25.3405 199.152 24.9913 198.722 24.9913H186.45C186.011 24.9913 185.655 24.6348 185.655 24.1949V20.5973C185.655 20.2675 185.388 20 185.059 20H182.276C181.947 20 181.68 20.2675 181.68 20.5973V24.1949C181.68 24.6348 181.324 24.9913 180.885 24.9913H165.644C165.214 24.9913 164.865 25.3405 164.865 25.7713V27.6289C164.865 27.8292 164.942 28.0216 165.08 28.1667L182.18 43.4659C182.322 43.6153 182.393 43.8075 182.394 44C182.393 44.1924 182.322 44.3847 182.18 44.5341L165.08 59.8332C164.942 59.9784 164.865 60.1708 164.865 60.3709V62.2287C164.865 62.6595 165.214 63.0085 165.644 63.0085H180.884C181.324 63.0085 181.68 63.3652 181.68 63.8052V67.4027C181.68 67.7325 181.947 68 182.276 68H185.059C185.388 68 185.655 67.7327 185.655 67.4027V63.8051C185.655 63.3652 186.011 63.0087 186.45 63.0087H198.721C199.151 63.0087 199.5 62.6593 199.5 62.2284V54.3523C199.5 53.9212 199.151 53.5719 198.721 53.5719H198.683C198.41 53.5719 198.156 53.7153 198.015 53.9497L196.974 55.6835C195.787 57.6584 193.643 58.8681 191.329 58.8681H186.053C185.833 58.8681 185.655 58.6897 185.655 58.47V50.8972C185.655 50.5333 185.208 50.36 184.963 50.6293L182.093 53.7921C181.827 54.0855 181.679 54.4673 181.679 54.8637V58.4704C181.679 58.6903 181.501 58.8684 181.282 58.8684H171.499C171.454 58.8684 171.41 58.8468 171.388 58.8081C171.36 58.7596 171.366 58.7029 171.399 58.6635L186.643 44.3263C186.644 44.3252 186.645 44.3243 186.646 44.3233C186.799 44.138 186.799 43.8619 186.646 43.6767C186.645 43.6756 186.644 43.6747 186.643 43.6737L171.399 29.3364C171.366 29.2969 171.36 29.2403 171.388 29.1917C171.41 29.1531 171.454 29.1315 171.499 29.1315H181.282C181.501 29.1315 181.679 29.3097 181.679 29.5295V33.1361C181.679 33.5325 181.827 33.9145 182.093 34.2079Z", fill: "#FF5500" }) })] }));
4
+ };
5
+ //# sourceMappingURL=MidenSVG.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"MidenSVG.js","sourceRoot":"","sources":["../src/MidenSVG.tsx"],"names":[],"mappings":";AAEA,MAAM,CAAC,MAAM,QAAQ,GAAO,GAAG,EAAE;IAC/B,OAAO,CACL,eAAK,KAAK,EAAC,4BAA4B,EAAC,KAAK,EAAC,KAAK,EAAC,MAAM,EAAC,IAAI,EAAC,OAAO,EAAC,YAAY,EAAC,IAAI,EAAC,MAAM,aACpG,eAAM,CAAC,EAAC,0gEAA0gE,EAAC,IAAI,EAAC,SAAS,GAAE,EACniE,YAAG,OAAO,EAAC,KAAK,YAChB,eAAM,CAAC,EAAC,s/DAAs/D,EAAC,IAAI,EAAC,SAAS,GAAE,GAC3gE,EACJ,YAAG,OAAO,EAAC,KAAK,YAChB,eAAM,CAAC,EAAC,y/DAAy/D,EAAC,IAAI,EAAC,SAAS,GAAE,GAC9gE,EACJ,YAAG,OAAO,EAAC,KAAK,YAChB,eAAM,CAAC,EAAC,+gEAA+gE,EAAC,IAAI,EAAC,SAAS,GAAE,GACpiE,EACJ,YAAG,OAAO,EAAC,KAAK,YAChB,eAAM,CAAC,EAAC,y/DAAy/D,EAAC,IAAI,EAAC,SAAS,GAAE,GAC9gE,IACE,CACH,CAAC;AACJ,CAAC,CAAC"}
@@ -0,0 +1,3 @@
1
+ import type { FC } from 'react';
2
+ import type { ButtonProps } from './Button';
3
+ export declare const WalletConnectButton: FC<ButtonProps>;
@@ -0,0 +1,29 @@
1
+ import { jsx as _jsx } from "react/jsx-runtime";
2
+ import { useCallback, useMemo } from 'react';
3
+ import { useWallet } from '@miden-sdk/miden-wallet-adapter-react';
4
+ import { Button } from './Button';
5
+ import { WalletIcon } from './WalletIcon';
6
+ import { AllowedPrivateData, PrivateDataPermission, WalletAdapterNetwork } from '@miden-sdk/miden-wallet-adapter-base';
7
+ export const WalletConnectButton = ({ children, disabled, onClick, privateDataPermission, network, allowedPrivateData, ...props }) => {
8
+ const { wallet, connect, connecting, connected } = useWallet();
9
+ const handleClick = useCallback((event) => {
10
+ if (onClick)
11
+ onClick(event);
12
+ // eslint-disable-next-line @typescript-eslint/no-empty-function
13
+ if (!event.defaultPrevented)
14
+ connect(privateDataPermission || PrivateDataPermission.UponRequest, network || WalletAdapterNetwork.Testnet, allowedPrivateData ?? AllowedPrivateData.None).catch(() => { });
15
+ }, [onClick, connect]);
16
+ const content = useMemo(() => {
17
+ if (children)
18
+ return children;
19
+ if (connecting)
20
+ return 'Connecting ...';
21
+ if (connected)
22
+ return 'Connected';
23
+ if (wallet)
24
+ return 'Connect';
25
+ return 'Connect Wallet';
26
+ }, [children, connecting, connected, wallet]);
27
+ return (_jsx(Button, { className: "wallet-adapter-button-trigger", disabled: disabled || !wallet || connecting || connected, startIcon: wallet ? _jsx(WalletIcon, { wallet: wallet }) : undefined, onClick: handleClick, ...props, children: content }));
28
+ };
29
+ //# sourceMappingURL=WalletConnectButton.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"WalletConnectButton.js","sourceRoot":"","sources":["../src/WalletConnectButton.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,WAAW,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAC7C,OAAO,EAAE,SAAS,EAAE,MAAM,uCAAuC,CAAC;AAElE,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,kBAAkB,EAAE,qBAAqB,EAAE,oBAAoB,EAAE,MAAM,sCAAsC,CAAC;AAEvH,MAAM,CAAC,MAAM,mBAAmB,GAAoB,CAAC,EACnD,QAAQ,EACR,QAAQ,EACR,OAAO,EACP,qBAAqB,EACrB,OAAO,EACP,kBAAkB,EAClB,GAAG,KAAK,EACT,EAAE,EAAE;IACH,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,UAAU,EAAE,SAAS,EAAE,GAAG,SAAS,EAAE,CAAC;IAE/D,MAAM,WAAW,GAAyC,WAAW,CACnE,CAAC,KAAK,EAAE,EAAE;QACR,IAAI,OAAO;YAAE,OAAO,CAAC,KAAK,CAAC,CAAC;QAC5B,gEAAgE;QAChE,IAAI,CAAC,KAAK,CAAC,gBAAgB;YACzB,OAAO,CACL,qBAAqB,IAAI,qBAAqB,CAAC,WAAW,EAC1D,OAAO,IAAI,oBAAoB,CAAC,OAAO,EACvC,kBAAkB,IAAI,kBAAkB,CAAC,IAAI,CAC9C,CAAC,KAAK,CAAC,GAAG,EAAE,GAAE,CAAC,CAAC,CAAC;IACtB,CAAC,EACD,CAAC,OAAO,EAAE,OAAO,CAAC,CACnB,CAAC;IAEF,MAAM,OAAO,GAAG,OAAO,CAAC,GAAG,EAAE;QAC3B,IAAI,QAAQ;YAAE,OAAO,QAAQ,CAAC;QAC9B,IAAI,UAAU;YAAE,OAAO,gBAAgB,CAAC;QACxC,IAAI,SAAS;YAAE,OAAO,WAAW,CAAC;QAClC,IAAI,MAAM;YAAE,OAAO,SAAS,CAAC;QAC7B,OAAO,gBAAgB,CAAC;IAC1B,CAAC,EAAE,CAAC,QAAQ,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,CAAC,CAAC,CAAC;IAE9C,OAAO,CACL,KAAC,MAAM,IACL,SAAS,EAAC,+BAA+B,EACzC,QAAQ,EAAE,QAAQ,IAAI,CAAC,MAAM,IAAI,UAAU,IAAI,SAAS,EACxD,SAAS,EAAE,MAAM,CAAC,CAAC,CAAC,KAAC,UAAU,IAAC,MAAM,EAAE,MAAM,GAAI,CAAC,CAAC,CAAC,SAAS,EAC9D,OAAO,EAAE,WAAW,KAChB,KAAK,YAER,OAAO,GACD,CACV,CAAC;AACJ,CAAC,CAAC"}
@@ -0,0 +1,3 @@
1
+ import type { FC } from 'react';
2
+ import type { ButtonProps } from './Button';
3
+ export declare const WalletDisconnectButton: FC<ButtonProps>;
@@ -0,0 +1,26 @@
1
+ import { jsx as _jsx } from "react/jsx-runtime";
2
+ import { useCallback, useMemo } from 'react';
3
+ import { useWallet } from '@miden-sdk/miden-wallet-adapter-react';
4
+ import { Button } from './Button';
5
+ import { WalletIcon } from './WalletIcon';
6
+ export const WalletDisconnectButton = ({ children, disabled, onClick, ...props }) => {
7
+ const { wallet, disconnect, disconnecting } = useWallet();
8
+ const handleClick = useCallback((event) => {
9
+ if (onClick)
10
+ onClick(event);
11
+ // eslint-disable-next-line @typescript-eslint/no-empty-function
12
+ if (!event.defaultPrevented)
13
+ disconnect().catch(() => { });
14
+ }, [onClick, disconnect]);
15
+ const content = useMemo(() => {
16
+ if (children)
17
+ return children;
18
+ if (disconnecting)
19
+ return 'Disconnecting ...';
20
+ if (wallet)
21
+ return 'Disconnect';
22
+ return 'Disconnect Wallet';
23
+ }, [children, disconnecting, wallet]);
24
+ return (_jsx(Button, { className: "wallet-adapter-button-trigger", disabled: disabled || !wallet, startIcon: wallet ? _jsx(WalletIcon, { wallet: wallet }) : undefined, onClick: handleClick, ...props, children: content }));
25
+ };
26
+ //# sourceMappingURL=WalletDisconnectButton.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"WalletDisconnectButton.js","sourceRoot":"","sources":["../src/WalletDisconnectButton.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,WAAW,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAC7C,OAAO,EAAE,SAAS,EAAE,MAAM,uCAAuC,CAAC;AAElE,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAE1C,MAAM,CAAC,MAAM,sBAAsB,GAAoB,CAAC,EACtD,QAAQ,EACR,QAAQ,EACR,OAAO,EACP,GAAG,KAAK,EACT,EAAE,EAAE;IACH,MAAM,EAAE,MAAM,EAAE,UAAU,EAAE,aAAa,EAAE,GAAG,SAAS,EAAE,CAAC;IAE1D,MAAM,WAAW,GAAyC,WAAW,CACnE,CAAC,KAAK,EAAE,EAAE;QACR,IAAI,OAAO;YAAE,OAAO,CAAC,KAAK,CAAC,CAAC;QAC5B,gEAAgE;QAChE,IAAI,CAAC,KAAK,CAAC,gBAAgB;YAAE,UAAU,EAAE,CAAC,KAAK,CAAC,GAAG,EAAE,GAAE,CAAC,CAAC,CAAC;IAC5D,CAAC,EACD,CAAC,OAAO,EAAE,UAAU,CAAC,CACtB,CAAC;IAEF,MAAM,OAAO,GAAG,OAAO,CAAC,GAAG,EAAE;QAC3B,IAAI,QAAQ;YAAE,OAAO,QAAQ,CAAC;QAC9B,IAAI,aAAa;YAAE,OAAO,mBAAmB,CAAC;QAC9C,IAAI,MAAM;YAAE,OAAO,YAAY,CAAC;QAChC,OAAO,mBAAmB,CAAC;IAC7B,CAAC,EAAE,CAAC,QAAQ,EAAE,aAAa,EAAE,MAAM,CAAC,CAAC,CAAC;IAEtC,OAAO,CACL,KAAC,MAAM,IACL,SAAS,EAAC,+BAA+B,EACzC,QAAQ,EAAE,QAAQ,IAAI,CAAC,MAAM,EAC7B,SAAS,EAAE,MAAM,CAAC,CAAC,CAAC,KAAC,UAAU,IAAC,MAAM,EAAE,MAAM,GAAI,CAAC,CAAC,CAAC,SAAS,EAC9D,OAAO,EAAE,WAAW,KAChB,KAAK,YAER,OAAO,GACD,CACV,CAAC;AACJ,CAAC,CAAC"}
@@ -0,0 +1,6 @@
1
+ import type { DetailedHTMLProps, FC, ImgHTMLAttributes } from 'react';
2
+ import { Wallet } from '@miden-sdk/miden-wallet-adapter-react';
3
+ export interface WalletIconProps extends DetailedHTMLProps<ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement> {
4
+ wallet: Wallet | null;
5
+ }
6
+ export declare const WalletIcon: FC<WalletIconProps>;
@@ -0,0 +1,5 @@
1
+ import { jsx as _jsx } from "react/jsx-runtime";
2
+ export const WalletIcon = ({ wallet, ...props }) => {
3
+ return (wallet && (_jsx("img", { src: wallet.adapter.icon, alt: `${wallet.adapter.name} icon`, ...props })));
4
+ };
5
+ //# sourceMappingURL=WalletIcon.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"WalletIcon.js","sourceRoot":"","sources":["../src/WalletIcon.tsx"],"names":[],"mappings":";AAWA,MAAM,CAAC,MAAM,UAAU,GAAwB,CAAC,EAAE,MAAM,EAAE,GAAG,KAAK,EAAE,EAAE,EAAE;IACtE,OAAO,CACL,MAAM,IAAI,CACR,cACE,GAAG,EAAE,MAAM,CAAC,OAAO,CAAC,IAAI,EACxB,GAAG,EAAE,GAAG,MAAM,CAAC,OAAO,CAAC,IAAI,OAAO,KAC9B,KAAK,GACT,CACH,CACF,CAAC;AACJ,CAAC,CAAC"}
@@ -0,0 +1,8 @@
1
+ import type { FC, MouseEventHandler } from 'react';
2
+ import { Wallet } from '@miden-sdk/miden-wallet-adapter-react';
3
+ export interface WalletListItemProps {
4
+ handleClick: MouseEventHandler<HTMLButtonElement>;
5
+ tabIndex?: number;
6
+ wallet: Wallet;
7
+ }
8
+ export declare const WalletListItem: FC<WalletListItemProps>;
@@ -0,0 +1,8 @@
1
+ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import { WalletReadyState } from '@miden-sdk/miden-wallet-adapter-base';
3
+ import { Button } from './Button';
4
+ import { WalletIcon } from './WalletIcon';
5
+ export const WalletListItem = ({ handleClick, tabIndex, wallet, }) => {
6
+ return (_jsx("li", { children: _jsxs(Button, { onClick: handleClick, startIcon: _jsx(WalletIcon, { wallet: wallet }), tabIndex: tabIndex, children: [wallet.adapter.name, wallet.readyState === WalletReadyState.Installed && (_jsxs(_Fragment, { children: [_jsx("span", { children: "Installed" }), _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "25", height: "24", viewBox: "0 0 25 24", fill: "none", children: _jsx("path", { d: "M10.1003 5L8.5 6.5745L13.6981 11.7L8.5 16.8255L10.1003 18.4L16.91 11.7L10.1003 5Z", fill: "black" }) })] }))] }) }));
7
+ };
8
+ //# sourceMappingURL=WalletListItem.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"WalletListItem.js","sourceRoot":"","sources":["../src/WalletListItem.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AAExE,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAQ1C,MAAM,CAAC,MAAM,cAAc,GAA4B,CAAC,EACtD,WAAW,EACX,QAAQ,EACR,MAAM,GACP,EAAE,EAAE;IACH,OAAO,CACL,uBACE,MAAC,MAAM,IACL,OAAO,EAAE,WAAW,EACpB,SAAS,EAAE,KAAC,UAAU,IAAC,MAAM,EAAE,MAAM,GAAI,EACzC,QAAQ,EAAE,QAAQ,aAEjB,MAAM,CAAC,OAAO,CAAC,IAAI,EACnB,MAAM,CAAC,UAAU,KAAK,gBAAgB,CAAC,SAAS,IAAI,CACnD,8BACE,uCAAsB,EACtB,cACE,KAAK,EAAC,4BAA4B,EAClC,KAAK,EAAC,IAAI,EACV,MAAM,EAAC,IAAI,EACX,OAAO,EAAC,WAAW,EACnB,IAAI,EAAC,MAAM,YAEX,eACE,CAAC,EAAC,mFAAmF,EACrF,IAAI,EAAC,OAAO,GACZ,GACE,IACL,CACJ,IACM,GACN,CACN,CAAC;AACJ,CAAC,CAAC"}
@@ -0,0 +1,10 @@
1
+ import type { FC } from 'react';
2
+ import { AllowedPrivateData, PrivateDataPermission, WalletAdapterNetwork } from '@miden-sdk/miden-wallet-adapter-base';
3
+ export interface WalletModalProps {
4
+ className?: string;
5
+ container?: string;
6
+ privateDataPermission?: PrivateDataPermission;
7
+ network?: WalletAdapterNetwork;
8
+ allowedPrivateData?: AllowedPrivateData;
9
+ }
10
+ export declare const WalletModal: FC<WalletModalProps>;
@@ -0,0 +1,115 @@
1
+ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
2
+ import { useCallback, useLayoutEffect, useMemo, useRef, useState, } from 'react';
3
+ import { createPortal } from 'react-dom';
4
+ import { AllowedPrivateData, PrivateDataPermission, WalletAdapterNetwork, WalletReadyState, } from '@miden-sdk/miden-wallet-adapter-base';
5
+ import { useWallet } from '@miden-sdk/miden-wallet-adapter-react';
6
+ import { useWalletModal } from './useWalletModal';
7
+ import { WalletListItem } from './WalletListItem';
8
+ import { DiscoverMidenMessage } from './DiscoverMidenMessage';
9
+ export const WalletModal = ({ className = '', container = 'body', privateDataPermission, network, allowedPrivateData, }) => {
10
+ const ref = useRef(null);
11
+ const { wallets, select, connect, wallet } = useWallet();
12
+ const { setVisible } = useWalletModal();
13
+ const [fadeIn, setFadeIn] = useState(false);
14
+ const [portal, setPortal] = useState(null);
15
+ const [installedWallets, otherWallets] = useMemo(() => {
16
+ const installed = [];
17
+ const notDetected = [];
18
+ const loadable = [];
19
+ for (const wallet of wallets) {
20
+ if (wallet.readyState === WalletReadyState.NotDetected) {
21
+ notDetected.push(wallet);
22
+ }
23
+ else if (wallet.readyState === WalletReadyState.Loadable) {
24
+ loadable.push(wallet);
25
+ }
26
+ else if (wallet.readyState === WalletReadyState.Installed) {
27
+ installed.push(wallet);
28
+ }
29
+ }
30
+ return [installed, [...loadable, ...notDetected]];
31
+ }, [wallets]);
32
+ const getStartedWallet = useMemo(() => {
33
+ return installedWallets.length
34
+ ? // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
35
+ installedWallets[0]
36
+ : wallets.find((wallet) => wallet.adapter.name === 'Miden Wallet') ||
37
+ // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
38
+ otherWallets[0];
39
+ }, [installedWallets, wallets, otherWallets]);
40
+ const otherInstalledWallets = useMemo(() => {
41
+ return installedWallets.filter((wallet) => wallet.adapter.name !== getStartedWallet.adapter.name);
42
+ }, [installedWallets, getStartedWallet]);
43
+ const hideModal = useCallback(() => {
44
+ setFadeIn(false);
45
+ setTimeout(() => setVisible(false), 150);
46
+ }, [setVisible]);
47
+ const handleClose = useCallback((event) => {
48
+ event.preventDefault();
49
+ hideModal();
50
+ }, [hideModal]);
51
+ const handleWalletClick = useCallback((event, walletName) => {
52
+ select(walletName);
53
+ handleClose(event);
54
+ }, [select, handleClose]);
55
+ const handleTabKey = useCallback((event) => {
56
+ const node = ref.current;
57
+ if (!node)
58
+ return;
59
+ // here we query all focusable elements
60
+ const focusableElements = node.querySelectorAll('button');
61
+ // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
62
+ const firstElement = focusableElements[0];
63
+ // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
64
+ const lastElement = focusableElements[focusableElements.length - 1];
65
+ if (event.shiftKey) {
66
+ // if going backward by pressing tab and firstElement is active, shift focus to last focusable element
67
+ if (document.activeElement === firstElement) {
68
+ lastElement.focus();
69
+ event.preventDefault();
70
+ }
71
+ }
72
+ else {
73
+ // if going forward by pressing tab and lastElement is active, shift focus to first focusable element
74
+ if (document.activeElement === lastElement) {
75
+ firstElement.focus();
76
+ event.preventDefault();
77
+ }
78
+ }
79
+ }, [ref]);
80
+ useLayoutEffect(() => {
81
+ const handleKeyDown = (event) => {
82
+ if (event.key === 'Escape') {
83
+ hideModal();
84
+ }
85
+ else if (event.key === 'Tab') {
86
+ handleTabKey(event);
87
+ }
88
+ };
89
+ // Get original overflow
90
+ const { overflow } = window.getComputedStyle(document.body);
91
+ // Hack to enable fade in animation after mount
92
+ setTimeout(() => setFadeIn(true), 0);
93
+ // Prevent scrolling on mount
94
+ document.body.style.overflow = 'hidden';
95
+ // Listen for keydown events
96
+ window.addEventListener('keydown', handleKeyDown, false);
97
+ return () => {
98
+ // Re-enable scrolling when component unmounts
99
+ document.body.style.overflow = overflow;
100
+ window.removeEventListener('keydown', handleKeyDown, false);
101
+ };
102
+ }, [hideModal, handleTabKey]);
103
+ useLayoutEffect(() => setPortal(document.querySelector(container)), [container]);
104
+ useLayoutEffect(() => {
105
+ if (wallet) {
106
+ connect(privateDataPermission || PrivateDataPermission.UponRequest, network || WalletAdapterNetwork.Testnet, allowedPrivateData ?? AllowedPrivateData.None).catch((e) => {
107
+ console.log({ e });
108
+ });
109
+ }
110
+ }, [wallet, privateDataPermission, network, allowedPrivateData, connect]);
111
+ return (portal &&
112
+ createPortal(_jsxs("div", { "aria-labelledby": "wallet-adapter-modal-title", "aria-modal": "true", className: `wallet-adapter-modal ${fadeIn && 'wallet-adapter-modal-fade-in'} ${className}`, ref: ref, role: "dialog", children: [_jsx("div", { className: "wallet-adapter-modal-container", children: _jsxs("div", { className: "wallet-adapter-modal-wrapper", children: [_jsxs("div", { className: "wallet-adapter-modal-title", children: ["Connect a Wallet", _jsx("button", { onClick: handleClose, className: "wallet-adapter-modal-button-close", children: _jsx("svg", { width: "14", height: "14", children: _jsx("path", { d: "M14 12.461 8.3 6.772l5.234-5.233L12.006 0 6.772 5.234 1.54 0 0 1.539l5.234 5.233L0 12.006l1.539 1.528L6.772 8.3l5.69 5.7L14 12.461z" }) }) })] }), installedWallets.length ? (_jsxs(_Fragment, { children: [_jsxs("div", { className: "wallet-adapter-modal-content", children: ["Connect your Miden Wallet and start exploring its powerful features now!", _jsx("hr", {})] }), _jsxs("ul", { className: "wallet-adapter-modal-list", children: [_jsx("span", { className: "wallet-adapter-modal-list-section-title", children: "Recommended" }), _jsx(WalletListItem, { handleClick: (event) => handleWalletClick(event, getStartedWallet.adapter.name), wallet: getStartedWallet }, getStartedWallet.adapter.name), (otherInstalledWallets.length > 0 ||
113
+ otherWallets.length > 0) && (_jsxs(_Fragment, { children: [_jsx("hr", {}), _jsx("span", { className: "wallet-adapter-modal-list-section-title", children: "Other wallets" }), otherInstalledWallets.map((wallet) => (_jsx(WalletListItem, { handleClick: (event) => handleWalletClick(event, wallet.adapter.name), wallet: wallet }, wallet.adapter.name))), otherWallets.map((wallet) => (_jsx(WalletListItem, { handleClick: (event) => handleWalletClick(event, wallet.adapter.name), wallet: wallet }, wallet.adapter.name)))] }))] })] })) : (_jsx(_Fragment, { children: _jsxs("div", { className: "wallet-adapter-modal-middle", children: [_jsx(DiscoverMidenMessage, {}), _jsxs("button", { type: "button", className: "wallet-adapter-modal-middle-button", onClick: (event) => handleWalletClick(event, getStartedWallet.adapter.name), children: ["Install Miden Wallet", _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "25", height: "24", viewBox: "0 0 25 24", fill: "none", children: _jsx("path", { d: "M10.1003 5L8.5 6.5745L13.6981 11.7L8.5 16.8255L10.1003 18.4L16.91 11.7L10.1003 5Z", fill: "white" }) })] })] }) }))] }) }), _jsx("div", { className: "wallet-adapter-modal-overlay", onMouseDown: handleClose })] }), portal));
114
+ };
115
+ //# sourceMappingURL=WalletModal.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"WalletModal.js","sourceRoot":"","sources":["../src/WalletModal.tsx"],"names":[],"mappings":"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"}
@@ -0,0 +1,3 @@
1
+ import type { FC } from 'react';
2
+ import type { ButtonProps } from './Button';
3
+ export declare const WalletModalButton: FC<ButtonProps>;
@@ -0,0 +1,15 @@
1
+ import { jsx as _jsx } from "react/jsx-runtime";
2
+ import { useCallback } from 'react';
3
+ import { Button } from './Button';
4
+ import { useWalletModal } from './useWalletModal';
5
+ export const WalletModalButton = ({ children = 'Select Wallet', onClick, ...props }) => {
6
+ const { visible, setVisible } = useWalletModal();
7
+ const handleClick = useCallback((event) => {
8
+ if (onClick)
9
+ onClick(event);
10
+ if (!event.defaultPrevented)
11
+ setVisible(!visible);
12
+ }, [onClick, setVisible, visible]);
13
+ return (_jsx(Button, { className: "wallet-adapter-button-trigger", onClick: handleClick, ...props, children: children }));
14
+ };
15
+ //# sourceMappingURL=WalletModalButton.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"WalletModalButton.js","sourceRoot":"","sources":["../src/WalletModalButton.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAEpC,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAElD,MAAM,CAAC,MAAM,iBAAiB,GAAoB,CAAC,EAAE,QAAQ,GAAG,eAAe,EAAE,OAAO,EAAE,GAAG,KAAK,EAAE,EAAE,EAAE;IACpG,MAAM,EAAE,OAAO,EAAE,UAAU,EAAE,GAAG,cAAc,EAAE,CAAC;IAEjD,MAAM,WAAW,GAAG,WAAW,CAC3B,CAAC,KAAoC,EAAE,EAAE;QACrC,IAAI,OAAO;YAAE,OAAO,CAAC,KAAK,CAAC,CAAC;QAC5B,IAAI,CAAC,KAAK,CAAC,gBAAgB;YAAE,UAAU,CAAC,CAAC,OAAO,CAAC,CAAC;IACtD,CAAC,EACD,CAAC,OAAO,EAAE,UAAU,EAAE,OAAO,CAAC,CACjC,CAAC;IAEF,OAAO,CACH,KAAC,MAAM,IAAC,SAAS,EAAC,+BAA+B,EAAC,OAAO,EAAE,WAAW,KAAM,KAAK,YAC5E,QAAQ,GACJ,CACZ,CAAC;AACN,CAAC,CAAC"}
@@ -0,0 +1,6 @@
1
+ import type { FC, ReactNode } from 'react';
2
+ import type { WalletModalProps } from './WalletModal';
3
+ export interface WalletModalProviderProps extends WalletModalProps {
4
+ children: ReactNode;
5
+ }
6
+ export declare const WalletModalProvider: FC<WalletModalProviderProps>;
@@ -0,0 +1,12 @@
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import { useState } from 'react';
3
+ import { WalletModalContext } from './useWalletModal';
4
+ import { WalletModal } from './WalletModal';
5
+ export const WalletModalProvider = ({ children, ...props }) => {
6
+ const [visible, setVisible] = useState(false);
7
+ return (_jsxs(WalletModalContext.Provider, { value: {
8
+ visible,
9
+ setVisible,
10
+ }, children: [children, visible && _jsx(WalletModal, { ...props })] }));
11
+ };
12
+ //# sourceMappingURL=WalletModalProvider.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"WalletModalProvider.js","sourceRoot":"","sources":["../src/WalletModalProvider.tsx"],"names":[],"mappings":";AACA,OAAc,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACxC,OAAO,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAC;AAEtD,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAM5C,MAAM,CAAC,MAAM,mBAAmB,GAAiC,CAAC,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,EAAE;IACxF,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAE9C,OAAO,CACH,MAAC,kBAAkB,CAAC,QAAQ,IACxB,KAAK,EAAE;YACH,OAAO;YACP,UAAU;SACb,aAEA,QAAQ,EACR,OAAO,IAAI,KAAC,WAAW,OAAK,KAAK,GAAI,IACZ,CACjC,CAAC;AACN,CAAC,CAAC"}
@@ -0,0 +1,3 @@
1
+ import type { FC } from 'react';
2
+ import type { ButtonProps } from './Button';
3
+ export declare const WalletMultiButton: FC<ButtonProps>;
@@ -0,0 +1,70 @@
1
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
+ import { useCallback, useEffect, useMemo, useRef, useState, } from 'react';
3
+ import { useWallet } from '@miden-sdk/miden-wallet-adapter-react';
4
+ import { Button } from './Button';
5
+ import { useWalletModal } from './useWalletModal';
6
+ import { WalletConnectButton } from './WalletConnectButton';
7
+ import { WalletIcon } from './WalletIcon';
8
+ import { WalletModalButton } from './WalletModalButton';
9
+ export const WalletMultiButton = ({ children, ...props }) => {
10
+ const { address, wallet, disconnect } = useWallet();
11
+ const { setVisible } = useWalletModal();
12
+ const [copied, setCopied] = useState(false);
13
+ const [active, setActive] = useState(false);
14
+ const ref = useRef(null);
15
+ const content = useMemo(() => {
16
+ if (children)
17
+ return children;
18
+ if (!wallet || !address)
19
+ return null;
20
+ const underscoreIndex = address.indexOf('_');
21
+ const frontPart = address.slice(0, 6);
22
+ const middlePart = address.slice(underscoreIndex - 4, underscoreIndex);
23
+ return `${frontPart}...${middlePart}`;
24
+ }, [children, wallet, address]);
25
+ const copyAddress = useCallback(async () => {
26
+ if (address) {
27
+ await navigator.clipboard.writeText(address);
28
+ setCopied(true);
29
+ setTimeout(() => setCopied(false), 400);
30
+ }
31
+ }, [address]);
32
+ const openDropdown = useCallback(() => {
33
+ setActive(true);
34
+ }, []);
35
+ const closeDropdown = useCallback(() => {
36
+ setActive(false);
37
+ }, []);
38
+ const openModal = useCallback(() => {
39
+ setVisible(true);
40
+ closeDropdown();
41
+ }, [setVisible, closeDropdown]);
42
+ useEffect(() => {
43
+ const listener = (event) => {
44
+ const node = ref.current;
45
+ // Do nothing if clicking dropdown or its descendants
46
+ if (!node || node.contains(event.target))
47
+ return;
48
+ closeDropdown();
49
+ };
50
+ document.addEventListener('mousedown', listener);
51
+ document.addEventListener('touchstart', listener);
52
+ return () => {
53
+ document.removeEventListener('mousedown', listener);
54
+ document.removeEventListener('touchstart', listener);
55
+ };
56
+ }, [ref, closeDropdown]);
57
+ if (!wallet)
58
+ return _jsx(WalletModalButton, { ...props, children: children });
59
+ if (!address)
60
+ return _jsx(WalletConnectButton, { ...props, children: children });
61
+ return (_jsxs("div", { className: "wallet-adapter-dropdown", children: [_jsx(Button, { "aria-expanded": active, className: "wallet-adapter-button-trigger", style: {
62
+ pointerEvents: active ? 'none' : 'auto',
63
+ width: '100%',
64
+ backgroundColor: '#FFFFFF',
65
+ border: '1px solid #D7D7D7',
66
+ color: 'black',
67
+ ...props.style
68
+ }, onClick: openDropdown, startIcon: _jsx(WalletIcon, { wallet: wallet }), ...props, children: content }), _jsxs("ul", { "aria-label": "dropdown-list", className: `wallet-adapter-dropdown-list ${active && 'wallet-adapter-dropdown-list-active'}`, ref: ref, role: "menu", children: [_jsx("li", { onClick: copyAddress, className: "wallet-adapter-dropdown-list-item", role: "menuitem", children: copied ? 'Copied' : 'Copy address' }), _jsx("li", { onClick: openModal, className: "wallet-adapter-dropdown-list-item", role: "menuitem", children: "Change wallet" }), _jsx("li", { onClick: disconnect, className: "wallet-adapter-dropdown-list-item", role: "menuitem", children: "Disconnect" })] })] }));
69
+ };
70
+ //# sourceMappingURL=WalletMultiButton.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"WalletMultiButton.js","sourceRoot":"","sources":["../src/WalletMultiButton.tsx"],"names":[],"mappings":"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"}
@@ -0,0 +1,8 @@
1
+ export * from './useWalletModal';
2
+ export * from './WalletConnectButton';
3
+ export * from './WalletModal';
4
+ export * from './WalletModalButton';
5
+ export * from './WalletModalProvider';
6
+ export * from './WalletDisconnectButton';
7
+ export * from './WalletIcon';
8
+ export * from './WalletMultiButton';
package/dist/index.js ADDED
@@ -0,0 +1,9 @@
1
+ export * from './useWalletModal';
2
+ export * from './WalletConnectButton';
3
+ export * from './WalletModal';
4
+ export * from './WalletModalButton';
5
+ export * from './WalletModalProvider';
6
+ export * from './WalletDisconnectButton';
7
+ export * from './WalletIcon';
8
+ export * from './WalletMultiButton';
9
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,kBAAkB,CAAC;AACjC,cAAc,uBAAuB,CAAC;AACtC,cAAc,eAAe,CAAC;AAC9B,cAAc,qBAAqB,CAAC;AACpC,cAAc,uBAAuB,CAAC;AACtC,cAAc,0BAA0B,CAAC;AACzC,cAAc,cAAc,CAAC;AAC7B,cAAc,qBAAqB,CAAC"}