Skip to content

fix(components): ui:menubar draws an item's authored icon on every arm, at any depth (objectui#6326) - #10246

Merged
objectstack-fleet[bot] merged 2 commits into
mainfrom
claude/issue-6326-menubar-item-icon
Sep 24, 2026
Merged

objectstack-fleet[bot] merged 2 commits into
mainfrom
claude/issue-6326-menubar-item-icon

Conversation

@objectstack-fleet

Copy link
Copy Markdown
Contributor

Fixes #6326

What changed

ui:menubar now draws an item's authored icon. MenubarMenu.items is typed MenuItem[], and MenuItem declares icon?: string (the component docs list it too), but packages/components/src/renderers/overlay/menubar.tsx never read the key: git grep -n -i icon on that file returned 0 lines at base a78cd378c. Controls on the same pathspec: label returned 10 and disabled returned 2.

  • The icon is resolved through resolveIcon, the lucide RECORD surface. This is the shape objectui#5930 ruled for dropdown-menu and objectui#6278 carried to context-menu. LazyIcon is not used.
  • The repair covers every arm that draws an item: the top-level leaf, the submenu trigger, and the item inside a submenu. ui:dropdown-menu renders an item's authored icon as raw TEXT — the catalog fixture named with-icons.json draws the words "edit", "copy", "trash" beside its labels #5930 ruled that repairing only the leaf is "a narrower version of the same bug".
  • The item walk is now a local recursion (renderMenubarItems, in this file only). The old renderer walked exactly one level. A submenu child that had its own children was drawn as a plain leaf, so those children were never shown, even though MenuItem.children is recursive by type and the docs describe it as "drawn as a nested submenu". The card's triage said this incidental rides the fix if the answer is "honour".
  • content/docs/components/overlay/menubar.mdx gains an ## Icons section, with the same wording as the context-menu page.
  • Adds one patch changeset, .changeset/6326-menubar-item-icon.md, for @object-ui/components.

⛔ Not touched: dropdown-menu.tsx and context-menu.tsx. objectui#6278's ruling forbids generalising across containers, and objectui#6327 (consolidating the three recursions) is on hold. No published type or accepted shape changed (Clause-② no).

Premise checks (at base a78cd378c)

Evidence

New suite packages/components/src/__tests__/menubar-item-icon.test.tsx has 10 rows, with lucide not mocked. Glyphs are asserted by the identity lucide gives them, svg.lucide-NAME, derived from the authored name. The submenu trigger's always-present chevron is asserted as a positive control on the instrument. A retired spelling (edit) must draw no glyph.

  • RED before the fix, with the test on the unfixed renderer: Tests 5 failed | 5 passed (10). The five failures are the leaf, submenu-trigger, submenu-child, depth-2 trigger and grandchild rows. The harness, retired-spelling and chevron-control rows stayed green.
  • GREEN after: Tests 10 passed (10).
  • Ablation, on the fix commit 3dd2a7b. Each mutation was checked on disk (marker count 1, remaining icon renders 1) and restored under trap … EXIT INT TERM using git checkout HEAD --. After each restore, the blob hash matched HEAD and git diff HEAD had 0 lines.
    • With the submenu-trigger render removed: 2 red, the submenu-trigger row and the depth-2 trigger row.
    • With the leaf render removed: 3 red, the top-level leaf, the submenu child and the grandchild.
    • Vitest resolves this renderer from source through a relative import, so no dist/ is in the path.
  • Full package pnpm exec vitest run packages/components/ (from repo root, on 3dd2a7b): Test Files 287 passed (287) / Tests 2787 passed (2787). The merge of origin/main that followed touched zero files under packages/components/.
  • On final head 6d7e1e7:
    • Targeted tests: 8 files, 144 passed. These are the new suite, both sibling icon suites, both menu handler and separator suites, component-fixture-declared-keys, menu-item-union and check-handler-key-read-sites.
    • turbo run type-check --filter=@object-ui/components: 9/9 successful. tsc -p tsconfig.test.json --listFiles includes both the renderer and the new test.
    • The components eslint . pass: 503 files judged by --format json, 0 errors, both changed files present. Lint is not type-aware (no projectService / project in eslint.config.js), so this diff cannot change the lint verdict for any untouched file.
    • Every one of the following exited 0: check-changeset-presence, -claims, -no-major, -fixed, -overwrite, vi-mock-specifiers / -inherit / -override-shape, test-path-roots, control-bytes, lucide-icon-record-names, doc-fence-languages, doc-links, doc-example-ids, doc-component-types, handler-key-read-sites, doc-example-types, doc-snippet-types (672 of 672 block(s) judged, 0 failed, after building its 35-task prerequisite), new-cross-file-line-citations and doc-example-shared-reader.

