@mesob/ui 0.2.1 → 0.2.3

package/dist/components/sidebar.d.ts

@@ -6,23 +6,10 @@ import { Separator } from './separator.js';
 import { TooltipContent } from './tooltip.js';
 import { VariantProps } from 'class-variance-authority';
 import * as React from 'react';
+export { useSidebar } from './sidebar-context';
 import '@radix-ui/react-separator';
 import '@radix-ui/react-tooltip';
 
-type SidebarContextProps = {
-    state: 'expanded' | 'collapsed';
-    open: boolean;
-    setOpen: (open: boolean | ((open: boolean) => boolean)) => void;
-    openMobile: boolean;
-    setOpenMobile: (open: boolean) => void;
-    isMobile: boolean;
-    toggleSidebar: () => void;
-    width: number;
-    setWidth: (w: number) => void;
-    minWidth: number;
-    maxWidth: number;
-};
-declare function useSidebar(): SidebarContextProps;
 declare function SidebarProvider({ defaultOpen, open: openProp, onOpenChange: setOpenProp, className, style, children, ...props }: React.ComponentProps<'div'> & {
     defaultOpen?: boolean;
     open?: boolean;
@@ -76,4 +63,4 @@ declare function SidebarMenuSubButton({ asChild, size, isActive, className, ...p
     isActive?: boolean;
 }): react_jsx_runtime.JSX.Element;
 
-export { Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, useSidebar };
+export { Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger };

package/dist/components/sidebar.js

@@ -10,7 +10,7 @@ function cn(...inputs) {
 // src/components/button.tsx
 import { Slot } from "@radix-ui/react-slot";
 import { cva } from "class-variance-authority";
-import { jsxs } from "react/jsx-runtime";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 var buttonVariants = cva(
   "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
   {
@@ -49,25 +49,25 @@ function Button({
   ...props
 }) {
   const Comp = asChild ? Slot : "button";
-  return /* @__PURE__ */ jsxs(
+  return /* @__PURE__ */ jsx(
     Comp,
     {
       "data-slot": "button",
       className: cn(buttonVariants({ variant, size, className })),
       ...props,
-      children: [
+      children: asChild ? children : /* @__PURE__ */ jsxs(Fragment, { children: [
         leftIcon,
         children,
         rightIcon
-      ]
+      ] })
     }
   );
 }
 
 // src/components/input.tsx
-import { jsx } from "react/jsx-runtime";
+import { jsx as jsx2 } from "react/jsx-runtime";
 function Input({ className, type, ...props }) {
-  return /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsx2(
     "input",
     {
       type,
@@ -85,14 +85,14 @@ function Input({ className, type, ...props }) {
 
 // src/components/separator.tsx
 import * as SeparatorPrimitive from "@radix-ui/react-separator";
-import { jsx as jsx2 } from "react/jsx-runtime";
+import { jsx as jsx3 } from "react/jsx-runtime";
 function Separator({
   className,
   orientation = "horizontal",
   decorative = true,
   ...props
 }) {
-  return /* @__PURE__ */ jsx2(
+  return /* @__PURE__ */ jsx3(
     SeparatorPrimitive.Root,
     {
       "data-slot": "separator",
@@ -110,20 +110,20 @@ function Separator({
 // src/components/sheet.tsx
 import * as SheetPrimitive from "@radix-ui/react-dialog";
 import { IconX } from "@tabler/icons-react";
-import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
+import { jsx as jsx4, jsxs as jsxs2 } from "react/jsx-runtime";
 function Sheet({ ...props }) {
-  return /* @__PURE__ */ jsx3(SheetPrimitive.Root, { "data-slot": "sheet", ...props });
+  return /* @__PURE__ */ jsx4(SheetPrimitive.Root, { "data-slot": "sheet", ...props });
 }
 function SheetPortal({
   ...props
 }) {
-  return /* @__PURE__ */ jsx3(SheetPrimitive.Portal, { "data-slot": "sheet-portal", ...props });
+  return /* @__PURE__ */ jsx4(SheetPrimitive.Portal, { "data-slot": "sheet-portal", ...props });
 }
 function SheetOverlay({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx3(
+  return /* @__PURE__ */ jsx4(
     SheetPrimitive.Overlay,
     {
       "data-slot": "sheet-overlay",
@@ -142,7 +142,7 @@ function SheetContent({
   ...props
 }) {
   return /* @__PURE__ */ jsxs2(SheetPortal, { children: [
-    /* @__PURE__ */ jsx3(SheetOverlay, {}),
+    /* @__PURE__ */ jsx4(SheetOverlay, {}),
     /* @__PURE__ */ jsxs2(
       SheetPrimitive.Content,
       {
@@ -159,8 +159,8 @@ function SheetContent({
         children: [
           children,
           /* @__PURE__ */ jsxs2(SheetPrimitive.Close, { className: "ring-offset-background focus:ring-ring data-[state=open]:bg-secondary absolute top-4 right-4 rounded-xs opacity-70 transition-opacity hover:opacity-100 focus:ring-2 focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none", children: [
-            /* @__PURE__ */ jsx3(IconX, { className: "size-4" }),
-            /* @__PURE__ */ jsx3("span", { className: "sr-only", children: "Close" })
+            /* @__PURE__ */ jsx4(IconX, { className: "size-4" }),
+            /* @__PURE__ */ jsx4("span", { className: "sr-only", children: "Close" })
           ] })
         ]
       }
@@ -168,7 +168,7 @@ function SheetContent({
   ] });
 }
 function SheetHeader({ className, ...props }) {
-  return /* @__PURE__ */ jsx3(
+  return /* @__PURE__ */ jsx4(
     "div",
     {
       "data-slot": "sheet-header",
@@ -181,7 +181,7 @@ function SheetTitle({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx3(
+  return /* @__PURE__ */ jsx4(
     SheetPrimitive.Title,
     {
       "data-slot": "sheet-title",
@@ -194,7 +194,7 @@ function SheetDescription({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx3(
+  return /* @__PURE__ */ jsx4(
     SheetPrimitive.Description,
     {
       "data-slot": "sheet-description",
@@ -205,9 +205,9 @@ function SheetDescription({
 }
 
 // src/components/skeleton.tsx
-import { jsx as jsx4 } from "react/jsx-runtime";
+import { jsx as jsx5 } from "react/jsx-runtime";
 function Skeleton({ className, ...props }) {
-  return /* @__PURE__ */ jsx4(
+  return /* @__PURE__ */ jsx5(
     "div",
     {
       "data-slot": "skeleton",
@@ -219,12 +219,12 @@ function Skeleton({ className, ...props }) {
 
 // src/components/tooltip.tsx
 import * as TooltipPrimitive from "@radix-ui/react-tooltip";
-import { jsx as jsx5, jsxs as jsxs3 } from "react/jsx-runtime";
+import { jsx as jsx6, jsxs as jsxs3 } from "react/jsx-runtime";
 function TooltipProvider({
   delayDuration = 0,
   ...props
 }) {
-  return /* @__PURE__ */ jsx5(
+  return /* @__PURE__ */ jsx6(
     TooltipPrimitive.Provider,
     {
       "data-slot": "tooltip-provider",
@@ -237,12 +237,12 @@ function Tooltip({
   children,
   ...props
 }) {
-  return /* @__PURE__ */ jsx5(TooltipPrimitive.Root, { "data-slot": "tooltip", ...props, children });
+  return /* @__PURE__ */ jsx6(TooltipPrimitive.Root, { "data-slot": "tooltip", ...props, children });
 }
 function TooltipTrigger({
   ...props
 }) {
-  return /* @__PURE__ */ jsx5(TooltipPrimitive.Trigger, { "data-slot": "tooltip-trigger", ...props });
+  return /* @__PURE__ */ jsx6(TooltipPrimitive.Trigger, { "data-slot": "tooltip-trigger", ...props });
 }
 function TooltipContent({
   className,
@@ -250,7 +250,7 @@ function TooltipContent({
   children,
   ...props
 }) {
-  return /* @__PURE__ */ jsx5(TooltipPrimitive.Portal, { children: /* @__PURE__ */ jsxs3(
+  return /* @__PURE__ */ jsx6(TooltipPrimitive.Portal, { children: /* @__PURE__ */ jsxs3(
     TooltipPrimitive.Content,
     {
       "data-slot": "tooltip-content",
@@ -262,7 +262,7 @@ function TooltipContent({
       ...props,
       children: [
         children,
-        /* @__PURE__ */ jsx5(TooltipPrimitive.Arrow, { className: "bg-foreground fill-foreground z-50 size-2.5 translate-y-[calc(-50%_-_2px)] rotate-45 rounded-[2px]" })
+        /* @__PURE__ */ jsx6(TooltipPrimitive.Arrow, { className: "bg-foreground fill-foreground z-50 size-2.5 translate-y-[calc(-50%_-_2px)] rotate-45 rounded-[2px]" })
       ]
     }
   ) });
@@ -292,7 +292,12 @@ import { Slot as Slot2 } from "@radix-ui/react-slot";
 import { IconMenu2 } from "@tabler/icons-react";
 import { cva as cva2 } from "class-variance-authority";
 import * as React2 from "react";
-import { jsx as jsx6, jsxs as jsxs4 } from "react/jsx-runtime";
+import {
+  SidebarContext,
+  useSidebar
+} from "./sidebar-context";
+import { useSidebar as useSidebar2 } from "./sidebar-context";
+import { jsx as jsx7, jsxs as jsxs4 } from "react/jsx-runtime";
 var SIDEBAR_COOKIE_NAME = "sidebar_state";
 var SIDEBAR_WIDTH_COOKIE = "sidebar_width";
 var SIDEBAR_COOKIE_MAX_AGE = 60 * 60 * 24 * 7;
@@ -316,14 +321,6 @@ function getWidthFromCookie() {
 function setWidthCookie(width) {
   document.cookie = `${SIDEBAR_WIDTH_COOKIE}=${width}; path=/; max-age=${SIDEBAR_COOKIE_MAX_AGE}`;
 }
-var SidebarContext = React2.createContext(null);
-function useSidebar() {
-  const context = React2.useContext(SidebarContext);
-  if (!context) {
-    throw new Error("useSidebar must be used within a SidebarProvider.");
-  }
-  return context;
-}
 function SidebarProvider({
   defaultOpen = true,
   open: openProp,
@@ -383,7 +380,7 @@ function SidebarProvider({
     maxWidth: SIDEBAR_WIDTH_MAX
   };
   const sidebarWidthValue = open ? `${width}px` : SIDEBAR_WIDTH;
-  return /* @__PURE__ */ jsx6(SidebarContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx6(TooltipProvider, { delayDuration: 0, children: /* @__PURE__ */ jsx6(
+  return /* @__PURE__ */ jsx7(SidebarContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx7(TooltipProvider, { delayDuration: 0, children: /* @__PURE__ */ jsx7(
     "div",
     {
       "data-slot": "sidebar-wrapper",
@@ -411,7 +408,7 @@ function Sidebar({
 }) {
   const { isMobile, state, openMobile, setOpenMobile } = useSidebar();
   if (collapsible === "none") {
-    return /* @__PURE__ */ jsx6(
+    return /* @__PURE__ */ jsx7(
       "div",
       {
         "data-slot": "sidebar",
@@ -425,7 +422,7 @@ function Sidebar({
     );
   }
   if (isMobile) {
-    return /* @__PURE__ */ jsx6(Sheet, { open: openMobile, onOpenChange: setOpenMobile, ...props, children: /* @__PURE__ */ jsxs4(
+    return /* @__PURE__ */ jsx7(Sheet, { open: openMobile, onOpenChange: setOpenMobile, ...props, children: /* @__PURE__ */ jsxs4(
       SheetContent,
       {
         "data-sidebar": "sidebar",
@@ -438,10 +435,10 @@ function Sidebar({
         side,
         children: [
           /* @__PURE__ */ jsxs4(SheetHeader, { className: "sr-only", children: [
-            /* @__PURE__ */ jsx6(SheetTitle, { children: "Sidebar" }),
-            /* @__PURE__ */ jsx6(SheetDescription, { children: "Displays the mobile sidebar." })
+            /* @__PURE__ */ jsx7(SheetTitle, { children: "Sidebar" }),
+            /* @__PURE__ */ jsx7(SheetDescription, { children: "Displays the mobile sidebar." })
           ] }),
-          /* @__PURE__ */ jsx6("div", { className: "flex h-full w-full flex-col", children })
+          /* @__PURE__ */ jsx7("div", { className: "flex h-full w-full flex-col", children })
         ]
       }
     ) });
@@ -456,7 +453,7 @@ function Sidebar({
       "data-side": side,
       "data-slot": "sidebar",
       children: [
-        /* @__PURE__ */ jsx6(
+        /* @__PURE__ */ jsx7(
           "div",
           {
             "data-slot": "sidebar-gap",
@@ -468,7 +465,7 @@ function Sidebar({
             )
           }
         ),
-        /* @__PURE__ */ jsx6(
+        /* @__PURE__ */ jsx7(
           "div",
           {
             "data-slot": "sidebar-container",
@@ -480,7 +477,7 @@ function Sidebar({
               className
             ),
             ...props,
-            children: /* @__PURE__ */ jsx6(
+            children: /* @__PURE__ */ jsx7(
               "div",
               {
                 "data-sidebar": "sidebar",
@@ -515,15 +512,15 @@ function SidebarTrigger({
       },
       ...props,
       children: [
-        /* @__PURE__ */ jsx6(IconMenu2, {}),
-        /* @__PURE__ */ jsx6("span", { className: "sr-only", children: "Toggle Sidebar" })
+        /* @__PURE__ */ jsx7(IconMenu2, {}),
+        /* @__PURE__ */ jsx7("span", { className: "sr-only", children: "Toggle Sidebar" })
       ]
     }
   );
 }
 function SidebarRail({ className, ...props }) {
   const { toggleSidebar } = useSidebar();
-  return /* @__PURE__ */ jsx6(
+  return /* @__PURE__ */ jsx7(
     "button",
     {
       "data-sidebar": "rail",
@@ -546,7 +543,7 @@ function SidebarRail({ className, ...props }) {
   );
 }
 function SidebarInset({ className, ...props }) {
-  return /* @__PURE__ */ jsx6(
+  return /* @__PURE__ */ jsx7(
     "main",
     {
       "data-slot": "sidebar-inset",
@@ -563,7 +560,7 @@ function SidebarInput({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx6(
+  return /* @__PURE__ */ jsx7(
     Input,
     {
       "data-slot": "sidebar-input",
@@ -574,7 +571,7 @@ function SidebarInput({
   );
 }
 function SidebarHeader({ className, ...props }) {
-  return /* @__PURE__ */ jsx6(
+  return /* @__PURE__ */ jsx7(
     "div",
     {
       "data-slot": "sidebar-header",
@@ -585,7 +582,7 @@ function SidebarHeader({ className, ...props }) {
   );
 }
 function SidebarFooter({ className, ...props }) {
-  return /* @__PURE__ */ jsx6(
+  return /* @__PURE__ */ jsx7(
     "div",
     {
       "data-slot": "sidebar-footer",
@@ -599,7 +596,7 @@ function SidebarSeparator({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx6(
+  return /* @__PURE__ */ jsx7(
     Separator,
     {
       "data-slot": "sidebar-separator",
@@ -610,7 +607,7 @@ function SidebarSeparator({
   );
 }
 function SidebarContent({ className, ...props }) {
-  return /* @__PURE__ */ jsx6(
+  return /* @__PURE__ */ jsx7(
     "div",
     {
       "data-slot": "sidebar-content",
@@ -624,7 +621,7 @@ function SidebarContent({ className, ...props }) {
   );
 }
 function SidebarGroup({ className, ...props }) {
-  return /* @__PURE__ */ jsx6(
+  return /* @__PURE__ */ jsx7(
     "div",
     {
       "data-slot": "sidebar-group",
@@ -640,7 +637,7 @@ function SidebarGroupLabel({
   ...props
 }) {
   const Comp = asChild ? Slot2 : "div";
-  return /* @__PURE__ */ jsx6(
+  return /* @__PURE__ */ jsx7(
     Comp,
     {
       "data-slot": "sidebar-group-label",
@@ -660,7 +657,7 @@ function SidebarGroupAction({
   ...props
 }) {
   const Comp = asChild ? Slot2 : "button";
-  return /* @__PURE__ */ jsx6(
+  return /* @__PURE__ */ jsx7(
     Comp,
     {
       "data-slot": "sidebar-group-action",
@@ -680,7 +677,7 @@ function SidebarGroupContent({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx6(
+  return /* @__PURE__ */ jsx7(
     "div",
     {
       "data-slot": "sidebar-group-content",
@@ -691,7 +688,7 @@ function SidebarGroupContent({
   );
 }
 function SidebarMenu({ className, ...props }) {
-  return /* @__PURE__ */ jsx6(
+  return /* @__PURE__ */ jsx7(
     "ul",
     {
       "data-slot": "sidebar-menu",
@@ -702,7 +699,7 @@ function SidebarMenu({ className, ...props }) {
   );
 }
 function SidebarMenuItem({ className, ...props }) {
-  return /* @__PURE__ */ jsx6(
+  return /* @__PURE__ */ jsx7(
     "li",
     {
       "data-slot": "sidebar-menu-item",
@@ -743,7 +740,7 @@ function SidebarMenuButton({
 }) {
   const Comp = asChild ? Slot2 : "button";
   const { isMobile, state } = useSidebar();
-  const button = /* @__PURE__ */ jsx6(
+  const button = /* @__PURE__ */ jsx7(
     Comp,
     {
       "data-slot": "sidebar-menu-button",
@@ -763,8 +760,8 @@ function SidebarMenuButton({
     };
   }
   return /* @__PURE__ */ jsxs4(Tooltip, { children: [
-    /* @__PURE__ */ jsx6(TooltipTrigger, { asChild: true, children: button }),
-    /* @__PURE__ */ jsx6(
+    /* @__PURE__ */ jsx7(TooltipTrigger, { asChild: true, children: button }),
+    /* @__PURE__ */ jsx7(
       TooltipContent,
       {
         side: "right",
@@ -782,7 +779,7 @@ function SidebarMenuAction({
   ...props
 }) {
   const Comp = asChild ? Slot2 : "button";
-  return /* @__PURE__ */ jsx6(
+  return /* @__PURE__ */ jsx7(
     Comp,
     {
       "data-slot": "sidebar-menu-action",
@@ -806,7 +803,7 @@ function SidebarMenuBadge({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx6(
+  return /* @__PURE__ */ jsx7(
     "div",
     {
       "data-slot": "sidebar-menu-badge",
@@ -840,14 +837,14 @@ function SidebarMenuSkeleton({
       className: cn("flex h-8 items-center gap-2 rounded-md px-2", className),
       ...props,
       children: [
-        showIcon && /* @__PURE__ */ jsx6(
+        showIcon && /* @__PURE__ */ jsx7(
           Skeleton,
           {
             className: "size-4 rounded-md",
             "data-sidebar": "menu-skeleton-icon"
           }
         ),
-        /* @__PURE__ */ jsx6(
+        /* @__PURE__ */ jsx7(
           Skeleton,
           {
             className: "h-4 max-w-(--skeleton-width) flex-1",
@@ -862,7 +859,7 @@ function SidebarMenuSkeleton({
   );
 }
 function SidebarMenuSub({ className, ...props }) {
-  return /* @__PURE__ */ jsx6(
+  return /* @__PURE__ */ jsx7(
     "ul",
     {
       "data-slot": "sidebar-menu-sub",
@@ -880,7 +877,7 @@ function SidebarMenuSubItem({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx6(
+  return /* @__PURE__ */ jsx7(
     "li",
     {
       "data-slot": "sidebar-menu-sub-item",
@@ -898,7 +895,7 @@ function SidebarMenuSubButton({
   ...props
 }) {
   const Comp = asChild ? Slot2 : "a";
-  return /* @__PURE__ */ jsx6(
+  return /* @__PURE__ */ jsx7(
     Comp,
     {
       "data-slot": "sidebar-menu-sub-button",
@@ -941,6 +938,6 @@ export {
   SidebarRail,
   SidebarSeparator,
   SidebarTrigger,
-  useSidebar
+  useSidebar2 as useSidebar
 };
 //# sourceMappingURL=sidebar.js.map