@breadcoop/ui 1.0.23 → 1.0.25

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.
package/dist/index.d.mts CHANGED
@@ -1,11 +1,110 @@
1
1
  import * as react_jsx_runtime from 'react/jsx-runtime';
2
- import React from 'react';
2
+ import * as viem from 'viem';
3
+ import { Address, Abi, Hex, Chain } from 'viem';
4
+ import React$1, { AnchorHTMLAttributes, FC, ComponentType, ReactNode, ButtonHTMLAttributes } from 'react';
5
+ import * as _tanstack_query_core from '@tanstack/query-core';
6
+ import { UseEnsNameReturnType } from 'wagmi';
7
+ import { GetEnsNameReturnType } from '@wagmi/core';
8
+ import { Icon } from '@phosphor-icons/react';
9
+ import { ClassValue } from 'clsx';
3
10
 
4
- declare function Footer({ className, topClassName, infoClassName }: {
11
+ type App = "fund" | "stacks" | "net";
12
+
13
+ type AuthProvider = "privy" | "general";
14
+ type TokenConfig = {
15
+ BREAD: {
16
+ address: Address;
17
+ abi: Abi;
18
+ };
19
+ };
20
+ declare const BreadUIKitProvider: ({ isProd, tokenConfig, children, app, authProvider, }: {
21
+ isProd: boolean;
22
+ tokenConfig: TokenConfig;
23
+ app: App;
24
+ authProvider: AuthProvider;
25
+ children: React.ReactNode;
26
+ }) => react_jsx_runtime.JSX.Element;
27
+
28
+ type LinkProps = AnchorHTMLAttributes<HTMLAnchorElement> & {
29
+ href: string;
30
+ children?: React$1.ReactNode;
31
+ };
32
+ declare const useLinkComponent: () => React$1.ComponentType<LinkProps>;
33
+ declare const LinkProvider: FC<{
34
+ Link: ComponentType<LinkProps>;
35
+ children: ReactNode;
36
+ }>;
37
+
38
+ declare const useBreadBalance: ({ address }: {
39
+ address: Address;
40
+ }) => {
41
+ BREAD: string;
42
+ refetchBalance: (options?: _tanstack_query_core.RefetchOptions) => Promise<_tanstack_query_core.QueryObserverResult<bigint, viem.ReadContractErrorType>>;
43
+ isLoading: boolean;
44
+ };
45
+
46
+ interface UseCopyToClipboardPayload {
47
+ textToCopy: string;
48
+ }
49
+ declare const useCopyToClipboard: ({ textToCopy, }: UseCopyToClipboardPayload) => {
50
+ copied: boolean;
51
+ copy: () => Promise<void>;
52
+ };
53
+
54
+ interface LoginButtonPrivyProps {
55
+ app: App;
56
+ status: "CONNECTED" | "LOADING" | "UNSUPPORTED_CHAIN" | "NOT_CONNECTED";
57
+ label?: string;
58
+ rightIcon?: ReactNode;
59
+ isProd?: boolean;
60
+ }
61
+
62
+ declare const LoginButton: ({ label, isProd, ...props }: LoginButtonPrivyProps) => react_jsx_runtime.JSX.Element;
63
+
64
+ interface CopyButtonProps extends ButtonHTMLAttributes<HTMLButtonElement>, UseCopyToClipboardPayload {
65
+ checkedIconSize?: number;
66
+ }
67
+ declare const CopyButtonIcon: ({ children, textToCopy, checkedIconSize, ...buttonProps }: CopyButtonProps) => react_jsx_runtime.JSX.Element;
68
+
69
+ interface ChipProps {
70
+ size?: "small" | "regular";
71
+ children: ReactNode;
72
+ icon?: boolean;
73
+ className?: string;
74
+ }
75
+ declare const Chip: ({ size, icon, className, children, }: ChipProps) => react_jsx_runtime.JSX.Element;
76
+
77
+ type TUserLoading = {
78
+ status: "LOADING";
79
+ };
80
+ type TUserNotConnected = {
81
+ status: "NOT_CONNECTED";
82
+ };
83
+ type TUserConnected = {
84
+ status: "CONNECTED" | "UNSUPPORTED_CHAIN";
85
+ address: Hex;
86
+ chain: Chain;
87
+ };
88
+ type TConnectedUserState = TUserLoading | TUserNotConnected | TUserConnected;
89
+
90
+ declare const useConnectedUser: () => {
91
+ user: TConnectedUserState;
92
+ isSafe: boolean;
93
+ };
94
+
95
+ interface IConnectedUserProviderProps {
96
+ children: ReactNode;
97
+ isProd: boolean;
98
+ }
99
+ declare function ConnectedUserProvider({ isProd, children, }: IConnectedUserProviderProps): react_jsx_runtime.JSX.Element;
100
+
101
+ interface FooterProps {
5
102
  className?: string;
6
103
  topClassName?: string;
7
104
  infoClassName?: string;
8
- }): react_jsx_runtime.JSX.Element;
105
+ mode?: "colored" | "transparent";
106
+ }
107
+ declare function Footer({ className, topClassName, infoClassName, mode, }: FooterProps): react_jsx_runtime.JSX.Element;
9
108
 
