fix(RadioButtonGroup): make selected prop reactive

[weaseldotro]

Fixes #406

[vercel]

This pull request is being automatically deployed with Vercel (learn more).
To see the status of your deployment, click below or on the icon next to each commit.

🔍 Inspect: https://vercel.com/carbon-svelte/carbon-components-svelte/rnuues5sc
✅ Preview: https://carbon-components-svelte-git-patch-1.carbon-svelte.vercel.app

[metonym]

Nice work.

One requested change. Programmatically setting and binding selected works. However, if the user clicks one of the radio buttons, the update method from the "RadioButtonGroup" context must update selected and not selectedValue.

Otherwise, there may be two or more selected buttons:

setContext("RadioButtonGroup", {
    selectedValue,
    add: ({ checked, value }) => {
      if (checked) {
        selectedValue.set(value);
      }
    },
    update: (value) => {
+      selected = value;
-       selectedValue.set(value);
    },
  });

[weaseldotro]

Oops, somehow I missed testing that. I have added the requested changes.

To correctly test this, in my test program https://codesandbox.io/s/loving-grass-p466p?file=/App.svelte I have replaced <RadioButtonGroup selected={plan}> with <RadioButtonGroup bind:selected={plan}> to use two way binding, otherwise it won't work correctly when using both radios and buttons to change the options.