@12-apps/ui 5.0.0 → 5.0.1

package/dist/form/Menubar.js

@@ -0,0 +1,465 @@
+import {
+  withDefaults
+} from "../chunk-Y2JYDXL7.js";
+import {
+  accentFor
+} from "../chunk-OZCEKQIX.js";
+import "../chunk-PZ5AY32C.js";
+
+// src/components/form/Menubar/Menubar.tsx
+import KeyboardArrowDownIcon2 from "@mui/icons-material/KeyboardArrowDown";
+import {
+  AppBar,
+  Box as Box3,
+  Button as Button2,
+  Divider as Divider3,
+  ListItemIcon as ListItemIcon2,
+  ListItemText as ListItemText2,
+  Menu as Menu2,
+  MenuItem as MenuItem2,
+  Typography,
+  useTheme as useTheme2
+} from "@mui/material";
+import { useState as useState2 } from "react";
+
+// src/components/form/Menubar/Menubar.hooks.ts
+import { useCallback, useRef, useState } from "react";
+var useMenubarMenus = (onClick) => {
+  const [activeMenu, setActiveMenu] = useState(null);
+  const menuRefs = useRef({});
+  const handleMenuOpen = useCallback((itemId, anchorEl) => {
+    setActiveMenu(itemId);
+    menuRefs.current[itemId] = anchorEl;
+  }, []);
+  const handleMenuClose = useCallback(() => {
+    setActiveMenu((previous) => {
+      if (previous && menuRefs.current[previous]) {
+        menuRefs.current[previous].focus();
+      }
+      return null;
+    });
+  }, []);
+  const handleItemClick = useCallback(
+    (item) => {
+      item.action?.();
+      onClick?.(item);
+      handleMenuClose();
+    },
+    [onClick, handleMenuClose]
+  );
+  return { activeMenu, menuRefs, handleMenuOpen, handleMenuClose, handleItemClick };
+};
+
+// src/components/form/Menubar/Menubar.styles.ts
+import { alpha } from "@mui/material";
+var SIZES = {
+  xs: (theme) => ({ minHeight: 40, fontSize: "0.75rem", padding: theme.spacing(0.5, 1) }),
+  sm: (theme) => ({ minHeight: 48, fontSize: "0.875rem", padding: theme.spacing(0.75, 1.5) }),
+  md: (theme) => ({ minHeight: 56, fontSize: "1rem", padding: theme.spacing(1, 2) }),
+  lg: (theme) => ({ minHeight: 64, fontSize: "1.125rem", padding: theme.spacing(1.25, 2.5) }),
+  xl: (theme) => ({ minHeight: 72, fontSize: "1.25rem", padding: theme.spacing(1.5, 3) })
+};
+var sizeStyles = (theme, size) => (SIZES[size] ?? SIZES.md)(theme);
+var accentOf = (theme, color) => color === "neutral" ? theme.palette.primary.main : accentFor(theme, color).main;
+var colorStyles = (theme, color, transparent) => {
+  const surface = color === "neutral" ? { backgroundColor: theme.palette.background.paper, color: theme.palette.text.primary } : { backgroundColor: accentFor(theme, color).main, color: accentFor(theme, color).contrastText };
+  return transparent ? { ...surface, backgroundColor: "transparent" } : surface;
+};
+var SURFACES = {
+  glass: (theme, { glass }) => ({
+    backgroundColor: alpha(theme.palette.background.paper, glass ? 0.1 : 0.8),
+    backdropFilter: "blur(20px)",
+    borderBottom: `1px solid ${alpha(theme.palette.divider, 0.1)}`
+  }),
+  gradient: (theme, { color, gradient }) => {
+    const accent = accentFor(theme, color === "neutral" ? "primary" : color);
+    return {
+      background: gradient ? `linear-gradient(135deg, ${accent.light}, ${accent.dark})` : accent.main,
+      color: accent.contrastText
+    };
+  },
+  elevated: (theme, { blur, elevation }) => ({
+    ...blur && { backdropFilter: "blur(10px)" },
+    boxShadow: theme.shadows[elevation]
+  }),
+  minimal: (_theme, { blur }) => ({
+    ...blur && { backdropFilter: "blur(10px)" },
+    boxShadow: "none",
+    borderBottom: "none"
+  }),
+  bordered: (theme, { blur, color }) => ({
+    ...blur && { backdropFilter: "blur(10px)" },
+    borderBottom: `2px solid ${color === "neutral" ? theme.palette.divider : accentFor(theme, color).main}`
+  }),
+  default: (_theme, { blur }) => ({ ...blur && { backdropFilter: "blur(10px)" } })
+};
+var barStyles = (theme, flags) => {
+  const { variant, size, color, glow, pulse, transparent } = flags;
+  return {
+    transition: theme.transitions.create(["all"], {
+      duration: theme.transitions.duration.standard
+    }),
+    ...sizeStyles(theme, size),
+    ...colorStyles(theme, color, transparent),
+    ...glow && { boxShadow: `0 0 20px ${alpha(accentOf(theme, color), 0.4)}` },
+    ...pulse && {
+      animation: "pulse 2s infinite",
+      "@keyframes pulse": {
+        "0%": { opacity: 1 },
+        "50%": { opacity: 0.8 },
+        "100%": { opacity: 1 }
+      }
+    },
+    ...(SURFACES[variant] ?? SURFACES.default)(theme, flags)
+  };
+};
+
+// src/components/form/Menubar/Menubar.toolbar.tsx
+import { Box as Box2, CircularProgress, Toolbar } from "@mui/material";
+
+// src/components/form/Menubar/Menubar.item.tsx
+import KeyboardArrowDownIcon from "@mui/icons-material/KeyboardArrowDown";
+import {
+  Box,
+  Button,
+  Chip,
+  Divider,
+  ListItemIcon,
+  ListItemText,
+  Menu,
+  MenuItem,
+  useTheme
+} from "@mui/material";
+import { jsx, jsxs } from "react/jsx-runtime";
+var DropdownItem = ({
+  child,
+  onActivate
+}) => child.divider ? /* @__PURE__ */ jsx(Divider, {}) : /* @__PURE__ */ jsxs(MenuItem, { onClick: () => onActivate(child), disabled: child.disabled, children: [
+  child.icon && /* @__PURE__ */ jsx(ListItemIcon, { children: child.icon }),
+  /* @__PURE__ */ jsx(ListItemText, { children: child.label }),
+  child.shortcut && /* @__PURE__ */ jsx(
+    Chip,
+    {
+      label: child.shortcut,
+      size: "small",
+      variant: "outlined",
+      sx: { ml: 2, height: 20, fontSize: "0.7rem" }
+    }
+  )
+] });
+var MenubarItemView = ({
+  item,
+  size,
+  disabled,
+  isOpen,
+  anchorEl,
+  onOpen,
+  onActivate,
+  onClose,
+  onFocus,
+  onBlur
+}) => {
+  const theme = useTheme();
+  const hasChildren = Boolean(item.children && item.children.length > 0);
+  const activate = (target) => {
+    if (hasChildren) {
+      onOpen(item.id, target);
+    } else {
+      onActivate(item);
+    }
+  };
+  return /* @__PURE__ */ jsxs(Box, { children: [
+    /* @__PURE__ */ jsx(
+      Button,
+      {
+        "data-testid": `menubar-button-${item.id}`,
+        onClick: (e) => activate(e.currentTarget),
+        onKeyDown: (e) => {
+          if (e.key === "Enter" || e.key === " ") {
+            e.preventDefault();
+            activate(e.currentTarget);
+          }
+        },
+        onMouseDown: (e) => e.preventDefault(),
+        onFocus,
+        onBlur,
+        disabled: item.disabled || disabled,
+        startIcon: item.icon,
+        endIcon: hasChildren ? /* @__PURE__ */ jsx(KeyboardArrowDownIcon, {}) : null,
+        "aria-haspopup": hasChildren ? "menu" : void 0,
+        "aria-expanded": hasChildren ? isOpen : void 0,
+        sx: { color: "inherit", textTransform: "none", ...sizeStyles(theme, size) },
+        children: item.label
+      }
+    ),
+    hasChildren && /* @__PURE__ */ jsx(
+      Menu,
+      {
+        anchorEl,
+        open: isOpen,
+        onClose,
+        autoFocus: true,
+        PaperProps: { sx: { minWidth: 200, mt: 1 } },
+        children: item.children?.map((child) => /* @__PURE__ */ jsx(DropdownItem, { child, onActivate }, child.id))
+      }
+    )
+  ] });
+};
+
+// src/components/form/Menubar/Menubar.separator.tsx
+import { Divider as Divider2 } from "@mui/material";
+import { jsx as jsx2 } from "react/jsx-runtime";
+var MenubarSeparator = ({
+  orientation = "horizontal",
+  className,
+  style
+}) => /* @__PURE__ */ jsx2(
+  Divider2,
+  {
+    orientation: orientation === "horizontal" ? "vertical" : "horizontal",
+    flexItem: true,
+    className,
+    sx: {
+      mx: orientation === "horizontal" ? 1 : 0,
+      my: orientation === "vertical" ? 1 : 0,
+      ...style
+    }
+  }
+);
+
+// src/components/form/Menubar/Menubar.toolbar.tsx
+import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
+var MenubarToolbar = ({
+  barSx,
+  items,
+  size,
+  orientation,
+  disabled,
+  loading,
+  logo,
+  endContent,
+  fullWidth,
+  activeMenu,
+  menuRefs,
+  onOpen,
+  onActivate,
+  onClose,
+  onFocus,
+  onBlur
+}) => {
+  const isVertical = orientation === "vertical";
+  return /* @__PURE__ */ jsxs2(
+    Toolbar,
+    {
+      role: "toolbar",
+      "aria-label": "Main navigation",
+      sx: {
+        ...barSx,
+        width: fullWidth ? "100%" : "auto",
+        flexDirection: isVertical ? "column" : "row",
+        alignItems: isVertical ? "flex-start" : "center",
+        gap: 1
+      },
+      children: [
+        logo && /* @__PURE__ */ jsx3(Box2, { sx: { mr: 2, display: "flex", alignItems: "center" }, children: logo }),
+        loading ? /* @__PURE__ */ jsx3(CircularProgress, { size: 20, color: "inherit" }) : /* @__PURE__ */ jsx3(
+          Box2,
+          {
+            sx: {
+              display: "flex",
+              flexDirection: isVertical ? "column" : "row",
+              gap: isVertical ? 0.5 : 1,
+              flex: 1
+            },
+            children: items.map(
+              (item) => item.divider ? /* @__PURE__ */ jsx3(MenubarSeparator, { orientation }, item.id) : /* @__PURE__ */ jsx3(
+                MenubarItemView,
+                {
+                  item,
+                  size,
+                  disabled,
+                  isOpen: activeMenu === item.id,
+                  anchorEl: menuRefs.current[item.id] ?? null,
+                  onOpen,
+                  onActivate,
+                  onClose,
+                  onFocus,
+                  onBlur
+                },
+                item.id
+              )
+            )
+          }
+        ),
+        endContent && /* @__PURE__ */ jsx3(Box2, { sx: { ml: "auto" }, children: endContent })
+      ]
+    }
+  );
+};
+
+// src/components/form/Menubar/Menubar.tsx
+import { Fragment, jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
+var DEFAULTS = {
+  variant: "default",
+  size: "md",
+  color: "neutral",
+  orientation: "horizontal",
+  glow: false,
+  pulse: false,
+  glass: false,
+  gradient: false,
+  loading: false,
+  disabled: false,
+  sticky: false,
+  transparent: false,
+  blur: false,
+  elevation: 4,
+  fullWidth: true
+};
+var Menubar = (props) => {
+  const {
+    items,
+    variant,
+    size,
+    color,
+    orientation,
+    glow,
+    pulse,
+    glass,
+    gradient,
+    loading,
+    disabled,
+    className,
+    style,
+    logo,
+    endContent,
+    sticky,
+    transparent,
+    blur,
+    elevation,
+    fullWidth,
+    onClick,
+    onFocus,
+    onBlur,
+    "data-testid": dataTestId
+  } = withDefaults(props, DEFAULTS);
+  const theme = useTheme2();
+  const { activeMenu, menuRefs, handleMenuOpen, handleMenuClose, handleItemClick } = useMenubarMenus(onClick);
+  const isVertical = orientation === "vertical";
+  const barSx = barStyles(theme, {
+    variant,
+    size,
+    color,
+    glow,
+    pulse,
+    glass,
+    gradient,
+    blur,
+    transparent,
+    elevation
+  });
+  const content = /* @__PURE__ */ jsx4(
+    MenubarToolbar,
+    {
+      barSx,
+      items,
+      size,
+      orientation,
+      disabled,
+      loading,
+      logo,
+      endContent,
+      fullWidth,
+      activeMenu,
+      menuRefs,
+      onOpen: handleMenuOpen,
+      onActivate: handleItemClick,
+      onClose: handleMenuClose,
+      onFocus,
+      onBlur
+    }
+  );
+  if (isVertical) {
+    return /* @__PURE__ */ jsx4(
+      Box3,
+      {
+        className,
+        sx: {
+          ...style,
+          position: sticky ? "sticky" : "relative",
+          top: sticky ? 0 : "auto",
+          zIndex: theme.zIndex.appBar
+        },
+        children: content
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx4(
+    AppBar,
+    {
+      position: sticky ? "sticky" : "static",
+      className,
+      "data-testid": dataTestId,
+      sx: { ...barSx, ...style },
+      elevation: 0,
+      component: "header",
+      children: content
+    }
+  );
+};
+var MenubarGroup = ({
+  label,
+  items,
+  icon,
+  disabled,
+  open,
+  onOpenChange,
+  onClick,
+  className,
+  style
+}) => {
+  const [anchorEl, setAnchorEl] = useState2(null);
+  const isOpen = open !== void 0 ? open : Boolean(anchorEl);
+  const handleClick = (event) => {
+    setAnchorEl(event.currentTarget);
+    onOpenChange?.(true);
+  };
+  const handleClose = () => {
+    setAnchorEl(null);
+    onOpenChange?.(false);
+  };
+  const handleItemClick = (item) => {
+    if (item.action) {
+      item.action();
+    }
+    onClick?.(item);
+    handleClose();
+  };
+  return /* @__PURE__ */ jsxs3(Fragment, { children: [
+    /* @__PURE__ */ jsx4(
+      Button2,
+      {
+        onClick: handleClick,
+        disabled,
+        startIcon: icon,
+        endIcon: /* @__PURE__ */ jsx4(KeyboardArrowDownIcon2, {}),
+        className,
+        sx: style,
+        children: label
+      }
+    ),
+    /* @__PURE__ */ jsx4(Menu2, { anchorEl, open: isOpen, onClose: handleClose, children: items.map(
+      (item) => item.divider ? /* @__PURE__ */ jsx4(Divider3, {}, item.id) : /* @__PURE__ */ jsxs3(MenuItem2, { onClick: () => handleItemClick(item), disabled: item.disabled, children: [
+        item.icon && /* @__PURE__ */ jsx4(ListItemIcon2, { children: item.icon }),
+        /* @__PURE__ */ jsx4(ListItemText2, { children: item.label }),
+        item.shortcut && /* @__PURE__ */ jsx4(Typography, { variant: "caption", sx: { ml: 2 }, children: item.shortcut })
+      ] }, item.id)
+    ) })
+  ] });
+};
+export {
+  Menubar,
+  MenubarGroup,
+  MenubarSeparator
+};
+//# sourceMappingURL=Menubar.js.map

package/dist/form/Menubar.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/form/Menubar/Menubar.tsx","../../src/components/form/Menubar/Menubar.hooks.ts","../../src/components/form/Menubar/Menubar.styles.ts","../../src/components/form/Menubar/Menubar.toolbar.tsx","../../src/components/form/Menubar/Menubar.item.tsx","../../src/components/form/Menubar/Menubar.separator.tsx"],"sourcesContent":["import KeyboardArrowDownIcon from '@mui/icons-material/KeyboardArrowDown';\nimport {\n  AppBar,\n  Box,\n  Button,\n  Divider,\n  ListItemIcon,\n  ListItemText,\n  Menu,\n  MenuItem,\n  Typography,\n  useTheme,\n} from '@mui/material';\nimport React, { useState } from 'react';\n\nimport { withDefaults } from '../../../utils/withDefaults';\n\nimport { useMenubarMenus } from './Menubar.hooks';\nimport { barStyles } from './Menubar.styles';\nimport { MenubarToolbar } from './Menubar.toolbar';\n\nimport type {\n  MenubarGroupProps,\n  MenubarItem,\n  MenubarProps,\n} from './Menubar.types';\n\nconst DEFAULTS = {\n  variant: 'default',\n  size: 'md',\n  color: 'neutral',\n  orientation: 'horizontal',\n  glow: false,\n  pulse: false,\n  glass: false,\n  gradient: false,\n  loading: false,\n  disabled: false,\n  sticky: false,\n  transparent: false,\n  blur: false,\n  elevation: 4,\n  fullWidth: true,\n} satisfies Partial<MenubarProps>;\n\ntype ResolvedProps = MenubarProps & Required<Pick<MenubarProps, keyof typeof DEFAULTS>>;\n\nexport const Menubar: React.FC<MenubarProps> = (props) => {\n  const {\n    items, variant, size, color, orientation, glow, pulse, glass, gradient,\n    loading, disabled, className, style, logo, endContent, sticky, transparent,\n    blur, elevation, fullWidth, onClick, onFocus, onBlur,\n    'data-testid': dataTestId,\n  } = withDefaults(props, DEFAULTS) as ResolvedProps;\n\n  const theme = useTheme();\n  const { activeMenu, menuRefs, handleMenuOpen, handleMenuClose, handleItemClick } =\n    useMenubarMenus(onClick);\n\n  const isVertical = orientation === 'vertical';\n\n  const barSx = barStyles(theme, {\n    variant, size, color, glow, pulse, glass, gradient, blur, transparent, elevation,\n  });\n\n  const content = (\n    <MenubarToolbar\n      barSx={barSx}\n      items={items}\n      size={size}\n      orientation={orientation}\n      disabled={disabled}\n      loading={loading}\n      logo={logo}\n      endContent={endContent}\n      fullWidth={fullWidth}\n      activeMenu={activeMenu}\n      menuRefs={menuRefs}\n      onOpen={handleMenuOpen}\n      onActivate={handleItemClick}\n      onClose={handleMenuClose}\n      onFocus={onFocus}\n      onBlur={onBlur}\n    />\n  );\n\n  // A vertical bar is not an app bar: AppBar's fixed/sticky positioning assumes\n  // a horizontal strip at the top of the page.\n  if (isVertical) {\n    return (\n      <Box\n        className={className}\n        sx={{\n          ...style,\n          position: sticky ? 'sticky' : 'relative',\n          top: sticky ? 0 : 'auto',\n          zIndex: theme.zIndex.appBar,\n        }}\n      >\n        {content}\n      </Box>\n    );\n  }\n\n  return (\n    <AppBar\n      position={sticky ? 'sticky' : 'static'}\n      className={className}\n      data-testid={dataTestId}\n      sx={{ ...barSx, ...style }}\n      elevation={0}\n      component=\"header\"\n    >\n      {content}\n    </AppBar>\n  );\n};\n\n\nexport const MenubarGroup: React.FC<MenubarGroupProps> = ({\n  label,\n  items,\n  icon,\n  disabled,\n  open,\n  onOpenChange,\n  onClick,\n  className,\n  style,\n}) => {\n  const [anchorEl, setAnchorEl] = useState<null | HTMLElement>(null);\n  const isOpen = open !== undefined ? open : Boolean(anchorEl);\n\n  const handleClick = (event: React.MouseEvent<HTMLElement>) => {\n    setAnchorEl(event.currentTarget);\n    onOpenChange?.(true);\n  };\n\n  const handleClose = () => {\n    setAnchorEl(null);\n    onOpenChange?.(false);\n  };\n\n  const handleItemClick = (item: MenubarItem) => {\n    if (item.action) {\n      item.action();\n    }\n    onClick?.(item);\n    handleClose();\n  };\n\n  return (\n    <>\n      <Button\n        onClick={handleClick}\n        disabled={disabled}\n        startIcon={icon}\n        endIcon={<KeyboardArrowDownIcon />}\n        className={className}\n        sx={style}\n      >\n        {label}\n      </Button>\n      <Menu anchorEl={anchorEl} open={isOpen} onClose={handleClose}>\n        {items.map((item) =>\n          item.divider ? (\n            <Divider key={item.id} />\n          ) : (\n            <MenuItem key={item.id} onClick={() => handleItemClick(item)} disabled={item.disabled}>\n              {item.icon && <ListItemIcon>{item.icon}</ListItemIcon>}\n              <ListItemText>{item.label}</ListItemText>\n              {item.shortcut && (\n                <Typography variant=\"caption\" sx={{ ml: 2 }}>\n                  {item.shortcut}\n                </Typography>\n              )}\n            </MenuItem>\n          ),\n        )}\n      </Menu>\n    </>\n  );\n};\n\nexport { MenubarSeparator } from './Menubar.separator';\n","import { useCallback, useRef, useState } from 'react';\n\nimport type { MenubarItem, MenubarProps } from './Menubar.types';\n\n/**\n * Which dropdown is open, and the buttons that opened them.\n *\n * The anchors are kept in a ref rather than state because closing needs to\n * return focus to the button that opened the menu, and that lookup must not\n * itself cause a render.\n */\nexport const useMenubarMenus = (onClick?: MenubarProps['onClick']) => {\n  const [activeMenu, setActiveMenu] = useState<string | null>(null);\n  const menuRefs = useRef<{ [key: string]: HTMLElement | null }>({});\n\n  const handleMenuOpen = useCallback((itemId: string, anchorEl: HTMLElement) => {\n    setActiveMenu(itemId);\n    menuRefs.current[itemId] = anchorEl;\n  }, []);\n\n  const handleMenuClose = useCallback(() => {\n    setActiveMenu((previous) => {\n      // Return focus to the button that opened the menu.\n      if (previous && menuRefs.current[previous]) {\n        menuRefs.current[previous].focus();\n      }\n      return null;\n    });\n  }, []);\n\n  const handleItemClick = useCallback(\n    (item: MenubarItem) => {\n      item.action?.();\n      onClick?.(item);\n      handleMenuClose();\n    },\n    [onClick, handleMenuClose],\n  );\n\n  return { activeMenu, menuRefs, handleMenuOpen, handleMenuClose, handleItemClick };\n};\n","import { alpha } from '@mui/material';\nimport type { CSSObject, Theme } from '@mui/material';\n\nimport type { MenubarProps } from './Menubar.types';\nimport { accentFor} from '../../../tokens/scales';\n\ntype Size = NonNullable<MenubarProps['size']>;\ntype Variant = NonNullable<MenubarProps['variant']>;\ntype Color = NonNullable<MenubarProps['color']>;\n\nconst SIZES: Record<Size, (theme: Theme) => CSSObject> = {\n  xs: (theme) => ({ minHeight: 40, fontSize: '0.75rem', padding: theme.spacing(0.5, 1) }),\n  sm: (theme) => ({ minHeight: 48, fontSize: '0.875rem', padding: theme.spacing(0.75, 1.5) }),\n  md: (theme) => ({ minHeight: 56, fontSize: '1rem', padding: theme.spacing(1, 2) }),\n  lg: (theme) => ({ minHeight: 64, fontSize: '1.125rem', padding: theme.spacing(1.25, 2.5) }),\n  xl: (theme) => ({ minHeight: 72, fontSize: '1.25rem', padding: theme.spacing(1.5, 3) }),\n};\n\nexport const sizeStyles = (theme: Theme, size: Size): CSSObject =>\n  (SIZES[size] ?? SIZES.md)(theme);\n\n/** `default` is not a palette entry — it means the paper surface and its text. */\nconst accentOf = (theme: Theme, color: Color) =>\n  color === 'neutral' ? theme.palette.primary.main : accentFor(theme, color).main;\n\nconst colorStyles = (theme: Theme, color: Color, transparent: boolean): CSSObject => {\n  const surface =\n    color === 'neutral'\n      ? { backgroundColor: theme.palette.background.paper, color: theme.palette.text.primary }\n      : { backgroundColor: accentFor(theme, color).main, color: accentFor(theme, color).contrastText };\n\n  return transparent ? { ...surface, backgroundColor: 'transparent' } : surface;\n};\n\ninterface MenubarStyleFlags {\n  variant: Variant;\n  size: Size;\n  color: Color;\n  glow: boolean;\n  pulse: boolean;\n  glass: boolean;\n  gradient: boolean;\n  blur: boolean;\n  transparent: boolean;\n  elevation: number;\n}\n\n/**\n * Each variant's own additions to the shared bar. The `glass` and `gradient`\n * arms deliberately do not take the blur spread: glass sets its own\n * backdropFilter, and a blurred gradient loses the gradient.\n */\nconst SURFACES: Record<Variant, (theme: Theme, flags: MenubarStyleFlags) => CSSObject> = {\n  glass: (theme, { glass }) => ({\n    backgroundColor: alpha(theme.palette.background.paper, glass ? 0.1 : 0.8),\n    backdropFilter: 'blur(20px)',\n    borderBottom: `1px solid ${alpha(theme.palette.divider, 0.1)}`,\n  }),\n\n  gradient: (theme, { color, gradient }) => {\n    // `neutral` borrows primary for the gradient, as this branch always did.\n    const accent = accentFor(theme, color === 'neutral' ? 'primary' : color);\n    return {\n      background: gradient\n        ? `linear-gradient(135deg, ${accent.light}, ${accent.dark})`\n        : accent.main,\n      color: accent.contrastText,\n    };\n  },\n\n  elevated: (theme, { blur, elevation }) => ({\n    ...(blur && { backdropFilter: 'blur(10px)' }),\n    boxShadow: theme.shadows[elevation],\n  }),\n\n  minimal: (_theme, { blur }) => ({\n    ...(blur && { backdropFilter: 'blur(10px)' }),\n    boxShadow: 'none',\n    borderBottom: 'none',\n  }),\n\n  bordered: (theme, { blur, color }) => ({\n    ...(blur && { backdropFilter: 'blur(10px)' }),\n    borderBottom: `2px solid ${\n      color === 'neutral' ? theme.palette.divider : accentFor(theme, color).main\n    }`,\n  }),\n\n  default: (_theme, { blur }) => ({ ...(blur && { backdropFilter: 'blur(10px)' }) }),\n};\n\nexport const barStyles = (theme: Theme, flags: MenubarStyleFlags): CSSObject => {\n  const { variant, size, color, glow, pulse, transparent } = flags;\n\n  return {\n    transition: theme.transitions.create(['all'], {\n      duration: theme.transitions.duration.standard,\n    }),\n    ...sizeStyles(theme, size),\n    ...colorStyles(theme, color, transparent),\n    ...(glow && { boxShadow: `0 0 20px ${alpha(accentOf(theme, color), 0.4)}` }),\n    ...(pulse && {\n      animation: 'pulse 2s infinite',\n      '@keyframes pulse': {\n        '0%': { opacity: 1 },\n        '50%': { opacity: 0.8 },\n        '100%': { opacity: 1 },\n      },\n    }),\n    ...(SURFACES[variant] ?? SURFACES.default)(theme, flags),\n  };\n};\n","import { Box, CircularProgress, Toolbar } from '@mui/material';\nimport type { CSSObject } from '@mui/material';\nimport React from 'react';\n\nimport { MenubarItemView } from './Menubar.item';\nimport { MenubarSeparator } from './Menubar.separator';\nimport type { MenubarItem, MenubarProps } from './Menubar.types';\n\nexport interface MenubarToolbarProps {\n  barSx: CSSObject;\n  items: MenubarItem[];\n  size: NonNullable<MenubarProps['size']>;\n  orientation: NonNullable<MenubarProps['orientation']>;\n  disabled: boolean;\n  loading: boolean;\n  logo?: React.ReactNode;\n  endContent?: React.ReactNode;\n  fullWidth: boolean;\n  activeMenu: string | null;\n  menuRefs: React.MutableRefObject<{ [key: string]: HTMLElement | null }>;\n  onOpen: (itemId: string, anchorEl: HTMLElement) => void;\n  onActivate: (item: MenubarItem) => void;\n  onClose: () => void;\n  onFocus?: React.FocusEventHandler;\n  onBlur?: React.FocusEventHandler;\n}\n\n/**\n * The bar's contents: an optional logo, the entries themselves, and whatever the\n * caller hangs off the end. Shared by both orientations — only the element\n * wrapping it differs.\n */\nexport const MenubarToolbar: React.FC<MenubarToolbarProps> = ({\n  barSx,\n  items,\n  size,\n  orientation,\n  disabled,\n  loading,\n  logo,\n  endContent,\n  fullWidth,\n  activeMenu,\n  menuRefs,\n  onOpen,\n  onActivate,\n  onClose,\n  onFocus,\n  onBlur,\n}) => {\n  const isVertical = orientation === 'vertical';\n\n  return (\n    <Toolbar\n      role=\"toolbar\"\n      aria-label=\"Main navigation\"\n      sx={{\n        ...barSx,\n        width: fullWidth ? '100%' : 'auto',\n        flexDirection: isVertical ? 'column' : 'row',\n        alignItems: isVertical ? 'flex-start' : 'center',\n        gap: 1,\n      }}\n    >\n      {logo && <Box sx={{ mr: 2, display: 'flex', alignItems: 'center' }}>{logo}</Box>}\n\n      {loading ? (\n        <CircularProgress size={20} color=\"inherit\" />\n      ) : (\n        <Box\n          sx={{\n            display: 'flex',\n            flexDirection: isVertical ? 'column' : 'row',\n            gap: isVertical ? 0.5 : 1,\n            flex: 1,\n          }}\n        >\n          {items.map((item) =>\n            item.divider ? (\n              <MenubarSeparator key={item.id} orientation={orientation} />\n            ) : (\n              <MenubarItemView\n                key={item.id}\n                item={item}\n                size={size}\n                disabled={disabled}\n                isOpen={activeMenu === item.id}\n                anchorEl={menuRefs.current[item.id] ?? null}\n                onOpen={onOpen}\n                onActivate={onActivate}\n                onClose={onClose}\n                onFocus={onFocus}\n                onBlur={onBlur}\n              />\n            ),\n          )}\n        </Box>\n      )}\n\n      {endContent && <Box sx={{ ml: 'auto' }}>{endContent}</Box>}\n    </Toolbar>\n  );\n};\n","import KeyboardArrowDownIcon from '@mui/icons-material/KeyboardArrowDown';\nimport {\n  Box,\n  Button,\n  Chip,\n  Divider,\n  ListItemIcon,\n  ListItemText,\n  Menu,\n  MenuItem,\n  useTheme,\n} from '@mui/material';\nimport React from 'react';\n\nimport { sizeStyles } from './Menubar.styles';\nimport type { MenubarItem, MenubarProps } from './Menubar.types';\n\nexport interface MenubarItemViewProps {\n  item: MenubarItem;\n  size: NonNullable<MenubarProps['size']>;\n  disabled: boolean;\n  isOpen: boolean;\n  anchorEl: HTMLElement | null;\n  onOpen: (itemId: string, anchorEl: HTMLElement) => void;\n  onActivate: (item: MenubarItem) => void;\n  onClose: () => void;\n  onFocus?: React.FocusEventHandler;\n  onBlur?: React.FocusEventHandler;\n}\n\n/** One row of an open menu: its icon, its label, and its shortcut hint. */\nconst DropdownItem: React.FC<{ child: MenubarItem; onActivate: (item: MenubarItem) => void }> = ({\n  child,\n  onActivate,\n}) =>\n  child.divider ? (\n    <Divider />\n  ) : (\n    <MenuItem onClick={() => onActivate(child)} disabled={child.disabled}>\n      {child.icon && <ListItemIcon>{child.icon}</ListItemIcon>}\n      <ListItemText>{child.label}</ListItemText>\n      {child.shortcut && (\n        <Chip\n          label={child.shortcut}\n          size=\"small\"\n          variant=\"outlined\"\n          sx={{ ml: 2, height: 20, fontSize: '0.7rem' }}\n        />\n      )}\n    </MenuItem>\n  );\n\n/**\n * A top-level menubar entry. An entry with children opens its dropdown; one\n * without acts immediately — a decision the click and keyboard paths both need,\n * so it is made once here rather than in each handler.\n */\nexport const MenubarItemView: React.FC<MenubarItemViewProps> = ({\n  item,\n  size,\n  disabled,\n  isOpen,\n  anchorEl,\n  onOpen,\n  onActivate,\n  onClose,\n  onFocus,\n  onBlur,\n}) => {\n  const theme = useTheme();\n  const hasChildren = Boolean(item.children && item.children.length > 0);\n\n  const activate = (target: HTMLElement) => {\n    if (hasChildren) {\n      onOpen(item.id, target);\n    } else {\n      onActivate(item);\n    }\n  };\n\n  return (\n    <Box>\n      <Button\n        data-testid={`menubar-button-${item.id}`}\n        onClick={(e) => activate(e.currentTarget)}\n        onKeyDown={(e) => {\n          if (e.key === 'Enter' || e.key === ' ') {\n            e.preventDefault();\n            activate(e.currentTarget);\n          }\n        }}\n        // Keeping focus on mousedown is what lets handleMenuClose return it here.\n        onMouseDown={(e) => e.preventDefault()}\n        onFocus={onFocus}\n        onBlur={onBlur}\n        disabled={item.disabled || disabled}\n        startIcon={item.icon}\n        endIcon={hasChildren ? <KeyboardArrowDownIcon /> : null}\n        aria-haspopup={hasChildren ? 'menu' : undefined}\n        aria-expanded={hasChildren ? isOpen : undefined}\n        sx={{ color: 'inherit', textTransform: 'none', ...sizeStyles(theme, size) }}\n      >\n        {item.label}\n      </Button>\n\n      {hasChildren && (\n        <Menu\n          anchorEl={anchorEl}\n          open={isOpen}\n          onClose={onClose}\n          autoFocus\n          PaperProps={{ sx: { minWidth: 200, mt: 1 } }}\n        >\n          {item.children?.map((child) => (\n            <DropdownItem key={child.id} child={child} onActivate={onActivate} />\n          ))}\n        </Menu>\n      )}\n    </Box>\n  );\n};\n","import { Divider } from '@mui/material';\nimport React from 'react';\n\nimport type { MenubarSeparatorProps } from './Menubar.types';\n\n/**\n * The rule between two entries. Its own orientation is the bar's turned ninety\n * degrees: a horizontal bar is divided by vertical rules.\n */\nexport const MenubarSeparator: React.FC<MenubarSeparatorProps> = ({\n  orientation = 'horizontal',\n  className,\n  style,\n}) => (\n  <Divider\n    orientation={orientation === 'horizontal' ? 'vertical' : 'horizontal'}\n    flexItem\n    className={className}\n    sx={{\n      mx: orientation === 'horizontal' ? 1 : 0,\n      my: orientation === 'vertical' ? 1 : 0,\n      ...style,\n    }}\n  />\n);\n"],"mappings":"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","names":["KeyboardArrowDownIcon","Box","Button","Divider","ListItemIcon","ListItemText","Menu","MenuItem","useTheme","useState","Box","Divider","jsx","jsx","jsxs","Box","jsx","jsxs","useTheme","Box","useState","Button","KeyboardArrowDownIcon","Menu","Divider","MenuItem","ListItemIcon","ListItemText"]}