# Vue Final Modal 4

The most powerful yet most light-weight modal library for Vue 3.

<p align="center"><a href="https://vue-final-modal.org" target="_blank" rel="noopener noreferrer"><img src="https://vue-final-modal.org/preview.png" alt="Vue Final Modal Logo"></a></p>

<p align="center">
  <a href="https://npmcharts.com/compare/vue-final-modal?minimal=true"><img src="https://badgen.net/npm/dm/vue-final-modal" alt="Downloads"></a>
  <a href="https://www.npmjs.com/package/vue-final-modal"><img src="https://img.shields.io/npm/l/vue-final-modal.svg?sanitize=true" alt="License"></a>
  <a href="https://app.netlify.com/sites/vue-final-modal/deploys"><img src="https://api.netlify.com/api/v1/badges/444b13a8-540f-4438-94da-80c865c8f103/deploy-status" alt="Netlify Status"></a>
</p>
<p align="center">
  <a href="https://www.npmjs.com/package/vue-final-modal"><img src="https://badgen.net/npm/v/vue-final-modal/latest" alt="Version"></a>
</p>

<p align="right">
  <a href="https://www.buymeacoffee.com/PL2qJIx" target="_blank" rel="noopener noreferrer">
    <img width="200" src="https://cdn.buymeacoffee.com/buttons/v2/default-green.png" alt="Buy Me A Coffee" />
  </a>
</p>

## Playground

- [Stackblitz for Vue 3](https://stackblitz.com/github/vue-final/vue-final-modal/tree/master/examples/vue3)
- [Stackblitz for Nuxt 3](https://stackblitz.com/github/vue-final/vue-final-modal/tree/master/examples/nuxt3)

## [Documentation](https://v4.vue-final-modal.org/)

Checkout [Migration guide from v3](https://v4.vue-final-modal.org/get-started/migration/from-v3).

Looking for old version?

- [vue-final-modal@3.x for Vue 3](https://v3.vue-final-modal.org/)
- [vue-final-modal@2.x for Vue 2](https://v2.vue-final-modal.org/)

## Contribution Guide

```bash [pnpm]
# Install packages
pnpm install --shamefully-hoist

# Build vue-final-modal library first
pnpm build:vfm

# Run both docs and viteplay
pnpm dev

# Run docs: http://localhost:3000/
pnpm dev:docs

# Run viteplay: http://localhost:5173/
pnpm dev:viteplay
```

## Contributors

Thank you to all the people who already contributed to `vue-final-modal`!

<a href="https://github.com/vue-final/vue-final-modal/graphs/contributors" aria-label="contributors">
  <img src="https://contrib.rocks/image?repo=vue-final/vue-final-modal" alt="contributors" />
</a>

Made with [contributors-img](https://contrib.rocks).

🚀 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).