Skip to content

feat(react-headless-components-preview): add Tag family#36230

Merged
mainframev merged 14 commits into
masterfrom
feat/headless-tag-3-impl
May 27, 2026
Merged

feat(react-headless-components-preview): add Tag family#36230
mainframev merged 14 commits into
masterfrom
feat/headless-tag-3-impl

Conversation

@mainframev

@mainframev mainframev commented May 19, 2026

Copy link
Copy Markdown
Contributor

Stack

  1. fix(react-tags): decouple useTagGroupBase_unstable from Tabster #36228 — feat(react-tags): decouple useTagGroupBase_unstable from Tabster + export contexts (base: master) — merge first
  2. test(react-tags): add hook regression tests for Tag family #36229 — test(react-tags): add hook regression tests for Tag family (base: fix(react-tags): decouple useTagGroupBase_unstable from Tabster #36228) — depends on fix(react-tags): decouple useTagGroupBase_unstable from Tabster #36228
  3. 👉 feat(react-headless-components-preview): add Tag family #36230 — feat(react-headless-components-preview): add Tag family (base: test(react-tags): add hook regression tests for Tag family #36229)merge last; depends on test(react-tags): add hook regression tests for Tag family #36229

Summary

Adds five headless Tag-family components to @fluentui/react-headless-components-preview, delegating all behaviour to the canonical base hooks in @fluentui/react-tags:

  • Tag (./tag)
  • TagGroup (./tag-group)
  • InteractionTag (./interaction-tag)
  • InteractionTagPrimary (./interaction-tag-primary)
  • InteractionTagSecondary (./interaction-tag-secondary)

What the headless flavour strips:

  • IconsInteractionTagSecondary no longer injects a default DismissRegular; consumers pass children.
  • Tabster — the headless useTagGroup omits the new arrowNavigationProps / onAfterTagDismiss options (introduced in fix(react-tags): decouple useTagGroupBase_unstable from Tabster #36228), so the group renders without data-tabster and without post-dismiss focus restoration. Consumers wire those up themselves.
  • Styles — no Griffel; the root slot exposes data-disabled / data-dismissible / data-selected / data-has-secondary-action attributes for downstream styling.

@github-actions

Copy link
Copy Markdown

Pull request demo site: URL

@mainframev mainframev force-pushed the feat/headless-tag-2-regression-tests branch from 9a05d90 to 36292c8 Compare May 19, 2026 14:58
@mainframev mainframev self-assigned this May 19, 2026
@mainframev mainframev force-pushed the feat/headless-tag-3-impl branch from f087756 to fcf27c5 Compare May 19, 2026 22:18
@mainframev mainframev force-pushed the feat/headless-tag-2-regression-tests branch from 36292c8 to f368d08 Compare May 19, 2026 22:24
@mainframev mainframev force-pushed the feat/headless-tag-3-impl branch 3 times, most recently from bac8400 to 961aca1 Compare May 20, 2026 01:07
@mainframev mainframev marked this pull request as ready for review May 20, 2026 01:10
@mainframev mainframev requested a review from a team as a code owner May 20, 2026 01:10
@mainframev mainframev force-pushed the feat/headless-tag-2-regression-tests branch from 77859e1 to 495dfb9 Compare May 20, 2026 01:36
@mainframev mainframev requested review from a team and ValentinaKozlova as code owners May 20, 2026 01:36
@mainframev mainframev force-pushed the feat/headless-tag-2-regression-tests branch 2 times, most recently from 1d660cc to 14b9a10 Compare May 20, 2026 02:04
@mainframev mainframev force-pushed the feat/headless-tag-3-impl branch from 961aca1 to 7681b40 Compare May 20, 2026 02:17
@tudorpopams tudorpopams requested a review from dmytrokirpa May 20, 2026 12:05
@mainframev mainframev force-pushed the feat/headless-tag-3-impl branch from 7681b40 to e40d2e6 Compare May 20, 2026 12:10
@mainframev mainframev force-pushed the feat/headless-tag-2-regression-tests branch from 14b9a10 to 28edd89 Compare May 20, 2026 12:10
@mainframev mainframev removed request for a team and ValentinaKozlova May 21, 2026 21:23
@mainframev mainframev changed the base branch from feat/headless-tag-2-regression-tests to master May 26, 2026 09:22
@mainframev mainframev force-pushed the feat/headless-tag-3-impl branch from e40d2e6 to 78d6c97 Compare May 26, 2026 09:28
…nTag, InteractionTagPrimary, InteractionTagSecondary, TagGroup
mainframev and others added 8 commits May 26, 2026 18:05
…e from Tag-family hooks

React Compiler config in the fluentui repo has been updated so the opt-out
directive is no longer needed for hooks that mutate their returned state
(e.g. setting data-* attributes on state.root). Removes the directive from
useTag, useInteractionTag, useInteractionTagPrimary, useInteractionTagSecondary,
and useTagGroup.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
@mainframev mainframev force-pushed the feat/headless-tag-3-impl branch from 78d6c97 to 7a5b4e7 Compare May 26, 2026 16:09
@github-actions

github-actions Bot commented May 26, 2026

Copy link
Copy Markdown

📊 Bundle size report

Package & Exports Baseline (minified/GZIP) PR Change
react-headless-components-preview
react-headless-components-preview: entire library
157.538 kB
44.675 kB
165.014 kB
46.273 kB
7.476 kB
1.598 kB

🤖 This report was generated against 99f2b569d3deb10836a01e3a1a46a2f9da790c00

@dmytrokirpa dmytrokirpa left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

left few comments, also please include new components to bundle-size measurements

Comment thread packages/react-components/react-headless-components-preview/library/package.json Outdated
@mainframev mainframev force-pushed the feat/headless-tag-3-impl branch from fb8c243 to 17ba98d Compare May 27, 2026 10:52
@mainframev mainframev requested a review from dmytrokirpa May 27, 2026 13:55
@mainframev mainframev merged commit ecb629c into master May 27, 2026
15 checks passed
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