Acceptance notes

  • The menubar catalog fixture application-menubar.json still authors no icon. No census entry was added to check-lucide-icon-record-names.mjs for menubar: with no authored name, its min non-vacuity rule would fail by design. The renderer is pinned by the suite above.
  • Out of fence, not fixed here: in all three menu renderers the submenu-trigger arm does not forward the declared disabled (MenubarSubTrigger / ContextMenuSubTrigger / DropdownMenuSubTrigger get no disabled prop). This was read from source and not probed at runtime, so it is not filed as a defect. The carrier is objectui#6327, which would touch all three copies.

Session: https://claude.ai/code/session_01LkCKMa5bvrw3L4ezcNXEXW


Generated by Claude Code

…m, at any depth (objectui#6326)

MenubarMenu.items is MenuItem[], which declares icon?: string, but the
menubar renderer never read the key. Resolve it through resolveIcon (the
lucide RECORD surface, as objectui#5930 / #6278 ruled for the two sibling
menus) on the leaf, submenu-trigger and submenu-child arms. The item walk
is now a local recursion, so a submenu child carrying its own children is
drawn as a nested submenu instead of a leaf that drops them.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01LkCKMa5bvrw3L4ezcNXEXW
@github-actions

Copy link
Copy Markdown
Contributor

✅ Console Performance Budget

Metric Value Budget
Eager closure (gzip, 329 chunks) 3036.4 KB 3104.5 KB
Main entry chunk (gzip) 147.5 KB 350 KB
Entry file index-D5YEAzXN.js —
Status PASS —

The eager closure is every chunk the entry reaches through static imports — what the browser fetches and parses before the app renders. The entry chunk on its own is a small fraction of it.


📦 Bundle Size Report

Package Size Gzipped
app-shell (consoleActionDispatch.js) 0.20KB 0.19KB
app-shell (index.js) 16.68KB 6.20KB
app-shell (runtime-config.js) 20.68KB 7.36KB
app-shell (types.js) 0.01KB 0.04KB
app-shell (urlParams.js) 10.06KB 3.86KB
auth (ActiveOrganizationStorage.js) 25.05KB 9.16KB
auth (AuthContext.js) 0.31KB 0.24KB
auth (AuthGuard.js) 2.07KB 1.00KB
auth (AuthProvider.js) 40.18KB 10.59KB
auth (AuthShell.js) 3.49KB 1.40KB
auth (ForgotPasswordForm.js) 12.21KB 3.45KB
auth (LoginForm.js) 18.15KB 5.39KB
auth (PreviewBanner.js) 0.90KB 0.50KB
auth (RegisterForm.js) 6.65KB 2.22KB
auth (SocialSignInButtons.js) 9.61KB 3.89KB
auth (UserMenu.js) 3.41KB 1.23KB
auth (auth-gate-events.js) 1.29KB 0.66KB
auth (authStyles.js) 5.04KB 1.72KB
auth (createAuthClient.js) 40.21KB 10.80KB
auth (createAuthenticatedFetch.js) 8.46KB 3.43KB
auth (index.js) 3.19KB 1.44KB
auth (invitation-status.js) 1.22KB 0.70KB
auth (org-roles.js) 6.66KB 2.78KB
auth (phone-identifier.js) 1.11KB 0.66KB
auth (types.js) 0.59KB 0.35KB
auth (useAuth.js) 5.30KB 1.02KB
auth (useWorkspaceAdminStatus.js) 11.08KB 4.58KB
collaboration (CommentThread.js) 26.08KB 7.56KB
collaboration (LiveCursors.js) 3.17KB 1.27KB
collaboration (PresenceAvatars.js) 6.49KB 2.64KB
collaboration (PresenceProvider.js) 2.79KB 1.13KB
collaboration (index.js) 1.68KB 0.73KB
collaboration (useCollaborationTranslation.js) 6.05KB 2.52KB
collaboration (useCommentSearch.js) 1.98KB 0.88KB
collaboration (useConflictResolution.js) 7.75KB 1.86KB
collaboration (useMentionNotifications.js) 1.81KB 0.68KB
collaboration (usePresence.js) 6.33KB 1.84KB
collaboration (useRealtimeSubscription.js) 7.91KB 2.01KB
components (index.js) 546.88KB 130.96KB
core (index.js) 8.94KB 3.59KB
create-plugin (index.js) 27.94KB 9.51KB
data-objectstack (index.js) 222.47KB 61.83KB
fields (index.js) 253.40KB 63.99KB
i18n (LocalizationContext.js) 1.76KB 0.96KB
i18n (builtinAggregateLabels.js) 0.86KB 0.49KB
i18n (currency.js) 1.22KB 0.64KB
i18n (fallbackInterpolation.js) 6.25KB 2.77KB
i18n (i18n.js) 8.87KB 3.64KB
i18n (index.js) 5.22KB 2.26KB
i18n (pickLocalized.js) 9.86KB 3.95KB
i18n (provider.js) 33.36KB 10.88KB
i18n (useDisplayLocale.js) 2.85KB 1.45KB
i18n (useObjectLabel.js) 34.34KB 9.17KB
i18n (useSafeTranslation.js) 5.60KB 2.33KB
layout (index.js) 39.02KB 11.00KB
mobile (MobileProvider.js) 0.92KB 0.49KB
mobile (ResponsiveContainer.js) 0.94KB 0.38KB
mobile (breakpoints.js) 1.51KB 0.70KB
mobile (createOfflineDataSource.js) 5.61KB 1.75KB
mobile (index.js) 1.99KB 0.87KB
mobile (offlineQueue.js) 3.91KB 1.35KB
mobile (pwa.js) 0.97KB 0.49KB
mobile (serviceWorker.js) 1.48KB 0.62KB
mobile (serviceWorkerSource.js) 3.41KB 1.48KB
mobile (useBreakpoint.js) 1.54KB 0.65KB
mobile (useGesture.js) 6.96KB 1.98KB
mobile (useOfflineSync.js) 1.99KB 0.72KB
mobile (usePullToRefresh.js) 6.62KB 2.45KB
mobile (useResponsive.js) 0.72KB 0.42KB
mobile (useSpecGesture.js) 5.52KB 2.10KB
mobile (useTouchTarget.js) 1.01KB 0.54KB
permissions (MePermissionsProvider.js) 13.52KB 4.88KB
permissions (PermissionContext.js) 0.31KB 0.25KB
permissions (PermissionGuard.js) 0.89KB 0.45KB
permissions (PermissionProvider.js) 6.24KB 2.16KB
permissions (discardProofCache.js) 1.04KB 0.55KB
permissions (evaluator.js) 8.39KB 3.10KB
permissions (index.js) 0.93KB 0.41KB
permissions (store.js) 0.91KB 0.42KB
permissions (useFieldPermissions.js) 1.28KB 0.53KB
permissions (usePermissions.js) 4.83KB 2.27KB
plugin-ai (index.js) 14.81KB 3.63KB
plugin-calendar (index.js) 51.44KB 14.62KB
plugin-charts (index.js) 71.82KB 20.13KB
plugin-chatbot (index.js) 198.27KB 47.18KB
plugin-dashboard (index.js) 133.00KB 35.19KB
plugin-designer (index.js) 215.98KB 44.34KB
plugin-detail (index.js) 257.23KB 66.95KB
plugin-editor (index.js) 2.23KB 1.05KB
plugin-form (index.js) 144.16KB 36.92KB
plugin-gantt (index.js) 167.99KB 41.37KB
plugin-grid (index.js) 214.80KB 58.65KB
plugin-kanban (index.js) 48.71KB 15.17KB
plugin-list (index.js) 113.53KB 27.99KB
plugin-map (index.js) 21.74KB 7.07KB
plugin-markdown (index.js) 13.88KB 4.80KB
plugin-report (index.js) 43.55KB 11.99KB
plugin-timeline (index.js) 30.68KB 8.95KB
plugin-tree (index.js) 10.58KB 3.72KB
plugin-view (index.js) 85.18KB 21.05KB
providers (DataSourceProvider.js) 0.75KB 0.39KB
providers (MetadataProvider.js) 1.37KB 0.59KB
providers (ThemeProvider.js) 1.90KB 0.85KB
providers (UploadProvider.js) 11.66KB 3.50KB
providers (index.js) 0.45KB 0.23KB
providers (types.js) 0.01KB 0.04KB
react-runtime (index.js) 5.62KB 2.34KB
react (LazyPluginLoader.js) 4.47KB 1.63KB
react (SchemaRenderer.js) 106.60KB 35.16KB
react (data-invalidation.js) 5.05KB 2.08KB
react (index.js) 4.63KB 2.18KB
react (schema-input.js) 4.25KB 2.04KB
react (spec-input.js) 0.20KB 0.18KB
sdui-parser (body-dialect.js) 4.38KB 1.98KB
sdui-parser (codegen.js) 6.58KB 2.74KB
sdui-parser (dashboard-widget-options.js) 3.08KB 1.30KB
sdui-parser (index.js) 5.74KB 2.54KB
sdui-parser (input-type.js) 2.84KB 1.40KB
sdui-parser (kanban-quick-add.js) 3.89KB 1.87KB
sdui-parser (parse.js) 25.28KB 7.80KB
sdui-parser (provenance.js) 3.66KB 1.82KB
sdui-parser (types.js) 0.28KB 0.23KB
sdui-parser (validate.js) 15.71KB 5.30KB
types (ai.js) 4.11KB 2.06KB
types (api-types.js) 0.20KB 0.18KB
types (app.js) 2.87KB 1.00KB
types (base.js) 0.20KB 0.18KB
types (blocks.js) 0.20KB 0.18KB
types (complex.js) 2.93KB 1.49KB
types (crud.js) 0.20KB 0.18KB
types (dashboard-filter-alias.js) 6.23KB 2.74KB
types (data-display.js) 3.75KB 1.85KB
types (data-protocol.js) 0.20KB 0.19KB
types (data.js) 0.20KB 0.18KB
types (designer.js) 1.85KB 0.85KB
types (disclosure.js) 0.20KB 0.18KB
types (error-code.js) 1.54KB 0.88KB
types (expression.js) 0.20KB 0.18KB
types (feedback.js) 0.20KB 0.18KB
types (field-types.js) 0.20KB 0.18KB
types (form.js) 0.20KB 0.18KB
types (http-inflight.js) 8.87KB 3.73KB
types (http-retry.js) 4.32KB 2.02KB
types (icon-key-migration.js) 4.26KB 1.63KB
types (index.js) 4.74KB 2.25KB
types (layout.js) 0.20KB 0.18KB
types (managed-by.js) 0.19KB 0.18KB
types (mobile.js) 5.00KB 2.39KB
types (navigation.js) 0.20KB 0.18KB
types (objectql.js) 0.20KB 0.18KB
types (overlay.js) 0.20KB 0.18KB
types (permissions.js) 0.20KB 0.18KB
types (plugin-scope.js) 0.20KB 0.18KB
types (record-components.js) 0.20KB 0.19KB
types (record-semantics.js) 1.28KB 0.67KB
types (registry.js) 0.20KB 0.18KB
types (reports.js) 0.20KB 0.18KB
types (select-option.js) 0.20KB 0.19KB
types (spec-report.js) 5.05KB 1.93KB
types (spec-ui-namespace.js) 0.20KB 0.19KB
types (strict-authoring-face.js) 17.15KB 6.32KB
types (system-fields.js) 3.33KB 1.54KB
types (theme.js) 6.28KB 2.87KB
types (ui-action.js) 8.11KB 3.32KB
types (views.js) 0.20KB 0.18KB
types (widget.js) 0.20KB 0.18KB

Size Limits

  • ✅ Core packages should be < 50KB gzipped
  • ✅ Component packages should be < 100KB gzipped
  • ⚠️ Plugin packages should be < 150KB gzipped

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

finding(components): ui:menubar never reads an item's icon either — the third MenuItem-shaped container, and the one no census can see

1 participant