@mirror-physics/fractal-ui 0.2.0-next.29 → 0.2.0-next.30

package/dist/index.cjs

@@ -78,6 +78,7 @@ __export(index_exports, {
   SidePanel: () => SidePanel,
   SidePanelGhost: () => SidePanelGhost,
   Sidebar: () => Sidebar,
+  SidebarAccountMenu: () => SidebarAccountMenu,
   SidebarBrand: () => SidebarBrand,
   SidebarFooter: () => SidebarFooter,
   SidebarGhost: () => SidebarGhost,
@@ -647,6 +648,7 @@ function Dropdown({
   align = "left",
   triggerContent,
   label,
+  iconOnly = false,
   noChevron = false,
   size = "md",
   triggerVariant = "outline",
@@ -727,6 +729,7 @@ function Dropdown({
           "fractal-dropdown-trigger",
           `fractal-dropdown-trigger--${size}`,
           `fractal-dropdown-trigger--${triggerVariant}`,
+          iconOnly && "fractal-dropdown-trigger--icon-only",
           triggerClassName
         ),
         children: [
@@ -734,7 +737,7 @@ function Dropdown({
             selected.icon != null && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { className: "fractal-dropdown-icon fractal-dropdown-icon--trigger", children: selected.icon }),
             selected.description != null && (typeof selected.description !== "string" || selected.description !== "") && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { className: "fractal-dropdown-selected-text", children: selected.description })
           ] }),
-          !noChevron && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { className: "fractal-dropdown-chevron", "aria-hidden": true, children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(ChevronIcon, { size: size === "sm" ? 14 : 16 }) })
+          !noChevron && !iconOnly && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { className: "fractal-dropdown-chevron", "aria-hidden": true, children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(ChevronIcon, { size: size === "sm" ? 14 : 16 }) })
         ]
       }
     ),
@@ -1491,6 +1494,29 @@ var SidebarBrand = React11.forwardRef(
   ({ className, type = "button", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("button", { ref, type, className: cn("fractal-sidebar__brand", className), ...props })
 );
 SidebarBrand.displayName = "SidebarBrand";
+function SidebarAccountMenu({
+  name,
+  items,
+  onSelect,
+  triggerLabel = "Account menu",
+  className
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+    Dropdown,
+    {
+      align: "left",
+      className: cn("fractal-sidebar__account", className),
+      items,
+      onSelect,
+      panelClassName: "fractal-sidebar__account-panel",
+      selectedValue: "",
+      triggerClassName: "fractal-sidebar__account-trigger",
+      triggerContent: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "fractal-sidebar__account-name", children: name }),
+      triggerLabel,
+      triggerVariant: "tertiary"
+    }
+  );
+}
 var SidebarNav = React11.forwardRef(
   ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("nav", { ref, className: cn("fractal-sidebar__nav", className), ...props })
 );
@@ -1799,6 +1825,7 @@ function Pagination({
   SidePanel,
   SidePanelGhost,
   Sidebar,
+  SidebarAccountMenu,
   SidebarBrand,
   SidebarFooter,
   SidebarGhost,