diff --git a/src/layout/layouts/HeaderOnly.tsx b/src/layout/layouts/HeaderOnly.tsx
index a57d8d5..945a569 100644
--- a/src/layout/layouts/HeaderOnly.tsx
+++ b/src/layout/layouts/HeaderOnly.tsx
@@ -1,7 +1,6 @@
 import { Theme } from '@/app/enum';
 import { routerConfig } from '@/router';
 import { Layout, Menu, MenuProps } from '@df/toco-ui';
-import { SelectInfo } from 'rc-menu/lib/interface';
 import React, { useCallback, useEffect, useMemo, useState } from 'react';
 import { Outlet, useMatches, useNavigate } from 'react-router-dom';
 import { LayoutProps } from '.';
@@ -26,7 +25,8 @@ const HeaderOnly: React.FC<LayoutProps> = (props) => {
   }, []);
 
   const onKeyChange = useCallback(
-    (info: SelectInfo) => {
+    (...args: Parameters<Required<MenuProps>['onSelect']>) => {
+      const info = args[0];
       const keys = info.keyPath;
       setSelectedKeys(info.keyPath);
       navigate(keys.reverse().join('/'));
diff --git a/src/layout/layouts/HeaderSider.tsx b/src/layout/layouts/HeaderSider.tsx
index ecb3844..b5ce273 100644
--- a/src/layout/layouts/HeaderSider.tsx
+++ b/src/layout/layouts/HeaderSider.tsx
@@ -1,7 +1,6 @@
 import { Theme } from '@/app/enum';
 import { routerConfig } from '@/router';
 import { Layout, Menu, MenuProps } from '@df/toco-ui';
-import { SelectInfo } from 'rc-menu/lib/interface';
 import React, { useCallback, useEffect, useMemo, useState } from 'react';
 import { Outlet, useMatches, useNavigate } from 'react-router-dom';
 import { LayoutProps } from '.';
@@ -37,7 +36,8 @@ const HeaderSider: React.FC<LayoutProps> = (props) => {
   }, []);
 
   const onHeaderKeyChange = useCallback(
-    (info: SelectInfo) => {
+    (...args: Parameters<Required<MenuProps>['onSelect']>) => {
+      const info = args[0];
       setHeaderKey(info.key);
       navigate(info.key);
     },
@@ -50,7 +50,8 @@ const HeaderSider: React.FC<LayoutProps> = (props) => {
   }, [headerKey]);
 
   const onSiderKeyChange = useCallback(
-    (info: SelectInfo) => {
+    (...args: Parameters<Required<MenuProps>['onSelect']>) => {
+      const info = args[0];
       const keys = info.keyPath;
       setSiderSelectedKeys(info.keyPath);
       const parts = [headerKey, ...keys];
diff --git a/src/layout/layouts/SiderOnly.tsx b/src/layout/layouts/SiderOnly.tsx
index e9bd270..1da6479 100644
--- a/src/layout/layouts/SiderOnly.tsx
+++ b/src/layout/layouts/SiderOnly.tsx
@@ -1,7 +1,6 @@
 import { Theme } from '@/app/enum';
 import { routerConfig } from '@/router';
 import { Layout, Menu, MenuProps } from '@df/toco-ui';
-import { SelectInfo } from 'rc-menu/lib/interface';
 import React, { useCallback, useEffect, useMemo, useState } from 'react';
 import { Outlet, useMatches, useNavigate } from 'react-router-dom';
 import { LayoutProps } from '.';
@@ -34,7 +33,8 @@ const SiderOnly: React.FC<LayoutProps> = (props) => {
   }, []);
 
   const onKeyChange = useCallback(
-    (info: SelectInfo) => {
+    (...args: Parameters<Required<MenuProps>['onSelect']>) => {
+      const info = args[0];
       const keys = info.keyPath;
       setSelectedKeys(info.keyPath);
       navigate(keys.reverse().join('/'));