Skip to content

feat(react-skeleton): add useSkeletonBase_unstable hook#35809

Merged
dmytrokirpa merged 3 commits into
masterfrom
feat/react-skeleton-base-hooks
Mar 20, 2026
Merged

feat(react-skeleton): add useSkeletonBase_unstable hook#35809
dmytrokirpa merged 3 commits into
masterfrom
feat/react-skeleton-base-hooks

Conversation

@dmytrokirpa

@dmytrokirpa dmytrokirpa commented Mar 3, 2026

Copy link
Copy Markdown
Contributor

Summary

  • Adds useSkeletonBase_unstable hook to react-skeleton that extracts pure component logic without design props
  • Adds useSkeletonItemBase_unstable hook to react-skeleton for SkeletonItem component
  • Adds SkeletonBaseProps / SkeletonBaseState types (omitting animation and appearance as design-related props)
  • Adds SkeletonItemBaseProps / SkeletonItemBaseState types (omitting animation, appearance, size, shape)
  • Refactors useSkeleton_unstable to call useSkeletonBase_unstable internally
  • Refactors useSkeletonItem_unstable to call useSkeletonItemBase_unstable internally
  • Exports all new types and hooks from the package index.ts

What base hooks include

The base hooks preserve:

  • role="progressbar" and aria-busy={true} ARIA attributes on Skeleton
  • Slot structure (root slot with intrinsic element props)

The base hooks exclude:

  • animation prop (wave/pulse visual animation - design concern)
  • appearance prop (opaque/translucent - design concern)
  • size prop on SkeletonItem (design concern)
  • shape prop on SkeletonItem (circle/square/rectangle - design concern)

🤖 Generated with Claude Code

…mBase_unstable hooks

Adds base state hooks for Skeleton and SkeletonItem components that extract pure
component logic (ARIA, slot structure) without design-related props (animation,
appearance, size, shape).

- Add SkeletonBaseProps/SkeletonBaseState types omitting animation and appearance
- Add SkeletonItemBaseProps/SkeletonItemBaseState types omitting animation, appearance, size, shape
- Add useSkeletonBase_unstable hook preserving role=progressbar and aria-busy=true
- Add useSkeletonItemBase_unstable hook for slot structure
- Refactor useSkeleton_unstable and useSkeletonItem_unstable to call base hooks
- Export new types and hooks from package index.ts

Co-Authored-By: Claude Sonnet 4.6 <[email protected]>
@dmytrokirpa dmytrokirpa changed the base branch from experimental/component-base-hooks to master March 5, 2026 10:26
@dmytrokirpa dmytrokirpa force-pushed the feat/react-skeleton-base-hooks branch from a7a3476 to b4c8762 Compare March 18, 2026 11:16
@github-actions github-actions Bot removed the CI label Mar 18, 2026
@dmytrokirpa dmytrokirpa marked this pull request as ready for review March 18, 2026 11:17
@dmytrokirpa dmytrokirpa requested review from a team and ValentinaKozlova as code owners March 18, 2026 11:17
@dmytrokirpa dmytrokirpa self-assigned this Mar 18, 2026
@github-actions

github-actions Bot commented Mar 18, 2026

Copy link
Copy Markdown

📊 Bundle size report

Package & Exports Baseline (minified/GZIP) PR Change
react-components
react-components: entire library
1.295 MB
323.649 kB
1.295 MB
323.654 kB
60 B
5 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 cd29f13fec3bd7fe638323d6a821b4aaf931a29b

@github-actions

Copy link
Copy Markdown

Pull request demo site: URL

@dmytrokirpa dmytrokirpa enabled auto-merge (squash) March 20, 2026 16:10
@dmytrokirpa dmytrokirpa merged commit 8b677d0 into master Mar 20, 2026
14 checks passed
tudorpopams pushed a commit to tudorpopams/fluentui that referenced this pull request Apr 14, 2026
@dmytrokirpa dmytrokirpa deleted the feat/react-skeleton-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