@bigbinary/neeto-atoms 1.0.1 → 1.0.3

package/dist/cjs/index.js

@@ -61287,11 +61287,11 @@ function SidebarProvider$1({ defaultOpen = true, open: openProp, onOpenChange: s
         setOpenMobile,
         toggleSidebar,
     }), [state, open, setOpen, isMobile, openMobile, setOpenMobile, toggleSidebar]);
-    return (jsxRuntime.jsx(SidebarContext.Provider, { value: contextValue, children: jsxRuntime.jsx("div", { "data-slot": "sidebar-wrapper", style: {
-                "--sidebar-width": SIDEBAR_WIDTH,
-                "--sidebar-width-icon": SIDEBAR_WIDTH_ICON,
-                ...style,
-            }, className: cn$1("group/sidebar-wrapper flex min-h-svh w-full has-data-[variant=inset]:bg-sidebar", className), ...props, children: children }) }));
+    return (jsxRuntime.jsx(SidebarContext.Provider, { value: contextValue, children: jsxRuntime.jsx(TooltipProvider$1, { delayDuration: 0, children: jsxRuntime.jsx("div", { "data-slot": "sidebar-wrapper", style: {
+                    "--sidebar-width": SIDEBAR_WIDTH,
+                    "--sidebar-width-icon": SIDEBAR_WIDTH_ICON,
+                    ...style,
+                }, className: cn$1("group/sidebar-wrapper flex min-h-svh w-full has-data-[variant=inset]:bg-sidebar", className), ...props, children: children }) }) }));
 }
 function Sidebar$1({ side = "left", variant = "sidebar", collapsible = "offcanvas", className, children, dir, ...props }) {
     const { isMobile, state, openMobile, setOpenMobile } = useSidebar();
@@ -61309,7 +61309,7 @@ function Sidebar$1({ side = "left", variant = "sidebar", collapsible = "offcanva
                 // Adjust the padding for floating and inset variants.
                 variant === "floating" || variant === "inset"
                     ? "p-2 group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+(--spacing(4))+2px)]"
-                    : "group-data-[collapsible=icon]:w-(--sidebar-width-icon) group-data-[side=left]:border-e group-data-[side=right]:border-s", className), ...props, children: jsxRuntime.jsx("div", { "data-sidebar": "sidebar", "data-slot": "sidebar-inner", className: "flex size-full flex-col bg-sidebar group-data-[variant=floating]:rounded-lg group-data-[variant=floating]:shadow-sm group-data-[variant=floating]:ring-1 group-data-[variant=floating]:ring-sidebar-border", children: children }) })] }));
+                    : "group-data-[collapsible=icon]:w-(--sidebar-width-icon) group-data-[side=left]:border-e group-data-[side=right]:border-s", className), ...props, children: jsxRuntime.jsx("div", { "data-sidebar": "sidebar", "data-slot": "sidebar-inner", className: "flex size-full flex-col bg-sidebar group-data-[variant=floating]:rounded-lg group-data-[variant=floating]:border group-data-[variant=floating]:border-sidebar-border group-data-[variant=floating]:shadow-sm", children: children }) })] }));
 }
 function SidebarTrigger$1({ className, onClick, ...props }) {
     const { toggleSidebar } = useSidebar();
@@ -61320,7 +61320,7 @@ function SidebarTrigger$1({ className, onClick, ...props }) {
 }
 function SidebarRail$1({ className, ...props }) {
     const { toggleSidebar } = useSidebar();
-    return (jsxRuntime.jsx("button", { "data-sidebar": "rail", "data-slot": "sidebar-rail", "aria-label": "Toggle Sidebar", tabIndex: -1, onClick: toggleSidebar, title: "Toggle Sidebar", className: cn$1("absolute inset-y-0 z-20 hidden w-4 transition-all ease-linear group-data-[side=left]:-right-4 group-data-[side=right]:left-0 after:absolute after:inset-y-0 after:start-1/2 after:w-[2px] hover:after:bg-sidebar-border sm:flex ltr:-translate-x-1/2 rtl:-translate-x-1/2", "in-data-[side=left]:cursor-w-resize rtl:in-data-[side=left]:cursor-e-resize in-data-[side=right]:cursor-e-resize rtl:in-data-[side=right]:cursor-w-resize", "[[data-side=left][data-state=collapsed]_&]:cursor-e-resize rtl:[[data-side=left][data-state=collapsed]_&]:cursor-w-resize [[data-side=right][data-state=collapsed]_&]:cursor-w-resize rtl:[[data-side=right][data-state=collapsed]_&]:cursor-e-resize", "group-data-[collapsible=offcanvas]:translate-x-0 rtl:group-data-[collapsible=offcanvas]:-translate-x-0 group-data-[collapsible=offcanvas]:after:start-full hover:group-data-[collapsible=offcanvas]:bg-sidebar", "[[data-side=left][data-collapsible=offcanvas]_&]:-end-2", "[[data-side=right][data-collapsible=offcanvas]_&]:-start-2", className), ...props }));
+    return (jsxRuntime.jsx("button", { "data-sidebar": "rail", "data-slot": "sidebar-rail", "aria-label": "Toggle Sidebar", tabIndex: -1, onClick: toggleSidebar, title: "Toggle Sidebar", className: cn$1("cn-sidebar-rail absolute inset-y-0 z-20 hidden w-4 -translate-x-1/2 transition-all ease-linear group-data-[side=left]:-right-4 group-data-[side=right]:left-0 after:absolute after:inset-y-0 after:start-1/2 after:w-[2px] hover:after:bg-sidebar-border sm:flex", "in-data-[side=left]:cursor-w-resize in-data-[side=right]:cursor-e-resize", "rtl:in-data-[side=left]:cursor-e-resize rtl:in-data-[side=right]:cursor-w-resize", "[[data-side=left][data-state=collapsed]_&]:cursor-e-resize [[data-side=right][data-state=collapsed]_&]:cursor-w-resize", "rtl:[[data-side=left][data-state=collapsed]_&]:cursor-w-resize rtl:[[data-side=right][data-state=collapsed]_&]:cursor-e-resize", "group-data-[collapsible=offcanvas]:translate-x-0 group-data-[collapsible=offcanvas]:after:start-full hover:group-data-[collapsible=offcanvas]:bg-sidebar", "[[data-side=left][data-collapsible=offcanvas]_&]:-right-2", "[[data-side=right][data-collapsible=offcanvas]_&]:-left-2", className), ...props }));
 }
 function SidebarInset$1({ className, ...props }) {
     return (jsxRuntime.jsx("main", { "data-slot": "sidebar-inset", className: cn$1("relative flex w-full flex-1 flex-col bg-background md:peer-data-[variant=inset]:m-2 md:peer-data-[variant=inset]:ms-0 md:peer-data-[variant=inset]:rounded-xl md:peer-data-[variant=inset]:shadow-sm md:peer-data-[variant=inset]:peer-data-[state=collapsed]:ms-2", className), ...props }));
@@ -61338,7 +61338,7 @@ function SidebarSeparator$1({ className, ...props }) {
     return (jsxRuntime.jsx(Separator$2, { "data-slot": "sidebar-separator", "data-sidebar": "separator", className: cn$1("mx-2 w-auto bg-sidebar-border", className), ...props }));
 }
 function SidebarContent$1({ className, ...props }) {
-    return (jsxRuntime.jsx("div", { "data-slot": "sidebar-content", "data-sidebar": "content", className: cn$1("no-scrollbar flex min-h-0 flex-1 flex-col gap-0 overflow-auto group-data-[collapsible=icon]:overflow-hidden", className), ...props }));
+    return (jsxRuntime.jsx("div", { "data-slot": "sidebar-content", "data-sidebar": "content", className: cn$1("no-scrollbar flex min-h-0 flex-1 flex-col gap-2 overflow-auto group-data-[collapsible=icon]:overflow-hidden", className), ...props }));
 }
 function SidebarGroup$1({ className, ...props }) {
     return (jsxRuntime.jsx("div", { "data-slot": "sidebar-group", "data-sidebar": "group", className: cn$1("relative flex w-full min-w-0 flex-col p-2", className), ...props }));
@@ -61355,7 +61355,7 @@ function SidebarGroupContent$1({ className, ...props }) {
     return (jsxRuntime.jsx("div", { "data-slot": "sidebar-group-content", "data-sidebar": "group-content", className: cn$1("w-full text-sm", className), ...props }));
 }
 function SidebarMenu$1({ className, ...props }) {
-    return (jsxRuntime.jsx("ul", { "data-slot": "sidebar-menu", "data-sidebar": "menu", className: cn$1("flex w-full min-w-0 flex-col gap-0", className), ...props }));
+    return (jsxRuntime.jsx("ul", { "data-slot": "sidebar-menu", "data-sidebar": "menu", className: cn$1("flex w-full min-w-0 flex-col gap-1", className), ...props }));
 }
 function SidebarMenuItem$1({ className, ...props }) {
     return (jsxRuntime.jsx("li", { "data-slot": "sidebar-menu-item", "data-sidebar": "menu-item", className: cn$1("group/menu-item relative", className), ...props }));
@@ -61401,9 +61401,9 @@ function SidebarMenuBadge$1({ className, ...props }) {
 }
 function SidebarMenuSkeleton$1({ className, showIcon = false, ...props }) {
     // Random width between 50 to 90%.
-    const [width] = React__namespace.useState(() => {
+    const width = React__namespace.useMemo(() => {
         return `${Math.floor(Math.random() * 40) + 50}%`;
-    });
+    }, []);
     return (jsxRuntime.jsxs("div", { "data-slot": "sidebar-menu-skeleton", "data-sidebar": "menu-skeleton", className: cn$1("flex h-8 items-center gap-2 rounded-md px-2", className), ...props, children: [showIcon && (jsxRuntime.jsx(Skeleton$1, { className: "size-4 rounded-md", "data-sidebar": "menu-skeleton-icon" })), jsxRuntime.jsx(Skeleton$1, { className: "h-4 max-w-(--skeleton-width) flex-1", "data-sidebar": "menu-skeleton-text", style: {
                     "--skeleton-width": width,
                 } })] }));
@@ -62737,6 +62737,79 @@ const TooltipContent = (props) => jsxRuntime.jsx(TooltipContent$1, { ...props })
 const TooltipProvider = (props) => jsxRuntime.jsx(TooltipProvider$1, { ...props });
 const TooltipTrigger = (props) => jsxRuntime.jsx(TooltipTrigger$1, { ...props });
 
+const typographyVariants = cva("", {
+    variants: {
+        variant: {
+            jumbo: "text-5xl font-semibold leading-none tracking-tight",
+            h1: "text-[32px] font-semibold leading-tight tracking-tight",
+            h2: "text-2xl font-semibold leading-tight tracking-tight",
+            h3: "text-xl font-semibold leading-tight tracking-tight",
+            h4: "text-base font-semibold leading-tight",
+            h5: "text-[15px] font-semibold leading-tight",
+            h6: "text-sm font-semibold leading-tight",
+            body1: "text-base leading-normal",
+            body2: "text-[15px] leading-normal",
+            body3: "text-sm leading-normal",
+            caption: "text-xs leading-normal",
+            nano: "text-[10px] leading-normal",
+            code: "font-mono text-sm",
+        },
+        weight: {
+            thin: "font-thin",
+            extralight: "font-extralight",
+            light: "font-light",
+            normal: "font-normal",
+            medium: "font-medium",
+            semibold: "font-semibold",
+            bold: "font-bold",
+            extrabold: "font-extrabold",
+            black: "font-black",
+        },
+        color: {
+            default: "text-foreground",
+            muted: "text-muted-foreground",
+            primary: "text-primary",
+            destructive: "text-destructive",
+            inherit: "text-inherit",
+        },
+        lineClamp: {
+            none: "",
+            1: "line-clamp-1",
+            2: "line-clamp-2",
+            3: "line-clamp-3",
+        },
+    },
+    defaultVariants: {
+        variant: "body3",
+        color: "default",
+    },
+});
+const defaultElementMap = {
+    jumbo: "h1",
+    h1: "h1",
+    h2: "h2",
+    h3: "h3",
+    h4: "h4",
+    h5: "h5",
+    h6: "h6",
+    body1: "p",
+    body2: "p",
+    body3: "p",
+    caption: "span",
+    nano: "span",
+    code: "code",
+};
+const Typography$1 = React__namespace.forwardRef(({ className, variant = "body3", weight, color = "default", lineClamp, asChild = false, ...props }, ref) => {
+    const Comp = asChild
+        ? Slot
+        : defaultElementMap[variant ?? "body3"] ?? "p";
+    return (jsxRuntime.jsx(Comp, { ref: ref, "data-slot": "typography", "data-variant": variant, className: cn$1(typographyVariants({ variant, weight, color, lineClamp, className })), ...props }));
+});
+Typography$1.displayName = "Typography";
+
+const Typography = React.forwardRef((props, ref) => jsxRuntime.jsx(Typography$1, { ref: ref, ...props }));
+Typography.displayName = "Typography";
+
 exports.Accordion = Accordion;
 exports.AccordionContent = AccordionContent;
 exports.AccordionItem = AccordionItem;
@@ -63033,6 +63106,7 @@ exports.Tooltip = Tooltip;
 exports.TooltipContent = TooltipContent;
 exports.TooltipProvider = TooltipProvider;
 exports.TooltipTrigger = TooltipTrigger;
+exports.Typography = Typography;
 exports.badgeVariants = badgeVariants;
 exports.buttonGroupVariants = buttonGroupVariants;
 exports.buttonVariants = buttonVariants;
@@ -63040,6 +63114,7 @@ exports.cn = cn$1;
 exports.navigationMenuTriggerStyle = navigationMenuTriggerStyle;
 exports.tabsListVariants = tabsListVariants;
 exports.toggleVariants = toggleVariants;
+exports.typographyVariants = typographyVariants;
 exports.useCarousel = useCarousel;
 exports.useComboboxAnchor = useComboboxAnchor;
 exports.useIsMobile = useIsMobile;