@liorian/sdk 0.28.0-alpha.56010ca

package/src/presentation/nav-main.tsx

@@ -0,0 +1,62 @@
+"use client"
+
+import {Button} from "./ui/button"
+import {
+    SidebarGroup,
+    SidebarGroupContent,
+    SidebarMenu,
+    SidebarMenuButton,
+    SidebarMenuItem,
+} from "./ui/sidebar"
+import {CirclePlusIcon, MailIcon} from "lucide-react"
+import Link from "next/link";
+
+export function NavMain({
+                            items,
+                        }: {
+    items: {
+        title: string
+        url: string
+        icon?: React.ReactNode
+    }[]
+}) {
+    return (
+        <SidebarGroup>
+            <SidebarGroupContent className="flex flex-col gap-2">
+                <SidebarMenu>
+                    <SidebarMenuItem className="flex items-center gap-2">
+                        <SidebarMenuButton
+                            tooltip="Quick Create"
+                            className="min-w-8 bg-primary text-primary-foreground duration-200 ease-linear hover:bg-primary/90 hover:text-primary-foreground active:bg-primary/90 active:text-primary-foreground"
+                        >
+                            <CirclePlusIcon
+                            />
+                            <span>Accès rapide</span>
+                        </SidebarMenuButton>
+                        <Button
+                            size="icon"
+                            className="size-8 group-data-[collapsible=icon]:opacity-0"
+                            variant="outline"
+                        >
+                            <MailIcon
+                            />
+                            <span className="sr-only">Inbox</span>
+                        </Button>
+                    </SidebarMenuItem>
+                </SidebarMenu>
+                <SidebarMenu>
+                    {items.map((item) => (
+                        <SidebarMenuItem key={item.title}>
+                            <Link href={item.url}>
+                                <SidebarMenuButton tooltip={item.title}>
+                                    {item.icon}
+                                    <span>{item.title}</span>
+                                </SidebarMenuButton>
+                            </Link>
+                        </SidebarMenuItem>
+                    ))}
+                </SidebarMenu>
+            </SidebarGroupContent>
+        </SidebarGroup>
+    )
+}

package/src/presentation/nav-secondary.tsx

@@ -0,0 +1,41 @@
+"use client"
+
+import * as React from "react"
+
+import {
+  SidebarGroup,
+  SidebarGroupContent,
+  SidebarMenu,
+  SidebarMenuButton,
+  SidebarMenuItem,
+} from "./ui/sidebar"
+
+export function NavSecondary({
+  items,
+  ...props
+}: {
+  items: {
+    title: string
+    url: string
+    icon: React.ReactNode
+  }[]
+} & React.ComponentPropsWithoutRef<typeof SidebarGroup>) {
+  return (
+    <SidebarGroup {...props}>
+      <SidebarGroupContent>
+        <SidebarMenu>
+          {items.map((item) => (
+            <SidebarMenuItem key={item.title}>
+              <SidebarMenuButton asChild>
+                <a href={item.url}>
+                  {item.icon}
+                  <span>{item.title}</span>
+                </a>
+              </SidebarMenuButton>
+            </SidebarMenuItem>
+          ))}
+        </SidebarMenu>
+      </SidebarGroupContent>
+    </SidebarGroup>
+  )
+}

package/src/presentation/nav-user.tsx

