react-shadcn-kit 0.0.1 → 0.0.3

package/dist/layouts/blog-layout.d.ts

@@ -0,0 +1,7 @@
+import { SidebarConfig } from '../types/navigation';
+export default function BlogLayout({ children, userConfig, scrollable, maxWidth, }: {
+    children: React.ReactNode;
+    userConfig?: Partial<SidebarConfig>;
+    scrollable?: boolean;
+    maxWidth?: string;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/layouts/blog-layout.js

@@ -0,0 +1,29 @@
+import { jsxs as l, jsx as e } from "react/jsx-runtime";
+import { SidebarProvider as t, SidebarInset as f, SidebarTrigger as m } from "../atoms/sidebar.js";
+import { AppSidebar as d } from "../organisms/app-sidebar.js";
+import { blogLayoutConfig as n } from "../config/blog-layout.config.js";
+function b({
+  children: i,
+  userConfig: a,
+  scrollable: s = !1,
+  maxWidth: r
+}) {
+  const o = { ...n, ...a };
+  return /* @__PURE__ */ l(t, { style: o.style, children: [
+    /* @__PURE__ */ e(d, { config: o, scrollable: s }),
+    /* @__PURE__ */ l(f, { children: [
+      /* @__PURE__ */ e("header", { className: "flex h-16 shrink-0 items-center gap-2 border-b px-4", children: /* @__PURE__ */ e(m, { className: "-ml-1" }) }),
+      /* @__PURE__ */ e(
+        "div",
+        {
+          className: "flex flex-1 flex-col gap-4 p-4 mx-auto w-full",
+          style: r ? { maxWidth: r } : void 0,
+          children: i
+        }
+      )
+    ] })
+  ] });
+}
+export {
+  b as default
+};

package/dist/layouts/default-layout.d.ts

@@ -0,0 +1,7 @@
+import { LayoutConfig } from '../types/layout';
+export default function Layout({ children, userConfig, scrollable, maxWidth, }: {
+    children: React.ReactNode;
+    userConfig?: Partial<LayoutConfig>;
+    scrollable?: boolean;
+    maxWidth?: string;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/layouts/default-layout.js

@@ -0,0 +1,54 @@
+import { jsx as r, jsxs as d } from "react/jsx-runtime";
+import { SidebarProvider as v, SidebarInset as f } from "../atoms/sidebar.js";
+import { AppSidebar as h } from "../organisms/app-sidebar.js";
+import { AppNavbar as m } from "../organisms/app-navbar.js";
+import { defaultSidebarConfig as p } from "../config/default-Sidebar.js";
+import { defaultLayoutConfig as i } from "../config/default-layout.js";
+function y({
+  children: o,
+  userConfig: e,
+  scrollable: t = !1,
+  maxWidth: n
+}) {
+  const a = {
+    ...i,
+    ...e,
+    sidebar: { ...i.sidebar, ...e?.sidebar || {} },
+    navbar: { ...i.navbar, ...e?.navbar || {} }
+  }, b = {
+    ...a.navbar,
+    branding: a.sidebar?.hasBranding ? p.branding : void 0
+  }, l = {
+    ...a.sidebar?.width ? { "--sidebar-width": a.sidebar.width } : {}
+  }, s = a.sidebar?.visible ?? !0, c = a.navbar?.visible ?? !0;
+  return /* @__PURE__ */ r("div", { className: "[--header-height:calc(--spacing(14))]", children: /* @__PURE__ */ d(v, { className: "flex flex-col", style: l, children: [
+    c && /* @__PURE__ */ r(
+      m,
+      {
+        config: b,
+        className: a.navbar?.transparent ? "bg-transparent" : void 0,
+        style: {
+          backgroundColor: a.navbar?.transparent ? "transparent" : a.navbar?.color,
+          height: a.navbar?.height,
+          boxShadow: a.navbar?.shadow ? void 0 : "none"
+        },
+        showSidebarTrigger: s
+      }
+    ),
+    /* @__PURE__ */ d("div", { className: "flex flex-1", children: [
+      s && /* @__PURE__ */ r(
+        h,
+        {
+          hideBranding: !0,
+          side: a.sidebar?.placement || "left",
+          scrollable: t,
+          className: "pt-14"
+        }
+      ),
+      /* @__PURE__ */ r(f, { children: /* @__PURE__ */ r("div", { className: "p-4 mx-auto w-full", style: n ? { maxWidth: n } : void 0, children: o }) })
+    ] })
+  ] }) });
+}
+export {
+  y as default
+};

package/dist/layouts/sidebar-scroll-layout.d.ts

@@ -0,0 +1,8 @@
+import { LayoutConfig } from '../types/layout';
+export default function SidebarScrollLayout({ children, userConfig, scrollable, // Default to true for this specific layout variation
+maxWidth, }: {
+    children: React.ReactNode;
+    userConfig?: Partial<LayoutConfig>;
+    scrollable?: boolean;
+    maxWidth?: string;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/layouts/sidebar-scroll-layout.js

@@ -0,0 +1,49 @@
+import { jsx as r, jsxs as t } from "react/jsx-runtime";
+import { SidebarProvider as c, SidebarInset as v } from "../atoms/sidebar.js";
+import { AppSidebar as h } from "../organisms/app-sidebar.js";
+import { AppNavbar as p } from "../organisms/app-navbar.js";
+import { defaultLayoutConfig as i } from "../config/default-layout.js";
+function S({
+  children: n,
+  userConfig: e,
+  scrollable: o = !0,
+  // Default to true for this specific layout variation
+  maxWidth: s
+}) {
+  const a = {
+    ...i,
+    ...e,
+    sidebar: { ...i.sidebar, ...e?.sidebar || {} },
+    navbar: { ...i.navbar, ...e?.navbar || {} }
+  }, b = {
+    ...a.sidebar?.width ? { "--sidebar-width": a.sidebar.width } : {}
+  }, d = a.sidebar?.visible ?? !0, l = a.navbar?.visible ?? !0;
+  return /* @__PURE__ */ r("div", { className: "[--header-height:calc(--spacing(14))]", children: /* @__PURE__ */ t(c, { className: "flex flex-col", style: b, children: [
+    l && /* @__PURE__ */ r(
+      p,
+      {
+        className: a.navbar?.transparent ? "bg-transparent" : void 0,
+        style: {
+          backgroundColor: a.navbar?.transparent ? "transparent" : a.navbar?.color,
+          height: a.navbar?.height,
+          boxShadow: a.navbar?.shadow ? void 0 : "none"
+        },
+        showSidebarTrigger: d
+      }
+    ),
+    /* @__PURE__ */ t("div", { className: "flex flex-1", children: [
+      d && /* @__PURE__ */ r(
+        h,
+        {
+          hideBranding: a.sidebar?.hasBranding === !1,
+          side: a.sidebar?.placement || "left",
+          scrollable: o
+        }
+      ),
+      /* @__PURE__ */ r(v, { children: /* @__PURE__ */ r("div", { className: "p-4 mx-auto w-full", style: s ? { maxWidth: s } : void 0, children: n }) })
+    ] })
+  ] }) });
+}
+export {
+  S as default
+};

package/dist/molecules/theme-toggle.d.ts

@@ -0,0 +1,9 @@
+import * as React from "react";
+export interface ThemeToggleProps {
+    align?: "center" | "start" | "end";
+    side?: "top" | "right" | "bottom" | "left";
+    sideOffset?: number;
+    className?: string;
+    trigger?: React.ReactNode;
+}
+export declare function ThemeToggle({ align, side, sideOffset, className, trigger, }: ThemeToggleProps): import("react/jsx-runtime").JSX.Element;

package/dist/molecules/theme-toggle.js

@@ -0,0 +1,30 @@
+import { jsxs as o, jsx as e } from "react/jsx-runtime";
+import { Sun as m, Moon as c } from "lucide-react";
+import { useTheme as d } from "next-themes";
+import { Button as h } from "../atoms/button.js";
+import { DropdownMenu as p, DropdownMenuTrigger as u, DropdownMenuContent as k, DropdownMenuItem as n } from "../atoms/dropdown-menu.js";
+import { cn as f } from "../lib/utils.js";
+function N({
+  align: a = "end",
+  side: l = "bottom",
+  sideOffset: s = 4,
+  className: i,
+  trigger: t
+}) {
+  const { setTheme: r } = d();
+  return /* @__PURE__ */ o(p, { children: [
+    /* @__PURE__ */ e(u, { asChild: !0, children: t || /* @__PURE__ */ o(h, { variant: "ghost", size: "icon", className: f("h-9 w-9", i), children: [
+      /* @__PURE__ */ e(m, { className: "h-[1.2rem] w-[1.2rem] rotate-0 scale-100 transition-all dark:-rotate-90 dark:scale-0" }),
+      /* @__PURE__ */ e(c, { className: "absolute h-[1.2rem] w-[1.2rem] rotate-90 scale-0 transition-all dark:rotate-0 dark:scale-100" }),
+      /* @__PURE__ */ e("span", { className: "sr-only", children: "Toggle theme" })
+    ] }) }),
+    /* @__PURE__ */ o(k, { align: a, side: l, sideOffset: s, children: [
+      /* @__PURE__ */ e(n, { onClick: () => r("light"), children: "Light" }),
+      /* @__PURE__ */ e(n, { onClick: () => r("dark"), children: "Dark" }),
+      /* @__PURE__ */ e(n, { onClick: () => r("system"), children: "System" })
+    ] })
+  ] });
+}
+export {
+  N as ThemeToggle
+};

package/dist/molecules/user-menu.d.ts

@@ -0,0 +1,18 @@
+import * as React from "react";
+export interface UserMenuProps {
+    user: {
+        name: string;
+        email: string;
+        avatar?: string;
+    };
+    items?: Array<{
+        label: string;
+        href?: string;
+        onClick?: () => void;
+        icon?: React.ComponentType<{
+            className?: string;
+        }>;
+    }>;
+    className?: string;
+}
+export declare function UserMenu({ user, items, className }: UserMenuProps): import("react/jsx-runtime").JSX.Element;

package/dist/molecules/user-menu.js

@@ -0,0 +1,29 @@
+import { jsxs as a, jsx as e } from "react/jsx-runtime";
+import * as d from "react";
+import { Avatar as t, AvatarImage as m, AvatarFallback as h } from "../atoms/avatar.js";
+import { Button as s } from "../atoms/button.js";
+import { DropdownMenu as p, DropdownMenuTrigger as f, DropdownMenuContent as u, DropdownMenuLabel as g, DropdownMenuSeparator as x, DropdownMenuItem as o } from "../atoms/dropdown-menu.js";
+import { cn as w } from "../lib/utils.js";
+function b({ user: n, items: l, className: i }) {
+  return /* @__PURE__ */ a(p, { children: [
+    /* @__PURE__ */ e(f, { asChild: !0, children: /* @__PURE__ */ e(s, { variant: "ghost", size: "icon", className: w("rounded-full", i), children: /* @__PURE__ */ a(t, { className: "h-8 w-8", children: [
+      /* @__PURE__ */ e(m, { src: n.avatar, alt: n.name }),
+      /* @__PURE__ */ e(h, { children: n.name?.[0] ?? "U" })
+    ] }) }) }),
+    /* @__PURE__ */ a(u, { align: "end", children: [
+      /* @__PURE__ */ e(g, { className: "p-0 font-normal", children: /* @__PURE__ */ a("div", { className: "flex flex-col space-y-1", children: [
+        /* @__PURE__ */ e("p", { className: "text-sm font-medium leading-none", children: n.name }),
+        /* @__PURE__ */ e("p", { className: "text-xs leading-none text-muted-foreground", children: n.email })
+      ] }) }),
+      /* @__PURE__ */ e(x, {}),
+      l?.map((r, c) => /* @__PURE__ */ e(o, { asChild: !0, children: /* @__PURE__ */ a("a", { href: r.href ?? "#", onClick: r.onClick, children: [
+        r.icon && d.createElement(r.icon, { className: "mr-2 h-4 w-4" }),
+        /* @__PURE__ */ e("span", { children: r.label })
+      ] }) }, c)),
+      !l?.length && /* @__PURE__ */ e(o, { asChild: !0, children: /* @__PURE__ */ e("a", { href: "#profile", children: "Profile" }) })
+    ] })
+  ] });
+}
+export {
+  b as UserMenu
+};

package/dist/{molecules → organisms}/app-navbar.d.ts

@@ -3,9 +3,11 @@ interface AppNavbarProps {
     config?: Partial<NavbarConfig>;
     showSearch?: boolean;
     showSidebarTrigger?: boolean;
-    showThemeToggle?: boolean;
     showUserMenu?: boolean;
+    showThemeToggle?: boolean;
     showNotifications?: boolean;
+    className?: string;
+    style?: React.CSSProperties;
 }
-export declare function AppNavbar({ config, showSearch, showSidebarTrigger, showThemeToggle, showUserMenu, showNotifications, }: AppNavbarProps): import("react/jsx-runtime").JSX.Element;
+export declare function AppNavbar({ config, showSearch, showSidebarTrigger, showUserMenu, showThemeToggle, showNotifications, className, style, }: AppNavbarProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/organisms/app-navbar.js

@@ -0,0 +1,89 @@
+import { jsxs as t, Fragment as h, jsx as e } from "react/jsx-runtime";
+import { Search as f, Bell as g } from "lucide-react";
+import { Input as N } from "../atoms/input.js";
+import { SidebarTrigger as b } from "../atoms/sidebar.js";
+import { Separator as x } from "../atoms/separator.js";
+import { defaultNavbarConfig as n } from "../config/default-navigation.js";
+import { Button as w } from "../atoms/button.js";
+import { DropdownMenu as M, DropdownMenuTrigger as v, DropdownMenuContent as D, DropdownMenuLabel as I, DropdownMenuSeparator as C, DropdownMenuItem as P } from "../atoms/dropdown-menu.js";
+import { ThemeToggle as S } from "../molecules/theme-toggle.js";
+import { UserMenu as T } from "../molecules/user-menu.js";
+function q({
+  config: a,
+  showSearch: o = !0,
+  showSidebarTrigger: l = !0,
+  showUserMenu: m = !0,
+  showThemeToggle: c = !0,
+  showNotifications: d = !0,
+  className: i,
+  style: u
+}) {
+  const r = {
+    items: a?.items || n.items,
+    searchPlaceholder: a?.searchPlaceholder || n.searchPlaceholder,
+    user: a?.user || n.user,
+    userMenuItems: a?.userMenuItems || n.userMenuItems,
+    notifications: a?.notifications || n.notifications,
+    branding: a?.branding || n.branding
+  };
+  return /* @__PURE__ */ t(
+    "header",
+    {
+      className: "flex h-16 shrink-0 items-center gap-2 border-b px-4 bg-background sticky top-0 z-50" + (i ? ` ${i}` : ""),
+      style: u,
+      children: [
+        l && /* @__PURE__ */ t(h, { children: [
+          /* @__PURE__ */ e(b, { className: "-ml-1" }),
+          /* @__PURE__ */ e(x, { orientation: "vertical", className: "mr-2 h-4" })
+        ] }),
+        r.branding && /* @__PURE__ */ t("a", { href: r.branding.href || "#", className: "flex items-center gap-2 mr-4", children: [
+          r.branding.logo && /* @__PURE__ */ e(r.branding.logo, { className: "h-6 w-6" }),
+          /* @__PURE__ */ e("span", { className: "font-semibold", children: r.branding.name })
+        ] }),
+        /* @__PURE__ */ t("div", { className: "ml-auto flex items-center gap-2", children: [
+          o && /* @__PURE__ */ t("div", { className: "relative", children: [
+            /* @__PURE__ */ e(f, { className: "absolute left-2 top-2.5 h-4 w-4 text-muted-foreground" }),
+            /* @__PURE__ */ e(
+              N,
+              {
+                placeholder: r.searchPlaceholder,
+                className: "pl-8 w-[200px] lg:w-[300px]"
+              }
+            )
+          ] }),
+          c && /* @__PURE__ */ e(S, {}),
+          m && r.user && /* @__PURE__ */ e(T, { user: r.user, items: r.userMenuItems }),
+          d && r.notifications && /* @__PURE__ */ t(M, { children: [
+            /* @__PURE__ */ e(v, { asChild: !0, children: /* @__PURE__ */ t(w, { variant: "ghost", size: "icon", className: "relative", children: [
+              /* @__PURE__ */ e(g, { className: "h-5 w-5" }),
+              r.notifications.some((s) => !s.read) && /* @__PURE__ */ e("span", { className: "absolute right-2 top-2 h-2 w-2 rounded-full bg-red-600" }),
+              /* @__PURE__ */ e("span", { className: "sr-only", children: "Notifications" })
+            ] }) }),
+            /* @__PURE__ */ t(D, { align: "end", className: "w-80", children: [
+              /* @__PURE__ */ e(I, { children: "Notifications" }),
+              /* @__PURE__ */ e(C, {}),
+              r.notifications.map((s, p) => /* @__PURE__ */ t(
+                P,
+                {
+                  className: "flex flex-col items-start gap-1 p-3 cursor-pointer",
+                  children: [
+                    /* @__PURE__ */ t("div", { className: "flex w-full items-center justify-between", children: [
+                      /* @__PURE__ */ e("span", { className: "font-medium", children: s.title }),
+                      /* @__PURE__ */ e("span", { className: "text-xs text-muted-foreground", children: s.date })
+                    ] }),
+                    /* @__PURE__ */ e("p", { className: "text-sm text-muted-foreground line-clamp-2", children: s.description })
+                  ]
+                },
+                p
+              )),
+              r.notifications.length === 0 && /* @__PURE__ */ e("div", { className: "p-4 text-center text-sm text-muted-foreground", children: "No new notifications" })
+            ] })
+          ] })
+        ] })
+      ]
+    }
+  );
+}
+export {
+  q as AppNavbar
+};

package/dist/{molecules → organisms}/app-sidebar.d.ts

@@ -1,9 +1,12 @@
+import { Sidebar } from '../atoms/sidebar';
 import { SidebarConfig } from '../types/navigation';
 interface AppSidebarProps {
     config?: Partial<SidebarConfig>;
     side?: "left" | "right";
     variant?: "sidebar" | "floating" | "inset";
     collapsible?: "offcanvas" | "icon" | "none";
+    hideBranding?: boolean;
+    showThemeToggle?: boolean;
 }
-export declare function AppSidebar({ config, side, variant, collapsible, }: AppSidebarProps): import("react/jsx-runtime").JSX.Element;
+export declare function AppSidebar({ config, side, variant, collapsible, hideBranding, showThemeToggle, className, style, scrollable, ...props }: AppSidebarProps & React.ComponentProps<typeof Sidebar>): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/organisms/app-sidebar.js

@@ -0,0 +1,169 @@
+import { jsxs as a, jsx as e } from "react/jsx-runtime";
+import { ChevronDown as m, Sun as B, Moon as F, LogOut as E } from "lucide-react";
+import { useTheme as H } from "next-themes";
+import { Sidebar as J, SidebarHeader as f, SidebarMenu as d, SidebarMenuItem as c, SidebarMenuButton as t, SidebarContent as K, SidebarGroup as P, SidebarGroupLabel as g, SidebarGroupContent as N, SidebarMenuSub as Q, SidebarMenuSubItem as R, SidebarMenuSubButton as U, SidebarFooter as V } from "../atoms/sidebar.js";
+import { Collapsible as x, CollapsibleTrigger as v, CollapsibleContent as C } from "../atoms/collapsible.js";
+import { cn as W } from "../lib/utils.js";
+import { defaultSidebarConfig as n } from "../config/default-Sidebar.js";
+import { defaultSidebarStyles as b } from "../config/sidebar.config.js";
+import { Avatar as S, AvatarImage as w, AvatarFallback as M } from "../atoms/avatar.js";
+import { DropdownMenu as y, DropdownMenuTrigger as k, DropdownMenuContent as A, DropdownMenuItem as o, DropdownMenuLabel as X, DropdownMenuSeparator as Y } from "../atoms/dropdown-menu.js";
+function te({
+  config: i,
+  side: z = "left",
+  variant: D,
+  collapsible: I,
+  hideBranding: T = !1,
+  showThemeToggle: L = !0,
+  className: j,
+  style: O,
+  scrollable: G,
+  ...q
+}) {
+  const { setTheme: u } = H(), r = {
+    groups: i?.groups || n.groups,
+    header: i?.header || n.header,
+    footer: i?.footer || n.footer,
+    user: i?.user || n.user,
+    userMenuItems: i?.userMenuItems || n.userMenuItems,
+    branding: T ? void 0 : i?.branding || n.branding,
+    fixed: i?.fixed ?? n.fixed,
+    variant: D ?? i?.variant ?? b.variant,
+    collapsible: I ?? i?.collapsible ?? b.collapsible,
+    scrollable: G ?? i?.scrollable ?? !1,
+    style: { ...b.style, ...i?.style, ...O },
+    className: i?.className
+  };
+  return /* @__PURE__ */ a(
+    J,
+    {
+      side: z,
+      variant: r.variant,
+      collapsible: r.collapsible,
+      scrollable: r.scrollable,
+      className: W(
+        r.fixed ? void 0 : "absolute h-full",
+        r.className,
+        j
+      ),
+      style: r.style,
+      ...q,
+      children: [
+        r.header && /* @__PURE__ */ e(f, { children: r.header }),
+        r.branding && !r.header && /* @__PURE__ */ e(f, { children: /* @__PURE__ */ e(d, { children: /* @__PURE__ */ e(c, { children: /* @__PURE__ */ e(t, { size: "lg", asChild: !0, children: /* @__PURE__ */ a("a", { href: r.branding.href || "#", children: [
+          /* @__PURE__ */ e("div", { className: "bg-sidebar-primary text-sidebar-primary-foreground flex aspect-square size-8 items-center justify-center rounded-lg", children: r.branding.logo && /* @__PURE__ */ e(r.branding.logo, { className: "size-4" }) }),
+          /* @__PURE__ */ a("div", { className: "grid flex-1 text-left text-sm leading-tight", children: [
+            /* @__PURE__ */ e("span", { className: "truncate font-semibold", children: r.branding.name }),
+            /* @__PURE__ */ e("span", { className: "truncate text-xs", children: "Enterprise" })
+          ] })
+        ] }) }) }) }) }),
+        /* @__PURE__ */ e(K, { children: r.groups.map((s, p) => /* @__PURE__ */ a(P, { children: [
+          s.label && (s.collapsible ? /* @__PURE__ */ a(x, { defaultOpen: !0, className: "group/collapsible", children: [
+            /* @__PURE__ */ e(g, { asChild: !0, children: /* @__PURE__ */ a(v, { children: [
+              s.label,
+              /* @__PURE__ */ e(m, { className: "ml-auto transition-transform group-data-[state=open]/collapsible:rotate-180" })
+            ] }) }),
+            /* @__PURE__ */ e(C, { children: /* @__PURE__ */ e(N, { children: /* @__PURE__ */ e(d, { children: s.items.map((l) => /* @__PURE__ */ e(c, { children: /* @__PURE__ */ e(t, { asChild: !0, isActive: l.isActive, children: /* @__PURE__ */ a("a", { href: l.href, children: [
+              l.icon && /* @__PURE__ */ e(l.icon, {}),
+              /* @__PURE__ */ e("span", { children: l.label })
+            ] }) }) }, l.href)) }) }) })
+          ] }) : /* @__PURE__ */ e(g, { children: s.label })),
+          !s.collapsible && /* @__PURE__ */ e(N, { children: /* @__PURE__ */ e(d, { children: s.items.map((l) => /* @__PURE__ */ e(c, { children: l.items && l.items.length > 0 ? /* @__PURE__ */ a(x, { className: "group/collapsible", children: [
+            /* @__PURE__ */ e(t, { asChild: !0, isActive: l.isActive, children: /* @__PURE__ */ a(v, { children: [
+              l.icon && /* @__PURE__ */ e(l.icon, {}),
+              /* @__PURE__ */ e("span", { children: l.label }),
+              /* @__PURE__ */ e(m, { className: "ml-auto transition-transform group-data-[state=open]/collapsible:rotate-180" })
+            ] }) }),
+            /* @__PURE__ */ e(C, { children: /* @__PURE__ */ e(Q, { children: l.items.map((h) => /* @__PURE__ */ e(R, { children: /* @__PURE__ */ e(U, { asChild: !0, isActive: h.isActive, children: /* @__PURE__ */ e("a", { href: h.href, children: /* @__PURE__ */ e("span", { children: h.label }) }) }) }, h.href)) }) })
+          ] }) : /* @__PURE__ */ e(t, { asChild: !0, isActive: l.isActive, children: /* @__PURE__ */ a("a", { href: l.href, children: [
+            l.icon && /* @__PURE__ */ e(l.icon, {}),
+            /* @__PURE__ */ e("span", { children: l.label })
+          ] }) }) }, l.href)) }) })
+        ] }, s.label || p)) }),
+        /* @__PURE__ */ a(V, { children: [
+          L && /* @__PURE__ */ e(d, { children: /* @__PURE__ */ e(c, { children: /* @__PURE__ */ a(y, { children: [
+            /* @__PURE__ */ e(k, { asChild: !0, children: /* @__PURE__ */ a(t, { size: "lg", children: [
+              /* @__PURE__ */ a("div", { className: "flex aspect-square size-8 items-center justify-center rounded-lg bg-sidebar-primary text-sidebar-primary-foreground", children: [
+                /* @__PURE__ */ e(B, { className: "size-4 rotate-0 scale-100 transition-all dark:-rotate-90 dark:scale-0" }),
+                /* @__PURE__ */ e(F, { className: "absolute size-4 rotate-90 scale-0 transition-all dark:rotate-0 dark:scale-100" })
+              ] }),
+              /* @__PURE__ */ a("div", { className: "grid flex-1 text-left text-sm leading-tight", children: [
+                /* @__PURE__ */ e("span", { className: "truncate font-semibold", children: "Theme" }),
+                /* @__PURE__ */ e("span", { className: "truncate text-xs", children: "Toggle theme" })
+              ] }),
+              /* @__PURE__ */ e(m, { className: "ml-auto size-4" })
+            ] }) }),
+            /* @__PURE__ */ a(
+              A,
+              {
+                className: "w-(--radix-dropdown-menu-trigger-width) min-w-56 rounded-lg",
+                side: "bottom",
+                align: "end",
+                sideOffset: 4,
+                children: [
+                  /* @__PURE__ */ e(o, { onClick: () => u("light"), children: "Light" }),
+                  /* @__PURE__ */ e(o, { onClick: () => u("dark"), children: "Dark" }),
+                  /* @__PURE__ */ e(o, { onClick: () => u("system"), children: "System" })
+                ]
+              }
+            )
+          ] }) }) }),
+          r.user && /* @__PURE__ */ e(d, { children: /* @__PURE__ */ e(c, { children: /* @__PURE__ */ a(y, { children: [
+            /* @__PURE__ */ e(k, { asChild: !0, children: /* @__PURE__ */ a(
+              t,
+              {
+                size: "lg",
+                className: "data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground",
+                children: [
+                  /* @__PURE__ */ a(S, { className: "h-8 w-8 rounded-lg", children: [
+                    /* @__PURE__ */ e(w, { src: r.user.avatar, alt: r.user.name }),
+                    /* @__PURE__ */ e(M, { className: "rounded-lg", children: "CN" })
+                  ] }),
+                  /* @__PURE__ */ a("div", { className: "grid flex-1 text-left text-sm leading-tight", children: [
+                    /* @__PURE__ */ e("span", { className: "truncate font-semibold", children: r.user.name }),
+                    /* @__PURE__ */ e("span", { className: "truncate text-xs", children: r.user.email })
+                  ] }),
+                  /* @__PURE__ */ e(m, { className: "ml-auto size-4" })
+                ]
+              }
+            ) }),
+            /* @__PURE__ */ a(
+              A,
+              {
+                className: "w-(--radix-dropdown-menu-trigger-width) min-w-56 rounded-lg",
+                side: "bottom",
+                align: "end",
+                sideOffset: 4,
+                children: [
+                  /* @__PURE__ */ e(X, { className: "p-0 font-normal", children: /* @__PURE__ */ a("div", { className: "flex items-center gap-2 px-1 py-1.5 text-left text-sm", children: [
+                    /* @__PURE__ */ a(S, { className: "h-8 w-8 rounded-lg", children: [
+                      /* @__PURE__ */ e(w, { src: r.user.avatar, alt: r.user.name }),
+                      /* @__PURE__ */ e(M, { className: "rounded-lg", children: "CN" })
+                    ] }),
+                    /* @__PURE__ */ a("div", { className: "grid flex-1 text-left text-sm leading-tight", children: [
+                      /* @__PURE__ */ e("span", { className: "truncate font-semibold", children: r.user.name }),
+                      /* @__PURE__ */ e("span", { className: "truncate text-xs", children: r.user.email })
+                    ] })
+                  ] }) }),
+                  /* @__PURE__ */ e(Y, {}),
+                  r.userMenuItems?.map((s, p) => /* @__PURE__ */ e(o, { asChild: !0, children: /* @__PURE__ */ a("a", { href: s.href || "#", onClick: s.onClick, children: [
+                    s.icon && /* @__PURE__ */ e(s.icon, { className: "mr-2 h-4 w-4" }),
+                    /* @__PURE__ */ e("span", { children: s.label })
+                  ] }) }, p)),
+                  !r.userMenuItems && /* @__PURE__ */ a(o, { children: [
+                    /* @__PURE__ */ e(E, { className: "mr-2 h-4 w-4" }),
+                    /* @__PURE__ */ e("span", { children: "Log out" })
+                  ] })
+                ]
+              }
+            )
+          ] }) }) }),
+          r.footer
+        ] })
+      ]
+    }
+  );
+}
+export {
+  te as AppSidebar
+};

package/package.json

@@ -2,7 +2,7 @@
   "name": "react-shadcn-kit",
   "author": "Tushar Yadav",
   "private": false,
-  "version": "0.0.1",
+  "version": "0.0.3",
   "type": "module",
   "main": "dist/index.js",
   "module": "dist/index.js",
@@ -15,15 +15,37 @@
   ],
   "exports": {
     ".": {
-      "import": "./dist/index.js",
-      "require": "./dist/index.js"
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
     },
-    "./atoms/*": "./dist/atoms/*",
-    "./molecules/*": "./dist/molecules/*",
-    "./organisms/*": "./dist/organisms/*",
-    "./hooks/*": "./dist/hooks/*",
-    "./lib/*": "./dist/lib/*",
-    "./config/*": "./dist/config/*"
+    "./atoms/*": {
+      "types": "./dist/atoms/*.d.ts",
+      "import": "./dist/atoms/*.js"
+    },
+    "./molecules/*": {
+      "types": "./dist/molecules/*.d.ts",
+      "import": "./dist/molecules/*.js"
+    },
+    "./organisms/*": {
+      "types": "./dist/organisms/*.d.ts",
+      "import": "./dist/organisms/*.js"
+    },
+    "./layouts/*": {
+      "types": "./dist/layouts/*.d.ts",
+      "import": "./dist/layouts/*.js"
+    },
+    "./hooks/*": {
+      "types": "./dist/hooks/*.d.ts",
+      "import": "./dist/hooks/*.js"
+    },
+    "./lib/*": {
+      "types": "./dist/lib/*.d.ts",
+      "import": "./dist/lib/*.js"
+    },
+    "./config/*": {
+      "types": "./dist/config/*.d.ts",
+      "import": "./dist/config/*.js"
+    }
   },
   "scripts": {
     "dev": "vite",
@@ -35,7 +57,8 @@
     "lint": "eslint . --report-unused-disable-directives",
     "preview": "vite preview",
     "format": "prettier --write .",
-    "test": "vitest"
+    "test": "vitest",
+    "test:exports": "node scripts/test-exports.mjs"
   },
   "peerDependencies": {
     "react": "^19.2.0",