{
  "name": "Menubar",
  "category": "Navigation",
  "subcategory": null,
  "description": "Horizontal menubar with File/Edit-style dropdowns.",
  "thumbnail": "/preview-cards/menubar.png",
  "hasDocsPage": true,
  "nugetPackage": "Lumeo",
  "files": [
    "UI/Menubar/Menubar.razor",
    "UI/Menubar/MenubarContent.razor",
    "UI/Menubar/MenubarItem.razor",
    "UI/Menubar/MenubarLabel.razor",
    "UI/Menubar/MenubarMenu.razor",
    "UI/Menubar/MenubarSeparator.razor",
    "UI/Menubar/MenubarShortcut.razor",
    "UI/Menubar/MenubarTrigger.razor"
  ],
  "dependencies": [],
  "packageDependencies": [],
  "cssVars": [
    "--color-accent",
    "--color-accent-foreground",
    "--color-background",
    "--color-border",
    "--color-muted",
    "--color-muted-foreground",
    "--color-popover",
    "--color-popover-foreground",
    "--radius"
  ],
  "api": {
    "name": "Menubar",
    "category": "Navigation",
    "subcategory": null,
    "description": "Horizontal menubar with File/Edit-style dropdowns.",
    "nugetPackage": "Lumeo",
    "files": [
      "UI/Menubar/Menubar.razor",
      "UI/Menubar/MenubarContent.razor",
      "UI/Menubar/MenubarItem.razor",
      "UI/Menubar/MenubarLabel.razor",
      "UI/Menubar/MenubarMenu.razor",
      "UI/Menubar/MenubarSeparator.razor",
      "UI/Menubar/MenubarShortcut.razor",
      "UI/Menubar/MenubarTrigger.razor"
    ],
    "namespace": "Lumeo",
    "inheritsFrom": null,
    "implements": [],
    "parameters": [
      {
        "name": "ChildContent",
        "type": "RenderFragment?",
        "default": null,
        "description": null,
        "isCascading": false,
        "captureUnmatched": false
      },
      {
        "name": "Class",
        "type": "string?",
        "default": null,
        "description": null,
        "isCascading": false,
        "captureUnmatched": false
      },
      {
        "name": "AdditionalAttributes",
        "type": "Dictionary<string, object>?",
        "default": null,
        "description": null,
        "isCascading": false,
        "captureUnmatched": true
      }
    ],
    "events": [],
    "enums": [],
    "records": [
      {
        "name": "MenubarContext",
        "signature": "MenubarContext(\n        string? OpenMenuId,\n        EventCallback<string?> SetOpenMenuId,\n        bool AnyOpen,\n        List<string> MenuIds,\n        Action<string> RegisterMenuId,\n        Action<int> NavigateMenus)",
        "description": null
      }
    ],
    "cssVars": [
      "--color-accent",
      "--color-accent-foreground",
      "--color-background",
      "--color-border",
      "--color-muted",
      "--color-muted-foreground",
      "--color-popover",
      "--color-popover-foreground",
      "--radius"
    ],
    "examples": [
      {
        "title": "Default",
        "code": "<Menubar>\n    <MenubarMenu>\n        <MenubarTrigger>File</MenubarTrigger>\n        <MenubarContent>\n            <MenubarItem>\n                New Tab <MenubarShortcut>Ctrl+T</MenubarShortcut>\n            </MenubarItem>\n            <MenubarItem>\n                New Window <MenubarShortcut>Ctrl+N</MenubarShortcut>\n            </MenubarItem>\n            <MenubarSeparator />\n            <MenubarItem>\n                Share <MenubarShortcut>Ctrl+S</MenubarShortcut>\n            </MenubarItem>\n            <MenubarSeparator />\n            <MenubarItem>\n                Print <MenubarShortcut>Ctrl+P</MenubarShortcut>\n            </MenubarItem>\n        </MenubarContent>\n    </MenubarMenu>\n    <MenubarMenu>\n        <MenubarTrigger>Edit</MenubarTrigger>\n        <MenubarContent>\n            <MenubarItem>\n                Undo <MenubarShortcut>Ctrl+Z</MenubarShortcut>\n            </MenubarItem>\n            <MenubarItem>\n                Redo <MenubarShortcut>Ctrl+Y</MenubarShortcut>\n            </MenubarItem>\n            <MenubarSeparator />\n            <MenubarItem>\n                Cut <MenubarShortcut>Ctrl+X</MenubarShortcut>\n            </MenubarItem>\n            <MenubarItem>\n                Copy <MenubarShortcut>Ctrl+C</MenubarShortcut>\n            </MenubarItem>\n            <MenubarItem>\n                Paste <MenubarShortcut>Ctrl+V</MenubarShortcut>\n            </MenubarItem>\n        </MenubarContent>\n    </MenubarMenu>\n    <MenubarMenu>\n        <MenubarTrigger>View</MenubarTrigger>\n        <MenubarContent>\n            <MenubarItem>\n                Zoom In <MenubarShortcut>Ctrl++</MenubarShortcut>\n            </MenubarItem>\n            <MenubarItem>\n                Zoom Out <MenubarShortcut>Ctrl+-</MenubarShortcut>\n            </MenubarItem>\n            <MenubarSeparator />\n            <MenubarItem>Toggle Fullscreen</MenubarItem>\n        </MenubarContent>\n    </MenubarMenu>\n</Menubar>"
      },
      {
        "title": "With Labels and Disabled Items",
        "code": "<Menubar>\n    <MenubarMenu>\n        <MenubarTrigger>Account</MenubarTrigger>\n        <MenubarContent>\n            <MenubarLabel>My Account</MenubarLabel>\n            <MenubarSeparator />\n            <MenubarItem>Profile</MenubarItem>\n            <MenubarItem>Settings</MenubarItem>\n            <MenubarItem>Billing</MenubarItem>\n            <MenubarSeparator />\n            <MenubarItem Disabled=\"true\">Invite Team (Pro)</MenubarItem>\n        </MenubarContent>\n    </MenubarMenu>\n    <MenubarMenu>\n        <MenubarTrigger>Help</MenubarTrigger>\n        <MenubarContent>\n            <MenubarItem>Documentation</MenubarItem>\n            <MenubarItem>Release Notes</MenubarItem>\n            <MenubarSeparator />\n            <MenubarItem>About</MenubarItem>\n        </MenubarContent>\n    </MenubarMenu>\n</Menubar>"
      },
      {
        "title": "Keyboard Navigation",
        "code": "<Menubar>\n    <MenubarMenu>\n        <MenubarTrigger>File</MenubarTrigger>\n        <MenubarContent>\n            <MenubarItem>New Tab <MenubarShortcut>Ctrl+T</MenubarShortcut></MenubarItem>\n            <MenubarItem>New Window <MenubarShortcut>Ctrl+N</MenubarShortcut></MenubarItem>\n            <MenubarSeparator />\n            <MenubarItem>Print <MenubarShortcut>Ctrl+P</MenubarShortcut></MenubarItem>\n        </MenubarContent>\n    </MenubarMenu>\n    <MenubarMenu>\n        <MenubarTrigger>Edit</MenubarTrigger>\n        <MenubarContent>\n            <MenubarItem>Undo <MenubarShortcut>Ctrl+Z</MenubarShortcut></MenubarItem>\n            <MenubarItem>Redo <MenubarShortcut>Ctrl+Y</MenubarShortcut></MenubarItem>\n            <MenubarSeparator />\n            <MenubarItem>Cut <MenubarShortcut>Ctrl+X</MenubarShortcut></MenubarItem>\n            <MenubarItem>Copy <MenubarShortcut>Ctrl+C</MenubarShortcut></MenubarItem>\n            <MenubarItem>Paste <MenubarShortcut>Ctrl+V</MenubarShortcut></MenubarItem>\n        </MenubarContent>\n    </MenubarMenu>\n    <MenubarMenu>\n        <MenubarTrigger>View</MenubarTrigger>\n        <MenubarContent>\n            <MenubarItem>Zoom In <MenubarShortcut>Ctrl++</MenubarShortcut></MenubarItem>\n            <MenubarItem>Zoom Out <MenubarShortcut>Ctrl+-</MenubarShortcut></MenubarItem>\n            <MenubarSeparator />\n            <MenubarItem>Full Screen <MenubarShortcut>F11</MenubarShortcut></MenubarItem>\n        </MenubarContent>\n    </MenubarMenu>\n</Menubar>"
      },
      {
        "title": "Text Editor",
        "code": "<Menubar>\n    <MenubarMenu>\n        <MenubarTrigger>Format</MenubarTrigger>\n        <MenubarContent>\n            <MenubarLabel>Text</MenubarLabel>\n            <MenubarItem>Bold <MenubarShortcut>Ctrl+B</MenubarShortcut></MenubarItem>\n            <MenubarItem>Italic <MenubarShortcut>Ctrl+I</MenubarShortcut></MenubarItem>\n            <MenubarItem>Underline <MenubarShortcut>Ctrl+U</MenubarShortcut></MenubarItem>\n            <MenubarSeparator />\n            <MenubarLabel>Alignment</MenubarLabel>\n            <MenubarItem>Align Left</MenubarItem>\n            <MenubarItem>Align Center</MenubarItem>\n            <MenubarItem>Align Right</MenubarItem>\n        </MenubarContent>\n    </MenubarMenu>\n    <MenubarMenu>\n        <MenubarTrigger>Insert</MenubarTrigger>\n        <MenubarContent>\n            <MenubarItem>Image</MenubarItem>\n            <MenubarItem>Table</MenubarItem>\n            <MenubarItem>Link</MenubarItem>\n            <MenubarSeparator />\n            <MenubarItem Disabled=\"true\">Video (Pro)</MenubarItem>\n        </MenubarContent>\n    </MenubarMenu>\n    <MenubarMenu>\n        <MenubarTrigger>Tools</MenubarTrigger>\n        <MenubarContent>\n            <MenubarItem>Word Count <MenubarShortcut>Ctrl+W</MenubarShortcut></MenubarItem>\n            <MenubarItem>Spell Check</MenubarItem>\n        </MenubarContent>\n    </MenubarMenu>\n</Menubar>"
      }
    ],
    "subComponents": {
      "MenubarContent": {
        "componentName": "MenubarContent",
        "fileName": "MenubarContent.razor",
        "namespace": "Lumeo",
        "inheritsFrom": null,
        "implements": [
          "IAsyncDisposable"
        ],
        "parameters": [
          {
            "name": "Context",
            "type": "Menubar.MenubarContext",
            "default": "default!",
            "description": null,
            "isCascading": true,
            "captureUnmatched": false
          },
          {
            "name": "MenuContext",
            "type": "MenubarMenu.MenubarMenuContext",
            "default": "default!",
            "description": null,
            "isCascading": true,
            "captureUnmatched": false
          },
          {
            "name": "ChildContent",
            "type": "RenderFragment?",
            "default": null,
            "description": null,
            "isCascading": false,
            "captureUnmatched": false
          },
          {
            "name": "Class",
            "type": "string?",
            "default": null,
            "description": null,
            "isCascading": false,
            "captureUnmatched": false
          },
          {
            "name": "AdditionalAttributes",
            "type": "Dictionary<string, object>?",
            "default": null,
            "description": null,
            "isCascading": false,
            "captureUnmatched": true
          }
        ],
        "events": [],
        "enums": [],
        "records": [],
        "parseFailed": false,
        "parseError": null
      },
      "MenubarItem": {
        "componentName": "MenubarItem",
        "fileName": "MenubarItem.razor",
        "namespace": "Lumeo",
        "inheritsFrom": null,
        "implements": [],
        "parameters": [
          {
            "name": "Context",
            "type": "Menubar.MenubarContext",
            "default": "default!",
            "description": null,
            "isCascading": true,
            "captureUnmatched": false
          },
          {
            "name": "ChildContent",
            "type": "RenderFragment?",
            "default": null,
            "description": null,
            "isCascading": false,
            "captureUnmatched": false
          },
          {
            "name": "OnClick",
            "type": "EventCallback",
            "default": null,
            "description": null,
            "isCascading": false,
            "captureUnmatched": false
          },
          {
            "name": "Disabled",
            "type": "bool",
            "default": null,
            "description": null,
            "isCascading": false,
            "captureUnmatched": false
          },
          {
            "name": "Class",
            "type": "string?",
            "default": null,
            "description": null,
            "isCascading": false,
            "captureUnmatched": false
          },
          {
            "name": "AdditionalAttributes",
            "type": "Dictionary<string, object>?",
            "default": null,
            "description": null,
            "isCascading": false,
            "captureUnmatched": true
          }
        ],
        "events": [
          {
            "name": "OnClick",
            "type": "EventCallback",
            "description": null
          }
        ],
        "enums": [],
        "records": [],
        "parseFailed": false,
        "parseError": null
      },
      "MenubarLabel": {
        "componentName": "MenubarLabel",
        "fileName": "MenubarLabel.razor",
        "namespace": "Lumeo",
        "inheritsFrom": null,
        "implements": [],
        "parameters": [
          {
            "name": "ChildContent",
            "type": "RenderFragment?",
            "default": null,
            "description": null,
            "isCascading": false,
            "captureUnmatched": false
          },
          {
            "name": "Class",
            "type": "string?",
            "default": null,
            "description": null,
            "isCascading": false,
            "captureUnmatched": false
          },
          {
            "name": "AdditionalAttributes",
            "type": "Dictionary<string, object>?",
            "default": null,
            "description": null,
            "isCascading": false,
            "captureUnmatched": true
          }
        ],
        "events": [],
        "enums": [],
        "records": [],
        "parseFailed": false,
        "parseError": null
      },
      "MenubarMenu": {
        "componentName": "MenubarMenu",
        "fileName": "MenubarMenu.razor",
        "namespace": "Lumeo",
        "inheritsFrom": null,
        "implements": [],
        "parameters": [
          {
            "name": "Context",
            "type": "Menubar.MenubarContext",
            "default": "default!",
            "description": null,
            "isCascading": true,
            "captureUnmatched": false
          },
          {
            "name": "ChildContent",
            "type": "RenderFragment?",
            "default": null,
            "description": null,
            "isCascading": false,
            "captureUnmatched": false
          },
          {
            "name": "Class",
            "type": "string?",
            "default": null,
            "description": null,
            "isCascading": false,
            "captureUnmatched": false
          },
          {
            "name": "AdditionalAttributes",
            "type": "Dictionary<string, object>?",
            "default": null,
            "description": null,
            "isCascading": false,
            "captureUnmatched": true
          }
        ],
        "events": [],
        "enums": [],
        "records": [
          {
            "name": "MenubarMenuContext",
            "signature": "MenubarMenuContext(string MenuId, string WrapperId)",
            "description": null
          }
        ],
        "parseFailed": false,
        "parseError": null
      },
      "MenubarSeparator": {
        "componentName": "MenubarSeparator",
        "fileName": "MenubarSeparator.razor",
        "namespace": "Lumeo",
        "inheritsFrom": null,
        "implements": [],
        "parameters": [
          {
            "name": "Class",
            "type": "string?",
            "default": null,
            "description": null,
            "isCascading": false,
            "captureUnmatched": false
          },
          {
            "name": "AdditionalAttributes",
            "type": "Dictionary<string, object>?",
            "default": null,
            "description": null,
            "isCascading": false,
            "captureUnmatched": true
          }
        ],
        "events": [],
        "enums": [],
        "records": [],
        "parseFailed": false,
        "parseError": null
      },
      "MenubarShortcut": {
        "componentName": "MenubarShortcut",
        "fileName": "MenubarShortcut.razor",
        "namespace": "Lumeo",
        "inheritsFrom": null,
        "implements": [],
        "parameters": [
          {
            "name": "ChildContent",
            "type": "RenderFragment?",
            "default": null,
            "description": null,
            "isCascading": false,
            "captureUnmatched": false
          },
          {
            "name": "Class",
            "type": "string?",
            "default": null,
            "description": null,
            "isCascading": false,
            "captureUnmatched": false
          },
          {
            "name": "AdditionalAttributes",
            "type": "Dictionary<string, object>?",
            "default": null,
            "description": null,
            "isCascading": false,
            "captureUnmatched": true
          }
        ],
        "events": [],
        "enums": [],
        "records": [],
        "parseFailed": false,
        "parseError": null
      },
      "MenubarTrigger": {
        "componentName": "MenubarTrigger",
        "fileName": "MenubarTrigger.razor",
        "namespace": "Lumeo",
        "inheritsFrom": null,
        "implements": [],
        "parameters": [
          {
            "name": "Context",
            "type": "Menubar.MenubarContext",
            "default": "default!",
            "description": null,
            "isCascading": true,
            "captureUnmatched": false
          },
          {
            "name": "MenuContext",
            "type": "MenubarMenu.MenubarMenuContext",
            "default": "default!",
            "description": null,
            "isCascading": true,
            "captureUnmatched": false
          },
          {
            "name": "ChildContent",
            "type": "RenderFragment?",
            "default": null,
            "description": null,
            "isCascading": false,
            "captureUnmatched": false
          },
          {
            "name": "Class",
            "type": "string?",
            "default": null,
            "description": null,
            "isCascading": false,
            "captureUnmatched": false
          },
          {
            "name": "AdditionalAttributes",
            "type": "Dictionary<string, object>?",
            "default": null,
            "description": null,
            "isCascading": false,
            "captureUnmatched": true
          }
        ],
        "events": [],
        "enums": [],
        "records": [],
        "parseFailed": false,
        "parseError": null
      }
    },
    "parseFailed": false,
    "parseError": null
  },
  "$schema": "https://lumeo.nativ.sh/registry-component-schema.json",
  "key": "menubar",
  "docsUrl": "https://lumeo.nativ.sh/components/menubar",
  "sourceUrl": [
    {
      "file": "UI/Menubar/Menubar.razor",
      "url": "https://github.com/Brain2k-0005/Lumeo/tree/master/src/Lumeo/UI/Menubar/Menubar.razor"
    },
    {
      "file": "UI/Menubar/MenubarContent.razor",
      "url": "https://github.com/Brain2k-0005/Lumeo/tree/master/src/Lumeo/UI/Menubar/MenubarContent.razor"
    },
    {
      "file": "UI/Menubar/MenubarItem.razor",
      "url": "https://github.com/Brain2k-0005/Lumeo/tree/master/src/Lumeo/UI/Menubar/MenubarItem.razor"
    },
    {
      "file": "UI/Menubar/MenubarLabel.razor",
      "url": "https://github.com/Brain2k-0005/Lumeo/tree/master/src/Lumeo/UI/Menubar/MenubarLabel.razor"
    },
    {
      "file": "UI/Menubar/MenubarMenu.razor",
      "url": "https://github.com/Brain2k-0005/Lumeo/tree/master/src/Lumeo/UI/Menubar/MenubarMenu.razor"
    },
    {
      "file": "UI/Menubar/MenubarSeparator.razor",
      "url": "https://github.com/Brain2k-0005/Lumeo/tree/master/src/Lumeo/UI/Menubar/MenubarSeparator.razor"
    },
    {
      "file": "UI/Menubar/MenubarShortcut.razor",
      "url": "https://github.com/Brain2k-0005/Lumeo/tree/master/src/Lumeo/UI/Menubar/MenubarShortcut.razor"
    },
    {
      "file": "UI/Menubar/MenubarTrigger.razor",
      "url": "https://github.com/Brain2k-0005/Lumeo/tree/master/src/Lumeo/UI/Menubar/MenubarTrigger.razor"
    }
  ],
  "source": [
    {
      "path": "UI/Menubar/Menubar.razor",
      "content": "@namespace Lumeo\n\n@{\n    var context = new MenubarContext(_openMenuId, EventCallback.Factory.Create<string?>(this, SetOpenMenuId), _openMenuId is not null, _menuIds, RegisterMenuId, NavigateMenus);\n}\n\n<CascadingValue Value=\"context\" IsFixed=\"false\">\n    <div role=\"menubar\" class=\"@CssClass\" @attributes=\"AdditionalAttributes\">\n        @ChildContent\n    </div>\n</CascadingValue>\n\n@code {\n    [Parameter] public RenderFragment? ChildContent { get; set; }\n    [Parameter] public string? Class { get; set; }\n    [Parameter(CaptureUnmatchedValues = true)] public Dictionary<string, object>? AdditionalAttributes { get; set; }\n\n    private string? _openMenuId;\n    private readonly List<string> _menuIds = [];\n\n    private string CssClass => $\"flex h-9 items-center space-x-1 rounded-md border border-border bg-background p-1 shadow-sm {Class}\".Trim();\n\n    private void SetOpenMenuId(string? menuId)\n    {\n        _openMenuId = menuId;\n        StateHasChanged();\n    }\n\n    private void RegisterMenuId(string menuId)\n    {\n        if (!_menuIds.Contains(menuId))\n        {\n            _menuIds.Add(menuId);\n            StateHasChanged();\n        }\n    }\n\n    private void NavigateMenus(int direction)\n    {\n        if (_menuIds.Count == 0) return;\n        if (_openMenuId is null)\n        {\n            _openMenuId = direction > 0 ? _menuIds[0] : _menuIds[^1];\n        }\n        else\n        {\n            var currentIndex = _menuIds.IndexOf(_openMenuId);\n            if (currentIndex < 0) return;\n            var nextIndex = (currentIndex + direction + _menuIds.Count) % _menuIds.Count;\n            _openMenuId = _menuIds[nextIndex];\n        }\n        StateHasChanged();\n    }\n\n    public record MenubarContext(\n        string? OpenMenuId,\n        EventCallback<string?> SetOpenMenuId,\n        bool AnyOpen,\n        List<string> MenuIds,\n        Action<string> RegisterMenuId,\n        Action<int> NavigateMenus);\n}\n"
    },
    {
      "path": "UI/Menubar/MenubarContent.razor",
      "content": "@namespace Lumeo\n@implements IAsyncDisposable\n\n@if (Context.OpenMenuId == MenuContext.MenuId)\n{\n    <div id=\"@_contentId\" class=\"@CssClass\" @onkeydown=\"HandleKeyDown\" tabindex=\"-1\" @attributes=\"AdditionalAttributes\">\n        @ChildContent\n    </div>\n}\n\n@inject ComponentInteropService Interop\n\n@code {\n    [CascadingParameter] public Menubar.MenubarContext Context { get; set; } = default!;\n    [CascadingParameter] public MenubarMenu.MenubarMenuContext MenuContext { get; set; } = default!;\n    [Parameter] public RenderFragment? ChildContent { get; set; }\n    [Parameter] public string? Class { get; set; }\n    [Parameter(CaptureUnmatchedValues = true)] public Dictionary<string, object>? AdditionalAttributes { get; set; }\n\n    private readonly string _contentId = $\"menubar-content-{Guid.NewGuid():N}\";\n    private bool _registered;\n\n    private string CssClass => $\"fixed z-50 min-w-[12rem] overflow-hidden rounded-md border border-border bg-popover p-1 text-popover-foreground shadow-lg animate-fade-in {Class}\".Trim();\n\n    protected override async Task OnAfterRenderAsync(bool firstRender)\n    {\n        if (Context.OpenMenuId == MenuContext.MenuId && !_registered)\n        {\n            await Interop.PositionFixed(_contentId, MenuContext.WrapperId, \"start\");\n            await Interop.RegisterClickOutside(_contentId, null, async () =>\n            {\n                await Context.SetOpenMenuId.InvokeAsync(null);\n                await InvokeAsync(StateHasChanged);\n            });\n            _registered = true;\n        }\n        else if (Context.OpenMenuId != MenuContext.MenuId && _registered)\n        {\n            await Cleanup();\n        }\n    }\n\n    private async Task HandleKeyDown(KeyboardEventArgs e)\n    {\n        if (e.Key == \"Escape\")\n        {\n            await Context.SetOpenMenuId.InvokeAsync(null);\n        }\n    }\n\n    private async Task Cleanup()\n    {\n        try { await Interop.UnpositionFixed(_contentId); } catch (JSDisconnectedException) { }\n        try { await Interop.UnregisterClickOutside(_contentId); } catch (JSDisconnectedException) { }\n        _registered = false;\n    }\n\n    public async ValueTask DisposeAsync()\n    {\n        if (_registered) await Cleanup();\n    }\n}\n"
    },
    {
      "path": "UI/Menubar/MenubarItem.razor",
      "content": "@namespace Lumeo\n\n<button class=\"@CssClass\" @onclick=\"HandleClick\" disabled=\"@Disabled\" @attributes=\"AdditionalAttributes\">\n    @ChildContent\n</button>\n\n@code {\n    [CascadingParameter] public Menubar.MenubarContext Context { get; set; } = default!;\n    [Parameter] public RenderFragment? ChildContent { get; set; }\n    [Parameter] public EventCallback OnClick { get; set; }\n    [Parameter] public bool Disabled { get; set; }\n    [Parameter] public string? Class { get; set; }\n    [Parameter(CaptureUnmatchedValues = true)] public Dictionary<string, object>? AdditionalAttributes { get; set; }\n\n    private string CssClass => $\"relative flex w-full cursor-pointer select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none transition-colors hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground disabled:pointer-events-none disabled:opacity-50 disabled:cursor-not-allowed {Class}\".Trim();\n\n    private async Task HandleClick()\n    {\n        await OnClick.InvokeAsync();\n        await Context.SetOpenMenuId.InvokeAsync(null);\n    }\n}\n"
    },
    {
      "path": "UI/Menubar/MenubarLabel.razor",
      "content": "@namespace Lumeo\n\n<div class=\"@CssClass\" @attributes=\"AdditionalAttributes\">\n    @ChildContent\n</div>\n\n@code {\n    [Parameter] public RenderFragment? ChildContent { get; set; }\n    [Parameter] public string? Class { get; set; }\n    [Parameter(CaptureUnmatchedValues = true)] public Dictionary<string, object>? AdditionalAttributes { get; set; }\n\n    private string CssClass => $\"px-2 py-1.5 text-sm font-semibold {Class}\".Trim();\n}\n"
    },
    {
      "path": "UI/Menubar/MenubarMenu.razor",
      "content": "@namespace Lumeo\n\n@{\n    var menuContext = new MenubarMenuContext(_menuId, _wrapperId);\n}\n\n<CascadingValue Value=\"menuContext\" IsFixed=\"true\">\n    <div id=\"@_wrapperId\" class=\"@CssClass\" @attributes=\"AdditionalAttributes\">\n        @ChildContent\n    </div>\n</CascadingValue>\n\n@code {\n    [CascadingParameter] public Menubar.MenubarContext Context { get; set; } = default!;\n    [Parameter] public RenderFragment? ChildContent { get; set; }\n    [Parameter] public string? Class { get; set; }\n    [Parameter(CaptureUnmatchedValues = true)] public Dictionary<string, object>? AdditionalAttributes { get; set; }\n\n    private readonly string _menuId = Guid.NewGuid().ToString(\"N\");\n    private readonly string _wrapperId = $\"menubar-menu-{Guid.NewGuid():N}\";\n\n    private string CssClass => $\"relative {Class}\".Trim();\n\n    protected override void OnInitialized()\n    {\n        Context.RegisterMenuId(_menuId);\n    }\n\n    public record MenubarMenuContext(string MenuId, string WrapperId);\n}\n"
    },
    {
      "path": "UI/Menubar/MenubarSeparator.razor",
      "content": "@namespace Lumeo\n\n<div class=\"@CssClass\" role=\"none\" @attributes=\"AdditionalAttributes\"></div>\n\n@code {\n    [Parameter] public string? Class { get; set; }\n    [Parameter(CaptureUnmatchedValues = true)] public Dictionary<string, object>? AdditionalAttributes { get; set; }\n\n    private string CssClass => $\"-mx-1 my-1 h-px bg-border {Class}\".Trim();\n}\n"
    },
    {
      "path": "UI/Menubar/MenubarShortcut.razor",
      "content": "@namespace Lumeo\n\n<span class=\"@CssClass\" @attributes=\"AdditionalAttributes\">\n    @ChildContent\n</span>\n\n@code {\n    [Parameter] public RenderFragment? ChildContent { get; set; }\n    [Parameter] public string? Class { get; set; }\n    [Parameter(CaptureUnmatchedValues = true)] public Dictionary<string, object>? AdditionalAttributes { get; set; }\n\n    private string CssClass => $\"ml-auto text-xs tracking-widest text-muted-foreground {Class}\".Trim();\n}\n"
    },
    {
      "path": "UI/Menubar/MenubarTrigger.razor",
      "content": "@namespace Lumeo\n\n<button class=\"@CssClass\" tabindex=\"@TabIndex\" @onclick=\"HandleClick\" @onmouseenter=\"HandleMouseEnter\" @onkeydown=\"HandleKeyDown\" @attributes=\"AdditionalAttributes\">\n    @ChildContent\n</button>\n\n@code {\n    [CascadingParameter] public Menubar.MenubarContext Context { get; set; } = default!;\n    [CascadingParameter] public MenubarMenu.MenubarMenuContext MenuContext { get; set; } = default!;\n    [Parameter] public RenderFragment? ChildContent { get; set; }\n    [Parameter] public string? Class { get; set; }\n    [Parameter(CaptureUnmatchedValues = true)] public Dictionary<string, object>? AdditionalAttributes { get; set; }\n\n    private bool IsOpen => Context.OpenMenuId == MenuContext.MenuId;\n\n    // Roving tabindex: the active (open) trigger — or the first registered trigger\n    // when none is open — gets tabindex=0; all others get tabindex=-1.\n    private string TabIndex\n    {\n        get\n        {\n            if (IsOpen) return \"0\";\n            if (Context.OpenMenuId is null && Context.MenuIds.Count > 0 && Context.MenuIds[0] == MenuContext.MenuId) return \"0\";\n            return \"-1\";\n        }\n    }\n\n    private string CssClass => string.Join(\" \", new[] { \"flex cursor-default select-none items-center rounded-sm px-3 py-1 text-sm font-medium outline-none\", IsOpen ? \"bg-accent text-accent-foreground\" : null, Class }.Where(s => !string.IsNullOrWhiteSpace(s)));\n\n    private async Task HandleClick()\n    {\n        if (IsOpen)\n        {\n            await Context.SetOpenMenuId.InvokeAsync(null);\n        }\n        else\n        {\n            await Context.SetOpenMenuId.InvokeAsync(MenuContext.MenuId);\n        }\n    }\n\n    private async Task HandleMouseEnter()\n    {\n        if (Context.AnyOpen)\n        {\n            await Context.SetOpenMenuId.InvokeAsync(MenuContext.MenuId);\n        }\n    }\n\n    private async Task HandleKeyDown(KeyboardEventArgs e)\n    {\n        switch (e.Key)\n        {\n            case \"ArrowDown\":\n            case \"Enter\":\n            case \" \":\n                if (!IsOpen)\n                {\n                    await Context.SetOpenMenuId.InvokeAsync(MenuContext.MenuId);\n                }\n                break;\n            case \"ArrowLeft\":\n                Context.NavigateMenus(-1);\n                break;\n            case \"ArrowRight\":\n                Context.NavigateMenus(1);\n                break;\n            case \"Escape\":\n                if (IsOpen)\n                {\n                    await Context.SetOpenMenuId.InvokeAsync(null);\n                }\n                break;\n        }\n    }\n}\n"
    }
  ],
  "slots": [
    {
      "name": "ChildContent",
      "owner": "Menubar",
      "type": "RenderFragment?",
      "description": null
    },
    {
      "name": "ChildContent",
      "owner": "MenubarContent",
      "type": "RenderFragment?",
      "description": null
    },
    {
      "name": "ChildContent",
      "owner": "MenubarItem",
      "type": "RenderFragment?",
      "description": null
    },
    {
      "name": "ChildContent",
      "owner": "MenubarLabel",
      "type": "RenderFragment?",
      "description": null
    },
    {
      "name": "ChildContent",
      "owner": "MenubarMenu",
      "type": "RenderFragment?",
      "description": null
    },
    {
      "name": "ChildContent",
      "owner": "MenubarShortcut",
      "type": "RenderFragment?",
      "description": null
    },
    {
      "name": "ChildContent",
      "owner": "MenubarTrigger",
      "type": "RenderFragment?",
      "description": null
    }
  ],
  "serviceDependencies": [
    {
      "service": "ComponentInteropService",
      "namespace": ""
    }
  ],
  "cascadingDependencies": [
    {
      "name": "Context",
      "type": "Menubar.MenubarContext",
      "required": true
    },
    {
      "name": "MenuContext",
      "type": "MenubarMenu.MenubarMenuContext",
      "required": true
    }
  ],
  "relatedComponents": [
    {
      "name": "MenubarContent",
      "reason": "sub-component"
    },
    {
      "name": "MenubarItem",
      "reason": "sub-component"
    },
    {
      "name": "MenubarLabel",
      "reason": "sub-component"
    },
    {
      "name": "MenubarMenu",
      "reason": "sub-component"
    },
    {
      "name": "MenubarSeparator",
      "reason": "sub-component"
    },
    {
      "name": "MenubarShortcut",
      "reason": "sub-component"
    },
    {
      "name": "MenubarTrigger",
      "reason": "sub-component"
    }
  ],
  "keyboardInteractions": [
    {
      "key": "Escape",
      "action": "HandleKeyDown handles Escape in MenubarContent.razor"
    }
  ],
  "tests": [
    "tests/Lumeo.Tests/Components/Menubar/MenubarTests.cs"
  ],
  "mdSummary": "# Menubar\n\nHorizontal menubar with File/Edit-style dropdowns.\n\n**Package:** `Lumeo` · **Category:** Navigation\n**Docs:** https://lumeo.nativ.sh/components/menubar\n\n## Parameters\n| Owner | Name | Type | Default | Description |\n|---|---|---|---|---|\n| Menubar | ChildContent | `RenderFragment?` | `` |  |\n| Menubar | Class | `string?` | `` |  |\n| Menubar | AdditionalAttributes | `Dictionary<string, object>?` | `` |  |\n| MenubarContent | Context | `Menubar.MenubarContext` | `default!` |  |\n| MenubarContent | MenuContext | `MenubarMenu.MenubarMenuContext` | `default!` |  |\n| MenubarContent | ChildContent | `RenderFragment?` | `` |  |\n| MenubarContent | Class | `string?` | `` |  |\n| MenubarContent | AdditionalAttributes | `Dictionary<string, object>?` | `` |  |\n| MenubarItem | Context | `Menubar.MenubarContext` | `default!` |  |\n| MenubarItem | ChildContent | `RenderFragment?` | `` |  |\n| MenubarItem | OnClick | `EventCallback` | `` |  |\n| MenubarItem | Disabled | `bool` | `` |  |\n| MenubarItem | Class | `string?` | `` |  |\n| MenubarItem | AdditionalAttributes | `Dictionary<string, object>?` | `` |  |\n| MenubarLabel | ChildContent | `RenderFragment?` | `` |  |\n| MenubarLabel | Class | `string?` | `` |  |\n| MenubarLabel | AdditionalAttributes | `Dictionary<string, object>?` | `` |  |\n| MenubarMenu | Context | `Menubar.MenubarContext` | `default!` |  |\n| MenubarMenu | ChildContent | `RenderFragment?` | `` |  |\n| MenubarMenu | Class | `string?` | `` |  |\n| MenubarMenu | AdditionalAttributes | `Dictionary<string, object>?` | `` |  |\n| MenubarSeparator | Class | `string?` | `` |  |\n| MenubarSeparator | AdditionalAttributes | `Dictionary<string, object>?` | `` |  |\n| MenubarShortcut | ChildContent | `RenderFragment?` | `` |  |\n| MenubarShortcut | Class | `string?` | `` |  |\n| MenubarShortcut | AdditionalAttributes | `Dictionary<string, object>?` | `` |  |\n| MenubarTrigger | Context | `Menubar.MenubarContext` | `default!` |  |\n| MenubarTrigger | MenuContext | `MenubarMenu.MenubarMenuContext` | `default!` |  |\n| MenubarTrigger | ChildContent | `RenderFragment?` | `` |  |\n| MenubarTrigger | Class | `string?` | `` |  |\n| MenubarTrigger | AdditionalAttributes | `Dictionary<string, object>?` | `` |  |\n\n## Slots\n- `ChildContent` (Menubar) — RenderFragment slot\n- `ChildContent` (MenubarContent) — RenderFragment slot\n- `ChildContent` (MenubarItem) — RenderFragment slot\n- `ChildContent` (MenubarLabel) — RenderFragment slot\n- `ChildContent` (MenubarMenu) — RenderFragment slot\n- `ChildContent` (MenubarShortcut) — RenderFragment slot\n- `ChildContent` (MenubarTrigger) — RenderFragment slot\n\n## Events\n- (none)\n\n## Sub-components\n- `MenubarContent`, `MenubarItem`, `MenubarLabel`, `MenubarMenu`, `MenubarSeparator`, `MenubarShortcut`, `MenubarTrigger`\n\n## Cascading values it expects\n- `Context` (`Menubar.MenubarContext`)\n- `MenuContext` (`MenubarMenu.MenubarMenuContext`)\n\n## Services it injects\n- `ComponentInteropService` ()\n\n## Keyboard\n- `Escape` — HandleKeyDown handles Escape in MenubarContent.razor\n\n## Example\n```razor\n<Menubar />\n```\n\n## CSS variables\n`--color-accent`, `--color-accent-foreground`, `--color-background`, `--color-border`, `--color-muted`, `--color-muted-foreground`, `--color-popover`, `--color-popover-foreground`, `--radius`\n\n## Files\n- `UI/Menubar/Menubar.razor`\n- `UI/Menubar/MenubarContent.razor`\n- `UI/Menubar/MenubarItem.razor`\n- `UI/Menubar/MenubarLabel.razor`\n- `UI/Menubar/MenubarMenu.razor`\n- `UI/Menubar/MenubarSeparator.razor`\n- `UI/Menubar/MenubarShortcut.razor`\n- `UI/Menubar/MenubarTrigger.razor`\n"
}