import type { SiderProps } from 'antd/lib/layout/Sider';
import type { CSSProperties } from 'react';
import React from 'react';
import type { WithFalse } from '../../typings';
import type { BaseMenuProps } from './BaseMenu';
import './index.less';
export declare const defaultRenderLogo: (logo: React.ReactNode | (() => React.ReactNode)) => React.ReactNode;
export declare const defaultRenderLogoAndTitle: (props: SiderMenuProps, renderKey?: string) => React.ReactNode;
export declare type SiderMenuProps = {
logo?: React.ReactNode;
siderWidth?: number;
/**
* @name 菜单 logo 和 title 区域的渲染
*
* @example 不要logo : menuHeaderRender={(logo,title)=> title}
* @example 不要title : menuHeaderRender={(logo,title)=> logo}
* @example 展开的时候显示title,收起显示 logo: menuHeaderRender={(logo,title,props)=> props.collapsed ? logo : title}
* @example 不要这个区域了 : menuHeaderRender={false}
*/
menuHeaderRender?: WithFalse<(logo: React.ReactNode, title: React.ReactNode, props?: SiderMenuProps) => React.ReactNode>;
/**
* @name 侧边菜单底部的配置,可以增加一些底部操作
*
* @example 底部增加超链接 menuFooterRender={()=>pro.ant.design}
* @example 根据收起展开配置不同的 dom menuFooterRender={()=>collapsed? null :pro.ant.design}
*/
menuFooterRender?: WithFalse<(props?: SiderMenuProps) => React.ReactNode>;
/**
* @name 侧边菜单,菜单区域的处理,可以单独处理菜单的dom
*
* @example 增加菜单区域的背景颜色 menuContentRender={(props,defaultDom)=>
{defaultDom}
}
* @example 某些情况下不显示菜单 menuContentRender={(props)=> return 不显示菜单
}
*/
menuContentRender?: WithFalse<(props: SiderMenuProps, defaultDom: React.ReactNode) => React.ReactNode>;
/**
* @name 侧边菜单 title 和 logo 下面区域的渲染,一般会增加个搜索框
*
* @example 增加一个搜索框 menuExtraRender={()=>()}
* @example 根据收起展开配置不同的 dom: menuExtraRender={()=>collapsed? null : }
*/
menuExtraRender?: WithFalse<(props: SiderMenuProps) => React.ReactNode>;
/**
* @name 自定义展开收起按钮的渲染
*
* @example 使用文字渲染 collapsedButtonRender={(collapsed)=>collapsed?"展开":"收起"})}
* @example 使用icon渲染 collapsedButtonRender={(collapsed)=>collapsed?:}
* @example 不渲染按钮 collapsedButtonRender={false}
*/
collapsedButtonRender?: WithFalse<(collapsed?: boolean) => React.ReactNode>;
/**
* @name 菜单是否收起的断点,设置成false 可以禁用
*
* @example 禁用断点 breakpoint={false}
* @example 最小的屏幕再收起 breakpoint={"xs"}
*/
breakpoint?: SiderProps['breakpoint'] | false;
/**
* @name 菜单顶部logo 和 title 区域的点击事件
*
* @example 点击跳转到首页 onMenuHeaderClick={()=>{ history.push('/') }}
*/
onMenuHeaderClick?: (e: React.MouseEvent) => void;
/**
* @name 侧边菜单底部的一些快捷链接
*
* @example links={[ 访问官网 , 帮助 ]}
*/
links?: React.ReactNode[];
onOpenChange?: (openKeys: WithFalse) => void;
getContainer?: false;
/**
* @name 侧边菜单的logo的样式,可以调整下大小
*
* @example 设置logo的大小为 42px logoStyle={{width: '42px', height: '42px'}}
*/
logoStyle?: CSSProperties;
hide?: boolean;
className?: string;
style?: CSSProperties;
} & Pick>;
export declare const defaultRenderCollapsedButton: (collapsed?: boolean) => JSX.Element;
export declare type PrivateSiderMenuProps = {
matchMenuKeys: string[];
};
declare const SiderMenu: React.FC;
export default SiderMenu;