Merge branch 'feature/test' into feature/multiple-endpoint-types

Author: Mini-ghost

.github/ISSUE_TEMPLATE/---bug-report.md

@@ -0,0 +1,36 @@
+---
+name: "\U0001F41B Bug report"
+about: "If something isn't working \U0001F915"
+title: ''
+labels: bug
+assignees: hunterliu1003
+
+---
+
+<!-- **IMPORTANT!**
+Before reporting a bug, please make sure that you have read through our documentation and you think your problem is indeed an issue related to our module. -->
+
+### Version
+
+vue-final-modal: <!-- ex: v0.19.0 -->
+vue: <!-- ex: v2.6.12 -->
+nuxt: <!-- ex: v2.12.0 -->
+
+### OS
+
+Mac or Windows
+
+### Reproduction Link
+<!--
+A minimal test case based on one of:
+- a fork of https://codesandbox.io/s/nuxtcontent-demo-l164h
+- a GitHub repository that can reproduce the bug
+-->
+
+### Steps to reproduce
+
+
+### What is Expected?
+
+
+### What is actually happening?

.github/ISSUE_TEMPLATE/---feature-request.md

@@ -0,0 +1,20 @@
+---
+name: "\U0001F680 Feature request"
+about: "Let us know if you have a feature request \U0001F4A1"
+title: ''
+labels: enhancement
+assignees: hunterliu1003
+
+---
+
+### Is your feature request related to a problem? Please describe.
+<!-- A clear and concise description of what the problem is. Ex. I'm always frustrated when [...] -->
+
+### Describe the solution you'd like
+<!-- A clear and concise description of what you want to happen. -->
+
+### Describe alternatives you've considered
+<!-- A clear and concise description of any alternative solutions or features you've considered. -->
+
+### Additional context
+<!-- Add any other context or screenshots about the feature request here. -->

.github/ISSUE_TEMPLATE/---say-thank-you.md

@@ -0,0 +1,23 @@
+---
+name: "❤️ Say thank you"
+about: Tell us how you use vue-final-modal & support our efforts in maintaining vue-final-modal
+title: ''
+labels: ''
+assignees: hunterliu1003
+
+---
+
+# ❤️ I'm using **`vue-final-modal`**
+
+If you (or your company) are using  **`vue-final-modal`** - please let us know. We'd love to hear from you!
+
+ **`vue-final-modal`** is a community driven project, which means it's not maintained by a company. If you would like to help `vue-final-modal` - any of the following is greatly appreciated.
+
+- [ ] Give the repository a star ⭐️
+- [ ] Help out with issues
+- [ ] Review pull requests
+- [ ] Blog about vue-final-modal
+- [ ] Make tutorials
+- [ ] Give talks
+
+Thank you! 💐

.github/ISSUE_TEMPLATE/-question.md

@@ -0,0 +1,12 @@
+---
+name: "❓Question"
+about: Ask a question about vue-final-modal
+title: ''
+labels: question
+assignees: hunterliu1003
+
+---
+
+<!-- **IMPORTANT!**
+Please make sure to look for an answer to your question in our documentation and the documentation before asking a question here.
+-->

README.md

