Add autoWidth prop to Tabs (#901)

* feat(tabs): support auto width tabs

Closes #899

* docs(tabs): add auto width example

src/Tabs/Tab.svelte

@@ -22,7 +22,7 @@
 
   import { onMount, afterUpdate, getContext, tick } from "svelte";
 
-  const { selectedTab, add, update, change } = getContext("Tabs");
+  const { selectedTab, useAutoWidth, add, update, change } = getContext("Tabs");
 
   add({ id, label, disabled });
 
@@ -81,6 +81,7 @@
     id="{id}"
     href="{href}"
     class:bx--tabs__nav-link="{true}"
+    style="{$useAutoWidth ? 'width: auto' : undefined}"
   >
     <slot>{label}</slot>
   </a>

src/Tabs/Tabs.svelte

@@ -8,6 +8,9 @@
    */
   export let type = "default";
 
+  /** Set to `true` for tabs to have an auto-width */
+  export let autoWidth = false;
+
   /**
    * Specify the ARIA label for the chevron icon
    * @type {string}
@@ -27,6 +30,7 @@
   const tabsById = derived(tabs, (_) =>
     _.reduce((a, c) => ({ ...a, [c.id]: c }), {})
   );
+  const useAutoWidth = writable(autoWidth);
   const selectedTab = writable(undefined);
   const content = writable([]);
   const contentById = derived(content, (_) =>
@@ -39,6 +43,7 @@
     contentById,
     selectedTab,
     selectedContent,
+    useAutoWidth,
     add: (data) => {
       tabs.update((_) => [..._, { ...data, index: _.length }]);
     },
@@ -99,6 +104,7 @@
   $: if ($selectedTab) {
     dropdownHidden = true;
   }
+  $: useAutoWidth.set(autoWidth);
 </script>
 
 <div