@breadcoop/ui 1.0.23 → 1.0.28

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,108 @@
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: ({ chainId, tokenConfig, children, app, authProvider, }: {
21
+ chainId: number;
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
+ }
60
+
61
+ declare const LoginButton: ({ label, ...props }: LoginButtonPrivyProps) => react_jsx_runtime.JSX.Element;
62
+
63
+ interface CopyButtonProps extends ButtonHTMLAttributes<HTMLButtonElement>, UseCopyToClipboardPayload {
64
+ checkedIconSize?: number;
65
+ }
66
+ declare const CopyButtonIcon: ({ children, textToCopy, checkedIconSize, ...buttonProps }: CopyButtonProps) => react_jsx_runtime.JSX.Element;
67
+
68
+ interface ChipProps {
69
+ size?: "small" | "regular";
70
+ children: ReactNode;
71
+ icon?: boolean;
72
+ className?: string;
73
+ }
74
+ declare const Chip: ({ size, icon, className, children, }: ChipProps) => react_jsx_runtime.JSX.Element;
75
+
76
+ type TUserLoading = {
77
+ status: "LOADING";
78
+ };
79
+ type TUserNotConnected = {
80
+ status: "NOT_CONNECTED";
81
+ };
82
+ type TUserConnected = {
83
+ status: "CONNECTED" | "UNSUPPORTED_CHAIN";
84
+ address: Hex;
85
+ chain: Chain;
86
+ };
87
+ type TConnectedUserState = TUserLoading | TUserNotConnected | TUserConnected;
88
+
89
+ declare const useConnectedUser: () => {
90
+ user: TConnectedUserState;
91
+ isSafe: boolean;
92
+ };
93
+
94
+ interface IConnectedUserProviderProps {
95
+ children: ReactNode;
96
+ }
97
+ declare function ConnectedUserProvider({ children }: IConnectedUserProviderProps): react_jsx_runtime.JSX.Element;
98
+
99
+ interface FooterProps {
5
100
  className?: string;
6
101
  topClassName?: string;
7
102
  infoClassName?: string;
8
- }): react_jsx_runtime.JSX.Element;
103
+ mode?: "colored" | "transparent";
104
+ }
105
+ declare function Footer({ className, topClassName, infoClassName, mode, }: FooterProps): react_jsx_runtime.JSX.Element;
9
106
 
