Chore(docs): regroup docs

Author: Godofbrowser

docs/.vuepress/config.js

@@ -24,25 +24,11 @@ export default defineUserConfig({
         // }),
     ],
     theme: defaultTheme({
-        docsDir: '/docs/content',
         sidebar: [
-            {
-                text: 'Getting started',
-                collapsible: false,
-                link:  '/',
-                children: [
-                    '/README.md'
-                ]
-            },
-            '/content/features/README.md',
-            {
-                text: 'Advanced',
-                collapsible: false,
-                link:  '/content/customization/README.md',
-                children: [
-                    '/content/customization/README.md'
-                ]
-            }
+            '/index.md',
+            '/features.md',
+            '/digging-deeper.md',
+            '/example-use-cases.md',
         ]
     }),
 })

docs/content/customization/README.md

@@ -0,0 +1,8 @@
+# Digging deeper
+
+## Options
+### Custom Class
+### loader
+
+## Custom component
+

docs/digging-deeper.md

@@ -0,0 +1,13 @@
+# Example use cases
+Below are some practical example use cases that you may find useful.
+
+## Quick alert after an event occurs
+
+
+## Confirming CRUD operations
+
+
+## Confirming link clicks
+
+
+## Confirming form reset/submit

docs/example-use-cases.md

@@ -4,7 +4,7 @@
 An alert dialog can be triggered using the `$dialog.alert()` method. This method returns a promise which resolves when the dialog is dismissed.
 
 <UIExamplesWrapper><FeaturesExampleAlert /></UIExamplesWrapper>
-@[code](../../components/examples/FeaturesExampleAlert.vue)
+@[code](components/examples/FeaturesExampleAlert.vue)
 
 
 
@@ -15,29 +15,29 @@ In this section we shall explore how to create a basic confirm dialog as well as
 
 ### Basic confirm dialog
 <UIExamplesWrapper><FeaturesExampleConfirm /></UIExamplesWrapper>
-@[code](../../components/examples/FeaturesExampleConfirm.vue)
+@[code](components/examples/FeaturesExampleConfirm.vue)
 
 
 ### Soft confirm dialog
 <UIExamplesWrapper><FeaturesExampleConfirmSoft /></UIExamplesWrapper>
-@[code](../../components/examples/FeaturesExampleConfirmSoft.vue)
+@[code](components/examples/FeaturesExampleConfirmSoft.vue)
 
 
 ### Hard confirm dialog
 <UIExamplesWrapper><FeaturesExampleConfirmHard /></UIExamplesWrapper>
-@[code](../../components/examples/FeaturesExampleConfirmHard.vue)
+@[code](components/examples/FeaturesExampleConfirmHard.vue)
 
 
 ## Prompt
 The `$dialog.prompt()` method creates a prompt dialog. Use the prompt dialog to ask user directly for input.
 
 <UIExamplesWrapper><FeaturesExamplePrompt /></UIExamplesWrapper>
-@[code](../../components/examples/FeaturesExamplePrompt.vue)
+@[code](components/examples/FeaturesExamplePrompt.vue)
 
 
 
 ## Confirm directive
 Add the `v-confirm` directive to any element to instantly cause it to trigger a confirm dialog. This dialog upon confirmation will trigger the default action or the provided callback when available.
 
 <UIExamplesWrapper><FeaturesExampleDirective /></UIExamplesWrapper>
-@[code](../../components/examples/FeaturesExampleDirective.vue)
+@[code](components/examples/FeaturesExampleDirective.vue)

docs/content/features/README.md renamed to docs/features.md

@@ -96,8 +96,8 @@ export default {
 </template>
 <script setup>
     import {inject} from "vue";
-    const dialog = inject('$dialog')
-    const openDialog = () => dialog.alert('Hello world!')
+    const $dialog = inject('$dialog')
+    const openDialog = () => $dialog.alert('Hello world!')
     return { openDialog }
 </script>
 ```
@@ -108,24 +108,3 @@ export default {
     <button v-confirm="'Hello world!'">Open dialog</button>
 </template>
 ```
-
-## Example use cases
-Below are some practical example use cases that you may find useful.
-
-### Quick alert after an event occurs
-
-
-### Confirming CRUD operations
-
-
-### Confirming link clicks
-
-
-### Confirming form submission
-
-One plus one equals: {{ 1 + 1 }}
-
-<span v-for="i in 3"> span: {{ i }} </span>
-
-<button class="dg-btn" v-confirm="'Please confirm!'">Click Directive</button>
-