@inf-monkeys-tech/monkeys-design 1.0.6 → 1.0.7

package/dist/components/workbench/index.mjs

@@ -87,6 +87,7 @@ var WorkbenchResizableSidebar = forwardRef(
   function WorkbenchResizableSidebar2({
     title,
     items,
+    sections = [],
     activeItemId,
     itemAs,
     collapsed,
@@ -203,6 +204,7 @@ var WorkbenchResizableSidebar = forwardRef(
         document.body.style.userSelect = "";
       };
     }, [collapseThreshold, collapsible, isResizing, maxWidth, minWidth, resolvedWidth, resolvedCollapsed]);
+    const resolvedItems = sections.length ? [...items, ...sections.flatMap((section) => section.items)] : items;
     const renderItem = (item, mobile = false) => {
       const active = item.active ?? item.id === activeItemId;
       const ItemComponent = itemAs ?? (item.href ? "a" : "button");
@@ -239,7 +241,7 @@ var WorkbenchResizableSidebar = forwardRef(
           children: [
             /* @__PURE__ */ jsx("span", { className: cn("inline-flex h-4 w-4 shrink-0 items-center justify-center [&_svg]:h-3.5 [&_svg]:w-3.5", classNames?.itemIcon), children: item.icon }),
             mobile || !resolvedCollapsed ? /* @__PURE__ */ jsx("span", { className: cn("min-w-0 flex-1 truncate", classNames?.itemLabel), children: item.label }) : null,
-            !mobile && !resolvedCollapsed && item.endContent ? /* @__PURE__ */ jsx("span", { className: "shrink-0", children: item.endContent }) : null
+            !mobile && !resolvedCollapsed && item.endContent !== void 0 && item.endContent !== null ? /* @__PURE__ */ jsx("span", { className: "shrink-0", children: item.endContent }) : null
           ]
         },
         item.id
@@ -293,12 +295,35 @@ var WorkbenchResizableSidebar = forwardRef(
                   }
                 ) : null
               ] }),
-              /* @__PURE__ */ jsx("div", { className: cn("min-h-0 flex-1 space-y-2 overflow-y-auto", resolvedCollapsed && "flex w-full flex-col items-center", classNames?.list), children: items.map((item) => renderItem(item)) })
+              /* @__PURE__ */ jsxs("div", { className: cn("min-h-0 flex-1 space-y-2 overflow-y-auto", resolvedCollapsed && "flex w-full flex-col items-center", classNames?.list), children: [
+                items.map((item) => renderItem(item)),
+                sections.map((section) => /* @__PURE__ */ jsxs(
+                  "div",
+                  {
+                    className: cn("flex w-full flex-col gap-2", classNames?.section, section.className),
+                    children: [
+                      !resolvedCollapsed && section.label ? /* @__PURE__ */ jsx(
+                        "div",
+                        {
+                          className: cn(
+                            "px-2 text-[11px] font-medium text-muted-foreground",
+                            classNames?.sectionLabel,
+                            section.labelClassName
+                          ),
+                          children: section.label
+                        }
+                      ) : null,
+                      section.items.map((item) => renderItem(item))
+                    ]
+                  },
+                  section.id
+                ))
+              ] })
             ] })
           ]
         }
       ),
-      /* @__PURE__ */ jsx("nav", { className: cn("gap-2 overflow-x-auto pb-1", mobileClassName, classNames?.mobileNav), "aria-label": typeof title === "string" ? title : void 0, children: items.map((item) => renderItem(item, true)) })
+      /* @__PURE__ */ jsx("nav", { className: cn("gap-2 overflow-x-auto pb-1", mobileClassName, classNames?.mobileNav), "aria-label": typeof title === "string" ? title : void 0, children: resolvedItems.map((item) => renderItem(item, true)) })
     ] });
   }
 );