UNPKG

@nexusui/components

Version:

These are custom components specially-developed for NexusUI applications. They will make your life easier by giving you out-of-the-box implementations for various high-level UI elements that you can drop directly into your application.

56 lines (55 loc) 2.73 kB
import { IDrawer, IDrawerNavItem } from '../Drawer'; export interface IProjectSidebar extends Omit<IDrawer, 'children'> { /** * A list of menu items that appears at the top of the project's sidebar. * * ``` * export interface IDrawerNavItem { * nodeId: string; // The unique identifier for the navigation item. * label?: ReactNode; // The label content for the navigation item. * icon?: ReactNode; // The icon component to display next to the label for the navigation item. * action?: ReactNode; // Custom component to display on the right side of the navigation item. * disabled?: Boolean; // Indicates that the navigation item is disabled. * onNavItemClick?: (node: IDrawerNavItem) => void; // Callback function triggered when the navigation item is clicked. * items?: IDrawerNavItem[]; // The navigation items nested under this item. * [key: string]: any; * }; * ``` * * @default [{ nodeId: 'projects', label: 'Projects', icon: <FolderOpenIcon fontSize={'small'} /> },{ nodeId: 'documents', label: 'Documents', icon: <StickyNote2OutlinedIcon fontSize={'small'} /> },{ nodeId: 'drafts', label: 'Drafts', icon: <EditNoteIcon fontSize={'small'} /> }] * */ menuItems?: ReadonlyArray<IDrawerNavItem>; /** * Title of project list that appears at the bottom of the project sidebar. * @default Projects */ projectsTitle?: string; /** * A list that appears at the bottom of the project sidebar. * * ``` * export interface IDrawerNavItem { * nodeId: string; // The unique identifier for the navigation item. * label?: ReactNode; // The label content for the navigation item. * icon?: ReactNode; // The icon component to display next to the label for the navigation item. * action?: ReactNode; // Custom component to display on the right side of the navigation item. * disabled?: Boolean; // Indicates that the navigation item is disabled. * onNavItemClick?: (node: IDrawerNavItem) => void; // Callback function triggered when the navigation item is clicked. * items?: IDrawerNavItem[]; // The navigation items nested under this item. * [key: string]: any; * }; * ``` */ projects?: ReadonlyArray<IDrawerNavItem>; /** * Description information if the bottom list is empty. * @default No projects created yet. */ emptyText?: string; /** * The on click event of side bar "Arrow Icon" when the screen is small size. */ onMenuToggle?: () => void; } export declare const ProjectSidebar: (props: IProjectSidebar) => import("react/jsx-runtime").JSX.Element;