10
107
  type LiftedButtonColors = {
11
108
  bg: string;
@@ -61,9 +158,9 @@ declare const LIFTED_BUTTON_PRESETS: {
61
158
  };
62
159
 
63
160
  type LiftedButtonProps = {
64
- children: React.ReactNode;
65
- leftIcon?: React.ReactNode;
66
- rightIcon?: React.ReactNode;
161
+ children: React$1.ReactNode;
162
+ leftIcon?: React$1.ReactNode;
163
+ rightIcon?: React$1.ReactNode;
67
164
  disabled?: boolean;
68
165
  preset?: LiftedButtonPreset;
69
166
  colorOverrides?: Partial<LiftedButtonColors>;
@@ -72,7 +169,7 @@ type LiftedButtonProps = {
72
169
  className?: string;
73
170
  width?: "full" | "auto" | "mobile-full";
74
171
  scrollTo?: string;
75
- } & React.ComponentPropsWithoutRef<"button">;
172
+ } & React$1.ComponentPropsWithoutRef<"button">;
76
173
  /**
77
174
  * LiftedButton — a square-edged button that floats up-left of a dark base layer.
78
175
  * - Preset: Choose "primary" (default), "secondary", "destructive", or "positive"
@@ -88,41 +185,53 @@ declare const fontVariables: {
88
185
  readonly breadDisplay: "--font-breadDisplay";
89
186
  readonly breadBody: "--font-breadBody";
90
187
  };
91
- declare const Typography: React.FC<{
188
+ declare const Typography: React$1.FC<{
92
189
  variant: "h1" | "h2" | "h3" | "h4" | "h5" | "body" | "caption";
93
- children: React.ReactNode;
190
+ children: React$1.ReactNode;
94
191
  className?: string;
95
192
  }>;
96
- declare const Heading1: React.FC<{
97
- children: React.ReactNode;
193
+ declare const Heading1: React$1.FC<{
194
+ children: React$1.ReactNode;
98
195
  className?: string;
99
196
  }>;
100
- declare const Heading2: React.FC<{
101
- children: React.ReactNode;
197
+ declare const Heading2: React$1.FC<{
198
+ children: React$1.ReactNode;
102
199
  className?: string;
103
200
  }>;
104
- declare const Heading3: React.FC<{
105
- children: React.ReactNode;
201
+ declare const Heading3: React$1.FC<{
202
+ children: React$1.ReactNode;
106
203
  className?: string;
107
204
  }>;
108
- declare const Heading4: React.FC<{
109
- children: React.ReactNode;
205
+ declare const Heading4: React$1.FC<{
206
+ children: React$1.ReactNode;
110
207
  className?: string;
111
208
  }>;
112
- declare const Heading5: React.FC<{
113
- children: React.ReactNode;
209
+ declare const Heading5: React$1.FC<{
210
+ children: React$1.ReactNode;
114
211
  className?: string;
115
212
  }>;
116
- declare const Body: React.FC<{
117
- children: React.ReactNode;
213
+ declare const Body: React$1.FC<{
214
+ children: React$1.ReactNode;
118
215
  className?: string;
119
216
  bold?: boolean;
120
217
  }>;
121
- declare const Caption: React.FC<{
122
- children: React.ReactNode;
218
+ declare const Caption: React$1.FC<{
219
+ children: React$1.ReactNode;
123
220
  className?: string;
124
221
  }>;
125
222
 
223
+ interface FormattedDecimalNumberProps {
224
+ value: number | string;
225
+ className?: string;
226
+ integralPartClassName?: string;
227
+ decimalPartClassName?: string;
228
+ withBreadIcon?: boolean;
229
+ breadIconClassName?: string;
230
+ breadSize?: number;
231
+ unit?: string;
232
+ }
233
+ declare function FormattedDecimalNumber({ value, className, integralPartClassName, decimalPartClassName, withBreadIcon, breadIconClassName, breadSize, unit, }: FormattedDecimalNumberProps): react_jsx_runtime.JSX.Element;
234
+
126
235
  type LogoColor = "orange" | "blue" | "jade" | "white";
127
236
  type LogoVariant = "square" | "line";
128
237
  type LogoProps = {
@@ -136,7 +245,7 @@ type LogoProps = {
136
245
  variant?: LogoVariant;
137
246
  /** Optional text to display next to the logo */
138
247
  text?: string;
139
- } & React.ComponentPropsWithoutRef<"svg">;
248
+ } & React$1.ComponentPropsWithoutRef<"svg">;
140
249
  /**
141
250
  * Logo component that renders the Bread UI Kit logo SVG.
142
251
  *
@@ -148,4 +257,48 @@ type LogoProps = {
148
257
  */
149
258
  declare function Logo({ size, className, color, variant, text, ...rest }: LogoProps): react_jsx_runtime.JSX.Element | undefined;
150
259
 
