gitscope
/
← marzneshin / dashboard/src/common/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/common/components/sidebar/sidebar.tsx · v0.6.4
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 d636f3f Dawsh 2y ago import { cn } from "@marzneshin/common/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 d636f3f Dawsh 2y ago variants: {
15 d636f3f Dawsh 2y ago variant: {
16 d636f3f Dawsh 2y ago default: "",
17 d636f3f Dawsh 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 d636f3f Dawsh 2y ago Header: typeof SidebarHeader;
23 d636f3f Dawsh 2y ago Footer: typeof SidebarFooter;
24 d636f3f Dawsh 2y ago Body: typeof SidebarBody;
25 d636f3f Dawsh 2y ago Group: typeof SidebarGroup;
26 d636f3f Dawsh 2y ago Item: typeof SidebarItem;
27 1eb203e Mrdn 2y ago }
28 1eb203e Mrdn 2y ago
29 1eb203e Mrdn 2y ago export interface SidebarProps
30 d636f3f Dawsh 2y ago extends React.HTMLAttributes<HTMLDivElement>,
31 1eb203e Mrdn 2y ago VariantProps<typeof sidebarVariants> {
32 d636f3f Dawsh 2y ago sidebar: SidebarItemGroup;
33 d636f3f Dawsh 2y ago collapsed: boolean;
34 d636f3f Dawsh 2y ago setCollapsed: (state: boolean) => void;
35 d636f3f Dawsh 2y ago open?: boolean;
36 d636f3f Dawsh 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 d636f3f Dawsh 2y ago collapsed,
41 d636f3f Dawsh 2y ago setCollapsed,
42 d636f3f Dawsh 2y ago sidebar,
43 d636f3f Dawsh 2y ago variant,
44 d636f3f Dawsh 2y ago className,
45 d636f3f Dawsh 2y ago setOpen,
46 d636f3f Dawsh 2y ago open,
47 d636f3f Dawsh 2y ago children,
48 d636f3f Dawsh 2y ago ...props
49 88bdde2 Mrdn 2y ago }) => {
50 d636f3f Dawsh 2y ago const contextValue = useMemo(
51 d636f3f Dawsh 2y ago () => ({ sidebar, collapsed, setCollapsed, open, setOpen }),
52 d636f3f Dawsh 2y ago [sidebar, collapsed, setCollapsed, open, setOpen],
53 d636f3f Dawsh 2y ago );
54 d636f3f Dawsh 2y ago return (
55 d636f3f Dawsh 2y ago <SidebarContext.Provider value={contextValue}>
56 d636f3f Dawsh 2y ago <div className={cn(sidebarVariants({ variant, className }))} {...props}>
57 d636f3f Dawsh 2y ago {children}
58 d636f3f Dawsh 2y ago </div>
59 d636f3f Dawsh 2y ago </SidebarContext.Provider>
60 d636f3f Dawsh 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 };