Disables transition on AvatarStack children that are added after initial render

[mperrotti]

Only applies transition property when disableExpand is not passed.

Closes#3688

Screenshots

Kapture.2023-09-05.at.13.49.32.mp4

Merge checklist

• Added/updated tests
• [n/a] Added/updated documentation
• Changes are SSR compatible
• Tested in Chrome
• Tested in Firefox
• Tested in Safari
• Tested in Edge

Take a look at the What we look for in reviews section of the contributing guidelines for more information on how we review PRs.

[changeset-bot]

🦋 Changeset detected

Latest commit: ab19031

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package

Name	Type
@primer/react	Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[mperrotti]

If you want to test these changes locally, you can replace the DisableExpandOnHover story with this:

exportconstDisableExpandOnHover=()=>{constsrcArr=['https://avatars.githubusercontent.com/primer','https://avatars.githubusercontent.com/github','https://avatars.githubusercontent.com/atom','https://avatars.githubusercontent.com/desktop',]const[avatarSrcs,setAvatarSrcs]=React.useState([])constaddAvatar=()=>{setAvatarSrcs([...avatarSrcs,srcArr[avatarSrcs.length%srcArr.length]])}constremoveAvatar=()=>{setAvatarSrcs(avatarSrcs.slice(0,avatarSrcs.length-1))}return(<divstyle={{display: 'flex',flexDirection: 'column',gap: '1em',alignItems: 'flex-start'}}><divstyle={{display: 'flex',gap: '0.5em'}}><ButtononClick={addAvatar}>Add avatar</Button><ButtononClick={removeAvatar}>Remove avatar</Button></div><div><AvatarStackdisableExpand>{avatarSrcs.map(src=>(<Avataralt="Some avatar"src={src}key={src}/>))}</AvatarStack></div></div>)}

[github-actions]

size-limit report 📦

Path	Size
dist/browser.esm.js	100.62 KB (-0.01% 🔽)
dist/browser.umd.js	101.19 KB (-0.01% 🔽)