UI: Add support for groups to TooltipLinkList and use it in main menu

[ghengeveld]

Closes #29214

What I did

Updated the TooltipLinkList component to accept a Link[][] besides the usual Link[]. Added padding and updated the border radius to match the new designs. Updated the main Storybook menu to use groups.

Checklist for Contributors

Testing

The changes in this PR are covered in the following automated tests:

• stories
• unit tests
• integration tests
• end-to-end tests

Manual testing

This section is mandatory for all contributions. If you believe no manual test is necessary, please state so explicitly. Thanks!

Documentation

• Add or update documentation reflecting your changes
• If you are deprecating/removing a feature, make sure to update
  MIGRATION.MD

Checklist for Maintainers

• When this PR is ready for testing, make sure to add ci:normal, ci:merged or ci:daily GH label to it to run a specific set of sandboxes. The particular set of sandboxes can be found in code/lib/cli/src/sandbox-templates.ts

• Make sure this PR contains one of the labels below:

  Available labels

  • bug: Internal changes that fixes incorrect behavior.
  • maintenance: User-facing maintenance tasks.
  • dependencies: Upgrading (sometimes downgrading) dependencies.
  • build: Internal-facing build tooling & test updates. Will not show up in release changelog.
  • cleanup: Minor cleanup style change. Will not show up in release changelog.
  • documentation: Documentation only changes. Will not show up in release changelog.
  • feature request: Introducing a new feature.
  • BREAKING CHANGE: Changes that break compatibility in some way with current major version.
  • other: Changes that don't fit in the above categories.

🦋 Canary release

This PR does not have a canary release associated. You can request a canary release of this pull request by mentioning the @storybookjs/core team here.

core team members can create a canary release here or locally with gh workflow run --repo storybookjs/storybook canary-release-pr.yml --field pr=<PR_NUMBER>

name	before	after	diff	z	%
createSize	0 B	0 B	0 B	-	-
generateSize	78 MB	78 MB	0 B	1.11	0%
initSize	143 MB	143 MB	-12.3 kB	1.07	0%
diffSize	65.1 MB	65.1 MB	-12.3 kB	-0.75	0%
buildSize	6.87 MB	6.88 MB	659 B	6.67	0%
buildSbAddonsSize	1.51 MB	1.51 MB	0 B	0.5	0%
buildSbCommonSize	195 kB	195 kB	0 B	-	0%
buildSbManagerSize	1.9 MB	1.9 MB	399 B	5.13	0%
buildSbPreviewSize	271 kB	271 kB	0 B	-	0%
buildStaticSize	0 B	0 B	0 B	-	-
buildPrebuildSize	3.88 MB	3.88 MB	399 B	4.37	0%
buildPreviewSize	3 MB	3 MB	260 B	49.47	0%
testBuildSize	0 B	0 B	0 B	-	-
testBuildSbAddonsSize	0 B	0 B	0 B	-	-
testBuildSbCommonSize	0 B	0 B	0 B	-	-
testBuildSbManagerSize	0 B	0 B	0 B	-	-
testBuildSbPreviewSize	0 B	0 B	0 B	-	-
testBuildStaticSize	0 B	0 B	0 B	-	-
testBuildPrebuildSize	0 B	0 B	0 B	-	-
testBuildPreviewSize	0 B	0 B	0 B	-	-

name	before	after	diff	z	%
createTime	6.5s	22.2s	15.7s	1.1	70.5%
generateTime	19.9s	19.5s	-483ms	-1.16	-2.5%
initTime	13.9s	13.9s	-21ms	-1.39	-0.2%
buildTime	7.8s	9.9s	2s	0.9	20.3%
testBuildTime	0ms	0ms	0ms	-	-
devPreviewResponsive	5s	6.7s	1.7s	0.62	25.5%
devManagerResponsive	3.2s	4.1s	860ms	0.35	20.7%
devManagerHeaderVisible	515ms	741ms	226ms	1.03	30.5%
devManagerIndexVisible	549ms	771ms	222ms	0.69	28.8%
devStoryVisibleUncached	614ms	1.2s	600ms	0.33	49.4%
devStoryVisible	547ms	770ms	223ms	0.78	29%
devAutodocsVisible	449ms	703ms	254ms	1.39	🔺36.1%
devMDXVisible	455ms	586ms	131ms	0.44	22.4%
buildManagerHeaderVisible	519ms	587ms	68ms	-0.23	11.6%
buildManagerIndexVisible	540ms	607ms	67ms	-0.18	11%
buildStoryVisible	521ms	588ms	67ms	-0.2	11.4%
buildAutodocsVisible	421ms	520ms	99ms	0.29	19%
buildMDXVisible	413ms	513ms	100ms	0.15	19.5%

Greptile Summary

Here's my concise summary of the PR changes:

Enhanced TooltipLinkList component to support grouped menu items with visual separators, primarily used in Storybook's main menu system.

• Added support for nested arrays (Link[][]) in TooltipLinkList component for grouped menu items
• Updated menu styling with new border radius, padding, and group separators in /code/core/src/components/components/tooltip/TooltipLinkList.tsx
• Restructured main Storybook menu into 3 logical groups (about/docs, navigation, addon shortcuts) in /code/core/src/manager/container/Menu.tsx
• Added new story WithGroups to demonstrate grouped links functionality in /code/core/src/components/components/tooltip/TooltipLinkList.stories.tsx
• Fixed type definitions and improved type safety across menu-related components

[greptile-apps]

_{6 file(s) reviewed, 3 comment(s)
Edit PR Review Bot Settings | Greptile}

[nx-cloud]

☁️ Nx Cloud Report

CI is running/has finished running commands for commit b02bc0a. As they complete they will appear below. Click to see the status, the terminal output, and the build insights.

📂 See all runs for this CI Pipeline Execution

---

✅ Successfully ran 2 targets

• nx affected -t check -c production --parallel=7
• nx run-many -t build -c production --parallel=3

---

Sent with 💌 from NxCloud.