@locusgraph/components 0.1.1 → 0.2.0

package/dist/overlay/context-menu/context-menu-sub.js

@@ -1,7 +1,7 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { ChevronRight as ChevronRightIcon } from "@carbon/icons-react";
 import { cn } from "cn";
-import { ChevronRightIcon } from "lucide-react";
 import * as ContextMenuPrimitive from "radix-ui/context-menu";
 function ContextMenuSub({ ...props }) {
     return _jsx(ContextMenuPrimitive.Sub, { "data-slot": "context-menu-sub", ...props });
@@ -10,6 +10,6 @@ function ContextMenuSubTrigger({ className, inset, children, ...props }) {
     return (_jsxs(ContextMenuPrimitive.SubTrigger, { "data-slot": "context-menu-sub-trigger", "data-inset": inset, className: cn("flex cursor-default items-center rounded-sm px-2 py-1.5 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground data-[inset]:pl-8 data-[state=open]:bg-accent data-[state=open]:text-accent-foreground [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-muted-foreground", className), ...props, children: [children, _jsx(ChevronRightIcon, { className: "ml-auto" })] }));
 }
 function ContextMenuSubContent({ className, ...props }) {
-    return (_jsx(ContextMenuPrimitive.SubContent, { "data-slot": "context-menu-sub-content", className: cn("z-50 min-w-[8rem] origin-(--radix-context-menu-content-transform-origin) overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-lg data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95", className), ...props }));
+    return (_jsx(ContextMenuPrimitive.SubContent, { "data-slot": "context-menu-sub-content", className: cn("z-50 min-w-[8rem] origin-(--radix-context-menu-content-transform-origin) overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-overlay data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95", className), ...props }));
 }
 export { ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger };

package/dist/overlay/context-menu/context-menu.js

@@ -15,6 +15,6 @@ function ContextMenuPortal({ ...props }) {
     return _jsx(ContextMenuPrimitive.Portal, { "data-slot": "context-menu-portal", ...props });
 }
 function ContextMenuContent({ className, ...props }) {
-    return (_jsx(ContextMenuPrimitive.Portal, { children: _jsx(ContextMenuPrimitive.Content, { "data-slot": "context-menu-content", className: cn("z-50 max-h-(--radix-context-menu-content-available-height) min-w-[8rem] origin-(--radix-context-menu-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border bg-popover p-1 text-popover-foreground shadow-md data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95", className), ...props }) }));
+    return (_jsx(ContextMenuPrimitive.Portal, { children: _jsx(ContextMenuPrimitive.Content, { "data-slot": "context-menu-content", className: cn("z-50 max-h-(--radix-context-menu-content-available-height) min-w-[8rem] origin-(--radix-context-menu-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border bg-popover p-1 text-popover-foreground shadow-overlay data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95", className), ...props }) }));
 }
 export { ContextMenu, ContextMenuContent, ContextMenuGroup, ContextMenuPortal, ContextMenuTrigger };

package/dist/overlay/dialog.js

@@ -1,7 +1,7 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Close as XIcon } from "@carbon/icons-react";
 import { cn } from "cn";
