From d578f6335028e4a53a54c51f57b4f67a3b67330f Mon Sep 17 00:00:00 2001
From: Cory LaViska <cory@abeautifulsite.net>
Date: Wed, 6 Jan 2021 12:59:36 -0500
Subject: [PATCH] Show dependencies not dependents

---
 docs/assets/plugins/metadata/metadata.js | 24 ++++++++++++++++++++----
 docs/getting-started/changelog.md        |  1 +
 2 files changed, 21 insertions(+), 4 deletions(-)

diff --git a/docs/assets/plugins/metadata/metadata.js b/docs/assets/plugins/metadata/metadata.js
index 774b06de5..aa44de7d9 100644
--- a/docs/assets/plugins/metadata/metadata.js
+++ b/docs/assets/plugins/metadata/metadata.js
@@ -175,6 +175,21 @@
     return table.outerHTML;
   }
 
+  function createDependenciesList(dependencies) {
+    const ul = document.createElement('ul');
+    ul.innerHTML = `
+        ${dependencies
+          .map(
+            dependency => `
+              <li><code>${escapeHtml(dependency)}</code></li>
+            `
+          )
+          .join('')}
+    `;
+
+    return ul.outerHTML;
+  }
+
   function createDependentsList(dependents) {
     const ul = document.createElement('ul');
     ul.innerHTML = `
@@ -362,13 +377,14 @@
           `;
         }
 
-        if (data.dependents.length) {
+        if (data.dependencies.length) {
           result += `
-            ## Dependents
+            ## Dependencies
 
-            The following components make use of this component.
+            This component has the following dependencies. If you're not using the lazy loader, be sure to import and
+            register these components in addition to <code>${tag}</code>.
 
-            ${createDependentsList(data.dependents)}
+            ${createDependenciesList(data.dependencies)}
           `;
         }
 
diff --git a/docs/getting-started/changelog.md b/docs/getting-started/changelog.md
index 6a9052809..a44c4a75f 100644
--- a/docs/getting-started/changelog.md
+++ b/docs/getting-started/changelog.md
@@ -16,6 +16,7 @@ _During the beta period, these restrictions may be relaxed in the event of a mis
 - Fixed a bug where `sl-hide` would be emitted twice when closing an alert with `hide()`
 - Fixed a bug in `sl-color-picker` where the toggle button was smaller than the preview button in Safari
 - Fixed a bug in `sl-tab-group` where activating a nested tab group didn't work properly [#299](https://github.com/shoelace-style/shoelace/issues/299)
+- Updated the docs to show dependencies instead of dependents which is much more useful when working with the custom elements bundle
 
 ## 2.0.0-beta.25