@manhphi1309/sidebar
v0.3.4
Published
A powerful, accessible, and customizable sidebar component for building app layouts.
Readme
@manhphi1309/sidebar
A powerful, accessible, and customizable sidebar component for building app layouts.
Subcomponents
This package provides the following components and hooks:
SidebarSidebarContentSidebarFooterSidebarGroupSidebarGroupActionSidebarGroupContentSidebarGroupLabelSidebarHeaderSidebarInputSidebarInsetSidebarMenuSidebarMenuActionSidebarMenuBadgeSidebarMenuButtonSidebarMenuItemSidebarMenuSkeletonSidebarMenuSubSidebarMenuSubButtonSidebarMenuSubItemSidebarProviderSidebarRailSidebarSeparatorSidebarTriggeruseSidebar
Dependencies
This package relies on:
@manhphi1309/button@manhphi1309/hooks@manhphi1309/input@manhphi1309/separator@manhphi1309/skeleton@manhphi1309/utilsclsxlucide-reactradix-uitailwind-merge
Installation
npm install @manhphi1309/sidebarUsage Example
import {
SidebarProvider,
Sidebar,
SidebarContent,
SidebarGroup,
SidebarMenu,
SidebarMenuItem,
SidebarMenuButton,
} from "@manhphi1309/sidebar"
import { Home } from "lucide-react"
export default function Example() {
return (
<SidebarProvider>
<Sidebar>
<SidebarContent>
<SidebarGroup>
<SidebarMenu>
<SidebarMenuItem>
<SidebarMenuButton>
<Home />
<span>Home</span>
</SidebarMenuButton>
</SidebarMenuItem>
</SidebarMenu>
</SidebarGroup>
</SidebarContent>
</Sidebar>
</SidebarProvider>
)
}