BREAKING(react-tags-preview): use JSX children instead of slots for InteractionTag's buttons

[YuanboXue-Amber]

Use JSX children for interactionTag's two buttons instead of slots.

Previous Behavior

{/* second button is `dismissButton` slot and it is shown when `dismissible` is true */}
<InteractionTag appearance="outline" icon={<CalendarMonth />} dismissible> 
  outlined {/* first button is `content` slot */}
</InteractionTag>

New Behavior

<InteractionTag appearance="outline">
  <InteractionTagPrimary icon={<CalendarMonth />}>outline</InteractionTagPrimary>  {/* first button */}
  <InteractionTagSecondary /> {/* second button */}
</InteractionTag>

JSX children provides an easier way to attach popover/tooltip to the primary/secondary button of InteractionTag. And this is one of the main use case we're targeting.

[fabricteam]

📊 Bundle size report

Package & Exports	Baseline (minified/GZIP)	PR	Change
react-tags-preview InteractionTag	33.653 kB 9.14 kB	10.895 kB 4.494 kB	-22.758 kB -4.646 kB
react-tags-preview Tag	25.292 kB 8.36 kB	25.264 kB 8.352 kB	-28 B -8 B
react-tags-preview TagGroup	69.523 kB 20.462 kB	69.471 kB 20.443 kB	-52 B -19 B

_{🤖 This report was generated against d1a32c704b6901ceb3f976ad2148d8bbffc7628a}

[codesandbox-ci]

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Latest deployment of this branch, based on commit ae5b24e:

Sandbox	Source
@fluentui/react 8 starter	Configuration
@fluentui/react-components 9 starter	Configuration

[size-auditor]

Asset size changes

Size Auditor did not detect a change in bundle size for any component!

Baseline commit: d1a32c704b6901ceb3f976ad2148d8bbffc7628a (build)

[fabricteam]

🕵 fluentuiv9 No visual regressions between this PR and main