feat: Copilot UX updates

[OEvgeny]

Changelog Entry

• (Experimental) Reworked the copilot variant to align with the modern Copilot UX, in PR #5630, by @OEvgeny, in PR #5634, by @OEvgeny
  • The legacy design is temporarily available as copilot-deprecated for migration
  • Added loading animation for copilot, copilot-deprecated and fluent variants

Description

This continues the work on the new copilot variant and fixes some issues found in white-label along the way.

The new loader animation for fluent-theme package was added as well as the styling for grouping was improved.

Specific Changes

-

• I have added tests and executed them locally
• I have updated CHANGELOG.md
• I have updated documentation

Review Checklist

This section is for contributors to review your work.

• Accessibility reviewed (tab order, content readability, alt text, color contrast)
• Browser and platform compatibilities reviewed
• CSS styles reviewed (minimal rules, no z-index)
• Documents reviewed (docs, samples, live demo)
• Internationalization reviewed (strings, unit formatting)
• package.json and package-lock.json reviewed
• Security reviewed (no data URIs, check for nonce leak)
• Tests reviewed (coverage, legitimacy)

[Copilot]

Pull Request Overview

This PR updates the Copilot variant to align with modern Copilot UX design and adds loading animations for multiple variants. The changes primarily involve standardizing the capitalization of creativeWorkStatus values from lowercase to title case (e.g., 'incomplete' to 'Incomplete') to match current API conventions.

Key Changes:

• Standardized creativeWorkStatus property values to use title case capitalization
• Updated documentation to reflect the new capitalized status values
• Added loading animation support for copilot, copilot-deprecated, and fluent variants

Reviewed Changes

Copilot reviewed 2 out of 647 changed files in this pull request and generated no comments.

File	Description
__tests__/html2/activity/message-status.html	Updated test cases to use title case for creativeWorkStatus values ('Incomplete' and 'Published')
CHANGELOG.md	Updated documentation to reflect the capitalized status values and added note about loading animations

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

[OEvgeny]

For the fluent-theme the chevron angle is consistent with our Figma:

• Closed state pointing to the right
• Opened state pointing to the bottom

This is consistent with say codespaces/vscode:

But not with fluentai ChainOfThought implementation: