refactor(chrome): use transient props where appropriate

[ze-flo]

Description

This PR updates various components in Chrome to use transient props where appropriate. These changes are necessary in preparation for the upgrade to [email protected] to ensure we avoid DOM violation errors after the transition.

Checklist

• 👌 design updates will be Garden Designer approved (add the designer as a reviewer)
• 🌐 demo is up-to-date (npm start)
• ⬅️ renders as expected with reversed (RTL) direction
• ⚫ renders as expected in dark mode
• 🤘 renders as expected with Bedrock CSS (?bedrock)
• 💂‍♂️ includes new unit tests. Maintain existing coverage (always >= 96%)
• ♿ tested for WCAG 2.1 AA accessibility compliance
• 📝 tested in Chrome, Firefox, Safari, and Edge

[jzempel]

If this package is complete, then its peerDependencies can bump to:

"styled-components": "^5.3.1 || ^6.0.0"

[jzempel]

fwiw, the most recent code convention for spread parameters exists in dropdowns where we simply used ...props naming (vs ...other or ...rest). I'm not opposed to ...other – just pointing to the most evolved convention 😉

[ze-flo]

fwiw, the most recent code convention for spread parameters exists in dropdowns where we simply used ...props naming (vs ...other or ...rest). I'm not opposed to ...other – just pointing to the most evolved convention 😉

When using ...other (or ...rest) instead of ...props, it's immediately clear that we're only passing along a subset of the props. This makes the code easier to understand and review because you don't have to jump to the component's definition to figure out what's being passed. Since we've mostly used ...other in our codebase, I'll stick with it for consistency.