Issue with reactivity on store binding of _this_ outside .svelte in custom element.

[RamAddict]

Describe the bug

When binding a component's this attribute to a store in a typescript file I am able to set its CSS from another component by simply importing the store variable and assigning a new value. This works properly when running in dev. But when I generate the custom element, the bound HTMLElement loses its reactivity (changing the CSS doesn't reflect on the dom). When debugging using the browser debugger, I see everything working perfectly. Even the CSS attribute gets set, but it just refuses to update. This is just an annoyance because I've found a workaround by setting an object and making the component subscribe to that object and then updating with the changes.

Reproduction

I've created an example repository that reproduces the issue: demo.
I have a Counter component in the demo whose this I bind to a local variable. Then, I bind the local variable to the father's component's variable which I import from the store. I then import that store into the ChangeColor component's on:click function to tell it to change the background color.

The repository has instructions on how to run and generate the custom element. You will see that it works running in dev but not in the custom element.

Logs

No logs were seen for this issue :(

System Info

System:
    OS: Linux 5.15 Ubuntu 20.04.4 LTS (Focal Fossa)
    CPU: (16) x64 AMD Ryzen 7 5800X3D 8-Core Processor
    Memory: 4.37 GB / 15.58 GB
    Container: Yes
    Shell: 5.0.17 - /bin/bash
  Binaries:
    Node: 16.16.0 - ~/.nvm/versions/node/v16.16.0/bin/node
    npm: 8.15.0 - ~/.nvm/versions/node/v16.16.0/bin/npm
  npmPackages:
    svelte: ^3.53.1 => 3.53.1
    vite: ^3.2.3
I use OperaGx, but its the same with chrome
LVL4 (core: 92.0.4561.71)
System:Windows 11 64-bit
Chromium version:106.0.5249.119

Severity

annoyance