Fixing bugs and docs issues

docs/src/components/breadcrumb.njk

@@ -32,7 +32,7 @@ toc:
       trigger_attrs={"class": "flex size-9 items-center justify-center h-4 w-4 hover:text-foreground cursor-pointer"}
     ) %}
       <nav role="menu">
-        <button type="button" role="menuitem" onclick="console.log('Documentation')">Documentation</button>
+        <button type="button" role="menuitem">Documentation</button>
         <button type="button" role="menuitem">Themes</button>
         <button type="button" role="menuitem">GitHub</button>
       </nav>

docs/src/components/chart.njk

@@ -575,7 +575,7 @@ const formatDateLabel = (dateString) => {
   try {
     const date = new Date(dateString + 'T00:00:00');
     return date.toLocaleDateString('en-US', { month: 'short', day: 'numeric' }); // e.g., "Apr 1"
-  } catch (e) {
+  } catch (event) {
     return dateString; // Fallback
   }
 };

docs/src/components/sidebar.njk

@@ -32,7 +32,7 @@ toc:
   <p>You can either <a href="/installation/#install-cdn-all">include the JavaScript file for all the components</a>, or just the one for this component by adding this to the <code>&lt;head&gt;</code> of your page:</p>
 </section>
 
-{% set code_script %}<script src="https://cdn.jsdelivr.net/npm/basecoat-css@{{ site.version }}/dist/js/select.min.js" defer></script>{% endset %}
+{% set code_script %}<script src="https://cdn.jsdelivr.net/npm/basecoat-css@{{ site.version }}/dist/js/sidebar.min.js" defer></script>{% endset %}
 {{ code_block(code_script | prettyHtml, "html") }}
 
 <div class="flex flex-wrap gap-2 my-6">
@@ -76,7 +76,7 @@ toc:
   menu=menu
 ) }}
 <main>
-  <button type="button" onclick="window.dispatchEvent(new CustomEvent('sidebar:toggle'))">Toggle sidebar</button>
+  <button type="button" onclick="window.dispatchEvent(new CustomEvent('basecoat:sidebar'))">Toggle sidebar</button>
   <h1>Content</h1>
 </main>
 {% endset %}
@@ -95,7 +95,7 @@ toc:
     </li>
   </ul>
 
-  <p>Any elememt on the page can toggle, open or close the sidebar by dispatching the <code>sidebar:toggle</code>, <code>sidebar:open</code> or <code>sidebar:close</code> events.</p>
+  <p>Any elememt on the page can toggle, open or close the sidebar by dispatching the <code>basecoat:sidebar</code>, <code>sidebar:open</code> or <code>sidebar:close</code> events.</p>
 
   <p>You can include the JavaScript code provided below, load it as an individual file or use the CLI. Some Alpine.js properties are also required on certain elements (e.g. <code class="text-xs">x-bind</code>, <code class="text-xs">x-data</code>, <code class="text-xs">@click</code>).</p>
 </section>

docs/src/components/toast.njk

@@ -94,6 +94,10 @@ toc:
 {% set code_toaster %}<div id="toaster" class="toaster"></div>{% endset %}
 {{ code_block(code_toaster | prettyHtml, "html") }}
 
+<section class="prose">
+  <p>You can set up the alignment of the toaster using the <code>data-align</code> attribute: <code>start</code>, <code>center</code>, or <code>end</code> (default to <code>end</code>).</p>
+</section>
+
 <h4 id="usage-html-js-3"><a href="#usage-html-js-3">Step 3: Add your toasts</a></h4>
 
 <section class="prose">
@@ -248,7 +252,7 @@ toc:
 {{ toast(
   title="Event has been created",
   description="Sunday, December 03, 2023 at 9:00 AM",
-  cancel={ label: "Undo", click: "close()" }
+  cancel={ label: "Undo" }
 ) }}{% endraw %}{% endset %}
 
 {% from "tabs.njk" import tabs %}