refactor: use $$restProps API

- add ref prop for applicable components (#196)
- add slot to Content Switcher `Switch` component (#183)
- remove fillArray, css utilities

src/components/ProgressIndicator/ProgressIndicator.Skeleton.svelte

@@ -1,27 +1,28 @@
 <script>
-  let className = undefined;
-  export { className as class };
-  export let style = undefined;
   export let vertical = false;
-
-  import { cx } from '../../lib';
 </script>
 
 <ul
+  class:bx--progress={true}
+  class:bx--progress--vertical={vertical}
+  class:bx--skeleton={true}
+  {...$$restProps}
   on:click
   on:mouseover
   on:mouseenter
-  on:mouseleave
-  class={cx('--progress', vertical && '--progress--vertical', '--skeleton', className)}
-  {style}>
+  on:mouseleave>
   {#each [0, 1, 2, 3] as item, i (item)}
-    <li class={cx('--progress-step', '--progress-step--incomplete')}>
-      <div class={cx('--progress-step-button', '--progress-step-button--unclickable')}>
+    <li
+      class:bx--progress-step={true}
+      class:bx--progress-step--incomplete={true}>
+      <div
+        class:bx--progress-step-button={true}
+        class:bx--progress-step-button--unclickable={true}>
         <svg>
           <path d="M 7, 7 m -7, 0 a 7,7 0 1,0 14,0 a 7,7 0 1,0 -14,0" />
         </svg>
-        <p class={cx('--progress-label')} />
-        <span class={cx('--progress-line')} />
+        <p class:bx--progress-label={true} />
+        <span class:bx--progress-line={true} />
       </div>
     </li>
   {/each}