10
109
  type LiftedButtonColors = {
11
110
  bg: string;
@@ -61,9 +160,9 @@ declare const LIFTED_BUTTON_PRESETS: {
61
160
  };
62
161
 
63
162
  type LiftedButtonProps = {
64
- children: React.ReactNode;
65
- leftIcon?: React.ReactNode;
66
- rightIcon?: React.ReactNode;
163
+ children: React$1.ReactNode;
164
+ leftIcon?: React$1.ReactNode;
165
+ rightIcon?: React$1.ReactNode;
67
166
  disabled?: boolean;
68
167
  preset?: LiftedButtonPreset;
69
168
  colorOverrides?: Partial<LiftedButtonColors>;
@@ -72,7 +171,7 @@ type LiftedButtonProps = {
72
171
  className?: string;
73
172
  width?: "full" | "auto" | "mobile-full";
74
173
  scrollTo?: string;
75
- } & React.ComponentPropsWithoutRef<"button">;
174
+ } & React$1.ComponentPropsWithoutRef<"button">;
76
175
  /**
77
176
  * LiftedButton — a square-edged button that floats up-left of a dark base layer.
78
177
  * - Preset: Choose "primary" (default), "secondary", "destructive", or "positive"
@@ -88,41 +187,53 @@ declare const fontVariables: {
88
187
  readonly breadDisplay: "--font-breadDisplay";
89
188
  readonly breadBody: "--font-breadBody";
90
189
  };
91
- declare const Typography: React.FC<{
190
+ declare const Typography: React$1.FC<{
92
191
  variant: "h1" | "h2" | "h3" | "h4" | "h5" | "body" | "caption";
93
- children: React.ReactNode;
192
+ children: React$1.ReactNode;
94
193
  className?: string;
95
194
  }>;
96
- declare const Heading1: React.FC<{
97
- children: React.ReactNode;
195
+ declare const Heading1: React$1.FC<{
196
+ children: React$1.ReactNode;
98
197
  className?: string;
99
198
  }>;
100
- declare const Heading2: React.FC<{
101
- children: React.ReactNode;
199
+ declare const Heading2: React$1.FC<{
200
+ children: React$1.ReactNode;
102
201
  className?: string;
103
202
  }>;
104
- declare const Heading3: React.FC<{
105
- children: React.ReactNode;
203
+ declare const Heading3: React$1.FC<{
204
+ children: React$1.ReactNode;
106
205
  className?: string;
107
206
  }>;
108
- declare const Heading4: React.FC<{
109
- children: React.ReactNode;
207
+ declare const Heading4: React$1.FC<{
208
+ children: React$1.ReactNode;
110
209
  className?: string;
111
210
  }>;
112
- declare const Heading5: React.FC<{
113
- children: React.ReactNode;
211
+ declare const Heading5: React$1.FC<{
212
+ children: React$1.ReactNode;
114
213
  className?: string;
115
214
  }>;
116
- declare const Body: React.FC<{
117
- children: React.ReactNode;
215
+ declare const Body: React$1.FC<{
216
+ children: React$1.ReactNode;
118
217
  className?: string;
119
218
  bold?: boolean;
120
219
  }>;
121
- declare const Caption: React.FC<{
122
- children: React.ReactNode;
220
+ declare const Caption: React$1.FC<{
221
+ children: React$1.ReactNode;
123
222
  className?: string;
124
223
  }>;
125
224
 
225
+ interface FormattedDecimalNumberProps {
226
+ value: number | string;
227
+ className?: string;
228
+ integralPartClassName?: string;
229
+ decimalPartClassName?: string;
230
+ withBreadIcon?: boolean;
231
+ breadIconClassName?: string;
232
+ breadSize?: number;
233
+ unit?: string;
234
+ }
235
+ declare function FormattedDecimalNumber({ value, className, integralPartClassName, decimalPartClassName, withBreadIcon, breadIconClassName, breadSize, unit, }: FormattedDecimalNumberProps): react_jsx_runtime.JSX.Element;
236
+
126
237
  type LogoColor = "orange" | "blue" | "jade" | "white";
127
238
  type LogoVariant = "square" | "line";
128
239
  type LogoProps = {
@@ -136,7 +247,7 @@ type LogoProps = {
136
247
  variant?: LogoVariant;
137
248
  /** Optional text to display next to the logo */
138
249
  text?: string;
139
- } & React.ComponentPropsWithoutRef<"svg">;
250
+ } & React$1.ComponentPropsWithoutRef<"svg">;
140
251
  /**
141
252
  * Logo component that renders the Bread UI Kit logo SVG.
142
253
  *
@@ -148,4 +259,48 @@ type LogoProps = {
148
259
  */