-import { XIcon } from "lucide-react";
 import * as DialogPrimitive from "radix-ui/dialog";
 function Dialog({ ...props }) {
     return _jsx(DialogPrimitive.Root, { "data-slot": "dialog", ...props });
@@ -16,10 +16,10 @@ function DialogClose({ ...props }) {
     return _jsx(DialogPrimitive.Close, { "data-slot": "dialog-close", ...props });
 }
 function DialogOverlay({ className, ...props }) {
-    return (_jsx(DialogPrimitive.Overlay, { "data-slot": "dialog-overlay", className: cn("fixed inset-0 z-[300] bg-black/40 backdrop-blur-sm data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:animate-in data-[state=open]:fade-in-0", className), ...props }));
+    return (_jsx(DialogPrimitive.Overlay, { "data-slot": "dialog-overlay", className: cn("fixed inset-0 z-[300] bg-scrim backdrop-blur-[2px] data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:animate-in data-[state=open]:fade-in-0", className), ...props }));
 }
 function DialogContent({ className, children, showCloseButton = true, ...props }) {
-    return (_jsxs(DialogPortal, { children: [_jsx(DialogOverlay, {}), _jsxs(DialogPrimitive.Content, { "data-slot": "dialog-content", className: cn("fixed top-[50%] left-[50%] z-[300] flex max-h-[calc(100dvh-4rem)] w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] flex-col overflow-hidden rounded-lg border border-line bg-background shadow-lg duration-200 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95 sm:max-w-lg", className), ...props, children: [children, showCloseButton ? (_jsxs(DialogPrimitive.Close, { "data-slot": "dialog-close", className: "absolute top-4 right-4 rounded-sm text-soft opacity-70 transition-opacity hover:text-foreground hover:opacity-100 focus-visible:ring-2 focus-visible:ring-ring focus-visible:outline-hidden", children: [_jsx(XIcon, { className: "size-4" }), _jsx("span", { className: "sr-only", children: "Close" })] })) : null] })] }));
+    return (_jsxs(DialogPortal, { children: [_jsx(DialogOverlay, {}), _jsxs(DialogPrimitive.Content, { "data-slot": "dialog-content", className: cn("fixed top-[50%] left-[50%] z-[300] flex max-h-[calc(100dvh-4rem)] w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] flex-col overflow-hidden rounded-lg border border-line bg-popover shadow-overlay duration-200 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95 sm:max-w-lg", className), ...props, children: [children, showCloseButton ? (_jsxs(DialogPrimitive.Close, { "data-slot": "dialog-close", className: "absolute top-4 right-4 rounded-sm text-soft opacity-70 transition-opacity hover:text-foreground hover:opacity-100 focus-visible:ring-2 focus-visible:ring-ring focus-visible:outline-hidden", children: [_jsx(XIcon, { className: "size-4" }), _jsx("span", { className: "sr-only", children: "Close" })] })) : null] })] }));
 }
 const clearOfCloseButton = "pr-12";
 function DialogHeader({ className, ...props }) {
@@ -29,7 +29,7 @@ function DialogBody({ className, ...props }) {
     return (_jsx("div", { "data-slot": "dialog-body", className: cn("no-scrollbar min-h-0 flex-1 space-y-4 overflow-y-auto px-6", className), ...props }));
 }
 function DialogFooter({ className, ...props }) {
-    return (_jsx("div", { "data-slot": "dialog-footer", className: cn("mt-auto flex flex-col-reverse gap-2 px-6 pt-4 pb-6 sm:flex-row", className), ...props }));
+    return (_jsx("div", { "data-slot": "dialog-footer", className: cn("mt-auto flex flex-col-reverse gap-2 px-6 pt-4 pb-6 sm:flex-row sm:justify-end", className), ...props }));
 }
 function DialogTitle({ className, ...props }) {
     return (_jsx(DialogPrimitive.Title, { "data-slot": "dialog-title", className: cn("text-base font-semibold tracking-tight", className), ...props }));

package/dist/overlay/floating/command.js

@@ -1,17 +1,17 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Search as SearchIcon } from "@carbon/icons-react";
 import { Command as CommandPrimitive } from "cmdk";
 import { cn } from "cn";
-import { SearchIcon } from "lucide-react";
 import { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle } from "../dialog.js";
 function Command({ className, ...props }) {
     return (_jsx(CommandPrimitive, { "data-slot": "command", className: cn("flex h-full w-full flex-col overflow-hidden rounded-md bg-popover text-popover-foreground", className), ...props }));
 }
-function CommandDialog({ title = "Command Palette", description = "Search for a command to run...", children, className, showCloseButton = true, ...props }) {
-    return (_jsxs(Dialog, { ...props, children: [_jsxs(DialogHeader, { className: "sr-only", children: [_jsx(DialogTitle, { children: title }), _jsx(DialogDescription, { children: description })] }), _jsx(DialogContent, { className: cn("overflow-hidden p-0", className), showCloseButton: showCloseButton, children: _jsx(Command, { className: "**:data-[slot=command-input-wrapper]:h-12 [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-muted-foreground [&_[cmdk-group]]:px-2 [&_[cmdk-group]:not([hidden])_~[cmdk-group]]:pt-0 [&_[cmdk-input-wrapper]_svg]:h-5 [&_[cmdk-input-wrapper]_svg]:w-5 [&_[cmdk-input]]:h-12 [&_[cmdk-item]]:px-2 [&_[cmdk-item]]:py-3 [&_[cmdk-item]_svg]:h-5 [&_[cmdk-item]_svg]:w-5", children: children }) })] }));
+function CommandDialog({ title = "Command Palette", description = "Search for a command to run...", children, className, showCloseButton = false, ...props }) {
+    return (_jsxs(Dialog, { ...props, children: [_jsxs(DialogHeader, { className: "sr-only", children: [_jsx(DialogTitle, { children: title }), _jsx(DialogDescription, { children: description })] }), _jsx(DialogContent, { className: cn("overflow-hidden p-0", className), showCloseButton: showCloseButton, children: _jsx(Command, { className: "**:data-[slot=command-input-wrapper]:h-12 [&_[cmdk-group]]:px-2 [&_[cmdk-group]:not([hidden])_~[cmdk-group]]:pt-0 [&_[cmdk-input]]:h-12 [&_[cmdk-item]]:py-2", children: children }) })] }));
 }
 function CommandInput({ className, ...props }) {
-    return (_jsxs("div", { "data-slot": "command-input-wrapper", className: "flex h-9 items-center gap-2 border-b px-3", children: [_jsx(SearchIcon, { className: "size-4 shrink-0 opacity-50" }), _jsx(CommandPrimitive.Input, { "data-slot": "command-input", className: cn("flex h-10 w-full rounded-md bg-transparent py-3 text-sm outline-hidden placeholder:text-muted-foreground disabled:cursor-not-allowed disabled:opacity-50", className), ...props })] }));
+    return (_jsxs("div", { "data-slot": "command-input-wrapper", className: "flex h-10 items-center gap-2 border-b px-3", children: [_jsx(SearchIcon, { className: "size-4 shrink-0 opacity-50" }), _jsx(CommandPrimitive.Input, { "data-slot": "command-input", className: cn("flex h-full w-full rounded-md bg-transparent py-3 text-sm outline-hidden placeholder:text-muted-foreground disabled:cursor-not-allowed disabled:opacity-50", className), ...props })] }));
 }
 function CommandList({ className, ...props }) {
     return (_jsx(CommandPrimitive.List, { "data-slot": "command-list", className: cn("max-h-[300px] scroll-py-1 overflow-x-hidden overflow-y-auto", className), ...props }));
@@ -20,7 +20,7 @@ function CommandEmpty({ ...props }) {
     return (_jsx(CommandPrimitive.Empty, { "data-slot": "command-empty", className: "py-6 text-center text-sm", ...props }));
 }
 function CommandGroup({ className, ...props }) {
-    return (_jsx(CommandPrimitive.Group, { "data-slot": "command-group", className: cn("overflow-hidden p-1 text-foreground [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:py-1.5 [&_[cmdk-group-heading]]:text-xs [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-muted-foreground", className), ...props }));
+    return (_jsx(CommandPrimitive.Group, { "data-slot": "command-group", className: cn("overflow-hidden p-1 text-foreground [&_[cmdk-group-heading]]:eyebrow [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:pt-2 [&_[cmdk-group-heading]]:pb-1", className), ...props }));
 }
 function CommandSeparator({ className, ...props }) {
     return (_jsx(CommandPrimitive.Separator, { "data-slot": "command-separator", className: cn("-mx-1 h-px bg-border", className), ...props }));

package/dist/overlay/floating/drawer.js

@@ -15,19 +15,19 @@ function DrawerClose({ ...props }) {
     return _jsx(DrawerPrimitive.Close, { "data-slot": "drawer-close", ...props });
 }
 function DrawerOverlay({ className, ...props }) {
-    return (_jsx(DrawerPrimitive.Overlay, { "data-slot": "drawer-overlay", className: cn("fixed inset-0 z-50 bg-black/50 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:animate-in data-[state=open]:fade-in-0", className), ...props }));
+    return (_jsx(DrawerPrimitive.Overlay, { "data-slot": "drawer-overlay", className: cn("fixed inset-0 z-[300] bg-scrim backdrop-blur-[2px] data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:animate-in data-[state=open]:fade-in-0", className), ...props }));
 }
 function DrawerContent({ className, children, ...props }) {
-    return (_jsxs(DrawerPortal, { "data-slot": "drawer-portal", children: [_jsx(DrawerOverlay, {}), _jsxs(DrawerPrimitive.Content, { "data-slot": "drawer-content", className: cn("group/drawer-content fixed z-50 flex h-auto flex-col bg-background", "data-[vaul-drawer-direction=top]:inset-x-0 data-[vaul-drawer-direction=top]:top-0 data-[vaul-drawer-direction=top]:mb-24 data-[vaul-drawer-direction=top]:max-h-[80vh] data-[vaul-drawer-direction=top]:rounded-b-lg data-[vaul-drawer-direction=top]:border-b", "data-[vaul-drawer-direction=bottom]:inset-x-0 data-[vaul-drawer-direction=bottom]:bottom-0 data-[vaul-drawer-direction=bottom]:mt-24 data-[vaul-drawer-direction=bottom]:max-h-[80vh] data-[vaul-drawer-direction=bottom]:rounded-t-lg data-[vaul-drawer-direction=bottom]:border-t", "data-[vaul-drawer-direction=right]:inset-y-0 data-[vaul-drawer-direction=right]:right-0 data-[vaul-drawer-direction=right]:w-3/4 data-[vaul-drawer-direction=right]:border-l data-[vaul-drawer-direction=right]:sm:max-w-sm", "data-[vaul-drawer-direction=left]:inset-y-0 data-[vaul-drawer-direction=left]:left-0 data-[vaul-drawer-direction=left]:w-3/4 data-[vaul-drawer-direction=left]:border-r data-[vaul-drawer-direction=left]:sm:max-w-sm", className), ...props, children: [_jsx("div", { className: "mx-auto mt-4 hidden h-2 w-[100px] shrink-0 rounded-full bg-muted group-data-[vaul-drawer-direction=bottom]/drawer-content:block" }), children] })] }));
+    return (_jsxs(DrawerPortal, { "data-slot": "drawer-portal", children: [_jsx(DrawerOverlay, {}), _jsxs(DrawerPrimitive.Content, { "data-slot": "drawer-content", className: cn("group/drawer-content fixed z-[300] flex h-auto flex-col bg-popover shadow-overlay", "data-[vaul-drawer-direction=top]:inset-x-0 data-[vaul-drawer-direction=top]:top-0 data-[vaul-drawer-direction=top]:mb-24 data-[vaul-drawer-direction=top]:max-h-[80vh] data-[vaul-drawer-direction=top]:rounded-b-lg data-[vaul-drawer-direction=top]:border-b", "data-[vaul-drawer-direction=bottom]:inset-x-0 data-[vaul-drawer-direction=bottom]:bottom-0 data-[vaul-drawer-direction=bottom]:mt-24 data-[vaul-drawer-direction=bottom]:max-h-[80vh] data-[vaul-drawer-direction=bottom]:rounded-t-lg data-[vaul-drawer-direction=bottom]:border-t", "data-[vaul-drawer-direction=right]:inset-y-0 data-[vaul-drawer-direction=right]:right-0 data-[vaul-drawer-direction=right]:w-3/4 data-[vaul-drawer-direction=right]:border-l data-[vaul-drawer-direction=right]:sm:max-w-sm", "data-[vaul-drawer-direction=left]:inset-y-0 data-[vaul-drawer-direction=left]:left-0 data-[vaul-drawer-direction=left]:w-3/4 data-[vaul-drawer-direction=left]:border-r data-[vaul-drawer-direction=left]:sm:max-w-sm", className), ...props, children: [_jsx("div", { className: "mx-auto mt-4 hidden h-1.5 w-12 shrink-0 rounded-full bg-foreground/20 group-data-[vaul-drawer-direction=bottom]/drawer-content:block" }), children] })] }));
 }
 function DrawerHeader({ className, ...props }) {
-    return (_jsx("div", { "data-slot": "drawer-header", className: cn("flex flex-col gap-0.5 p-4 group-data-[vaul-drawer-direction=bottom]/drawer-content:text-center group-data-[vaul-drawer-direction=top]/drawer-content:text-center md:gap-1.5 md:text-left", className), ...props }));
+    return (_jsx("div", { "data-slot": "drawer-header", className: cn("flex flex-col gap-1.5 px-6 pt-4 pb-4 text-left", className), ...props }));
 }
 function DrawerFooter({ className, ...props }) {
-    return (_jsx("div", { "data-slot": "drawer-footer", className: cn("mt-auto flex flex-col gap-2 p-4", className), ...props }));
+    return (_jsx("div", { "data-slot": "drawer-footer", className: cn("mt-auto flex flex-col gap-2 px-6 pt-4 pb-6", className), ...props }));
 }
 function DrawerTitle({ className, ...props }) {
-    return (_jsx(DrawerPrimitive.Title, { "data-slot": "drawer-title", className: cn("font-semibold text-foreground", className), ...props }));
+    return (_jsx(DrawerPrimitive.Title, { "data-slot": "drawer-title", className: cn("text-base font-semibold tracking-tight text-foreground", className), ...props }));
 }
 function DrawerDescription({ className, ...props }) {
     return (_jsx(DrawerPrimitive.Description, { "data-slot": "drawer-description", className: cn("text-sm text-muted-foreground", className), ...props }));

package/dist/overlay/floating/hover-card.js

@@ -8,7 +8,7 @@ function HoverCard({ ...props }) {
 function HoverCardTrigger({ ...props }) {
     return _jsx(HoverCardPrimitive.Trigger, { "data-slot": "hover-card-trigger", ...props });
 }
-function HoverCardContent({ className, align = "center", sideOffset = 4, ...props }) {
-    return (_jsx(HoverCardPrimitive.Portal, { "data-slot": "hover-card-portal", children: _jsx(HoverCardPrimitive.Content, { "data-slot": "hover-card-content", align: align, sideOffset: sideOffset, className: cn("z-50 w-64 origin-(--radix-hover-card-content-transform-origin) rounded-md border bg-popover p-4 text-popover-foreground shadow-md outline-hidden data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95", className), ...props }) }));
+function HoverCardContent({ className, align = "center", sideOffset = 6, ...props }) {
+    return (_jsx(HoverCardPrimitive.Portal, { "data-slot": "hover-card-portal", children: _jsx(HoverCardPrimitive.Content, { "data-slot": "hover-card-content", align: align, sideOffset: sideOffset, className: cn("z-50 w-64 origin-(--radix-hover-card-content-transform-origin) rounded-md border bg-popover p-4 text-popover-foreground shadow-overlay outline-hidden data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95", className), ...props }) }));
 }
 export { HoverCard, HoverCardContent, HoverCardTrigger };

package/dist/overlay/menu/dropdown-menu-choice.js

@@ -1,7 +1,7 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Checkmark as CheckIcon, CircleSolid as CircleIcon } from "@carbon/icons-react";
 import { cn } from "cn";
-import { CheckIcon, CircleIcon } from "lucide-react";
 import * as DropdownMenuPrimitive from "radix-ui/dropdown-menu";
 function DropdownMenuCheckboxItem({ className, children, checked, ...props }) {
     return (_jsxs(DropdownMenuPrimitive.CheckboxItem, { "data-slot": "dropdown-menu-checkbox-item", className: cn("relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", className), checked: checked, ...props, children: [_jsx("span", { className: "pointer-events-none absolute left-2 flex size-3.5 items-center justify-center", children: _jsx(DropdownMenuPrimitive.ItemIndicator, { children: _jsx(CheckIcon, { className: "size-4" }) }) }), children] }));

package/dist/overlay/menu/dropdown-menu-item.js

@@ -6,7 +6,7 @@ function DropdownMenuItem({ className, inset, variant = "default", ...props }) {
     return (_jsx(DropdownMenuPrimitive.Item, { "data-slot": "dropdown-menu-item", "data-inset": inset, "data-variant": variant, className: cn("relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:pl-8 data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 data-[variant=destructive]:focus:text-destructive dark:data-[variant=destructive]:focus:bg-destructive/20 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-muted-foreground data-[variant=destructive]:*:[svg]:text-destructive!", className), ...props }));
 }
 function DropdownMenuLabel({ className, inset, ...props }) {
-    return (_jsx(DropdownMenuPrimitive.Label, { "data-slot": "dropdown-menu-label", "data-inset": inset, className: cn("px-2 py-1.5 text-sm font-medium data-[inset]:pl-8", className), ...props }));
+    return (_jsx(DropdownMenuPrimitive.Label, { "data-slot": "dropdown-menu-label", "data-inset": inset, className: cn("eyebrow px-2 pt-2 pb-1 data-[inset]:pl-8", className), ...props }));
 }
 function DropdownMenuSeparator({ className, ...props }) {
     return (_jsx(DropdownMenuPrimitive.Separator, { "data-slot": "dropdown-menu-separator", className: cn("-mx-1 my-1 h-px bg-border", className), ...props }));

package/dist/overlay/menu/dropdown-menu-sub.js

@@ -1,7 +1,7 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { ChevronRight as ChevronRightIcon } from "@carbon/icons-react";
 import { cn } from "cn";
-import { ChevronRightIcon } from "lucide-react";
 import * as DropdownMenuPrimitive from "radix-ui/dropdown-menu";
 function DropdownMenuSub({ ...props }) {
     return _jsx(DropdownMenuPrimitive.Sub, { "data-slot": "dropdown-menu-sub", ...props });
@@ -10,6 +10,6 @@ function DropdownMenuSubTrigger({ className, inset, children, ...props }) {
     return (_jsxs(DropdownMenuPrimitive.SubTrigger, { "data-slot": "dropdown-menu-sub-trigger", "data-inset": inset, className: cn("flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground data-[inset]:pl-8 data-[state=open]:bg-accent data-[state=open]:text-accent-foreground [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-muted-foreground", className), ...props, children: [children, _jsx(ChevronRightIcon, { className: "ml-auto size-4" })] }));
 }
 function DropdownMenuSubContent({ className, ...props }) {
-    return (_jsx(DropdownMenuPrimitive.SubContent, { "data-slot": "dropdown-menu-sub-content", className: cn("z-50 min-w-[8rem] origin-(--radix-dropdown-menu-content-transform-origin) overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-lg data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95", className), ...props }));
+    return (_jsx(DropdownMenuPrimitive.SubContent, { "data-slot": "dropdown-menu-sub-content", className: cn("z-50 min-w-[8rem] origin-(--radix-dropdown-menu-content-transform-origin) overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-overlay data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95", className), ...props }));
 }
 export { DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger };

package/dist/overlay/menu/dropdown-menu.js

@@ -11,8 +11,8 @@ function DropdownMenuPortal({ ...props }) {
 function DropdownMenuTrigger({ ...props }) {
     return _jsx(DropdownMenuPrimitive.Trigger, { "data-slot": "dropdown-menu-trigger", ...props });
 }
-function DropdownMenuContent({ className, sideOffset = 4, ...props }) {
-    return (_jsx(DropdownMenuPrimitive.Portal, { children: _jsx(DropdownMenuPrimitive.Content, { "data-slot": "dropdown-menu-content", sideOffset: sideOffset, className: cn("z-50 max-h-(--radix-dropdown-menu-content-available-height) min-w-[8rem] origin-(--radix-dropdown-menu-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border bg-popover p-1 text-popover-foreground shadow-md data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95", className), ...props }) }));
+function DropdownMenuContent({ className, sideOffset = 6, ...props }) {
+    return (_jsx(DropdownMenuPrimitive.Portal, { children: _jsx(DropdownMenuPrimitive.Content, { "data-slot": "dropdown-menu-content", sideOffset: sideOffset, className: cn("z-50 max-h-(--radix-dropdown-menu-content-available-height) min-w-[8rem] origin-(--radix-dropdown-menu-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border bg-popover p-1 text-popover-foreground shadow-overlay data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95", className), ...props }) }));
 }
 function DropdownMenuGroup({ ...props }) {
     return _jsx(DropdownMenuPrimitive.Group, { "data-slot": "dropdown-menu-group", ...props });

package/dist/overlay/popover.js

@@ -8,7 +8,7 @@ function Popover({ ...props }) {
 function PopoverTrigger({ ...props }) {
     return _jsx(PopoverPrimitive.Trigger, { "data-slot": "popover-trigger", ...props });
 }
-function PopoverContent({ className, align = "center", sideOffset = 4, ...props }) {
-    return (_jsx(PopoverPrimitive.Portal, { children: _jsx(PopoverPrimitive.Content, { "data-slot": "popover-content", align: align, sideOffset: sideOffset, className: cn("z-50 w-72 origin-(--radix-popover-content-transform-origin) rounded-md border bg-popover p-4 text-popover-foreground shadow-md outline-hidden", "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0", className), ...props }) }));
+function PopoverContent({ className, align = "center", sideOffset = 6, ...props }) {
+    return (_jsx(PopoverPrimitive.Portal, { children: _jsx(PopoverPrimitive.Content, { "data-slot": "popover-content", align: align, sideOffset: sideOffset, className: cn("z-50 w-72 origin-(--radix-popover-content-transform-origin) rounded-md border bg-popover p-4 text-popover-foreground shadow-overlay outline-hidden", "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0", className), ...props }) }));
 }
 export { Popover, PopoverContent, PopoverTrigger };

package/dist/overlay/sheet.js

@@ -1,7 +1,7 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Close as XIcon } from "@carbon/icons-react";
 import { cn } from "cn";
-import { XIcon } from "lucide-react";
 import * as SheetPrimitive from "radix-ui/dialog";
 function Sheet({ ...props }) {
     return _jsx(SheetPrimitive.Root, { "data-slot": "sheet", ...props });
@@ -16,23 +16,23 @@ function SheetPortal({ ...props }) {
     return _jsx(SheetPrimitive.Portal, { "data-slot": "sheet-portal", ...props });
 }
 function SheetOverlay({ className, ...props }) {
-    return (_jsx(SheetPrimitive.Overlay, { "data-slot": "sheet-overlay", className: cn("fixed inset-0 z-[300] bg-black/40 backdrop-blur-sm data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:animate-in data-[state=open]:fade-in-0", className), ...props }));
+    return (_jsx(SheetPrimitive.Overlay, { "data-slot": "sheet-overlay", className: cn("fixed inset-0 z-[300] bg-scrim backdrop-blur-[2px] data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:animate-in data-[state=open]:fade-in-0", className), ...props }));
 }
 function SheetContent({ className, children, side = "right", showCloseButton = true, ...props }) {
-    return (_jsxs(SheetPortal, { children: [_jsx(SheetOverlay, {}), _jsxs(SheetPrimitive.Content, { "data-slot": "sheet-content", className: cn("fixed z-[300] flex flex-col gap-4 bg-background shadow-lg transition ease-in-out data-[state=closed]:animate-out data-[state=closed]:duration-300 data-[state=open]:animate-in data-[state=open]:duration-500", side === "right" &&
+    return (_jsxs(SheetPortal, { children: [_jsx(SheetOverlay, {}), _jsxs(SheetPrimitive.Content, { "data-slot": "sheet-content", className: cn("fixed z-[300] flex flex-col gap-4 bg-popover shadow-overlay transition ease-in-out data-[state=closed]:animate-out data-[state=closed]:duration-300 data-[state=open]:animate-in data-[state=open]:duration-500", side === "right" &&
                     "inset-y-0 right-0 h-full w-3/4 border-l data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right sm:max-w-sm", side === "left" &&
                     "inset-y-0 left-0 h-full w-3/4 border-r data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left sm:max-w-sm", side === "top" &&
                     "inset-x-0 top-0 h-auto border-b data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top", side === "bottom" &&
-                    "inset-x-0 bottom-0 h-auto border-t data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom", className), ...props, children: [children, showCloseButton && (_jsxs(SheetPrimitive.Close, { className: "absolute top-4 right-4 rounded-xs opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:ring-2 focus:ring-ring focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none data-[state=open]:bg-secondary", children: [_jsx(XIcon, { className: "size-4" }), _jsx("span", { className: "sr-only", children: "Close" })] }))] })] }));
+                    "inset-x-0 bottom-0 h-auto border-t data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom", className), ...props, children: [children, showCloseButton && (_jsxs(SheetPrimitive.Close, { className: "absolute top-4 right-4 rounded-sm text-soft opacity-70 transition-opacity hover:text-foreground hover:opacity-100 focus-visible:ring-2 focus-visible:ring-ring focus-visible:outline-hidden disabled:pointer-events-none", children: [_jsx(XIcon, { className: "size-4" }), _jsx("span", { className: "sr-only", children: "Close" })] }))] })] }));
 }
 function SheetHeader({ className, ...props }) {
-    return (_jsx("div", { "data-slot": "sheet-header", className: cn("flex flex-col gap-1.5 p-4", className), ...props }));
+    return (_jsx("div", { "data-slot": "sheet-header", className: cn("flex flex-col gap-1.5 px-6 pt-6 pb-2 pr-12", className), ...props }));
 }
 function SheetFooter({ className, ...props }) {
-    return (_jsx("div", { "data-slot": "sheet-footer", className: cn("mt-auto flex flex-col gap-2 p-4", className), ...props }));
+    return (_jsx("div", { "data-slot": "sheet-footer", className: cn("mt-auto flex flex-col gap-2 px-6 pt-4 pb-6", className), ...props }));
 }
 function SheetTitle({ className, ...props }) {
-    return (_jsx(SheetPrimitive.Title, { "data-slot": "sheet-title", className: cn("font-semibold text-foreground", className), ...props }));
+    return (_jsx(SheetPrimitive.Title, { "data-slot": "sheet-title", className: cn("text-base font-semibold tracking-tight text-foreground", className), ...props }));
 }
 function SheetDescription({ className, ...props }) {
     return (_jsx(SheetPrimitive.Description, { "data-slot": "sheet-description", className: cn("text-sm text-muted-foreground", className), ...props }));

package/dist/shell/breadcrumbs.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { ChevronRightIcon } from "lucide-react";
+import { ChevronRight as ChevronRightIcon } from "@carbon/icons-react";
 function CrumbLabel({ crumb, last, Link, }) {
     if (last) {
         return (_jsx("span", { "aria-current": "page", className: "truncate font-medium", children: crumb.label }));

package/dist/shell/docs/docs-header.js

@@ -1,7 +1,7 @@
 "use client";
 import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Menu as MenuIcon } from "@carbon/icons-react";
 import { cn } from "cn";
-import { MenuIcon } from "lucide-react";
 import { useState } from "react";
 import { Button } from "../../action/button.js";
 import { Sheet, SheetContent, SheetTitle } from "../../overlay/sheet.js";

package/dist/shell/docs/docs-sidebar.js

@@ -1,9 +1,9 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { cn } from "cn";
 function DocsNavList({ groups, activeHref, linkComponent: Link = "a" }) {
-    return (_jsx("div", { className: "flex flex-col gap-4", children: groups.map((group) => (_jsxs("div", { className: "flex flex-col", children: [_jsx("p", { className: "flex h-8 items-center px-2 text-xs font-medium text-muted-foreground", children: group.label }), _jsx("ul", { className: "flex flex-col gap-0.5", children: group.items.map((item) => {
+    return (_jsx("div", { className: "flex flex-col gap-4", children: groups.map((group) => (_jsxs("div", { className: "flex flex-col", children: [_jsx("p", { className: "eyebrow flex h-8 items-center px-2", children: group.label }), _jsx("ul", { className: "flex flex-col gap-0.5", children: group.items.map((item) => {
                         const active = item.href === activeHref;
-                        return (_jsx("li", { children: _jsx(Link, { href: item.href, "aria-current": active ? "page" : undefined, className: cn("flex h-[30px] w-fit items-center rounded-md border border-transparent px-2 text-[0.8rem] font-medium transition-colors hover:bg-accent", active && "border-accent bg-accent"), children: item.title }) }, item.href));
+                        return (_jsx("li", { children: _jsx(Link, { href: item.href, "aria-current": active ? "page" : undefined, className: cn("flex h-[30px] w-fit items-center rounded-md border border-transparent px-2 text-sm font-medium transition-colors hover:bg-accent", active && "border-accent bg-accent"), children: item.title }) }, item.href));
                     }) })] }, group.label))) }));
 }
 function DocsSidebar(props) {

package/dist/shell/docs/on-this-page.js

@@ -4,7 +4,7 @@ import { cn } from "cn";
 import { useActiveSection } from "./use-active-section.js";
 function OnThisPage({ sections, title = "On This Page" }) {
     const [activeId, pinSection] = useActiveSection(sections.map((section) => section.id));
-    return (_jsxs("nav", { "aria-label": title, className: "flex flex-col gap-2 text-sm", children: [_jsx("p", { className: "h-6 text-xs font-medium text-muted-foreground", children: title }), sections.map((section) => (_jsx("button", { type: "button", onClick: () => {
+    return (_jsxs("nav", { "aria-label": title, className: "flex flex-col gap-2 text-sm", children: [_jsx("p", { className: "eyebrow flex h-6 items-center", children: title }), sections.map((section) => (_jsx("button", { type: "button", onClick: () => {
                     pinSection(section.id);
                     document.getElementById(section.id)?.scrollIntoView({ behavior: "smooth" });
                 }, "aria-current": activeId === section.id ? "location" : undefined, className: cn("text-left text-[0.8rem] text-muted-foreground transition-colors hover:text-foreground", section.nested && "pl-4", activeId === section.id && "font-medium text-foreground"), children: section.title }, section.id)))] }));

package/dist/shell/theme-toggle.js

@@ -1,6 +1,6 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { MoonIcon, SunIcon } from "lucide-react";
+import { Moon as MoonIcon, Sun as SunIcon } from "@carbon/icons-react";
 import { Button } from "../action/button.js";
 function ThemeToggle({ theme, onThemeChange }) {
     const nextTheme = theme === "dark" ? "light" : "dark";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@locusgraph/components",
-  "version": "0.1.1",
+  "version": "0.2.0",
   "description": "Radix and shadcn based React components, shells and theme for LocusGraph apps.",
   "license": "MIT",
   "repository": {
@@ -33,14 +33,14 @@
   },
   "dependencies": {
     "@base-ui/react": "^1.9.0",
-    "@locusgraph/tokens": "0.1.1",
+    "@carbon/icons-react": "11.89.0",
+    "@locusgraph/tokens": "0.2.0",
     "@shadcn/react": "^0.3.1",
     "class-variance-authority": "^0.7.1",
     "cmdk": "^1.1.1",
     "cn": "^0.4.0",
     "embla-carousel-react": "^8.6.0",
     "input-otp": "^1.5.0",
-    "lucide-react": "^1.28.0",
     "radix-ui": "^1.8.1",
     "react-day-picker": "^9.14.0",
     "react-hook-form": "^7.90.0",
@@ -50,7 +50,7 @@
     "vaul": "^1.1.2"
   },
   "devDependencies": {
-    "@locusgraph/config": "0.1.0",
+    "@locusgraph/config": "0.1.1",
     "@types/node": "^22.0.0",
     "@types/react": "^19.2.0",
     "@types/react-dom": "^19.2.0",