Bug - Drawer - expandable section inside the panel content causes drawer's onExpand to be fired

[kdoberst]

Describe the problem
When an expandable section is placed inside the panelContent prop of the drawer and the user expands or collapses the expandable section, the onExpand method for the drawer is fired.

This is unexpected and since the onExpand is used to put focus on the drawer when opened, having onExpand called when the drawer is already open causes the focus to move (and possibly browser scroll) to behave unexpectedly.

How do you reproduce the problem?
Place an expandable section inside the panel content prop of the drawer. Expand the drawer and then expand/collapse the expandable section. This will cause the onExpand method from the drawer to be fired.

See https://codesandbox.io/s/stupefied-pasteur-tmt5ud?file=/index.tsx for an example.

Expected behavior
The onExpand is triggered only when the drawer is expanded.

Is this issue blocking you?
The only workaround I could come up with is adding another state variable to determine when onExpand should be triggered or not. Using isExpanded didn't work because isExpanded is always true when onExpand is called.

Screenshots
See https://codesandbox.io/s/stupefied-pasteur-tmt5ud?file=/index.tsx for an example.

What is your environment?
OS: [e.g. iOS]: Any (I tested using a macbook pro using OS 11.7.1)
Browser [e.g. chrome, safari]: Any (I tested using chrome 108.0.5359.124 )

What is your product and what release date are you targeting?
OCM

Any other information?