Skip to content

feat(react-breadcrumb): add useBreadcrumbBase_unstable hook#35819

Merged
dmytrokirpa merged 6 commits into
masterfrom
feat/react-breadcrumb-base-hooks
Mar 23, 2026
Merged

feat(react-breadcrumb): add useBreadcrumbBase_unstable hook#35819
dmytrokirpa merged 6 commits into
masterfrom
feat/react-breadcrumb-base-hooks

Conversation

@dmytrokirpa

@dmytrokirpa dmytrokirpa commented Mar 3, 2026

Copy link
Copy Markdown
Contributor

Summary

This PR adds base state hooks for all Breadcrumb components as part of the experimental base hooks initiative.

What was implemented

  • useBreadcrumbBase_unstable — base hook for Breadcrumb component

    • Props type: BreadcrumbBaseProps (omits size)
    • State type: BreadcrumbBaseState (omits size)
    • Handles: focusMode/arrow navigation via useArrowNavigationGroup, ARIA label, slot structure (root, list)
  • useBreadcrumbButtonBase_unstable — base hook for BreadcrumbButton component

    • Props type: BreadcrumbButtonBaseProps (omits size)
    • State type: BreadcrumbButtonBaseState (omits size)
    • Handles: current state, aria-current, aria-disabled, button element type selection, calls useButtonBase_unstable
  • useBreadcrumbDividerBase_unstable — base hook for BreadcrumbDivider component

    • Props type: BreadcrumbDividerBaseProps (same as BreadcrumbDividerProps since no design props)
    • State type: BreadcrumbDividerBaseState (omits size)
    • Handles: aria-hidden, RTL/LTR chevron icon selection via useFluent
  • useBreadcrumbItemBase_unstable — base hook for BreadcrumbItem component

    • Props type: BreadcrumbItemBaseProps (omits size)
    • State type: BreadcrumbItemBaseState (omits size)
    • Handles: slot structure for li element

Refactoring

All styled hooks (useBreadcrumb_unstable, useBreadcrumbButton_unstable, useBreadcrumbDivider_unstable, useBreadcrumbItem_unstable) now call their base counterparts internally and spread results, then add the size design prop.

Exports

All new types and hooks are exported from the package index.ts. They are NOT exported from @fluentui/react-components.

🤖 Generated with Claude Code

@github-actions

github-actions Bot commented Mar 3, 2026

Copy link
Copy Markdown

Pull request demo site: URL

dmytrokirpa and others added 2 commits March 5, 2026 12:02
…mbButton, BreadcrumbDivider, and BreadcrumbItem

Implements base state hooks for all Breadcrumb components as part of the experimental base hooks initiative.
Each base hook extracts pure component logic (slot structure, ARIA attributes, keyboard navigation)
while omitting design props (primarily size).

- BreadcrumbBaseProps/BreadcrumbBaseState: omits size
  useBreadcrumbBase_unstable: handles focusMode, arrow navigation, ARIA label, slot structure

- BreadcrumbButtonBaseProps/BreadcrumbButtonBaseState: omits size
  useBreadcrumbButtonBase_unstable: handles current state, aria-current, aria-disabled, button behavior

- BreadcrumbDividerBaseProps/BreadcrumbDividerBaseState: excludes size (injected via context in full hook)
  useBreadcrumbDividerBase_unstable: handles aria-hidden, RTL/LTR chevron icon selection

- BreadcrumbItemBaseProps/BreadcrumbItemBaseState: excludes size (injected via context in full hook)
  useBreadcrumbItemBase_unstable: handles slot structure

All styled hooks now call their base counterparts internally.
All new types and hooks exported from package index.ts.

Co-Authored-By: Claude Sonnet 4.6 <[email protected]>
@dmytrokirpa dmytrokirpa force-pushed the feat/react-breadcrumb-base-hooks branch from 55bdfa4 to d4d7850 Compare March 5, 2026 11:03
@dmytrokirpa dmytrokirpa changed the base branch from experimental/component-base-hooks to master March 5, 2026 11:03
@github-actions

github-actions Bot commented Mar 5, 2026

Copy link
Copy Markdown

📊 Bundle size report

Package & Exports Baseline (minified/GZIP) PR Change
react-breadcrumb
@fluentui/react-breadcrumb - package
114.911 kB
31.405 kB
115.355 kB
31.542 kB
444 B
137 B
react-components
react-components: entire library
1.295 MB
323.683 kB
1.296 MB
323.791 kB
249 B
108 B
Unchanged fixtures
Package & Exports Size (minified/GZIP)
react-components
react-components: Button, FluentProvider & webLightTheme
70.397 kB
19.96 kB
react-components
react-components: Accordion, Button, FluentProvider, Image, Menu, Popover
236.62 kB
68.716 kB
react-components
react-components: FluentProvider & webLightTheme
43.612 kB
14.022 kB
react-portal-compat
PortalCompatProvider
8.386 kB
2.624 kB
react-timepicker-compat
TimePicker
108.174 kB
35.695 kB
🤖 This report was generated against 8b677d0f0120d5bb60acc558325d8a0e37269cf6

@dmytrokirpa dmytrokirpa marked this pull request as ready for review March 21, 2026 08:12
@dmytrokirpa dmytrokirpa requested a review from a team as a code owner March 21, 2026 08:12
@dmytrokirpa dmytrokirpa enabled auto-merge (squash) March 21, 2026 09:01
@ValentinaKozlova ValentinaKozlova self-requested a review March 23, 2026 13:19
@dmytrokirpa dmytrokirpa merged commit f630c09 into master Mar 23, 2026
15 checks passed
tudorpopams pushed a commit to tudorpopams/fluentui that referenced this pull request Apr 14, 2026
@dmytrokirpa dmytrokirpa deleted the feat/react-breadcrumb-base-hooks branch May 23, 2026 10:31
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.

2 participants