[feature]: Extension's ability manipulate Venia-Ui JSX

Is your feature request related to a problem? Please describe. Extensions have limited access to extending the JSX markup in components. In Product Recommendations' use case, we would like to add a onClick handler to tags inside of the GalleryItem component to enable rendered recommendation product tracking.

Describe the solution you'd like Short term: merge this pr https://github.com/magento/pwa-studio/pull/3053 Long term: The issue with enabling extensions to target JSX in components in the same way that Storefronts can target and manipulate JSX in components that if any JSX is changed in a PWA-Studio release, it becomes a breaking change. To solve this make the targeting system class based. Inside of each component localized CSS classes are being used, these are essentially unique identifiers in the DOM tree and could be reused as a method to target JSX inside of components. Because the extension (and i would propose considering using this method for storefronts as well) doesn't rely upon the DOM tree inside of JSX, there will only be breaking changes in the codebase if a className is removed or changed, not when a new one is added.

Describe alternatives you've considered Alternative for adding props to Venia-ui components: Adding props catch alls to peregrine talons that are then spread across Venia-UI components. Extensions could then intercept the Talons and then change the prop catch alls to their desired props. This is limited and would not solve the issue that extensions need to extend all of the markup in Venia-UI components, not just the props.

Please let us know what packages this feature is in regards to:

[ ] venia-concept
[x] venia-ui
[ ] pwa-buildpack
[ ] peregrine
[ ] pwa-devdocs
[ ] upward-js
[ ] upward-spec
[ ] create-pwa

magento / pwa-studio

[feature]: Extension's ability manipulate Venia-Ui JSX #3050