@classytic/fluid 0.4.2 → 0.5.0

package/dist/layouts.d.mts

@@ -1,8 +1,47 @@
-import * as react_jsx_runtime0 from "react/jsx-runtime";
-import * as react from "react";
+import * as React$1 from "react";
 import { ReactNode } from "react";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
 import { LucideIcon } from "lucide-react";
 
+//#region src/components/context-menu-wrapper.d.ts
+interface ContextMenuAction {
+  type?: "item" | "separator" | "label" | "checkbox" | "radio-group" | "submenu";
+  key?: string;
+  label?: string;
+  icon?: LucideIcon;
+  onClick?: () => void;
+  disabled?: boolean;
+  hidden?: boolean;
+  variant?: "default" | "destructive";
+  shortcut?: string;
+  /** For checkbox items */
+  checked?: boolean;
+  onCheckedChange?: (checked: boolean) => void;
+  /** For radio groups */
+  radioValue?: string;
+  onRadioChange?: (value: string) => void;
+  radioOptions?: {
+    value: string;
+    label: string;
+  }[];
+  /** For submenus */
+  items?: ContextMenuAction[];
+}
+interface ContextMenuWrapperProps {
+  children: React$1.ReactNode;
+  items: ContextMenuAction[];
+  className?: string;
+  contentClassName?: string;
+  disabled?: boolean;
+}
+declare function ContextMenuWrapper({
+  children,
+  items,
+  className,
+  contentClassName,
+  disabled
+}: ContextMenuWrapperProps): react_jsx_runtime0.JSX.Element;
+//#endregion
 //#region src/components/drawer-wrapper.d.ts
 declare const DRAWER_SIZE_CLASSES: {
   readonly horizontal: {
@@ -50,7 +89,7 @@ interface DrawerWrapperProps {
   /** Whether drawer should scale background */
   shouldScaleBackground?: boolean;
 }
-declare const DrawerWrapper: react.NamedExoticComponent<DrawerWrapperProps>;
+declare const DrawerWrapper: React$1.NamedExoticComponent<DrawerWrapperProps>;
 interface FormDrawerProps extends Omit<DrawerWrapperProps, "footer"> {
   onSubmit?: () => void;
   onCancel?: () => void;
@@ -59,7 +98,7 @@ interface FormDrawerProps extends Omit<DrawerWrapperProps, "footer"> {
   submitDisabled?: boolean;
   submitLoading?: boolean;
 }
-declare const FormDrawer: react.NamedExoticComponent<FormDrawerProps>;
+declare const FormDrawer: React$1.NamedExoticComponent<FormDrawerProps>;
 interface ConfirmDrawerProps extends Omit<DrawerWrapperProps, "footer"> {
   onConfirm?: () => void;
   onCancel?: () => void;
@@ -69,7 +108,54 @@ interface ConfirmDrawerProps extends Omit<DrawerWrapperProps, "footer"> {
   confirmDisabled?: boolean;
   confirmLoading?: boolean;
 }
-declare const ConfirmDrawer: react.NamedExoticComponent<ConfirmDrawerProps>;
+declare const ConfirmDrawer: React$1.NamedExoticComponent<ConfirmDrawerProps>;
+//#endregion
+//#region src/components/hover-card-wrapper.d.ts
+interface HoverCardWrapperProps {
+  trigger: React$1.ReactNode;
+  children: React$1.ReactNode;
+  side?: "top" | "bottom" | "left" | "right";
+  align?: "start" | "center" | "end";
+  sideOffset?: number;
+  className?: string;
+  contentClassName?: string;
+  /** Delay before opening (ms) */
+  openDelay?: number;
+  /** Delay before closing (ms) */
+  closeDelay?: number;
+}
+declare function HoverCardWrapper({
+  trigger,
+  children,
+  side,
+  align,
+  sideOffset,
+  className,
+  contentClassName,
+  openDelay,
+  closeDelay
+}: HoverCardWrapperProps): react_jsx_runtime0.JSX.Element;
+interface UserHoverCardProps {
+  trigger: React$1.ReactNode;
+  user: {
+    name: string;
+    username?: string;
+    avatar?: string;
+    bio?: string;
+    initials?: string;
+  };
+  /** Extra content below bio */
+  footer?: React$1.ReactNode;
+  side?: "top" | "bottom" | "left" | "right";
+  className?: string;
+}
+declare function UserHoverCard({
+  trigger,
+  user,
+  footer,
+  side,
+  className
+}: UserHoverCardProps): react_jsx_runtime0.JSX.Element;
 //#endregion
 //#region src/components/navigation-bar.d.ts
 interface NavBarLink {
@@ -91,13 +177,13 @@ interface NavBarDropdown {
     title: string;
     description: string;
     href: string;
-    icon?: react.ReactNode;
+    icon?: React$1.ReactNode;
   };
 }
 type NavBarItem = NavBarLink | NavBarDropdown;
 interface NavBarBrand {
   title: string;
-  icon?: react.ReactNode;
+  icon?: React$1.ReactNode;
   href?: string;
 }
 interface NavigationBarProps {
@@ -106,7 +192,7 @@ interface NavigationBarProps {
   /** Navigation items */
   items: NavBarItem[];
   /** Right-side content (e.g., auth buttons, avatar) */
-  actions?: react.ReactNode;
+  actions?: React$1.ReactNode;
   /** Sticky positioning */
   sticky?: boolean;
   /** Show border at bottom */
@@ -126,90 +212,4 @@ declare function NavigationBar({
   mobileBreakpoint
 }: NavigationBarProps): react_jsx_runtime0.JSX.Element;
 //#endregion
-//#region src/components/context-menu-wrapper.d.ts
-interface ContextMenuAction {
-  type?: "item" | "separator" | "label" | "checkbox" | "radio-group" | "submenu";
-  key?: string;
-  label?: string;
-  icon?: LucideIcon;
-  onClick?: () => void;
-  disabled?: boolean;
-  hidden?: boolean;
-  variant?: "default" | "destructive";
-  shortcut?: string;
-  /** For checkbox items */
-  checked?: boolean;
-  onCheckedChange?: (checked: boolean) => void;
-  /** For radio groups */
-  radioValue?: string;
-  onRadioChange?: (value: string) => void;
-  radioOptions?: {
-    value: string;
-    label: string;
-  }[];
-  /** For submenus */
-  items?: ContextMenuAction[];
-}
-interface ContextMenuWrapperProps {
-  children: react.ReactNode;
-  items: ContextMenuAction[];
-  className?: string;
-  contentClassName?: string;
-  disabled?: boolean;
-}
-declare function ContextMenuWrapper({
-  children,
-  items,
-  className,
-  contentClassName,
-  disabled
-}: ContextMenuWrapperProps): react_jsx_runtime0.JSX.Element;
-//#endregion
-//#region src/components/hover-card-wrapper.d.ts
-interface HoverCardWrapperProps {
-  trigger: react.ReactNode;
-  children: react.ReactNode;
-  side?: "top" | "bottom" | "left" | "right";
-  align?: "start" | "center" | "end";
-  sideOffset?: number;
-  className?: string;
-  contentClassName?: string;
-  /** Delay before opening (ms) */
-  openDelay?: number;
-  /** Delay before closing (ms) */
-  closeDelay?: number;
-}
-declare function HoverCardWrapper({
-  trigger,
-  children,
-  side,
-  align,
-  sideOffset,
-  className,
-  contentClassName,
-  openDelay,
-  closeDelay
-}: HoverCardWrapperProps): react_jsx_runtime0.JSX.Element;
-interface UserHoverCardProps {
-  trigger: react.ReactNode;
-  user: {
-    name: string;
-    username?: string;
-    avatar?: string;
-    bio?: string;
-    initials?: string;
-  };
-  /** Extra content below bio */
-  footer?: react.ReactNode;
-  side?: "top" | "bottom" | "left" | "right";
-  className?: string;
-}
-declare function UserHoverCard({
-  trigger,
-  user,
-  footer,
-  side,
-  className
-}: UserHoverCardProps): react_jsx_runtime0.JSX.Element;
-//#endregion
 export { ConfirmDrawer, type ConfirmDrawerProps, type ContextMenuAction, ContextMenuWrapper, type ContextMenuWrapperProps, DrawerWrapper, type DrawerWrapperProps, FormDrawer, type FormDrawerProps, HoverCardWrapper, type HoverCardWrapperProps, type NavBarBrand, type NavBarDropdown, type NavBarItem, type NavBarLink, NavigationBar, type NavigationBarProps, UserHoverCard, type UserHoverCardProps };

package/dist/layouts.mjs

@@ -1,19 +1,64 @@
 "use client";
 
 import { t as cn } from "./utils-DQ5SCVoW.mjs";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import * as React$1 from "react";
 import { memo, useCallback, useMemo } from "react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import { Menu, XIcon } from "lucide-react";
 import { Button } from "@/components/ui/button";
 import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar";
 import { Sheet, SheetContent, SheetDescription, SheetTitle, SheetTrigger } from "@/components/ui/sheet";
 import Link from "next/link";
-import { Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerTitle, DrawerTrigger } from "@/components/ui/drawer";
-import { NavigationMenu, NavigationMenuContent, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, navigationMenuTriggerStyle } from "@/components/ui/navigation-menu";
 import { ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger } from "@/components/ui/context-menu";
+import { Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerTitle, DrawerTrigger } from "@/components/ui/drawer";
 import { HoverCard, HoverCardContent, HoverCardTrigger } from "@/components/ui/hover-card";
+import { NavigationMenu, NavigationMenuContent, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, navigationMenuTriggerStyle } from "@/components/ui/navigation-menu";
+
+//#region src/components/context-menu-wrapper.tsx
+function ContextMenuWrapper({ children, items, className, contentClassName, disabled = false }) {
+	if (disabled) return /* @__PURE__ */ jsx(Fragment$1, { children });
+	return /* @__PURE__ */ jsxs(ContextMenu, { children: [/* @__PURE__ */ jsx(ContextMenuTrigger, {
+		className,
+		children
+	}), /* @__PURE__ */ jsx(ContextMenuContent, {
+		className: cn("min-w-[180px]", contentClassName),
+		children: items.map((item, index) => renderContextItem(item, index))
+	})] });
+}
+function renderContextItem(item, index) {
+	if (item.hidden) return null;
+	const key = item.key || `ctx-${index}`;
+	if (item.type === "separator") return /* @__PURE__ */ jsx(ContextMenuSeparator, {}, key);
+	if (item.type === "label") return /* @__PURE__ */ jsx(ContextMenuGroup, { children: /* @__PURE__ */ jsx(ContextMenuLabel, { children: item.label }) }, key);
+	if (item.type === "checkbox") return /* @__PURE__ */ jsxs(ContextMenuCheckboxItem, {
+		checked: item.checked,
+		onCheckedChange: item.onCheckedChange,
+		disabled: item.disabled,
+		children: [item.label, item.shortcut && /* @__PURE__ */ jsx(ContextMenuShortcut, { children: item.shortcut })]
+	}, key);
+	if (item.type === "radio-group" && item.radioOptions) return /* @__PURE__ */ jsxs(ContextMenuRadioGroup, {
+		value: item.radioValue,
+		onValueChange: item.onRadioChange,
+		children: [item.label && /* @__PURE__ */ jsx(ContextMenuLabel, { children: item.label }), item.radioOptions.map((opt) => /* @__PURE__ */ jsx(ContextMenuRadioItem, {
+			value: opt.value,
+			children: opt.label
+		}, opt.value))]
+	}, key);
+	if (item.type === "submenu" && item.items) return /* @__PURE__ */ jsxs(ContextMenuSub, { children: [/* @__PURE__ */ jsxs(ContextMenuSubTrigger, { children: [item.icon && /* @__PURE__ */ jsx(item.icon, { className: "h-4 w-4" }), item.label] }), /* @__PURE__ */ jsx(ContextMenuSubContent, { children: item.items.map((subItem, subIdx) => renderContextItem(subItem, subIdx)) })] }, key);
+	const Icon = item.icon;
+	return /* @__PURE__ */ jsxs(ContextMenuItem, {
+		onClick: item.onClick,
+		disabled: item.disabled,
+		variant: item.variant,
+		children: [
+			Icon && /* @__PURE__ */ jsx(Icon, { className: "h-4 w-4" }),
+			/* @__PURE__ */ jsx("span", { children: item.label }),
+			item.shortcut && /* @__PURE__ */ jsx(ContextMenuShortcut, { children: item.shortcut })
+		]
+	}, key);
+}
 
+//#endregion
 //#region src/components/drawer-wrapper.tsx
 const DRAWER_SIZE_CLASSES = {
 	horizontal: {
@@ -149,6 +194,62 @@ const ConfirmDrawer = memo(function ConfirmDrawer({ open, onOpenChange, title =
 	});
 });
 
+//#endregion
+//#region src/components/hover-card-wrapper.tsx
+function HoverCardWrapper({ trigger, children, side = "bottom", align = "center", sideOffset = 4, className, contentClassName, openDelay, closeDelay }) {
+	return /* @__PURE__ */ jsxs(HoverCard, {
+		openDelay,
+		closeDelay,
+		children: [/* @__PURE__ */ jsx(HoverCardTrigger, {
+			className,
+			children: trigger
+		}), /* @__PURE__ */ jsx(HoverCardContent, {
+			side,
+			align,
+			sideOffset,
+			className: cn("w-80", contentClassName),
+			children
+		})]
+	});
+}
+function UserHoverCard({ trigger, user, footer, side = "bottom", className }) {
+	const initials = user.initials || user.name.split(" ").map((n) => n[0]).join("").slice(0, 2).toUpperCase();
+	return /* @__PURE__ */ jsxs(HoverCardWrapper, {
+		trigger,
+		side,
+		className,
+		children: [/* @__PURE__ */ jsxs("div", {
+			className: "flex gap-3",
+			children: [/* @__PURE__ */ jsxs(Avatar, {
+				className: "h-10 w-10 shrink-0",
+				children: [user.avatar && /* @__PURE__ */ jsx(AvatarImage, {
+					src: user.avatar,
+					alt: user.name
+				}), /* @__PURE__ */ jsx(AvatarFallback, { children: initials })]
+			}), /* @__PURE__ */ jsxs("div", {
+				className: "space-y-1 min-w-0",
+				children: [
+					/* @__PURE__ */ jsx("h4", {
+						className: "text-sm font-semibold truncate",
+						children: user.name
+					}),
+					user.username && /* @__PURE__ */ jsxs("p", {
+						className: "text-xs text-muted-foreground",
+						children: ["@", user.username]
+					}),
+					user.bio && /* @__PURE__ */ jsx("p", {
+						className: "text-sm text-muted-foreground line-clamp-2",
+						children: user.bio
+					})
+				]
+			})]
+		}), footer && /* @__PURE__ */ jsx("div", {
+			className: "mt-3 pt-3 border-t",
+			children: footer
+		})]
+	});
+}
+
 //#endregion
 //#region src/components/navigation-bar.tsx
 function isDropdown(item) {
@@ -164,7 +265,7 @@ function DropdownContent({ item }) {
 		children: [item.featured && /* @__PURE__ */ jsx("div", {
 			className: "w-[180px] shrink-0",
 			children: /* @__PURE__ */ jsxs(NavigationMenuLink, {
-				href: item.featured.href,
+				render: /* @__PURE__ */ jsx(Link, { href: item.featured.href }),
 				className: "flex h-full flex-col justify-end rounded-lg bg-gradient-to-b from-muted/50 to-muted p-4",
 				children: [
 					item.featured.icon && /* @__PURE__ */ jsx("div", {
@@ -186,7 +287,11 @@ function DropdownContent({ item }) {
 			children: item.items.map((link) => {
 				const Icon = link.icon;
 				return /* @__PURE__ */ jsxs(NavigationMenuLink, {
-					href: link.href,
+					render: link.external ? /* @__PURE__ */ jsx("a", {
+						href: link.href,
+						target: "_blank",
+						rel: "noopener noreferrer"
+					}) : /* @__PURE__ */ jsx(Link, { href: link.href }),
 					className: cn("block select-none rounded-md p-2.5", link.isActive && "bg-accent/50"),
 					children: [/* @__PURE__ */ jsxs("div", {
 						className: "flex items-center gap-2",
@@ -327,12 +432,13 @@ function NavigationBar({ brand, items, actions, sticky = true, bordered = true,
 					children: /* @__PURE__ */ jsx(NavigationMenuList, { children: items.map((item, idx) => {
 						if (isDropdown(item)) return /* @__PURE__ */ jsxs(NavigationMenuItem, { children: [/* @__PURE__ */ jsx(NavigationMenuTrigger, { children: item.title }), /* @__PURE__ */ jsx(NavigationMenuContent, { children: /* @__PURE__ */ jsx(DropdownContent, { item }) })] }, `nav-dropdown-${idx}`);
 						return /* @__PURE__ */ jsx(NavigationMenuItem, { children: /* @__PURE__ */ jsx(NavigationMenuLink, {
-							href: item.href,
-							className: cn(navigationMenuTriggerStyle(), item.isActive && "bg-accent/50"),
-							...item.external ? {
+							render: item.external ? /* @__PURE__ */ jsx("a", {
+								href: item.href,
 								target: "_blank",
 								rel: "noopener noreferrer"
-							} : {},
+							}) : /* @__PURE__ */ jsx(Link, { href: item.href }),
+							className: cn(navigationMenuTriggerStyle(), item.isActive && "bg-accent/50"),
+							"aria-current": item.isActive ? "page" : void 0,
 							children: item.title
 						}) }, item.href);
 					}) })
@@ -355,106 +461,5 @@ function NavigationBar({ brand, items, actions, sticky = true, bordered = true,
 	});
 }
 
-//#endregion
-//#region src/components/context-menu-wrapper.tsx
-function ContextMenuWrapper({ children, items, className, contentClassName, disabled = false }) {
-	if (disabled) return /* @__PURE__ */ jsx(Fragment, { children });
-	return /* @__PURE__ */ jsxs(ContextMenu, { children: [/* @__PURE__ */ jsx(ContextMenuTrigger, {
-		className,
-		children
-	}), /* @__PURE__ */ jsx(ContextMenuContent, {
-		className: cn("min-w-[180px]", contentClassName),
-		children: items.map((item, index) => renderContextItem(item, index))
-	})] });
-}
-function renderContextItem(item, index) {
-	if (item.hidden) return null;
-	const key = item.key || `ctx-${index}`;
-	if (item.type === "separator") return /* @__PURE__ */ jsx(ContextMenuSeparator, {}, key);
-	if (item.type === "label") return /* @__PURE__ */ jsx(ContextMenuGroup, { children: /* @__PURE__ */ jsx(ContextMenuLabel, { children: item.label }) }, key);
-	if (item.type === "checkbox") return /* @__PURE__ */ jsxs(ContextMenuCheckboxItem, {
-		checked: item.checked,
-		onCheckedChange: item.onCheckedChange,
-		disabled: item.disabled,
-		children: [item.label, item.shortcut && /* @__PURE__ */ jsx(ContextMenuShortcut, { children: item.shortcut })]
-	}, key);
-	if (item.type === "radio-group" && item.radioOptions) return /* @__PURE__ */ jsxs(ContextMenuRadioGroup, {
-		value: item.radioValue,
-		onValueChange: item.onRadioChange,
-		children: [item.label && /* @__PURE__ */ jsx(ContextMenuLabel, { children: item.label }), item.radioOptions.map((opt) => /* @__PURE__ */ jsx(ContextMenuRadioItem, {
-			value: opt.value,
-			children: opt.label
-		}, opt.value))]
-	}, key);
-	if (item.type === "submenu" && item.items) return /* @__PURE__ */ jsxs(ContextMenuSub, { children: [/* @__PURE__ */ jsxs(ContextMenuSubTrigger, { children: [item.icon && /* @__PURE__ */ jsx(item.icon, { className: "h-4 w-4" }), item.label] }), /* @__PURE__ */ jsx(ContextMenuSubContent, { children: item.items.map((subItem, subIdx) => renderContextItem(subItem, subIdx)) })] }, key);
-	const Icon = item.icon;
-	return /* @__PURE__ */ jsxs(ContextMenuItem, {
-		onClick: item.onClick,
-		disabled: item.disabled,
-		variant: item.variant,
-		children: [
-			Icon && /* @__PURE__ */ jsx(Icon, { className: "h-4 w-4" }),
-			/* @__PURE__ */ jsx("span", { children: item.label }),
-			item.shortcut && /* @__PURE__ */ jsx(ContextMenuShortcut, { children: item.shortcut })
-		]
-	}, key);
-}
-
-//#endregion
-//#region src/components/hover-card-wrapper.tsx
-function HoverCardWrapper({ trigger, children, side = "bottom", align = "center", sideOffset = 4, className, contentClassName, openDelay, closeDelay }) {
-	return /* @__PURE__ */ jsxs(HoverCard, {
-		openDelay,
-		closeDelay,
-		children: [/* @__PURE__ */ jsx(HoverCardTrigger, {
-			className,
-			children: trigger
-		}), /* @__PURE__ */ jsx(HoverCardContent, {
-			side,
-			align,
-			sideOffset,
-			className: cn("w-80", contentClassName),
-			children
-		})]
-	});
-}
-function UserHoverCard({ trigger, user, footer, side = "bottom", className }) {
-	const initials = user.initials || user.name.split(" ").map((n) => n[0]).join("").slice(0, 2).toUpperCase();
-	return /* @__PURE__ */ jsxs(HoverCardWrapper, {
-		trigger,
-		side,
-		className,
-		children: [/* @__PURE__ */ jsxs("div", {
-			className: "flex gap-3",
-			children: [/* @__PURE__ */ jsxs(Avatar, {
-				className: "h-10 w-10 shrink-0",
-				children: [user.avatar && /* @__PURE__ */ jsx(AvatarImage, {
-					src: user.avatar,
-					alt: user.name
-				}), /* @__PURE__ */ jsx(AvatarFallback, { children: initials })]
-			}), /* @__PURE__ */ jsxs("div", {
-				className: "space-y-1 min-w-0",
-				children: [
-					/* @__PURE__ */ jsx("h4", {
-						className: "text-sm font-semibold truncate",
-						children: user.name
-					}),
-					user.username && /* @__PURE__ */ jsxs("p", {
-						className: "text-xs text-muted-foreground",
-						children: ["@", user.username]
-					}),
-					user.bio && /* @__PURE__ */ jsx("p", {
-						className: "text-sm text-muted-foreground line-clamp-2",
-						children: user.bio
-					})
-				]
-			})]
-		}), footer && /* @__PURE__ */ jsx("div", {
-			className: "mt-3 pt-3 border-t",
-			children: footer
-		})]
-	});
-}
-
 //#endregion
 export { ConfirmDrawer, ContextMenuWrapper, DrawerWrapper, FormDrawer, HoverCardWrapper, NavigationBar, UserHoverCard };