feat(table): add compound expandable fullscreen demo

[jenny-s51]

What: Closes #7339

Convenience link to demo: https://patternfly-react-pr-7366.surge.sh/components/table/react-demos/compound-expansion/

[patternfly-build]

Preview: https://patternfly-react-pr-7366.surge.sh

A11y report: https://patternfly-react-pr-7366-a11y.surge.sh

[nicolethoen]

Is the sortable columns in the core example something we should add to the react example? I notice the compound expandable example (not the demo) does not have sortable columns, so I'm not sure how hard that'd be to wire up...
What do you think, @mcarrano ?

[mcarrano]

It seems like sortable columns and compound expansion and really demonstrating two separate things. So I'm OK to leave it out of this demo unless there is value in including it here because there are unique issues to integrating column sorting with compound expansion that do not occur elsewhere.

[mmenestr]

Something random I noticed is that clicking on the "Open in GitHub" link on the first row, opens up the second column expansion. That probably shouldn't happen right?

[jenny-s51]

It seems like sortable columns and compound expansion and really demonstrating two separate things. So I'm OK to leave it out of this demo unless there is value in including it here because there are unique issues to integrating column sorting with compound expansion that do not occur elsewhere.

@mcarrano I agree that it makes the most sense to leave sorting out of this demo, since we are demonstrating compound expansion and don't want to puff up the demo too much with repeated code that doesn't directly relate to the table variant being demoed.

If consumers want to see an example of sorting, they can check out our sortable demo!.

Something random I noticed is that clicking on the "Open in GitHub" link on the first row, opens up the second column expansion. That probably shouldn't happen right?

Good question and nice catch @mmenestr ! For all our react demos with an action link, the href is set to #. When the link is clicked, the # tag is added to the url and the component is rerendered.

This effectively has the same function as refreshing the page, which is why the row gets expanded again (that's the default state here). This won't present any issues to consumers.

[tlabaj]

I would make this a little more similar to core by

1. Chang the name to compound expansion
2. add a toolbar
3. add bottom pagination

[mcarrano]

LGTM. Thanks @jenny-s51 !

[mcoker]

LGTM!