151
- export { Body, Caption, Footer, Heading1, Heading2, Heading3, Heading4, Heading5, LiftedButton, type LiftedButtonProps, Logo, type LogoColor, type LogoProps, type LogoVariant, Typography, fontVariables };
260
+ interface NavSolidarityAppsProps {
261
+ current?: App;
262
+ className?: string;
263
+ showTitle?: boolean;
264
+ showSelected?: boolean;
265
+ rearranged?: boolean;
266
+ }
267
+ declare const NavSolidarityApps: ({ current, className, showTitle, showSelected, rearranged, }: NavSolidarityAppsProps) => react_jsx_runtime.JSX.Element;
268
+ declare const NavSolidarityAppsDesktop: ({ label, app, }: {
269
+ app: App;
270
+ label: string;
271
+ }) => react_jsx_runtime.JSX.Element;
272
+
273
+ interface NavAccountDetailsProps {
274
+ userAddress: Address;
275
+ ensNameResult: UseEnsNameReturnType<GetEnsNameReturnType> | {
276
+ data: string | undefined;
277
+ isLoading: boolean;
278
+ isError: boolean;
279
+ };
280
+ className?: string;
281
+ app: App;
282
+ widgetItems?: ReactNode;
283
+ actionItems?: ReactNode;
284
+ }
285
+
286
+ interface NavbarProps extends Pick<NavAccountDetailsProps, "widgetItems" | "actionItems"> {
287
+ app: App;
288
+ children: ReactNode;
289
+ className?: string;
290
+ }
291
+ declare function Navbar({ app, children, className, widgetItems, actionItems }: NavbarProps): react_jsx_runtime.JSX.Element;
292
+
293
+ declare const NavAccountWidgetItem: ({ I, label, children, appIconColor, }: {
294
+ I: Icon;
295
+ appIconColor: string;
296
+ label: string;
297
+ children: ReactNode;
298
+ }) => react_jsx_runtime.JSX.Element;
299
+
300
+ declare function cn(...inputs: ClassValue[]): string;
301
+
302
+ declare function formatBalance(value: number, decimals?: number): string;
303
+
304
+ 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,108 @@
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: ({ chainId, tokenConfig, children, app, authProvider, }: {
21
+ chainId: number;
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
+ }
60
+
61
+ declare const LoginButton: ({ label, ...props }: LoginButtonPrivyProps) => react_jsx_runtime.JSX.Element;
62
+
63
+ interface CopyButtonProps extends ButtonHTMLAttributes<HTMLButtonElement>, UseCopyToClipboardPayload {
64
+ checkedIconSize?: number;
65
+ }
66
+ declare const CopyButtonIcon: ({ children, textToCopy, checkedIconSize, ...buttonProps }: CopyButtonProps) => react_jsx_runtime.JSX.Element;
67
+
68
+ interface ChipProps {
69
+ size?: "small" | "regular";
70
+ children: ReactNode;
71
+ icon?: boolean;
72
+ className?: string;
73
+ }
74
+ declare const Chip: ({ size, icon, className, children, }: ChipProps) => react_jsx_runtime.JSX.Element;
75
+
76
+ type TUserLoading = {
77
+ status: "LOADING";
78
+ };
79
+ type TUserNotConnected = {
80
+ status: "NOT_CONNECTED";
81
+ };
82
+ type TUserConnected = {
83
+ status: "CONNECTED" | "UNSUPPORTED_CHAIN";
84
+ address: Hex;
85
+ chain: Chain;
86
+ };
87
+ type TConnectedUserState = TUserLoading | TUserNotConnected | TUserConnected;
88
+
89
+ declare const useConnectedUser: () => {
90
+ user: TConnectedUserState;
91
+ isSafe: boolean;
92
+ };
93
+
94
+ interface IConnectedUserProviderProps {
95
+ children: ReactNode;
96
+ }
97
+ declare function ConnectedUserProvider({ children }: IConnectedUserProviderProps): react_jsx_runtime.JSX.Element;
98
+
99
+ interface FooterProps {
5
100
  className?: string;
6
101
  topClassName?: string;
7
102
  infoClassName?: string;
8
- }): react_jsx_runtime.JSX.Element;
103
+ mode?: "colored" | "transparent";
104
+ }
105
+ declare function Footer({ className, topClassName, infoClassName, mode, }: FooterProps): react_jsx_runtime.JSX.Element;
9
106
 