@@ -30,7 +30,8 @@ Looking for a Vue 3 version? [It's over here](https://github.com/hunterliu1003/v
 
 ## Introduction
 
-`Vue Final Modal` is a renderless component<br />
+### **Vue Final Modal** is a **renderless component**!
+
 You can create a [higher-order component](https://vue-final-modal.org/examples/recommended-use) easily and can customize `template`, `script` and `style` based on your needs.
 
 features:
@@ -199,11 +200,29 @@ You can use:
 
 All modal instances include show and hide.
 
-### `$vfm.show(name)`
+### `$vfm.show(name, params)`
 
 - Type: `Function`
 - Arguments:
   - name: `String` - Name of the modal
+  - params: `?: object` - Any data that you would want to pass into the modal (@before-open event handler will contain `params` in the event). You can also using scoped-slot to get `params` in template:
+
+```html
+<template v-slot="{ params }">
+  <!-- modal content -->
+</template>
+```
+
+Or get `params` on `@beforeOpen` event:
+
+```html
+<vue-final-modal @beforeOpen="e => e.ref.params">
+  <!-- modal content -->
+</vue-final-modal>
+```
+
+> `parmas` will be reset to `{}` automatically after `closed` event. You can avoid the modal to reset the `params` to empty object by calling `event.stop()`.
+
 - Example:
 
 ```html
@@ -253,12 +272,29 @@ export default {
 
 hide all modals.
 
-### `$vfm.toggle(name, show)`
+### `$vfm.toggle(name, show, params)`
 
 - Type: `Function`
 - Arguments:
   - name: `String` - Name of the modal
-  - show: `Boolean` - Show modal or not
+  - show: `?: Boolean` - Show modal or not
+  - params: `?: object` - Any data that you would want to pass into the modal (@before-open event handler will contain params in the event). You can also using scoped-slot to get `params` in template:
+
+```html
+<template v-slot="{ params }">
+  <!-- modal content -->
+</template>
+```
+
+Or get `params` on `@beforeOpen` event:
+
+```html
+<vue-final-modal @beforeOpen="e => e.ref.params">
+  <!-- modal content -->
+</vue-final-modal>
+```
+
+> `parmas` will be reset to `{}` automatically after `closed` event. You can avoid the modal to reset the `params` to empty object by calling `event.stop()`.
 
 toggle modal by name.
 
@@ -277,12 +313,14 @@ toggle modal by name.
   lockScroll: { type: Boolean, default: true },
   hideOverlay: { type: Boolean, default: false },
   clickToClose: { type: Boolean, default: true },
+  escToClose: { type: Boolean, default: false },
   preventClick: { type: Boolean, default: false },
   attach: { type: null, default: false, validator: validateAttachTarget },
   transition: { type: String, default: 'vfm' },
   overlayTransition: { type: String, default: 'vfm' },
   zIndexBase: { type: [String, Number], default: 1000 },
   zIndex: { type: [Boolean, String, Number], default: false },
+  focusRetain: { type: Boolean, default: true },
   focusTrap: { type: Boolean, default: false }
 }
 ```
@@ -297,20 +335,59 @@ toggle modal by name.
 
 ### `@before-open`
 
-- Emits while modal is still invisible, but before transition starting.
+- Emits while modal is still invisible, but before transition starting. Further opening of the modal can be blocked from this event listener by calling `event.stop()`.
 
 ### `@opened`
 
 - Emits after modal became visible and transition ended.
 
 ### `@before-close`
 
-- Emits before modal is going to be closed.
+- Emits before modal is going to be closed. Further closing of the modal can be blocked from this event listener by calling `event.stop()`.
 
 ### `@closed`
 
-- Emits right before modal is destroyed.
+- Emits right before modal is destroyed. Further after the modal was closed, you can avoid the modal to reset the `params` to empty object by calling `event.stop()`.
+
+## **Slots**
+
+If you open a modal though API `show(name, params)`, You can using scoped-slot to get `params` in template:
+
+```html
+<template v-slot="{ params }">
+  <!-- modal content -->
+</template>
+```
+
+Or get `params` on `@beforeOpen` event:
+
+```html
+<vue-final-modal @beforeOpen="e => e.ref.params">
+  <!-- modal content -->
+</vue-final-modal>
+```
+
+> `parmas` will be reset to `{}` automatically after `closed` event. You can avoid the modal to reset the `params` to empty object by calling `event.stop()`.
+
+## **Contribution**
+
+👋 Hi I'm Hunter, the author of `vue-final-modal`. 
+
+To develop vue-final-modal, I learn a lot from these awesome libraries:
+
+- [Vuetify](https://vuetifyjs.com/en/)
+  - attach
+- [Element UI](https://element.eleme.io/)
+  - stackable modal
+  - zIndex
+  - zIndexBase
+- [vue-js-modal](https://github.com/euvl/vue-js-modal)
+  - dynamic modal
+  - transition
+  - focusTrap for A11y
+- [Bootstrap Vue](https://bootstrap-vue.org/)
+  - lockScroll
 
-## Contribution
+> There is no perfect library even the `final` of vue modal. 
 
 If you have any ideas for optimization of `vue-final-modal`, feel free to open [issues](https://github.com/hunterliu1003/vue-final-modal/issues) or [pull requests](https://github.com/hunterliu1003/vue-final-modal/pulls).