docs: link source code to folder for multiple components (#1582)

* docs: link source code to folder for multiple components

* chore(docs): remove unused `source` from frontmatter

docs/src/layouts/ComponentLayout.svelte

@@ -22,7 +22,6 @@
 
   export let component = $page.title;
   export let components = [component];
-  export let source = "";
   export let unreleased = false;
   export let unstable = false;
 
@@ -42,10 +41,28 @@
     }
   });
 
+  function formatSourceURL(multiple) {
+    const filePath = api_components[0]?.filePath ?? "";
+
+    if (multiple) {
+      /**
+       * Link to folder for doc with multiple components.
+       * @example "src/Breadcrumb"
+       */
+      return filePath.split("/").slice(0, -1).join("/");
+    }
+
+    /**
+     * Else, link to the component source.
+     * @example "src/Tile/ClickableTile.svelte"
+     */
+    return filePath;
+  }
+
   // TODO: [refactor] read from package.json value
-  $: sourceCode = `https://github.com/carbon-design-system/carbon-components-svelte/tree/master/src/${
-    source || `${$page.title}/${$page.title}.svelte`
-  }`;
+  $: sourceCode = `https://github.com/carbon-design-system/carbon-components-svelte/tree/master/${formatSourceURL(
+    multiple
+  )}`;
 </script>
 
 <Content data-components>

docs/src/pages/components/ButtonSet.svx

@@ -1,7 +1,3 @@
----
-source: Button/ButtonSet.svelte
----
-
 <script>
   import { Button, ButtonSet } from "carbon-components-svelte";
   import Login from "carbon-icons-svelte/lib/Login.svelte";

docs/src/pages/components/ClickableTile.svx

@@ -1,7 +1,3 @@
----
-source: Tile/ClickableTile.svelte
----
-
 <script>
   import { ClickableTile } from "carbon-components-svelte";
   import Preview from "../../components/Preview.svelte";

docs/src/pages/components/ExpandableTile.svx

@@ -1,7 +1,3 @@
----
-source: Tile/ExpandableTile.svelte
----
-
 <script>
   import { ExpandableTile, Button } from "carbon-components-svelte";
   import Preview from "../../components/Preview.svelte";

docs/src/pages/components/InlineNotification.svx

@@ -1,6 +1,5 @@
 ---
 components: ["InlineNotification", "NotificationActionButton"]
-source: Notification/InlineNotification.svelte
 ---
 
 <script>

docs/src/pages/components/PasswordInput.svx

@@ -1,7 +1,3 @@
----
-source: TextInput/PasswordInput.svelte
----
-
 <script>
   import { PasswordInput } from "carbon-components-svelte";
   import Preview from "../../components/Preview.svelte";

docs/src/pages/components/RadioTile.svx

@@ -1,6 +1,5 @@
 ---
 components: ["TileGroup", "RadioTile"]
-source: Tile/RadioTile.svelte
 ---
 
 <script>

docs/src/pages/components/SelectableTile.svx

@@ -1,6 +1,5 @@
 ---
 components: ["SelectableTile"]
-source: Tile/SelectableTile.svelte
 ---
 
 <script>

docs/src/pages/components/Tile.svx

@@ -1,7 +1,3 @@
----
-source: Tile/Tile.svelte
----
-
 <script>
   import { Tile } from "carbon-components-svelte";
   import Preview from "../../components/Preview.svelte";

docs/src/pages/components/ToastNotification.svx

@@ -1,7 +1,3 @@
----
-source: Notification/ToastNotification.svelte
----
-
 <script>
   import { ToastNotification } from "carbon-components-svelte";
   import Preview from "../../components/Preview.svelte";