diff --git a/components/icons.tsx b/components/icons.tsx new file mode 100644 index 0000000..b9dfbb2 --- /dev/null +++ b/components/icons.tsx @@ -0,0 +1,114 @@ +import { + AlertTriangle, + ArrowRight, + Check, + ChevronLeft, + ChevronRight, + Circle, + ClipboardCheck, + Copy, + CreditCard, + File, + FileText, + HelpCircle, + Image, + Laptop, + Loader2, + LucideProps, + Moon, + MoreVertical, + Pizza, + Plus, + Settings, + SunMedium, + Trash, + Twitter, + User, + X, + type Icon as LucideIcon, +} from "lucide-react"; + +export type Icon = LucideIcon; + +export const Icons = { + logo: (props: LucideProps) => ( + + + + ), + close: X, + spinner: Loader2, + chevronLeft: ChevronLeft, + chevronRight: ChevronRight, + trash: Trash, + post: FileText, + page: File, + media: Image, + settings: Settings, + billing: CreditCard, + ellipsis: MoreVertical, + add: Plus, + warning: AlertTriangle, + user: User, + arrowRight: ArrowRight, + help: HelpCircle, + pizza: Pizza, + twitter: Twitter, + check: Check, + copy: Copy, + copyDone: ClipboardCheck, + sun: SunMedium, + moon: Moon, + laptop: Laptop, + gitHub: (props: LucideProps) => ( + + + + ), + radix: (props: LucideProps) => ( + + + + + + ), + npm: (props: LucideProps) => ( + + + + ), + yarn: (props: LucideProps) => ( + + + + ), + pnpm: (props: LucideProps) => ( + + + + ), + react: (props: LucideProps) => ( + + + + ), + tailwind: (props: LucideProps) => ( + + + + ), +}; diff --git a/components/loading.tsx b/components/loading.tsx new file mode 100644 index 0000000..7e592a8 --- /dev/null +++ b/components/loading.tsx @@ -0,0 +1,27 @@ +import React, { SVGProps } from "react"; + +export function Loading({ + width = 24, + height = 24, + dur = "0.75s", +}: SVGProps): JSX.Element { + return ( + + + + + + + + + + + + ); +} diff --git a/components/logo.tsx b/components/logo.tsx index ef54a98..03b5d24 100644 --- a/components/logo.tsx +++ b/components/logo.tsx @@ -11,9 +11,9 @@ export const Logo: React.FC = ({ className }) => { viewBox="0 0 24 24" fill="none" stroke="current" - stroke-width="2" - stroke-linecap="round" - stroke-linejoin="round"> + strokeWidth="2" + strokeLinecap="round" + strokeLinejoin="round"> diff --git a/components/mobile-nav.tsx b/components/mobile-nav.tsx new file mode 100644 index 0000000..0883aaa --- /dev/null +++ b/components/mobile-nav.tsx @@ -0,0 +1,78 @@ +"use client"; + +import * as React from "react"; +import Link from "next/link"; + +// import { docsConfig } from "@/config/docs" +import { cn } from "@/lib/utils"; +import { Icons } from "@/components/icons"; +import { Button } from "@/components/ui/button"; +import { + DropdownMenu, + DropdownMenuContent, + DropdownMenuGroup, + DropdownMenuItem, + DropdownMenuLabel, + DropdownMenuSeparator, + DropdownMenuTrigger, +} from "@/components/ui/dropdown-menu"; +import { ScrollArea } from "@/components/ui/scroll-area"; + +export function MobileNav() { + return ( + + + + + + + + Omnidash + + + + + {/* {docsConfig.sidebarNav?.map( + (item, index) => + item.href && ( + + {item.title} + + ) + )} + {docsConfig.sidebarNav.map((item, index) => ( + + + {item.title} + + {item?.items?.length && + item.items.map((item) => ( + + {item.href ? ( + {item.title} + ) : ( + item.title + )} + + ))} + + ))} */} + + + + ); +} diff --git a/components/page-header.tsx b/components/page-header.tsx new file mode 100644 index 0000000..00859ac --- /dev/null +++ b/components/page-header.tsx @@ -0,0 +1,21 @@ +type Props = { + title: string; + description?: string; + actions?: React.ReactNode[]; +}; + +export const PageHeader: React.FC = ({ title, description, actions }) => { + return ( +
+
+

{title}

+

{description}

+
+
    + {(actions ?? []).map((action, i) => ( +
  • {action}
    • + ))} +
+
+ ); +};