From 2abd47647b1da8a4176ee45818ef7b44f2030347 Mon Sep 17 00:00:00 2001
From: spwoodcock <sam.woodcock@protonmail.com>
Date: Fri, 31 May 2024 16:23:34 +0100
Subject: [PATCH] docs: add separate examples page

---
 docs/components/hot-button.md   | 17 -----------------
 docs/components/hot-toolbar.md  |  8 --------
 docs/components/hot-tracking.md |  1 +
 docs/examples.md                | 28 ++++++++++++++++++++++++++++
 mkdocs.yml                      |  1 +
 5 files changed, 30 insertions(+), 25 deletions(-)
 create mode 100644 docs/examples.md

diff --git a/docs/components/hot-button.md b/docs/components/hot-button.md
index b446f32..236f634 100644
--- a/docs/components/hot-button.md
+++ b/docs/components/hot-button.md
@@ -13,20 +13,3 @@
 | Event   |
 |---------|
 | `click` |
-
-## Example
-
-<!-- markdownlint-disable -->
-
-<hot-button id="hotButton">Click Me!</hot-button>
-<script>
-  const button = document.getElementById('hotButton');
-
-  button.addEventListener('click', () => {
-    alert('Button Clicked!');
-  });
-</script>
-
-<br>
-
-<!-- markdownlint-enable -->
diff --git a/docs/components/hot-toolbar.md b/docs/components/hot-toolbar.md
index d8172e3..37a70ec 100644
--- a/docs/components/hot-toolbar.md
+++ b/docs/components/hot-toolbar.md
@@ -19,11 +19,3 @@
 | `hot-rightalign-click`  |
 | `hot-underline-click`   |
 | `hot-undo-click`        |
-
-## Example
-
-<!-- markdownlint-disable -->
-
-<hot-toolbar></hot-toolbar>
-
-<!-- markdownlint-enable -->
diff --git a/docs/components/hot-tracking.md b/docs/components/hot-tracking.md
index 77b68ab..c384644 100644
--- a/docs/components/hot-tracking.md
+++ b/docs/components/hot-tracking.md
@@ -5,6 +5,7 @@
 | Property | Attribute | Type      | Default        | Description                      |
 |----------|-----------|-----------|----------------|----------------------------------|
 | `domain` | `domain`  | `string`  | ""             | The domains to apply tracking.   |
+| `force`  | `force`   | `boolean` | false          | Force display the banner.        |
 | `isOpen` |           | `boolean` | true           |                                  |
 | `name`   | `name`    | `string`  | "hot-tracking" |                                  |
 | `siteId` | `site-id` | `string`  | ""             | The Matomo site id for tracking. |
diff --git a/docs/examples.md b/docs/examples.md
new file mode 100644
index 0000000..235bfb2
--- /dev/null
+++ b/docs/examples.md
@@ -0,0 +1,28 @@
+# Component Examples
+
+As web components can be rendered in HTML / Markdown, here are some examples.
+
+## Button
+
+<!-- markdownlint-disable -->
+
+<hot-button id="hotButton">Click Me!</hot-button>
+<script>
+  const button = document.getElementById('hotButton');
+
+  button.addEventListener('click', () => {
+    alert('Button Clicked!');
+  });
+</script>
+
+<br>
+
+<!-- markdownlint-enable -->
+
+## Toolbar
+
+<!-- markdownlint-disable -->
+
+<hot-toolbar></hot-toolbar>
+
+<!-- markdownlint-enable -->
diff --git a/mkdocs.yml b/mkdocs.yml
index 875257f..06fb0d6 100644
--- a/mkdocs.yml
+++ b/mkdocs.yml
@@ -65,6 +65,7 @@ nav:
       - Header: components/hot-header.md
       - Toolbar: components/hot-toolbar.md
       - Tracking: components/hot-tracking.md
+  - Examples: examples.md
   - Storybook: storybook.md
   - License: LICENSE.md
   - Changelog: CHANGELOG.md