149
260
  declare function Logo({ size, className, color, variant, text, ...rest }: LogoProps): react_jsx_runtime.JSX.Element | undefined;
150
261
 
151
- export { Body, Caption, Footer, Heading1, Heading2, Heading3, Heading4, Heading5, LiftedButton, type LiftedButtonProps, Logo, type LogoColor, type LogoProps, type LogoVariant, Typography, fontVariables };
262
+ interface NavSolidarityAppsProps {
263
+ current?: App;
264
+ className?: string;
265
+ showTitle?: boolean;
266
+ showSelected?: boolean;
267
+ rearranged?: boolean;
268
+ }
269
+ declare const NavSolidarityApps: ({ current, className, showTitle, showSelected, rearranged, }: NavSolidarityAppsProps) => react_jsx_runtime.JSX.Element;
270
+ declare const NavSolidarityAppsDesktop: ({ label, app, }: {
271
+ app: App;
272
+ label: string;
273
+ }) => react_jsx_runtime.JSX.Element;
274
+
275
+ interface NavAccountDetailsProps {
276
+ userAddress: Address;
277
+ ensNameResult: UseEnsNameReturnType<GetEnsNameReturnType> | {
278
+ data: string | undefined;
279
+ isLoading: boolean;
280
+ isError: boolean;
281
+ };
282
+ className?: string;
283
+ app: App;
284
+ widgetItems?: ReactNode;
285
+ actionItems?: ReactNode;
286
+ }
287
+
288
+ interface NavbarProps extends Pick<NavAccountDetailsProps, "widgetItems" | "actionItems"> {
289
+ app: App;
290
+ children: ReactNode;
291
+ className?: string;
292
+ }
293
+ declare function Navbar({ app, children, className, widgetItems, actionItems }: NavbarProps): react_jsx_runtime.JSX.Element;
294
+
295
+ declare const NavAccountWidgetItem: ({ I, label, children, appIconColor, }: {
296
+ I: Icon;
297
+ appIconColor: string;
298
+ label: string;
299
+ children: ReactNode;
300
+ }) => react_jsx_runtime.JSX.Element;
301
+
302
+ declare function cn(...inputs: ClassValue[]): string;
303
+
304
+ declare function formatBalance(value: number, decimals?: number): string;
305
+
306
+ export { Body, BreadUIKitProvider, Caption, Chip, ConnectedUserProvider, CopyButtonIcon, Footer, FormattedDecimalNumber, Heading1, Heading2, Heading3, Heading4, Heading5, LiftedButton, type LiftedButtonProps, type LinkProps, LinkProvider, LoginButton, Logo, type LogoColor, type LogoProps, type LogoVariant, NavAccountWidgetItem, NavSolidarityApps, NavSolidarityAppsDesktop, Navbar, type TConnectedUserState, type TUserConnected, type TUserLoading, type TUserNotConnected, Typography, cn, fontVariables, formatBalance, useBreadBalance, useConnectedUser, useCopyToClipboard, useLinkComponent };
package/dist/index.d.ts CHANGED
@@ -1,11 +1,110 @@
1
1
  import * as react_jsx_runtime from 'react/jsx-runtime';
