chore: add more prop annotations

src/ContentSwitcher/ContentSwitcher.Story.svelte

@@ -1,5 +1,9 @@
 <script>
   export let story = undefined;
+  /**
+   * Set to `true` to enable the light variant
+   * @type {boolean} [light=false]
+   */
   export let light = false;
 
   import ContentSwitcher from "./ContentSwitcher.svelte";

src/ContentSwitcher/ContentSwitcher.svelte

@@ -1,5 +1,14 @@
 <script>
+  /**
+   * Set the selected index of the switch item
+   * @type {number} [selectedIndex=0]
+   */
   export let selectedIndex = 0;
+
+  /**
+   * Set to `true` to enable the light variant
+   * @type {boolean} [light=false]
+   */
   export let light = false;
 
   import { afterUpdate, createEventDispatcher, setContext } from "svelte";
@@ -24,10 +33,10 @@
 
       switches = [...switches, { id, text, selected }];
     },
-    update: id => {
+    update: (id) => {
       selectedIndex = switches.map(({ id }) => id).indexOf(id);
     },
-    change: direction => {
+    change: (direction) => {
       let index = currentIndex + direction;
 
       if (index < 0) {
@@ -37,7 +46,7 @@
       }
 
       selectedIndex = index;
-    }
+    },
   });
 
   afterUpdate(() => {

src/ContentSwitcher/Switch.svelte

@@ -1,8 +1,33 @@
 <script>
+  /**
+   * Specify the switch text
+   * Alternatively, use the named slot "text" (e.g. <span slot="text">...</span>)
+   * @type {string} [text="Provide text"]
+   */
   export let text = "Provide text";
+
+  /**
+   * Set to `true` for the switch to be selected
+   * @type {boolean} [selected=false]
+   */
   export let selected = false;
+
+  /**
+   * Set to `true` to disable the switch
+   * @type {boolean} [disabled=false]
+   */
   export let disabled = false;
+
+  /**
+   * Set an id for the button element
+   * @type {string} [id]
+   */
   export let id = "ccs-" + Math.random().toString(36);
+
+  /**
+   * Obtain a reference to the button HTML element
+   * @type {null | HTMLElement} [ref=null]
+   */
   export let ref = null;
 
   import { afterUpdate, getContext, onDestroy } from "svelte";
@@ -11,7 +36,7 @@
 
   ctx.add({ id, text, selected });
 
-  const unsubscribe = ctx.currentId.subscribe($ => {
+  const unsubscribe = ctx.currentId.subscribe(($) => {
     selected = $ === id;
   });