10
107
  type LiftedButtonColors = {
11
108
  bg: string;
@@ -61,9 +158,9 @@ declare const LIFTED_BUTTON_PRESETS: {
61
158
  };
62
159
 
63
160
  type LiftedButtonProps = {
64
- children: React.ReactNode;
65
- leftIcon?: React.ReactNode;
66
- rightIcon?: React.ReactNode;
161
+ children: React$1.ReactNode;
162
+ leftIcon?: React$1.ReactNode;
163
+ rightIcon?: React$1.ReactNode;
67
164
  disabled?: boolean;
68
165
  preset?: LiftedButtonPreset;
69
166
  colorOverrides?: Partial<LiftedButtonColors>;
@@ -72,7 +169,7 @@ type LiftedButtonProps = {
72
169
  className?: string;
73
170
  width?: "full" | "auto" | "mobile-full";
74
171
  scrollTo?: string;
75
- } & React.ComponentPropsWithoutRef<"button">;
172
+ } & React$1.ComponentPropsWithoutRef<"button">;
76
173
  /**
77
174
  * LiftedButton — a square-edged button that floats up-left of a dark base layer.
78
175
  * - Preset: Choose "primary" (default), "secondary", "destructive", or "positive"
@@ -88,41 +185,53 @@ declare const fontVariables: {
88
185
  readonly breadDisplay: "--font-breadDisplay";
89
186
  readonly breadBody: "--font-breadBody";
90
187
  };
91
- declare const Typography: React.FC<{
188
+ declare const Typography: React$1.FC<{
92
189
  variant: "h1" | "h2" | "h3" | "h4" | "h5" | "body" | "caption";
93
- children: React.ReactNode;
190
+ children: React$1.ReactNode;
94
191
  className?: string;
95
192
  }>;
96
- declare const Heading1: React.FC<{
97
- children: React.ReactNode;
193
+ declare const Heading1: React$1.FC<{
194
+ children: React$1.ReactNode;
98
195
  className?: string;
99
196
  }>;
100
- declare const Heading2: React.FC<{
101
- children: React.ReactNode;
197
+ declare const Heading2: React$1.FC<{
198
+ children: React$1.ReactNode;
102
199
  className?: string;
103
200
  }>;
104
- declare const Heading3: React.FC<{
105
- children: React.ReactNode;
201
+ declare const Heading3: React$1.FC<{
202
+ children: React$1.ReactNode;
106
203
  className?: string;
107
204
  }>;
108
- declare const Heading4: React.FC<{
109
- children: React.ReactNode;
205
+ declare const Heading4: React$1.FC<{
206
+ children: React$1.ReactNode;
110
207
  className?: string;
111
208
  }>;
112
- declare const Heading5: React.FC<{
113
- children: React.ReactNode;
209
+ declare const Heading5: React$1.FC<{
210
+ children: React$1.ReactNode;
114
211
  className?: string;
115
212
  }>;
116
- declare const Body: React.FC<{
117
- children: React.ReactNode;
213
+ declare const Body: React$1.FC<{
214
+ children: React$1.ReactNode;
118
215
  className?: string;
119
216
  bold?: boolean;
120
217
  }>;
121
- declare const Caption: React.FC<{
122
- children: React.ReactNode;
218
+ declare const Caption: React$1.FC<{
219
+ children: React$1.ReactNode;
123
220
  className?: string;
124
221
  }>;
125
222
 
223
+ interface FormattedDecimalNumberProps {
224
+ value: number | string;
225
+ className?: string;
226
+ integralPartClassName?: string;
227
+ decimalPartClassName?: string;
228
+ withBreadIcon?: boolean;
229
+ breadIconClassName?: string;
230
+ breadSize?: number;
231
+ unit?: string;
232
+ }
233
+ declare function FormattedDecimalNumber({ value, className, integralPartClassName, decimalPartClassName, withBreadIcon, breadIconClassName, breadSize, unit, }: FormattedDecimalNumberProps): react_jsx_runtime.JSX.Element;
234
+
126
235
  type LogoColor = "orange" | "blue" | "jade" | "white";
127
236
  type LogoVariant = "square" | "line";
128
237
  type LogoProps = {
@@ -136,7 +245,7 @@ type LogoProps = {
136
245
  variant?: LogoVariant;
137
246
  /** Optional text to display next to the logo */
138
247
  text?: string;
139
- } & React.ComponentPropsWithoutRef<"svg">;
248
+ } & React$1.ComponentPropsWithoutRef<"svg">;
140
249
  /**
141
250
  * Logo component that renders the Bread UI Kit logo SVG.
142
251
  *
@@ -148,4 +257,48 @@ type LogoProps = {
148
257
  */
149
258
  declare function Logo({ size, className, color, variant, text, ...rest }: LogoProps): react_jsx_runtime.JSX.Element | undefined;
150
259
 
151
- export { Body, Caption, Footer, Heading1, Heading2, Heading3, Heading4, Heading5, LiftedButton, type LiftedButtonProps, Logo, type LogoColor, type LogoProps, type LogoVariant, Typography, fontVariables };
260
+ interface NavSolidarityAppsProps {
261
+ current?: App;
262
+ className?: string;
263
+ showTitle?: boolean;
264
+ showSelected?: boolean;
265
+ rearranged?: boolean;
266
+ }
267
+ declare const NavSolidarityApps: ({ current, className, showTitle, showSelected, rearranged, }: NavSolidarityAppsProps) => react_jsx_runtime.JSX.Element;
268
+ declare const NavSolidarityAppsDesktop: ({ label, app, }: {
269
+ app: App;
270
+ label: string;
271
+ }) => react_jsx_runtime.JSX.Element;
272
+
273
+ interface NavAccountDetailsProps {
274
+ userAddress: Address;
275
+ ensNameResult: UseEnsNameReturnType<GetEnsNameReturnType> | {
276
+ data: string | undefined;
277
+ isLoading: boolean;
278
+ isError: boolean;
279
+ };
280
+ className?: string;
281
+ app: App;
282
+ widgetItems?: ReactNode;
283
+ actionItems?: ReactNode;
284
+ }
285
+
286
+ interface NavbarProps extends Pick<NavAccountDetailsProps, "widgetItems" | "actionItems"> {
287
+ app: App;
288
+ children: ReactNode;
289
+ className?: string;
290
+ }
291
+ declare function Navbar({ app, children, className, widgetItems, actionItems }: NavbarProps): react_jsx_runtime.JSX.Element;
292
+
293
+ declare const NavAccountWidgetItem: ({ I, label, children, appIconColor, }: {
294
+ I: Icon;
295
+ appIconColor: string;
296
+ label: string;
297
+ children: ReactNode;
298
+ }) => react_jsx_runtime.JSX.Element;
299
+
300
+ declare function cn(...inputs: ClassValue[]): string;
301
+
302
+ declare function formatBalance(value: number, decimals?: number): string;
303
+
304
+ 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 };