bug/issue 128 fix shadow root rendering for JSX

[thescientist13]

Related Issue

resolves #128

Summary of Changes

1. Wrap JSX that renders into a shadow DOM with a <template> tag
2. Fix issues with inferredObservability interop
3. Added a test case (there was never one to begin with 😱 )
4. All sandbox demos are working as expected now 🎉
5. Updated documentation, examples, and caveats for JSX support

See https://github.com/thescientist13/greenwood-htmx/pull/10 for a working example

TODO

1. [x] JSX + Shadow DOM testing - see https://github.com/ProjectEvergreen/wcc/issues/130
   • so yeah, the current implementation is not going to work, if use shadowRoot.innerHTML we're still going to keep getting runtime warnings
2. [x] Greenwood regression testing
3. [x] more test cases, like for inferredObservability
4. [x] documentation
   • hard dependency on constructor (does it have to be though?) - nope!
   • hard dependency on

     connectedCallback() {
     this.render();
     }

   • inline <style> tag in JSX not supported - https://stackoverflow.com/questions/27530462/tag-error-react-jsx-style-tag-error-on-render
   • attachShadow is needed as a hint for DSD
5. [x] reuse HTMLTemplateElement (e.g. DOM shim) instead of manually wrapping - N / A
6. [x] refactor DSD render function implementation to avoid innerHTML usage (nice to have, otherwise could be a good first issue) - made its own issue, but of lower priority if we can get #108 working (since renders would only happen once) - https://github.com/ProjectEvergreen/wcc/issues/138