gitscope
/
← marzneshin / dashboard/src/components/sidebar/sidebar.tsx / blame
Files Commits 446 Branches 1 Tags 43 Markers 4 README License
https://dev.kronoz.win/r/marzneshin.git
dashboard/src/components/sidebar/sidebar.tsx · v0.3.1
Source
1 88bdde2 Mrdn 2y ago import type { FC, PropsWithChildren } from "react";
2 88bdde2 Mrdn 2y ago import { useMemo } from "react";
3 88bdde2 Mrdn 2y ago import { SidebarContext } from "./sidebar-provider";
4 88bdde2 Mrdn 2y ago import type { SidebarItemGroup } from "./types";
5 88bdde2 Mrdn 2y ago import { type VariantProps, cva } from "class-variance-authority";
6 1eb203e Mrdn 2y ago import { cn } from "@marzneshin/utils";
7 1eb203e Mrdn 2y ago import { SidebarHeader } from "./sidebar-header";
8 1eb203e Mrdn 2y ago import { SidebarFooter } from "./sidebar-footer";
9 1eb203e Mrdn 2y ago import { SidebarBody } from "./sidebar-body";
10 1eb203e Mrdn 2y ago import { SidebarItem } from "./sidebar-item";
11 1eb203e Mrdn 2y ago import { SidebarGroup } from "./sidebar-group";
12 1eb203e Mrdn 2y ago
13 1eb203e Mrdn 2y ago const sidebarVariants = cva("flex flex-col justify-between h-full w-full", {
14 88bdde2 Mrdn 2y ago variants: {
15 88bdde2 Mrdn 2y ago variant: {
16 88bdde2 Mrdn 2y ago default: "",
17 88bdde2 Mrdn 2y ago },
18 88bdde2 Mrdn 2y ago },
19 1eb203e Mrdn 2y ago });
20 1eb203e Mrdn 2y ago
21 1eb203e Mrdn 2y ago interface ContentComposition {
22 88bdde2 Mrdn 2y ago Header: typeof SidebarHeader;
23 88bdde2 Mrdn 2y ago Footer: typeof SidebarFooter;
24 88bdde2 Mrdn 2y ago Body: typeof SidebarBody;
25 88bdde2 Mrdn 2y ago Group: typeof SidebarGroup;
26 88bdde2 Mrdn 2y ago Item: typeof SidebarItem;
27 1eb203e Mrdn 2y ago }
28 1eb203e Mrdn 2y ago
29 1eb203e Mrdn 2y ago export interface SidebarProps
30 88bdde2 Mrdn 2y ago extends React.HTMLAttributes<HTMLDivElement>,
31 1eb203e Mrdn 2y ago VariantProps<typeof sidebarVariants> {
32 88bdde2 Mrdn 2y ago sidebar: SidebarItemGroup;
33 88bdde2 Mrdn 2y ago collapsed: boolean;
34 88bdde2 Mrdn 2y ago setCollapsed: (state: boolean) => void;
35 88bdde2 Mrdn 2y ago open?: boolean;
36 88bdde2 Mrdn 2y ago setOpen?: (state: boolean) => void;
37 1eb203e Mrdn 2y ago }
38 1eb203e Mrdn 2y ago
39 88bdde2 Mrdn 2y ago const Sidebar: FC<SidebarProps & PropsWithChildren> & ContentComposition = ({
40 88bdde2 Mrdn 2y ago collapsed,
41 88bdde2 Mrdn 2y ago setCollapsed,
42 88bdde2 Mrdn 2y ago sidebar,
43 88bdde2 Mrdn 2y ago variant,
44 88bdde2 Mrdn 2y ago className,
45 88bdde2 Mrdn 2y ago setOpen,
46 88bdde2 Mrdn 2y ago open,
47 88bdde2 Mrdn 2y ago children,
48 88bdde2 Mrdn 2y ago ...props
49 88bdde2 Mrdn 2y ago }) => {
50 88bdde2 Mrdn 2y ago const contextValue = useMemo(
51 88bdde2 Mrdn 2y ago () => ({ sidebar, collapsed, setCollapsed, open, setOpen }),
52 88bdde2 Mrdn 2y ago [sidebar, collapsed, setCollapsed, open, setOpen],
53 88bdde2 Mrdn 2y ago );
54 88bdde2 Mrdn 2y ago return (
55 88bdde2 Mrdn 2y ago <SidebarContext.Provider value={contextValue}>
56 88bdde2 Mrdn 2y ago <div className={cn(sidebarVariants({ variant, className }))} {...props}>
57 88bdde2 Mrdn 2y ago {children}
58 88bdde2 Mrdn 2y ago </div>
59 88bdde2 Mrdn 2y ago </SidebarContext.Provider>
60 88bdde2 Mrdn 2y ago );
61 88bdde2 Mrdn 2y ago };
62 1eb203e Mrdn 2y ago
63 1eb203e Mrdn 2y ago Sidebar.Header = SidebarHeader;
64 1eb203e Mrdn 2y ago Sidebar.Footer = SidebarFooter;
65 1eb203e Mrdn 2y ago Sidebar.Body = SidebarBody;
66 1eb203e Mrdn 2y ago Sidebar.Item = SidebarItem;
67 1eb203e Mrdn 2y ago Sidebar.Group = SidebarGroup;
68 88bdde2 Mrdn 2y ago Sidebar.displayName = "Sidebar";
69 1eb203e Mrdn 2y ago
70 88bdde2 Mrdn 2y ago export { Sidebar, sidebarVariants };