diff --git a/docs/index.html b/docs/index.html
index 4c2df43..ad60453 100644
--- a/docs/index.html
+++ b/docs/index.html
@@ -70,14 +70,16 @@
           <a href="?page=developing-extensions/Importing-$blueprint"><button type="button" class="btn btn-dark btn-sm text-start" style="--bs-btn-padding-y: .1rem;">Importing $blueprint</button><br></a>
           <a href="?page=developing-extensions/Admin-configuration"><button type="button" class="btn btn-dark btn-sm text-start" style="--bs-btn-padding-y: .1rem;">Admin configuration</button><br></a>
           <a href="?page=developing-extensions/Dashboard-modifications"><button type="button" class="btn btn-dark btn-sm text-start" style="--bs-btn-padding-y: .1rem;">Dashboard modifications</button><br></a>
+          <a href="?page=developing-extensions/React-components"><button type="button" class="btn btn-dark btn-sm text-start" style="--bs-btn-padding-y: .1rem;">React components</button><br></a>
           <a href="?page=developing-extensions/Packaging-extensions"><button type="button" class="btn btn-dark btn-sm text-start" style="--bs-btn-padding-y: .1rem;">Packaging extensions</button><br></a>
         </div>
         <div class="docs-category pb-4">
           <div class="ms-2"><span class="fw-bolder">Documentation</span><br></div>
           <a href="?page=documentation/$blueprint"><button type="button" class="btn btn-dark btn-sm text-start" style="--bs-btn-padding-y: .1rem;">$blueprint</button><br></a>
           <a href="?page=documentation/confyml"><button type="button" class="btn btn-dark btn-sm text-start" style="--bs-btn-padding-y: .1rem;">conf.yml</button><br></a>
-          <a href="?page=documentation/placeholders"><button type="button" class="btn btn-dark btn-sm text-start" style="--bs-btn-padding-y: .1rem;">placeholders</button><br></a>
-          <a href="?page=documentation/flags"><button type="button" class="btn btn-dark btn-sm text-start" style="--bs-btn-padding-y: .1rem;">flags</button><br></a>
+          <a href="?page=documentation/componentsyml"><button type="button" class="btn btn-dark btn-sm text-start" style="--bs-btn-padding-y: .1rem;">Components.yml</button><br></a>
+          <a href="?page=documentation/placeholders"><button type="button" class="btn btn-dark btn-sm text-start" style="--bs-btn-padding-y: .1rem;">Placeholders</button><br></a>
+          <a href="?page=documentation/flags"><button type="button" class="btn btn-dark btn-sm text-start" style="--bs-btn-padding-y: .1rem;">Flags</button><br></a>
         </div>
         <div class="docs-category pb-4">
           <div class="ms-2"><span class="fw-bolder">About</span><br></div>
@@ -128,7 +130,7 @@
   <script>
   var u = new URL(window.location.href);
   var d = u.searchParams.get('page');