@@ -0,0 +1,109 @@
+"use client"
+
+import {
+  Avatar,
+  AvatarFallback,
+  AvatarImage,
+} from "./ui/avatar"
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuGroup,
+  DropdownMenuItem,
+  DropdownMenuLabel,
+  DropdownMenuSeparator,
+  DropdownMenuTrigger,
+} from "./ui/dropdown-menu"
+import {
+  SidebarMenu,
+  SidebarMenuButton,
+  SidebarMenuItem,
+  useSidebar,
+} from "./ui/sidebar"
+import { EllipsisVerticalIcon, CircleUserRoundIcon, CreditCardIcon, BellIcon, LogOutIcon } from "lucide-react"
+import {useAuth} from "../infrastructure/hooks/use-auth";
+
+export function NavUser({
+  user,
+}: {
+  user: {
+    name: string
+    email: string
+    avatar: string
+  }
+}) {
+  const { isMobile } = useSidebar()
+  const { logout } = useAuth()
+
+  return (
+    <SidebarMenu>
+      <SidebarMenuItem>
+        <DropdownMenu>
+          <DropdownMenuTrigger asChild>
+            <SidebarMenuButton
+              size="lg"
+              className="data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground"
+            >
+              <Avatar className="h-8 w-8 rounded-lg grayscale">
+                <AvatarImage src={user.avatar} alt={user.name} />
+                <AvatarFallback className="rounded-lg">CN</AvatarFallback>
+              </Avatar>
+              <div className="grid flex-1 text-left text-sm leading-tight">
+                <span className="truncate font-medium">{user.name}</span>
+                <span className="truncate text-xs text-muted-foreground">
+                  {user.email}
+                </span>
+              </div>
+              <EllipsisVerticalIcon className="ml-auto size-4" />
+            </SidebarMenuButton>
+          </DropdownMenuTrigger>
+          <DropdownMenuContent
+            className="w-(--radix-dropdown-menu-trigger-width) min-w-56 rounded-lg"
+            side={isMobile ? "bottom" : "right"}
+            align="end"
+            sideOffset={4}
+          >
+            <DropdownMenuLabel className="p-0 font-normal">
+              <div className="flex items-center gap-2 px-1 py-1.5 text-left text-sm">
+                <Avatar className="h-8 w-8 rounded-lg">
+                  <AvatarImage src={user.avatar} alt={user.name} />
+                  <AvatarFallback className="rounded-lg">CN</AvatarFallback>
+                </Avatar>
+                <div className="grid flex-1 text-left text-sm leading-tight">
+                  <span className="truncate font-medium">{user.name}</span>
+                  <span className="truncate text-xs text-muted-foreground">
+                    {user.email}
+                  </span>
+                </div>
+              </div>
+            </DropdownMenuLabel>
+            <DropdownMenuSeparator />
+            <DropdownMenuGroup>
+              <DropdownMenuItem>
+                <CircleUserRoundIcon
+                />
+                Account
+              </DropdownMenuItem>
+              <DropdownMenuItem>
+                <CreditCardIcon
+                />
+                Billing
+              </DropdownMenuItem>
+              <DropdownMenuItem>
+                <BellIcon
+                />
+                Notifications
+              </DropdownMenuItem>
+            </DropdownMenuGroup>
+            <DropdownMenuSeparator />
+            <DropdownMenuItem onClick={logout} className="cursor-pointer">
+              <LogOutIcon
+              />
+              Log out
+            </DropdownMenuItem>
+          </DropdownMenuContent>
+        </DropdownMenu>
+      </SidebarMenuItem>
+    </SidebarMenu>
+  )
+}

package/src/presentation/permission-action-badge.tsx

@@ -0,0 +1,35 @@
+import {explainActivityAction} from "../infrastructure/utilities/activities.util";
+import {cn} from "../infrastructure/utilities/utils";
+
+
+export interface PermissionActionBadgeProps {
+    action?: string
+}
+
+
+export function PermissionActionBadge({action}: PermissionActionBadgeProps) {
+    if(!action) return;
+
+    let className = ''
+    switch (action?.toLowerCase()) {
+        case 'get':
+            className = 'bg-blue-500/10 text-blue-500 border-blue-500/30'
+            break
+        case 'post':
+            className = 'bg-green-500/10 text-green-500 border-green-500/30'
+            break
+        case 'put':
+        case 'patch':
+            className = 'bg-yellow-500/10 text-yellow-500 border-yellow-500/30'
+            break
+        case 'delete':
+            className = 'bg-red-500/10 text-red-500 border-red-500/30'
+            break
+    }
+
+    return (
+        <div className={cn('text-xs px-2.5 py-1 border rounded-full', className)}>
+            {explainActivityAction(action)}
+        </div>
+    )
+}

package/src/presentation/reui/index.tsx

@@ -0,0 +1,3 @@
+// @liorian/sdk/presentation/reui — reusable UI primitives (stepper, timeline).
+export * from "./stepper";
+export * from "./timeline";