2
- import React from 'react';
2
+ import * as viem from 'viem';
3
+ import { Address, Abi, Hex, Chain } from 'viem';
4
+ import React$1, { AnchorHTMLAttributes, FC, ComponentType, ReactNode, ButtonHTMLAttributes } from 'react';
5
+ import * as _tanstack_query_core from '@tanstack/query-core';
6
+ import { UseEnsNameReturnType } from 'wagmi';
7
+ import { GetEnsNameReturnType } from '@wagmi/core';
8
+ import { Icon } from '@phosphor-icons/react';
9
+ import { ClassValue } from 'clsx';
3
10
 
4
- declare function Footer({ className, topClassName, infoClassName }: {
11
+ type App = "fund" | "stacks" | "net";
12
+
13
+ type AuthProvider = "privy" | "general";
14
+ type TokenConfig = {
15
+ BREAD: {
16
+ address: Address;
17
+ abi: Abi;
18
+ };
19
+ };
20
+ declare const BreadUIKitProvider: ({ isProd, tokenConfig, children, app, authProvider, }: {
21
+ isProd: boolean;
22
+ tokenConfig: TokenConfig;
23
+ app: App;
24
+ authProvider: AuthProvider;
25
+ children: React.ReactNode;
26
+ }) => react_jsx_runtime.JSX.Element;
27
+
28
+ type LinkProps = AnchorHTMLAttributes<HTMLAnchorElement> & {
29
+ href: string;
30
+ children?: React$1.ReactNode;
31
+ };
32
+ declare const useLinkComponent: () => React$1.ComponentType<LinkProps>;
33
+ declare const LinkProvider: FC<{
34
+ Link: ComponentType<LinkProps>;
35
+ children: ReactNode;
36
+ }>;
37
+
38
+ declare const useBreadBalance: ({ address }: {
39
+ address: Address;
40
+ }) => {
41
+ BREAD: string;
42
+ refetchBalance: (options?: _tanstack_query_core.RefetchOptions) => Promise<_tanstack_query_core.QueryObserverResult<bigint, viem.ReadContractErrorType>>;
43
+ isLoading: boolean;
44
+ };
45
+
46
+ interface UseCopyToClipboardPayload {
47
+ textToCopy: string;
48
+ }
49
+ declare const useCopyToClipboard: ({ textToCopy, }: UseCopyToClipboardPayload) => {
50
+ copied: boolean;
51
+ copy: () => Promise<void>;
52
+ };
53
+
54
+ interface LoginButtonPrivyProps {
55
+ app: App;
56
+ status: "CONNECTED" | "LOADING" | "UNSUPPORTED_CHAIN" | "NOT_CONNECTED";
57
+ label?: string;
58
+ rightIcon?: ReactNode;
59
+ isProd?: boolean;
60
+ }
61
+
62
+ declare const LoginButton: ({ label, isProd, ...props }: LoginButtonPrivyProps) => react_jsx_runtime.JSX.Element;
63
+
64
+ interface CopyButtonProps extends ButtonHTMLAttributes<HTMLButtonElement>, UseCopyToClipboardPayload {
65
+ checkedIconSize?: number;
66
+ }
67
+ declare const CopyButtonIcon: ({ children, textToCopy, checkedIconSize, ...buttonProps }: CopyButtonProps) => react_jsx_runtime.JSX.Element;
68
+
69
+ interface ChipProps {
70
+ size?: "small" | "regular";
71
+ children: ReactNode;
72
+ icon?: boolean;
73
+ className?: string;
74
+ }
75
+ declare const Chip: ({ size, icon, className, children, }: ChipProps) => react_jsx_runtime.JSX.Element;
76
+
77
+ type TUserLoading = {
78
+ status: "LOADING";
79
+ };
80
+ type TUserNotConnected = {
81
+ status: "NOT_CONNECTED";
82
+ };
83
+ type TUserConnected = {
84
+ status: "CONNECTED" | "UNSUPPORTED_CHAIN";
85
+ address: Hex;
86
+ chain: Chain;
87
+ };
88
+ type TConnectedUserState = TUserLoading | TUserNotConnected | TUserConnected;
89
+
90
+ declare const useConnectedUser: () => {
91
+ user: TConnectedUserState;
92
+ isSafe: boolean;
93
+ };
94
+
95
+ interface IConnectedUserProviderProps {
96
+ children: ReactNode;
97
+ isProd: boolean;
98
+ }
99
+ declare function ConnectedUserProvider({ isProd, children, }: IConnectedUserProviderProps): react_jsx_runtime.JSX.Element;
100
+
101
+ interface FooterProps {
5
102
  className?: string;
6
103
  topClassName?: string;
7
104
  infoClassName?: string;
8
- }): react_jsx_runtime.JSX.Element;
105
+ mode?: "colored" | "transparent";
106
+ }
107
+ declare function Footer({ className, topClassName, infoClassName, mode, }: FooterProps): react_jsx_runtime.JSX.Element;
9
108
 
