Hacktoberfest 2026: the issues maintainers tagged for October, open and beginner-friendly. Browse Hacktoberfest issues

[menubar] Why not use Base UI `Toolbar` for this component?

Open
#41 1 comment 0 reactions 0 assignees View on GitHub

Maintainers usually reply within 1 day

Nobody has claimed this yet.

Assessment

Difficulty
5/5
Estimated time
Over a week
Newbie friendliness
25/100
Issue type
Refactor
Clarity
Needs clarification
Activity status
Stale
Tech stack
react, typescript

Research direction

Start with the Kumo MenuBar documentation and compare its documented behavior with Base UI's Toolbar reference. No source file, test, or concrete change is named, so first determine whether this is an intentional abstraction or a component replacement. Done requires a decided direction and clear documentation of the resulting semantics and accessibility expectations.

Written by the indexing model from the issue text.

Description

Describe the issue

The current MenuBar component appears to closely match the semantics and behavior of Base UI’s Toolbar component, rather than Base UI’s MenuBar.

The documented examples (e.g. bold / italic formatting actions) represent a classic toolbar use case: a horizontal group of icon buttons with toggleable active state and immediate actions.

Given that Kumo is built on top of Base UI, it’s unclear why a custom MenuBar abstraction is used instead of directly leveraging Base UI’s Toolbar.


Current behavior
  • Renders a horizontal row of icon buttons
  • Actions are triggered immediately via onClick
  • Supports active state (isActive)
  • No menu hierarchy or nested menu items
  • Matches formatting / editor toolbar patterns

Why this is confusing

In Base UI:

  • Toolbar
    • Designed for grouped controls and icon buttons
    • Ideal for formatting actions (bold, italic, etc.)
  • MenuBar
    • Represents a semantic application menu
    • Contains menus and menu items
    • Focused on navigation and command discovery

Kumo’s MenuBar behavior aligns with Toolbar, not MenuBar.


Question / clarification requested
  • Is there a reason Base UI’s Toolbar component is not used here?
  • Is this an intentional abstraction or a naming choice?
  • Are there behavior or styling differences that prevent using Toolbar directly?

Clarifying this would help consumers understand the intended semantics and accessibility expectations of the component.


Environment
  • Package: @cloudflare/kumo
  • Version: 1.0.0
  • Browser: All
  • OS: All

References
Dominant language
TypeScript
Stars
4.1k
Forks
189
Avg merge
20h 32m
Merged PRs (30d)
36

Getting set up

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

More from cloudflare/kumo

All issues in cloudflare/kumo

Similar issues

More TypeScript issues

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.