-  try { document.querySelector('a[href="?page='+d+'"] button').classList.add("disabled") } catch {  }
+  try { document.querySelector('a[href="?page='+d+'"] button').classList += ("disabled border border-4 text-primary-emphasis border-primary border-top-0 border-end-0 border-bottom-0 rounded-0 fw-bolder text-start") } catch {  }
   if(d) { a = './pages/'+d+'.md' } else { a = './pages/Documentation.md' }
   fetch(a)
     .then(b => {
diff --git a/docs/pages/about/changelog/alpha-NLM.md b/docs/pages/about/changelog/alpha-NLM.md
index 883b077..9f9b494 100644
--- a/docs/pages/about/changelog/alpha-NLM.md
+++ b/docs/pages/about/changelog/alpha-NLM.md
@@ -21,6 +21,9 @@
 - Speed up "Checking Dependencies" by dumping `npm ls` and just looking for the module in the `node_modules` folder.
 - Add new `-debug` command, which can be used to easily print all recent information and muted logs.
 - The `-help` command can now also be triggered by providing zero arguments to the `blueprint` CLI tool.
+- Internal placeholders `@version`, `&bp.version&` and `&bp.folder&` have been renamed to `::v` and `::f`.
+- Developers can now add components to the Pterodactyl navigation bar through React. 
+- Add GitHub sponsors section and link to Blueprint's `README.md`.
 
 <br/>
 
@@ -35,6 +38,8 @@
 - If extension script flags were present but the extension did not have given script, Blueprint would throw a weird error.
 - The debug file path defined in `lib/bash_colors.sh` was relative, which would cause an error if not ran in the Pterodactyl directory.
 - Extension file paths defined in `conf.yml` could escape the temporarily directory.
+- Onboarding admin notification was not being displayed and has now been removed.
+- Puzzle navbar button in the admin panel would normally flash upon first load with Blueprint, but didn't.
 
 <br/>
 
diff --git a/docs/pages/developing-extensions/Dashboard-modifications.md b/docs/pages/developing-extensions/Dashboard-modifications.md
index c042219..0b06e2f 100644
--- a/docs/pages/developing-extensions/Dashboard-modifications.md
+++ b/docs/pages/developing-extensions/Dashboard-modifications.md
@@ -1,5 +1,5 @@
 # Dashboard modifications
-<h4 class="fw-light">Extend the Pterodactyl client-side dashboard.</h4><br/>
+<h4 class="fw-light">Extend the Pterodactyl client-side dashboard within the Laravel blade wrapper.</h4><br/>
 
 <div class="alert alert-dark bg-body mt-3 rounded-4 border" role="alert">
   <i class="bi bi-x mb-1" style="font-size:23px; float: left;"></i>
@@ -8,5 +8,5 @@
 
 <div class="btn-group" role="group" aria-label="Navigation" style="float: right">
   <a href="?page=developing-extensions/Admin-configuration" class="btn btn-dark bg-light-subtle border-light-subtle">Previous</a>
-  <a href="?page=developing-extensions/Packaging-extensions" class="btn btn-dark bg-light-subtle border-light-subtle">Next</a>
+  <a href="?page=developing-extensions/React-components" class="btn btn-dark bg-light-subtle border-light-subtle">Next</a>
 </div>
\ No newline at end of file
diff --git a/docs/pages/developing-extensions/Packaging-extensions.md b/docs/pages/developing-extensions/Packaging-extensions.md
index a3a48e5..0aa087b 100644
--- a/docs/pages/developing-extensions/Packaging-extensions.md
+++ b/docs/pages/developing-extensions/Packaging-extensions.md
@@ -49,6 +49,6 @@ We hope you can create something that suits your needs with the export script fe
 
 
 <div class="btn-group" role="group" aria-label="Navigation" style="float: right">
-  <a href="?page=developing-extensions/Dashboard-modifications" class="btn btn-dark bg-light-subtle border-light-subtle">Previous</a>
+  <a href="?page=developing-extensions/React-components" class="btn btn-dark bg-light-subtle border-light-subtle">Previous</a>
   <button type="button" class="btn btn-dark bg-light-subtle border-light-subtle text-secondary disabled">Next</button>
 </div>
\ No newline at end of file
diff --git a/docs/pages/developing-extensions/React-components.md b/docs/pages/developing-extensions/React-components.md
new file mode 100644
index 0000000..fdae1ba
--- /dev/null
+++ b/docs/pages/developing-extensions/React-components.md
@@ -0,0 +1,12 @@
+# React components
+<h4 class="fw-light">Add your own component on specific places in the Pterodactyl panel.</h4><br/>
+
+<div class="alert alert-dark bg-body mt-3 rounded-4 border" role="alert">
+  <i class="bi bi-x mb-1" style="font-size:23px; float: left;"></i>
+  <div class="ps-3 ms-3"><b>This guide is not available yet.</b> We are working on writing a brand new set of guides, which you can contribute to <a href="https://github.com/teamblueprint/web">here</a>.</div>
+</div><br/>
+
+<div class="btn-group" role="group" aria-label="Navigation" style="float: right">
+  <a href="?page=developing-extensions/Dashboard-modifications" class="btn btn-dark bg-light-subtle border-light-subtle">Previous</a>
+  <a href="?page=developing-extensions/Packaging-extensions" class="btn btn-dark bg-light-subtle border-light-subtle">Next</a>
+</div>
\ No newline at end of file
diff --git a/docs/pages/documentation/componentsyml.md b/docs/pages/documentation/componentsyml.md
new file mode 100644
index 0000000..b36cddd
--- /dev/null
+++ b/docs/pages/documentation/componentsyml.md
@@ -0,0 +1,5 @@
+# Components.yml
+<h4 class="fw-light">Define which React components should be added on given views.</h4><br/>
+
+### **What is Components.yml?**
+While you can add React components to your extension without a `Components.yml` file, they won't be applied anywhere. `Components.yml` allows you to tell Blueprint where to apply a specific component, one or multiple different places.
\ No newline at end of file
diff --git a/docs/pages/documentation/confyml.md b/docs/pages/documentation/confyml.md
index dfc908a..b976506 100644
--- a/docs/pages/documentation/confyml.md
+++ b/docs/pages/documentation/confyml.md
@@ -60,6 +60,9 @@ Add custom css to the Pterodactyl client panel, provide the path to your .css fi
 `wrapper`\
 Path to blade code that you want to add to the Pterodactyl client dashboard layout.
 
+`components` <span class="badge text-primary-emphasis"><i class="bi bi-stars"></i> New in <b>alpha-NLM</b></span>\
+Directory with React components which can be used to integrate your extension directly with the Pterodactyl frontend.
+
 <br/>
 
 ##### data
diff --git a/docs/pages/documentation/placeholders.md b/docs/pages/documentation/placeholders.md
index fdb345c..cba729c 100644
--- a/docs/pages/documentation/placeholders.md
+++ b/docs/pages/documentation/placeholders.md
@@ -15,12 +15,12 @@ Version defined in [conf.yml](?page=documentation/confyml).
 `^#author#^`\
 Author defined in [conf.yml](?page=documentation/confyml).
 
-`^#identifier#^`\
-Identifier defined in [conf.yml](?page=documentation/confyml).
-
 `^#name#^`\
 Display name defined in [conf.yml](?page=documentation/confyml).
 
+`^#identifier#^`\
+Identifier defined in [conf.yml](?page=documentation/confyml).
+
 <br/>
 
 ##### Variable information
@@ -40,4 +40,7 @@ Information about how the extension was installed. Is "normal" when the extensio
 Blueprint version that installed/built your extension.
 
 `^#timestamp#^`\
-Timestamp of when your extension started installation, specifically the timestamp of when Blueprint started applying extension placeholders.
\ No newline at end of file
+Timestamp of when your extension started installation, specifically the timestamp of when Blueprint started applying extension placeholders.
+
+`^#componentroot#^` <span class="badge text-primary-emphasis"><i class="bi bi-stars"></i> New in <b>alpha-NLM</b></span>\
+Root path to your component directory in the format `@/blueprint/extensions/identifier`. Extension developers should refrain from using this path as a filesystem path.
\ No newline at end of file