10
109
  type LiftedButtonColors = {
11
110
  bg: string;
@@ -61,9 +160,9 @@ declare const LIFTED_BUTTON_PRESETS: {
61
160
  };
62
161
 
63
162
  type LiftedButtonProps = {
64
- children: React.ReactNode;
65
- leftIcon?: React.ReactNode;
66
- rightIcon?: React.ReactNode;
163
+ children: React$1.ReactNode;
164
+ leftIcon?: React$1.ReactNode;
165
+ rightIcon?: React$1.ReactNode;
67
166
  disabled?: boolean;
68
167
  preset?: LiftedButtonPreset;
69
168
  colorOverrides?: Partial<LiftedButtonColors>;
@@ -72,7 +171,7 @@ type LiftedButtonProps = {
72
171
  className?: string;
73
172
  width?: "full" | "auto" | "mobile-full";
74
173
  scrollTo?: string;
75
- } & React.ComponentPropsWithoutRef<"button">;
174
+ } & React$1.ComponentPropsWithoutRef<"button">;
76
175
  /**
77
176
  * LiftedButton — a square-edged button that floats up-left of a dark base layer.
78
177
  * - Preset: Choose "primary" (default), "secondary", "destructive", or "positive"
@@ -88,41 +187,53 @@ declare const fontVariables: {
88
187
  readonly breadDisplay: "--font-breadDisplay";
89
188
  readonly breadBody: "--font-breadBody";
90
189
  };
91
- declare const Typography: React.FC<{
190
+ declare const Typography: React$1.FC<{
92
191
  variant: "h1" | "h2" | "h3" | "h4" | "h5" | "body" | "caption";
93
- children: React.ReactNode;
192
+ children: React$1.ReactNode;
94
193
  className?: string;
95
194
  }>;
96
- declare const Heading1: React.FC<{
97
- children: React.ReactNode;
195
+ declare const Heading1: React$1.FC<{
196
+ children: React$1.ReactNode;
98
197
  className?: string;
99
198
  }>;
100
- declare const Heading2: React.FC<{
101
- children: React.ReactNode;
199
+ declare const Heading2: React$1.FC<{
200
+ children: React$1.ReactNode;
102
201
  className?: string;
103
202
  }>;
104
- declare const Heading3: React.FC<{
105
- children: React.ReactNode;
203
+ declare const Heading3: React$1.FC<{
204
+ children: React$1.ReactNode;
106
205
  className?: string;
107
206
  }>;
108
- declare const Heading4: React.FC<{
109
- children: React.ReactNode;
207
+ declare const Heading4: React$1.FC<{
208
+ children: React$1.ReactNode;
110
209
  className?: string;
111
210
  }>;
112
- declare const Heading5: React.FC<{
113
- children: React.ReactNode;
211
+ declare const Heading5: React$1.FC<{
212
+ children: React$1.ReactNode;
114
213
  className?: string;
115
214
  }>;
116
- declare const Body: React.FC<{
117
- children: React.ReactNode;
215
+ declare const Body: React$1.FC<{
216
+ children: React$1.ReactNode;
118
217
  className?: string;
119
218
  bold?: boolean;
120
219
  }>;
121
- declare const Caption: React.FC<{
122
- children: React.ReactNode;
220
+ declare const Caption: React$1.FC<{
221
+ children: React$1.ReactNode;
123
222
  className?: string;
124
223
  }>;
125
224
 
225
+ interface FormattedDecimalNumberProps {
226
+ value: number | string;
227
+ className?: string;
228
+ integralPartClassName?: string;
229
+ decimalPartClassName?: string;
230
+ withBreadIcon?: boolean;
231
+ breadIconClassName?: string;
232
+ breadSize?: number;
233
+ unit?: string;
234
+ }
235
+ declare function FormattedDecimalNumber({ value, className, integralPartClassName, decimalPartClassName, withBreadIcon, breadIconClassName, breadSize, unit, }: FormattedDecimalNumberProps): react_jsx_runtime.JSX.Element;
236
+
126
237
  type LogoColor = "orange" | "blue" | "jade" | "white";
127
238
  type LogoVariant = "square" | "line";
128
239
  type LogoProps = {
@@ -136,7 +247,7 @@ type LogoProps = {
136
247
  variant?: LogoVariant;
137
248
  /** Optional text to display next to the logo */
138
249
  text?: string;
139
- } & React.ComponentPropsWithoutRef<"svg">;
250
+ } & React$1.ComponentPropsWithoutRef<"svg">;
140
251
  /**
141
252
  * Logo component that renders the Bread UI Kit logo SVG.
142
253
  *
@@ -148,4 +259,48 @@ type LogoProps = {
148
259
  */
