@orderly.network/ui-scaffold 2.12.4 → 3.0.0-alpha.0

package/dist/index.d.mts

@@ -1,52 +1,41 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
-import * as react from 'react';
-import react__default, { ReactNode, HTMLAttributeAnchorTarget, FC, PropsWithChildren } from 'react';
 import * as _orderly_network_types from '@orderly.network/types';
-import { RouterAdapter, NetworkId, API } from '@orderly.network/types';
+import { AccountStatusEnum, RouterAdapter, NetworkId, API } from '@orderly.network/types';
+import * as react from 'react';
+import react__default, { HTMLAttributeAnchorTarget, ReactNode, FC, PropsWithChildren } from 'react';
+import * as react_jsx_runtime from 'react/jsx-runtime';
 import { WsNetworkStatus } from '@orderly.network/hooks';
 import * as _orderly_network_i18n from '@orderly.network/i18n';
 import { LanguageContextState } from '@orderly.network/i18n';
 import { useAnnouncement } from '@orderly.network/ui-notification';
 
-declare const AccountMenuWidget: () => react_jsx_runtime.JSX.Element;
-
-type LeftNavProps = {
-    /** custom leading */
-    leading?: ReactNode;
-    menus?: LeftNavItem[];
-    twitterUrl?: string;
-    telegramUrl?: string;
-    discordUrl?: string;
-    duneUrl?: string;
-    /**
-     * @deprecated Deprecated. This prop will no longer affect the rendered UI
-     * in the leftNav drawer footer. Use `customFooter` instead.
-     */
-    feedbackUrl?: string;
-    customFooter?: ReactNode;
-    customLeftNav?: ReactNode;
+type AccountMenuProps = {
+    accountState: AccountState;
+    address?: string;
+    onDisconnect: () => void;
+    connect: () => Promise<void>;
+    onCrateAccount: () => Promise<void>;
+    onCreateOrderlyKey: () => Promise<void>;
+    onOpenExplorer: () => void;
+    onSwitchNetwork: () => void;
+    wrongNetwork: boolean;
+    disabledConnect?: boolean;
+    isMobile: boolean;
 };
-type LeftNavItem = {
-    name: string;
-    href: string;
-    target?: string;
-    icon?: ReactNode;
-    trailing?: ReactNode;
-    customRender?: (option: {
-        name: string;
-        href: string;
-        isActive?: boolean;
-    }) => React.ReactNode;
+type AccountState = {
+    status: AccountStatusEnum;
     /**
-     * if true, this item will only be shown in the main account
-     * @default false
-     **/
-    onlyInMainAccount?: boolean;
-    /**
-     * Optional secondary style; secondary items render smaller and gray.
-     * Secondary items are grouped below primary items with a divider in between.
+     * whether the account is validating
      */
-    isSecondary?: boolean;
+    validating: boolean;
+    chainNamespace?: string;
+    accountId?: string;
+    userId?: string;
+    address?: string;
+    isNew?: boolean;
+    connectWallet?: {
+        name: string;
+        chainId: number;
+    };
 };
 
 type MainNavItem = {
@@ -114,6 +103,66 @@ type MainNavClassNames = {
     navItem?: string;
     subMenu?: string;
 };
+type MainNavItemsProps = {
+    items?: MainNavItem[];
+    current?: string[];
+    classNames?: MainNavClassNames;
+    onItemClick?: (item: MainNavItem[]) => void;
+};
+
+/**
+ * Module augmentation: maps interceptor target paths to their component props types.
+ * Import from @orderly.network/ui-scaffold to enable typed props in
+ * createInterceptor('Account.AccountMenu', ...) and createInterceptor('Layout.MainMenus', ...).
+ */
+
+declare module "@orderly.network/plugin-core" {
+    interface InterceptorTargetPropsMap {
+        "Account.AccountMenu": AccountMenuProps;
+        "Layout.MainMenus": MainNavItemsProps;
+    }
+}
+
+declare const AccountMenuWidget: () => react_jsx_runtime.JSX.Element;
+
+type LeftNavProps = {
+    /** custom leading */
+    leading?: ReactNode;
+    menus?: LeftNavItem[];
+    twitterUrl?: string;
+    telegramUrl?: string;
+    discordUrl?: string;
+    duneUrl?: string;
+    /**
+     * @deprecated Deprecated. This prop will no longer affect the rendered UI
+     * in the leftNav drawer footer. Use `customFooter` instead.
+     */
+    feedbackUrl?: string;
+    customFooter?: ReactNode;
+    customLeftNav?: ReactNode;
+};
+type LeftNavItem = {
+    name: string;
+    href: string;
+    target?: string;
+    icon?: ReactNode;
+    trailing?: ReactNode;
+    customRender?: (option: {
+        name: string;
+        href: string;
+        isActive?: boolean;
+    }) => React.ReactNode;
+    /**
+     * if true, this item will only be shown in the main account
+     * @default false
+     **/
+    onlyInMainAccount?: boolean;
+    /**
+     * Optional secondary style; secondary items render smaller and gray.
+     * Secondary items are grouped below primary items with a divider in between.
+     */
+    isSecondary?: boolean;
+};
 
 declare const useLeftNavScript: () => {
     open: boolean;
@@ -482,4 +531,4 @@ declare const useScanQRCodeScript: () => {
 type ScanQRCodeProps = UseScanQRCodeScriptReturn;
 declare const ScanQRCode: FC<ScanQRCodeProps>;
 
-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 };
+export { type AccountMenuProps, 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, type MainNavItemsProps, 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 };

package/dist/index.d.ts

@@ -1,52 +1,41 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
-import * as react from 'react';
-import react__default, { ReactNode, HTMLAttributeAnchorTarget, FC, PropsWithChildren } from 'react';
 import * as _orderly_network_types from '@orderly.network/types';
-import { RouterAdapter, NetworkId, API } from '@orderly.network/types';
+import { AccountStatusEnum, RouterAdapter, NetworkId, API } from '@orderly.network/types';
+import * as react from 'react';
+import react__default, { HTMLAttributeAnchorTarget, ReactNode, FC, PropsWithChildren } from 'react';
+import * as react_jsx_runtime from 'react/jsx-runtime';
 import { WsNetworkStatus } from '@orderly.network/hooks';
 import * as _orderly_network_i18n from '@orderly.network/i18n';
 import { LanguageContextState } from '@orderly.network/i18n';
 import { useAnnouncement } from '@orderly.network/ui-notification';
 
-declare const AccountMenuWidget: () => react_jsx_runtime.JSX.Element;
-
-type LeftNavProps = {
-    /** custom leading */
-    leading?: ReactNode;
-    menus?: LeftNavItem[];
-    twitterUrl?: string;
-    telegramUrl?: string;
-    discordUrl?: string;
-    duneUrl?: string;
-    /**
-     * @deprecated Deprecated. This prop will no longer affect the rendered UI
-     * in the leftNav drawer footer. Use `customFooter` instead.
-     */
-    feedbackUrl?: string;
-    customFooter?: ReactNode;
-    customLeftNav?: ReactNode;
+type AccountMenuProps = {
+    accountState: AccountState;
+    address?: string;
+    onDisconnect: () => void;
+    connect: () => Promise<void>;
+    onCrateAccount: () => Promise<void>;
+    onCreateOrderlyKey: () => Promise<void>;
+    onOpenExplorer: () => void;
+    onSwitchNetwork: () => void;
+    wrongNetwork: boolean;
+    disabledConnect?: boolean;
+    isMobile: boolean;
 };
-type LeftNavItem = {
-    name: string;
-    href: string;
-    target?: string;
-    icon?: ReactNode;
-    trailing?: ReactNode;
-    customRender?: (option: {
-        name: string;
-        href: string;
-        isActive?: boolean;
-    }) => React.ReactNode;
+type AccountState = {
+    status: AccountStatusEnum;
     /**
-     * if true, this item will only be shown in the main account
-     * @default false
-     **/
-    onlyInMainAccount?: boolean;
-    /**
-     * Optional secondary style; secondary items render smaller and gray.
-     * Secondary items are grouped below primary items with a divider in between.
+     * whether the account is validating
      */
-    isSecondary?: boolean;
+    validating: boolean;
+    chainNamespace?: string;
+    accountId?: string;
+    userId?: string;
+    address?: string;
+    isNew?: boolean;
+    connectWallet?: {
+        name: string;
+        chainId: number;
+    };
 };
 
 type MainNavItem = {
@@ -114,6 +103,66 @@ type MainNavClassNames = {
     navItem?: string;
     subMenu?: string;
 };
+type MainNavItemsProps = {
+    items?: MainNavItem[];
+    current?: string[];
+    classNames?: MainNavClassNames;
+    onItemClick?: (item: MainNavItem[]) => void;
+};
+
+/**
+ * Module augmentation: maps interceptor target paths to their component props types.
+ * Import from @orderly.network/ui-scaffold to enable typed props in
+ * createInterceptor('Account.AccountMenu', ...) and createInterceptor('Layout.MainMenus', ...).
+ */
+
+declare module "@orderly.network/plugin-core" {
+    interface InterceptorTargetPropsMap {
+        "Account.AccountMenu": AccountMenuProps;
+        "Layout.MainMenus": MainNavItemsProps;
+    }
+}
+
+declare const AccountMenuWidget: () => react_jsx_runtime.JSX.Element;
+
+type LeftNavProps = {
+    /** custom leading */
+    leading?: ReactNode;
+    menus?: LeftNavItem[];
+    twitterUrl?: string;
+    telegramUrl?: string;
+    discordUrl?: string;
+    duneUrl?: string;
+    /**
+     * @deprecated Deprecated. This prop will no longer affect the rendered UI
+     * in the leftNav drawer footer. Use `customFooter` instead.
+     */
+    feedbackUrl?: string;
+    customFooter?: ReactNode;
+    customLeftNav?: ReactNode;
+};
+type LeftNavItem = {
+    name: string;
+    href: string;
+    target?: string;
+    icon?: ReactNode;
+    trailing?: ReactNode;
+    customRender?: (option: {
+        name: string;
+        href: string;
+        isActive?: boolean;
+    }) => React.ReactNode;
+    /**
+     * if true, this item will only be shown in the main account
+     * @default false
+     **/
+    onlyInMainAccount?: boolean;
+    /**
+     * Optional secondary style; secondary items render smaller and gray.
+     * Secondary items are grouped below primary items with a divider in between.
+     */
+    isSecondary?: boolean;
+};
 
 declare const useLeftNavScript: () => {
     open: boolean;
@@ -482,4 +531,4 @@ declare const useScanQRCodeScript: () => {
 type ScanQRCodeProps = UseScanQRCodeScriptReturn;
 declare const ScanQRCode: FC<ScanQRCodeProps>;
 
-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 };
+export { type AccountMenuProps, 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, type MainNavItemsProps, 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 };

package/dist/index.js

@@ -978,21 +978,14 @@ var useAccountMenu = () => {
     isMobile
   };
 };
+var InjectableAccountMenu = ui.injectable(AccountMenu, "Account.AccountMenu");
 var AccountMenuWidget = () => {
   const state = useAccountMenu();
   return /* @__PURE__ */ jsxRuntime.jsx(AccountMenu, { ...state });
 };
-ui.installExtension({
-  name: "account-menu",
-  scope: ["*"],
-  positions: [ui.ExtensionPositionEnum.AccountMenu],
-  builder: useAccountMenu,
-  __isInternal: true
-})((props) => {
-  return /* @__PURE__ */ jsxRuntime.jsx(AccountMenu, { ...props });
-});
 var WalletConnectButtonExtension = () => {
-  return /* @__PURE__ */ jsxRuntime.jsx(ui.ExtensionSlot, { position: ui.ExtensionPositionEnum.AccountMenu });
+  const state = useAccountMenu();
+  return /* @__PURE__ */ jsxRuntime.jsx(InjectableAccountMenu, { ...state });
 };
 var useChainMenuScript = () => {
   const [open2, setOpen] = React7.useState(false);
@@ -5550,16 +5543,9 @@ var MainNavMenus = (props) => {
     index
   )) });
 };
-ui.installExtension({
-  name: "default-main-nav-menus",
-  scope: ["*"],
-  positions: [ui.ExtensionPositionEnum.MainMenus],
-  __isInternal: true
-})((props) => {
-  return /* @__PURE__ */ jsxRuntime.jsx(MainNavMenus, { ...props });
-});
+var InjectableMainNavMenus = ui.injectable(MainNavMenus, "Layout.MainMenus");
 var MainNavMenusExtension = (props) => {
-  return /* @__PURE__ */ jsxRuntime.jsx(ui.ExtensionSlot, { position: ui.ExtensionPositionEnum.MainMenus, ...props });
+  return /* @__PURE__ */ jsxRuntime.jsx(InjectableMainNavMenus, { ...props });
 };
 var MainNav = (props) => {
   const { className, classNames, campaigns, campaignPosition } = props;