From f7dbdfff69a358cf9ff1217a74eebc4243f9d58c Mon Sep 17 00:00:00 2001
From: Ken Kieu <minhcanhdn0704@gmail.com>
Date: Tue, 26 Nov 2024 00:14:51 -0800
Subject: [PATCH] Update guide

---
 README.md | 219 +-----------------------------------------------------
 1 file changed, 4 insertions(+), 215 deletions(-)

diff --git a/README.md b/README.md
index 88db55e..ceb7205 100644
--- a/README.md
+++ b/README.md
@@ -1,4 +1,4 @@
-# Vuetify Notifier
+# Vuetify Notifier Nuxt Module
 
 ![image](https://user-images.githubusercontent.com/136077/230705147-849714e2-a50b-4118-9100-f14d6a82d2e9.png)
 
@@ -9,225 +9,14 @@ Vuetify Notifier is a Vue 3 plugin that simplifies the process of displaying not
 </h2>
 
 ## Installation
-
-```sh
-$ npm install -D vuetify-notifier
-or
-$ yarn add -D vuetify-notifier
-```
-
-## Setup
-
-### Vue 3 | Vite
-
-#### **`main.js|ts`**
-
-```js
-import { createApp } from 'vue'
-import App from './App.vue'
-import { createVuetify } from 'vuetify'
-
-import { VuetifyNotifier } from 'vuetify-notifier'
-
-import { VOverlay, VDialog } from 'vuetify/components'
-
-const vuetify = createVuetify({
-  components: { VOverlay, VDialog },
-})
-
-/**
- * You can do manually import the components you are using.
- * https://vuetifyjs.com/en/features/treeshaking/#manual-imports
- */
-
-// const vuetify = createVuetify({
-//   components: {
-//     VDefaultsProvider,
-//     VDialog,
-//     VCard,content.
-//     VToolbar,
-//     VBtn,
-//     VIcon,
-//   },
-//   ...
-// })
-
-const app = createApp(App)
-app.use(vuetify)
-
-app.use(VuetifyNotifier, {
-  default: {
-    defaultColor: 'primary', //default color for all notifications
-    closeIcon: 'mdi-close', //default close icon for component
-  },
-})
-
-app.mount('#app')
-```
-
-## Nuxt
-
-#### **`nuxt.config.js|ts`**
-
-```javascript
-export default defineNuxtConfig({
-   ...
-   modules: [
-      'vuetify-notifier/nuxt'
-   ],
-   notifier:{
-      default:{
-         ...
-      }
-   }
-   ...
-})
-```
-
-## Usage
-
-### Vue 3 | Vite
-
-```javascript
-<script setup>
-import { useNotifier } from "vuetify-notifier";
-
-const notifier = useNotifier();
-
-const onLogin = async () => {
-  await login();
-  notifier.toast({text: "Login Success", status: "success" });
-};
-</script>
 ```
-
-### Nuxt
-
-```javascript
-<script setup>
-const notifier = useNotifier();
-//or
-const notifier = useNuxtApp();
-
-const onLogin = async () => {
-  await login();
-  notifier.toast({text: "Login Success", status: "success" });
-};
-</script>
+$ npx nuxi@latest module add vuetify-notifier-nuxt-module
 ```
 
-## API
-
-### Options
-
-### Methods
-
-The plugin adds notifier to the Vue instance, which provides the following methods:
-
-**Confirm**
-
-- toast
-- confirm
-- prompt
-- alert
-- component
-
-### Options
-
-Options for each method can be customized by providing an object as the last argument. You can configure default options globally for dialogs, toasts, and components
-** Options **
-
-```typescript
-export const defaultOptions: NotifierOptions = {
-  default: {
-    defaultColor: '',
-    defaultIcon: 'mdi-alert-circle',
-    successIcon: 'mdi-check-circle',
-    infoIcon: 'mdi-information',
-    warningIcon: 'mdi-alert',
-    errorIcon: 'mdi-alert-circle',
-    closeIcon: 'mdi-close',
-  },
-  dialogOptions: {
-    transition: 'dialog-bottom-transition',
-    width: 500,
-    minWidth: 300,
-    minHeight: 250,
-    textAlign: 'center',
-    primaryButtonText: 'OK',
-    secondaryButtonText: 'Cancel',
-    showDivider: true,
-    buttonProps: {
-      width: '100',
-    },
-
-    dialogProps: {}, // https://vuetifyjs.com/en/api/v-dialog)
-    cardProps: {}, // https://vuetifyjs.com/en/api/v-card)
-
-    buttonProps: {}, // https://vuetifyjs.com/en/api/v-btn)
-
-    primaryButtonProps: {}, // https://vuetifyjs.com/en/api/v-btn)
-    secondaryButtonProps: {}, // https://vuetifyjs.com/en/api/v-btn)
-
-    handleCancel: 'silent',
-    inputProps: {
-      // https://vuetifyjs.com/en/api/v-text-field/
-      label: 'Input',
-    },
-  },
-  toastOptions: {
-    toastProps: {
-      // https://vuetifyjs.com/en/api/v-snackbar/
-      transition: 'v-scroll-x-transition',
-      location: 'top right',
-    },
-  },
-  componentOptions: {
-    existsButton: true,
-  },
-}
+Please install vuetify-nuxt-module if you're not install.
 ```
-
-**Basic Examples**
-
-```javascript
-notifier
-  .confirm({
-    text: 'Are you sure you want to delete this item?',
-  })
-  .then((result) => {
-    if (result) {
-      // Delete the item
-    }
-  })
-
-notifier.prompt({ text: 'Input your name' }).then((name) => {
-  console.log('User entered name:', name)
-})
+$ npx nuxi@latest module add vuetify-nuxt-module 
 ```
 
-**Super Advance Examples**
-
-```javascript
-import HelloWorld from './components/HelloWorld.vue';
-
-notifier.component({title: "Component Title", component: HelloWorld}).then((result) => {
-  console.log(result);
-});
-
-notifier.component({
-  title: "Component Title",
-  component:'global-component-name'
-}).then((result) => {
-  console.log(result);
-});
-
-// In your component. Please emit the event 'onSubmit' or 'onClose' to close the dialog
-<v-btn @click="$emit('onSubmit', 'Submit value')">Submit</v-btn>
-<v-btn @click="$emit('onCancel', 'Cancel value')">Cancel</v-btn>
-
-```
 
-## License
 
-### MIT License