149
260
  declare function Logo({ size, className, color, variant, text, ...rest }: LogoProps): react_jsx_runtime.JSX.Element | undefined;
150
261
 
151
- export { Body, Caption, Footer, Heading1, Heading2, Heading3, Heading4, Heading5, LiftedButton, type LiftedButtonProps, Logo, type LogoColor, type LogoProps, type LogoVariant, Typography, fontVariables };
262
+ interface NavSolidarityAppsProps {
263
+ current?: App;
264
+ className?: string;
265
+ showTitle?: boolean;
266
+ showSelected?: boolean;
267
+ rearranged?: boolean;
268
+ }
269
+ declare const NavSolidarityApps: ({ current, className, showTitle, showSelected, rearranged, }: NavSolidarityAppsProps) => react_jsx_runtime.JSX.Element;
270
+ declare const NavSolidarityAppsDesktop: ({ label, app, }: {
271
+ app: App;
272
+ label: string;
273
+ }) => react_jsx_runtime.JSX.Element;
274
+
275
+ interface NavAccountDetailsProps {
276
+ userAddress: Address;
277
+ ensNameResult: UseEnsNameReturnType<GetEnsNameReturnType> | {
278
+ data: string | undefined;
279
+ isLoading: boolean;
280
+ isError: boolean;
281
+ };
282
+ className?: string;
283
+ app: App;
284
+ widgetItems?: ReactNode;
285
+ actionItems?: ReactNode;
286
+ }
287
+
288
+ interface NavbarProps extends Pick<NavAccountDetailsProps, "widgetItems" | "actionItems"> {
289
+ app: App;
290
+ children: ReactNode;
291
+ className?: string;
292
+ }
293
+ declare function Navbar({ app, children, className, widgetItems, actionItems }: NavbarProps): react_jsx_runtime.JSX.Element;
294
+
295
+ declare const NavAccountWidgetItem: ({ I, label, children, appIconColor, }: {
296
+ I: Icon;
297
+ appIconColor: string;
298
+ label: string;
299
+ children: ReactNode;
300
+ }) => react_jsx_runtime.JSX.Element;
301
+
302
+ declare function cn(...inputs: ClassValue[]): string;
303
+
304
+ declare function formatBalance(value: number, decimals?: number): string;
305
+
306
+ export { Body, BreadUIKitProvider, Caption, Chip, ConnectedUserProvider, CopyButtonIcon, Footer, FormattedDecimalNumber, Heading1, Heading2, Heading3, Heading4, Heading5, LiftedButton, type LiftedButtonProps, type LinkProps, LinkProvider, LoginButton, Logo, type LogoColor, type LogoProps, type LogoVariant, NavAccountWidgetItem, NavSolidarityApps, NavSolidarityAppsDesktop, Navbar, type TConnectedUserState, type TUserConnected, type TUserLoading, type TUserNotConnected, Typography, cn, fontVariables, formatBalance, useBreadBalance, useConnectedUser, useCopyToClipboard, useLinkComponent };