diff --git a/.changeset/pratik-tooltip-sider-fix.md b/.changeset/pratik-tooltip-sider-fix.md new file mode 100644 index 0000000000000..494cbb202e8a0 --- /dev/null +++ b/.changeset/pratik-tooltip-sider-fix.md @@ -0,0 +1,5 @@ +--- +"@refinedev/antd": patch +--- + +fix(antd): add tooltip support for truncated menu labels in ThemedSider diff --git a/packages/antd/src/components/themedLayout/sider/index.tsx b/packages/antd/src/components/themedLayout/sider/index.tsx index bbee40e82fa10..633b8eaf4df9b 100644 --- a/packages/antd/src/components/themedLayout/sider/index.tsx +++ b/packages/antd/src/components/themedLayout/sider/index.tsx @@ -7,6 +7,7 @@ import { Button, theme, ConfigProvider, + Tooltip, } from "antd"; import { LogoutOutlined, @@ -82,7 +83,26 @@ export const ThemedSider: React.FC = ({ } - title={label} + title={ + siderCollapsed ? ( + label + ) : ( + + + {label} + + + ) + } > {renderTreeView(children, selectedKey)} @@ -110,7 +130,24 @@ export const ThemedSider: React.FC = ({ style={linkStyle} > - {label} + {siderCollapsed ? ( + label + ) : ( + + + {label} + + + )} {!siderCollapsed && isSelected && (
@@ -145,7 +182,24 @@ export const ThemedSider: React.FC = ({ onClick={() => handleLogout()} icon={} > - {translate("buttons.logout", "Logout")} + {siderCollapsed ? ( + translate("buttons.logout", "Logout") + ) : ( + + + {translate("buttons.logout", "Logout")} + + + )} );