@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 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 LeftNavWidget: FC<LeftNavProps>;
99
-
100
- type BottomNavItem = {
101
- name: string;
102
- href: string;
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
- declare const BottomNav: react__default.FC<BottomNavProps>;
231
-
232
- declare const useLeftNavState: () => {};
233
- type LeftNavState = ReturnType<typeof useLeftNavState>;
116
+ type LeftNavScriptReturn = ReturnType<typeof useLeftNavScript>;
234
117
 
235
- type LeftNavUIProps = LeftNavProps & LeftNavState & {
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, AnnouncementUI, AnnouncementWidget, type AnnouncementWidgetProps, 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, LeftNavWidget, MainLogo, MainNavMobile, MainNavWidget, type MainNavWidgetProps, MaintenanceTipsUI, MaintenanceTipsWidget, RestrictedInfo, RestrictedInfoWidget, type RouteOption, type RouterAdapter, Scaffold, ScaffoldContext, type ScaffoldProps, ScanQRCode, ScanQRCodeWidget, SideBar, type SideBarProps, type SideMenuItem, SideNavbarWidget, SubAccountScript, SubAccountUI, SubAccountWidget, useAnnouncementScript, useLanguageSwitcherScript, useRestrictedInfoScript, useScaffoldContext, useScanQRCodeScript };
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 };