@opencosmos/ui 1.3.3 → 1.3.4

package/dist/index.d.mts

@@ -2459,16 +2459,18 @@ interface AppSidebarProps {
     logo?: React__default.ReactNode;
     /** Wordmark shown next to the logo when expanded */
     title?: string;
-    /** Navigation items */
+    /** Navigation items rendered at the top (below the header) */
     items?: AppSidebarNavItem[];
-    /** Body slot — rendered in the scrollable mid-section (e.g. conversation history). Only visible when expanded. */
+    /** Navigation items rendered at the bottom (above the footer) */
+    bottomItems?: AppSidebarNavItem[];
+    /** Body slot — rendered in the flex-1 mid-section (e.g. conversation history). Only visible when expanded. */
     children?: React__default.ReactNode;
     /** Footer slot — auth section, user avatar, sign-in prompt, etc. */
     footer?: React__default.ReactNode;
     /** Additional className for the <aside> */
     className?: string;
 }
-declare function AppSidebar({ logo, title, items, children, footer, className, }: AppSidebarProps): react_jsx_runtime.JSX.Element;
+declare function AppSidebar({ logo, title, items, bottomItems, children, footer, className, }: AppSidebarProps): react_jsx_runtime.JSX.Element;
 
 interface StackProps extends React__default.HTMLAttributes<HTMLDivElement> {
     /**

package/dist/index.d.ts

@@ -2459,16 +2459,18 @@ interface AppSidebarProps {
     logo?: React__default.ReactNode;
     /** Wordmark shown next to the logo when expanded */
     title?: string;
-    /** Navigation items */
+    /** Navigation items rendered at the top (below the header) */
     items?: AppSidebarNavItem[];
-    /** Body slot — rendered in the scrollable mid-section (e.g. conversation history). Only visible when expanded. */
+    /** Navigation items rendered at the bottom (above the footer) */
+    bottomItems?: AppSidebarNavItem[];
+    /** Body slot — rendered in the flex-1 mid-section (e.g. conversation history). Only visible when expanded. */
     children?: React__default.ReactNode;
     /** Footer slot — auth section, user avatar, sign-in prompt, etc. */
     footer?: React__default.ReactNode;
     /** Additional className for the <aside> */
     className?: string;
 }
-declare function AppSidebar({ logo, title, items, children, footer, className, }: AppSidebarProps): react_jsx_runtime.JSX.Element;
+declare function AppSidebar({ logo, title, items, bottomItems, children, footer, className, }: AppSidebarProps): react_jsx_runtime.JSX.Element;
 
 interface StackProps extends React__default.HTMLAttributes<HTMLDivElement> {
     /**

package/dist/index.js

@@ -11118,6 +11118,7 @@ function AppSidebar({
   logo,
   title,
   items = [],
+  bottomItems = [],
   children,
   footer,
   className
@@ -11232,6 +11233,40 @@ function AppSidebar({
             children
           }
         ),
+        bottomItems.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime89.jsx)("nav", { className: "px-2 py-2 space-y-1 shrink-0 border-t border-foreground/8", "aria-label": "Bottom navigation", children: bottomItems.map((item) => /* @__PURE__ */ (0, import_jsx_runtime89.jsxs)(
+          "a",
+          {
+            href: item.href,
+            target: item.external ? "_blank" : void 0,
+            rel: item.external ? "noopener noreferrer" : void 0,
+            title: !isOpen ? item.label : void 0,
+            "aria-label": !isOpen ? item.label : void 0,
+            className: cn(
+              "flex items-center rounded-lg transition-colors duration-150",
+              "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--color-focus)]",
+              isOpen ? "gap-3 px-3 py-3" : "justify-center w-9 h-9 mx-auto",
+              item.active ? "bg-foreground/8 text-foreground font-medium" : "text-[var(--color-text-secondary)] hover:bg-foreground/5 hover:text-[var(--color-text-primary)]"
+            ),
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime89.jsx)("span", { className: "shrink-0 flex items-center justify-center w-4 h-4", children: item.icon }),
+              /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
+                "span",
+                {
+                  className: "text-sm whitespace-nowrap",
+                  style: {
+                    opacity: isOpen ? 1 : 0,
+                    width: isOpen ? "auto" : 0,
+                    overflow: "hidden",
+                    pointerEvents: isOpen ? "auto" : "none",
+                    transition: shouldAnimate ? `opacity ${Math.round(duration * 0.55)}ms ease-out` : "none"
+                  },
+                  children: item.label
+                }
+              )
+            ]
+          },
+          item.label
+        )) }),
         footer && /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(
           "div",
           {