@orderly.network/ui-scaffold 2.8.1 → 2.8.2
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 +147 -159
- package/dist/index.d.ts +147 -159
- package/dist/index.js +5932 -13
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +5909 -14
- package/dist/index.mjs.map +1 -1
- package/dist/styles.css +1 -1
- package/package.json +11 -10
package/dist/index.d.mts
CHANGED
|
@@ -2,10 +2,11 @@ import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
|
2
2
|
import * as react from 'react';
|
|
3
3
|
import react__default, { ReactNode, HTMLAttributeAnchorTarget, FC, PropsWithChildren } from 'react';
|
|
4
4
|
import * as _orderly_network_types from '@orderly.network/types';
|
|
5
|
-
import { NetworkId, API } from '@orderly.network/types';
|
|
5
|
+
import { RouterAdapter, NetworkId, API } from '@orderly.network/types';
|
|
6
6
|
import { WsNetworkStatus } from '@orderly.network/hooks';
|
|
7
7
|
import * as _orderly_network_i18n from '@orderly.network/i18n';
|
|
8
8
|
import { LocaleContextState } from '@orderly.network/i18n';
|
|
9
|
+
import { useAnnouncement } from '@orderly.network/ui-notification';
|
|
9
10
|
|
|
10
11
|
declare const AccountMenuWidget: () => react_jsx_runtime.JSX.Element;
|
|
11
12
|
|
|
@@ -36,6 +37,11 @@ type LeftNavItem = {
|
|
|
36
37
|
* @default false
|
|
37
38
|
**/
|
|
38
39
|
onlyInMainAccount?: boolean;
|
|
40
|
+
/**
|
|
41
|
+
* Optional secondary style; secondary items render smaller and gray.
|
|
42
|
+
* Secondary items are grouped below primary items with a divider in between.
|
|
43
|
+
*/
|
|
44
|
+
isSecondary?: boolean;
|
|
39
45
|
};
|
|
40
46
|
|
|
41
47
|
type MainNavItem = {
|
|
@@ -72,6 +78,12 @@ type MainNavItem = {
|
|
|
72
78
|
href: string;
|
|
73
79
|
isActive?: boolean;
|
|
74
80
|
}) => react__default.ReactNode;
|
|
81
|
+
/**
|
|
82
|
+
* Custom submenu renderer - provides full control over submenu content
|
|
83
|
+
* Renders as a free-form component without any predefined structure
|
|
84
|
+
* @returns React node to render as submenu content
|
|
85
|
+
*/
|
|
86
|
+
customSubMenuRender?: () => react__default.ReactNode;
|
|
75
87
|
/**
|
|
76
88
|
* if true, this item will only be shown in the main account
|
|
77
89
|
* @default false
|
|
@@ -95,144 +107,15 @@ type MainNavClassNames = {
|
|
|
95
107
|
subMenu?: string;
|
|
96
108
|
};
|
|
97
109
|
|
|
98
|
-
declare const
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
activeIcon: ReactNode;
|
|
104
|
-
inactiveIcon: ReactNode;
|
|
105
|
-
};
|
|
106
|
-
type BottomNavProps$1 = {
|
|
107
|
-
mainMenus?: BottomNavItem[];
|
|
108
|
-
current?: string;
|
|
109
|
-
onRouteChange?: RouterAdapter["onRouteChange"];
|
|
110
|
-
};
|
|
111
|
-
declare const BottomNavWidget: react__default.FC<BottomNavProps$1>;
|
|
112
|
-
|
|
113
|
-
type FooterReturns = {
|
|
114
|
-
wsStatus: WsNetworkStatus;
|
|
115
|
-
};
|
|
116
|
-
|
|
117
|
-
type FooterProps = {
|
|
118
|
-
telegramUrl?: string;
|
|
119
|
-
twitterUrl?: string;
|
|
120
|
-
discordUrl?: string;
|
|
121
|
-
trailing?: ReactNode;
|
|
122
|
-
};
|
|
123
|
-
declare const FooterWidget: react__default.FC<FooterProps>;
|
|
124
|
-
|
|
125
|
-
declare const Footer: FC<FooterReturns & FooterProps>;
|
|
126
|
-
|
|
127
|
-
type SideMenuItem = {
|
|
128
|
-
name: string;
|
|
129
|
-
icon?: react__default.ReactNode;
|
|
130
|
-
href?: string;
|
|
131
|
-
disabled?: boolean;
|
|
132
|
-
onClick?: () => void;
|
|
133
|
-
hide?: boolean;
|
|
134
|
-
};
|
|
135
|
-
type SideBarProps = {
|
|
136
|
-
title?: react__default.ReactNode;
|
|
137
|
-
items?: SideMenuItem[];
|
|
138
|
-
open?: boolean;
|
|
139
|
-
onOpenChange?: (open: boolean) => void;
|
|
140
|
-
onItemSelect?: (item: SideMenuItem) => void;
|
|
141
|
-
current?: string;
|
|
142
|
-
className?: string;
|
|
143
|
-
maxWidth?: number;
|
|
144
|
-
minWidth?: number;
|
|
145
|
-
style?: react__default.CSSProperties;
|
|
146
|
-
};
|
|
147
|
-
declare const SideBar: react__default.FC<SideBarProps>;
|
|
148
|
-
|
|
149
|
-
declare const SideNavbarWidget: react__default.FC<Partial<SideBarProps>>;
|
|
150
|
-
|
|
151
|
-
type RouteOption = {
|
|
152
|
-
href: string;
|
|
153
|
-
name: string;
|
|
154
|
-
scope?: string;
|
|
155
|
-
target?: string;
|
|
156
|
-
};
|
|
157
|
-
type RouterAdapter = {
|
|
158
|
-
onRouteChange: (option: RouteOption) => void;
|
|
159
|
-
currentPath?: string;
|
|
160
|
-
};
|
|
161
|
-
type ScaffoldState = {
|
|
162
|
-
routerAdapter?: RouterAdapter;
|
|
163
|
-
expanded?: boolean;
|
|
164
|
-
setExpand: (expand: boolean) => void;
|
|
165
|
-
checkChainSupport: (chainId: number | string) => boolean;
|
|
166
|
-
topNavbarHeight: number;
|
|
167
|
-
footerHeight: number;
|
|
168
|
-
announcementHeight: number;
|
|
169
|
-
};
|
|
170
|
-
declare const ScaffoldContext: react.Context<ScaffoldState>;
|
|
171
|
-
declare const useScaffoldContext: () => ScaffoldState;
|
|
172
|
-
|
|
173
|
-
type ScaffoldProps = {
|
|
174
|
-
/**
|
|
175
|
-
* custom left sidebar component, only works on desktop
|
|
176
|
-
* if provided, the layout will use this component over the default sidebar component
|
|
177
|
-
*/
|
|
178
|
-
leftSidebar?: ReactNode;
|
|
179
|
-
/**
|
|
180
|
-
* custom left sidebar props, only works on desktop
|
|
181
|
-
*/
|
|
182
|
-
leftSideProps?: SideBarProps;
|
|
183
|
-
/**
|
|
184
|
-
* custom left nav props, only works on mobile
|
|
185
|
-
*/
|
|
186
|
-
leftNavProps?: LeftNavProps;
|
|
187
|
-
/**
|
|
188
|
-
* custom top bar component
|
|
189
|
-
*/
|
|
190
|
-
topBar?: ReactNode;
|
|
191
|
-
/**
|
|
192
|
-
* custom top nav props
|
|
193
|
-
*/
|
|
194
|
-
mainNavProps?: MainNavWidgetProps;
|
|
195
|
-
/**
|
|
196
|
-
* custom bottom nav component, only works on mobile
|
|
197
|
-
*/
|
|
198
|
-
bottomNav?: ReactNode;
|
|
199
|
-
/**
|
|
200
|
-
* custom bottom nav component, only works on mobile
|
|
201
|
-
*/
|
|
202
|
-
bottomNavProps?: BottomNavProps$1;
|
|
203
|
-
/**
|
|
204
|
-
* custom footer component, only works on desktop
|
|
205
|
-
*/
|
|
206
|
-
footer?: ReactNode;
|
|
207
|
-
/**
|
|
208
|
-
* custom footer props, only works on desktop
|
|
209
|
-
*/
|
|
210
|
-
footerProps?: FooterProps;
|
|
211
|
-
routerAdapter?: RouterAdapter;
|
|
212
|
-
classNames?: {
|
|
213
|
-
root?: string;
|
|
214
|
-
container?: string;
|
|
215
|
-
content?: string;
|
|
216
|
-
body?: string;
|
|
217
|
-
leftSidebar?: string;
|
|
218
|
-
topNavbar?: string;
|
|
219
|
-
footer?: string;
|
|
220
|
-
bottomNav?: string;
|
|
221
|
-
};
|
|
222
|
-
};
|
|
223
|
-
declare const Scaffold: react__default.FC<PropsWithChildren<ScaffoldProps>>;
|
|
224
|
-
|
|
225
|
-
type BottomNavProps = {
|
|
226
|
-
mainMenus?: BottomNavItem[];
|
|
227
|
-
current?: string | string[];
|
|
228
|
-
onRouteChange?: RouterAdapter["onRouteChange"];
|
|
110
|
+
declare const useLeftNavScript: () => {
|
|
111
|
+
open: boolean;
|
|
112
|
+
onOpenChange: react.Dispatch<react.SetStateAction<boolean>>;
|
|
113
|
+
showSheet: () => void;
|
|
114
|
+
hideSheet: () => void;
|
|
229
115
|
};
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
declare const useLeftNavState: () => {};
|
|
233
|
-
type LeftNavState = ReturnType<typeof useLeftNavState>;
|
|
116
|
+
type LeftNavScriptReturn = ReturnType<typeof useLeftNavScript>;
|
|
234
117
|
|
|
235
|
-
type LeftNavUIProps = LeftNavProps &
|
|
118
|
+
type LeftNavUIProps = LeftNavProps & Partial<LeftNavScriptReturn> & {
|
|
236
119
|
className?: string;
|
|
237
120
|
logo?: {
|
|
238
121
|
src: string;
|
|
@@ -243,6 +126,8 @@ type LeftNavUIProps = LeftNavProps & LeftNavState & {
|
|
|
243
126
|
};
|
|
244
127
|
declare const LeftNavUI: FC<LeftNavUIProps>;
|
|
245
128
|
|
|
129
|
+
declare const LeftNavWidget: FC<LeftNavUIProps>;
|
|
130
|
+
|
|
246
131
|
declare enum CampaignPositionEnum {
|
|
247
132
|
menuLeading = "menuLeading",
|
|
248
133
|
menuTailing = "menuTailing",
|
|
@@ -297,6 +182,7 @@ type MainNavWidgetProps = {
|
|
|
297
182
|
chainMenu?: ReactNode;
|
|
298
183
|
/** Wallet connection component (desktop & mobile) */
|
|
299
184
|
walletConnect?: ReactNode;
|
|
185
|
+
notify?: ReactNode;
|
|
300
186
|
/** Main navigation menu (desktop & mobile) */
|
|
301
187
|
mainNav?: ReactNode;
|
|
302
188
|
/** Account summary component (desktop only) */
|
|
@@ -319,6 +205,26 @@ type MainNavMobileProps = {
|
|
|
319
205
|
} & MainNavWidgetProps;
|
|
320
206
|
declare const MainNavMobile: FC<MainNavMobileProps>;
|
|
321
207
|
|
|
208
|
+
type BottomNavItem = {
|
|
209
|
+
name: string;
|
|
210
|
+
href: string;
|
|
211
|
+
activeIcon: ReactNode;
|
|
212
|
+
inactiveIcon: ReactNode;
|
|
213
|
+
};
|
|
214
|
+
type BottomNavProps$1 = {
|
|
215
|
+
mainMenus?: BottomNavItem[];
|
|
216
|
+
current?: string;
|
|
217
|
+
onRouteChange?: RouterAdapter["onRouteChange"];
|
|
218
|
+
};
|
|
219
|
+
declare const BottomNavWidget: react__default.FC<BottomNavProps$1>;
|
|
220
|
+
|
|
221
|
+
type BottomNavProps = {
|
|
222
|
+
mainMenus?: BottomNavItem[];
|
|
223
|
+
current?: string | string[];
|
|
224
|
+
onRouteChange?: RouterAdapter["onRouteChange"];
|
|
225
|
+
};
|
|
226
|
+
declare const BottomNav: react__default.FC<BottomNavProps>;
|
|
227
|
+
|
|
322
228
|
declare const AccountSummaryWidget: react__default.FC;
|
|
323
229
|
|
|
324
230
|
declare const ChainMenuWidget: () => react_jsx_runtime.JSX.Element;
|
|
@@ -342,6 +248,30 @@ declare const useChainMenuScript: () => {
|
|
|
342
248
|
|
|
343
249
|
declare const ChainMenu: (props: UseChainMenuScriptReturn) => react_jsx_runtime.JSX.Element;
|
|
344
250
|
|
|
251
|
+
type SideMenuItem = {
|
|
252
|
+
name: string;
|
|
253
|
+
icon?: react__default.ReactNode;
|
|
254
|
+
href?: string;
|
|
255
|
+
disabled?: boolean;
|
|
256
|
+
onClick?: () => void;
|
|
257
|
+
hide?: boolean;
|
|
258
|
+
};
|
|
259
|
+
type SideBarProps = {
|
|
260
|
+
title?: react__default.ReactNode;
|
|
261
|
+
items?: SideMenuItem[];
|
|
262
|
+
open?: boolean;
|
|
263
|
+
onOpenChange?: (open: boolean) => void;
|
|
264
|
+
onItemSelect?: (item: SideMenuItem) => void;
|
|
265
|
+
current?: string;
|
|
266
|
+
className?: string;
|
|
267
|
+
maxWidth?: number;
|
|
268
|
+
minWidth?: number;
|
|
269
|
+
style?: react__default.CSSProperties;
|
|
270
|
+
};
|
|
271
|
+
declare const SideBar: react__default.FC<SideBarProps>;
|
|
272
|
+
|
|
273
|
+
declare const SideNavbarWidget: react__default.FC<Partial<SideBarProps>>;
|
|
274
|
+
|
|
345
275
|
type SubAccountWidgetProps = {
|
|
346
276
|
customTrigger?: ReactNode;
|
|
347
277
|
};
|
|
@@ -376,6 +306,20 @@ declare function SubAccountUI(props: SubAccountScriptReturn & {
|
|
|
376
306
|
customTrigger?: ReactNode;
|
|
377
307
|
}): react_jsx_runtime.JSX.Element;
|
|
378
308
|
|
|
309
|
+
type FooterReturns = {
|
|
310
|
+
wsStatus: WsNetworkStatus;
|
|
311
|
+
};
|
|
312
|
+
|
|
313
|
+
type FooterProps = {
|
|
314
|
+
telegramUrl?: string;
|
|
315
|
+
twitterUrl?: string;
|
|
316
|
+
discordUrl?: string;
|
|
317
|
+
trailing?: ReactNode;
|
|
318
|
+
};
|
|
319
|
+
declare const FooterWidget: react__default.FC<FooterProps>;
|
|
320
|
+
|
|
321
|
+
declare const Footer: FC<FooterReturns & FooterProps>;
|
|
322
|
+
|
|
379
323
|
interface MaintenanceTipInterface {
|
|
380
324
|
tipsContent: string;
|
|
381
325
|
showTips: boolean;
|
|
@@ -388,27 +332,6 @@ declare const MaintenanceTipsUI: (props: MaintenanceTipInterface) => react_jsx_r
|
|
|
388
332
|
|
|
389
333
|
declare const MaintenanceTipsWidget: () => react_jsx_runtime.JSX.Element;
|
|
390
334
|
|
|
391
|
-
type AnnouncementScriptOptions = {
|
|
392
|
-
hideTips?: boolean;
|
|
393
|
-
};
|
|
394
|
-
type AnnouncementScriptReturn = ReturnType<typeof useAnnouncementScript>;
|
|
395
|
-
declare const useAnnouncementScript: (options?: AnnouncementScriptOptions) => {
|
|
396
|
-
maintenanceDialogInfo: string | undefined;
|
|
397
|
-
tips: API.AnnouncementRow[];
|
|
398
|
-
closeTips: () => void;
|
|
399
|
-
showAnnouncement: boolean;
|
|
400
|
-
};
|
|
401
|
-
|
|
402
|
-
type AnnouncementProps = AnnouncementScriptReturn & {
|
|
403
|
-
style?: react__default.CSSProperties;
|
|
404
|
-
className?: string;
|
|
405
|
-
hideTips?: boolean;
|
|
406
|
-
};
|
|
407
|
-
declare const AnnouncementUI: react__default.FC<Readonly<AnnouncementProps>>;
|
|
408
|
-
|
|
409
|
-
type AnnouncementWidgetProps = Pick<AnnouncementProps, "style" | "className" | "hideTips">;
|
|
410
|
-
declare const AnnouncementWidget: react__default.FC<AnnouncementWidgetProps>;
|
|
411
|
-
|
|
412
335
|
type UseRestrictedInfoScriptReturn = ReturnType<typeof useRestrictedInfoScript> & {
|
|
413
336
|
brokerName?: string;
|
|
414
337
|
};
|
|
@@ -440,6 +363,71 @@ declare const RestrictedInfo: FC<RestrictedInfoProps>;
|
|
|
440
363
|
type RestrictedInfoWidgetProps = Pick<RestrictedInfoProps, "className">;
|
|
441
364
|
declare const RestrictedInfoWidget: FC<RestrictedInfoWidgetProps>;
|
|
442
365
|
|
|
366
|
+
type ScaffoldProps = {
|
|
367
|
+
/**
|
|
368
|
+
* custom left sidebar component, only works on desktop
|
|
369
|
+
* if provided, the layout will use this component over the default sidebar component
|
|
370
|
+
*/
|
|
371
|
+
leftSidebar?: ReactNode;
|
|
372
|
+
/**
|
|
373
|
+
* custom left sidebar props, only works on desktop
|
|
374
|
+
*/
|
|
375
|
+
leftSideProps?: SideBarProps;
|
|
376
|
+
/**
|
|
377
|
+
* custom left nav props, only works on mobile
|
|
378
|
+
*/
|
|
379
|
+
leftNavProps?: LeftNavProps;
|
|
380
|
+
/**
|
|
381
|
+
* custom top bar component
|
|
382
|
+
*/
|
|
383
|
+
topBar?: ReactNode;
|
|
384
|
+
/**
|
|
385
|
+
* custom top nav props
|
|
386
|
+
*/
|
|
387
|
+
mainNavProps?: MainNavWidgetProps;
|
|
388
|
+
/**
|
|
389
|
+
* custom bottom nav component, only works on mobile
|
|
390
|
+
*/
|
|
391
|
+
bottomNav?: ReactNode;
|
|
392
|
+
/**
|
|
393
|
+
* custom bottom nav component, only works on mobile
|
|
394
|
+
*/
|
|
395
|
+
bottomNavProps?: BottomNavProps$1;
|
|
396
|
+
/**
|
|
397
|
+
* custom footer component, only works on desktop
|
|
398
|
+
*/
|
|
399
|
+
footer?: ReactNode;
|
|
400
|
+
/**
|
|
401
|
+
* custom footer props, only works on desktop
|
|
402
|
+
*/
|
|
403
|
+
footerProps?: FooterProps;
|
|
404
|
+
routerAdapter?: RouterAdapter;
|
|
405
|
+
classNames?: {
|
|
406
|
+
root?: string;
|
|
407
|
+
container?: string;
|
|
408
|
+
content?: string;
|
|
409
|
+
body?: string;
|
|
410
|
+
leftSidebar?: string;
|
|
411
|
+
topNavbar?: string;
|
|
412
|
+
footer?: string;
|
|
413
|
+
bottomNav?: string;
|
|
414
|
+
};
|
|
415
|
+
};
|
|
416
|
+
declare const Scaffold: react__default.FC<PropsWithChildren<ScaffoldProps>>;
|
|
417
|
+
|
|
418
|
+
type ScaffoldState = {
|
|
419
|
+
routerAdapter?: RouterAdapter;
|
|
420
|
+
expanded?: boolean;
|
|
421
|
+
setExpand: (expand: boolean) => void;
|
|
422
|
+
checkChainSupport: (chainId: number | string) => boolean;
|
|
423
|
+
topNavbarHeight: number;
|
|
424
|
+
footerHeight: number;
|
|
425
|
+
announcementHeight: number;
|
|
426
|
+
announcementState: ReturnType<typeof useAnnouncement>;
|
|
427
|
+
};
|
|
428
|
+
declare const ScaffoldContext: react.Context<ScaffoldState>;
|
|
429
|
+
declare const useScaffoldContext: () => ScaffoldState;
|
|
430
|
+
|
|
443
431
|
type MainLogoProps = {
|
|
444
432
|
src?: string;
|
|
445
433
|
alt?: string;
|
|
@@ -486,4 +474,4 @@ declare const useScanQRCodeScript: () => {
|
|
|
486
474
|
type ScanQRCodeProps = UseScanQRCodeScriptReturn;
|
|
487
475
|
declare const ScanQRCode: FC<ScanQRCodeProps>;
|
|
488
476
|
|
|
489
|
-
export { AccountMenuWidget, AccountSummaryWidget,
|
|
477
|
+
export { AccountMenuWidget, AccountSummaryWidget, BottomNav, type BottomNavProps$1 as BottomNavProps, BottomNavWidget, CampaignPositionEnum, ChainMenu, ChainMenuWidget, Footer, type FooterProps, FooterWidget, LanguageSwitcher, type LanguageSwitcherProps, type LanguageSwitcherScriptReturn, LanguageSwitcherWidget, type LanguageSwitcherWidgetProps, type LeftNavItem, type LeftNavProps, LeftNavUI, type LeftNavUIProps, LeftNavWidget, MainLogo, type MainNavItem, MainNavMobile, MainNavWidget, type MainNavWidgetProps, MaintenanceTipsUI, MaintenanceTipsWidget, RestrictedInfo, RestrictedInfoWidget, Scaffold, ScaffoldContext, type ScaffoldProps, ScanQRCode, ScanQRCodeWidget, SideBar, type SideBarProps, type SideMenuItem, SideNavbarWidget, SubAccountScript, SubAccountUI, SubAccountWidget, useLanguageSwitcherScript, useRestrictedInfoScript, useScaffoldContext, useScanQRCodeScript };
|