diff --git a/docs/modules/README.md b/docs/modules/README.md index f4114b0..63e1ee3 100644 --- a/docs/modules/README.md +++ b/docs/modules/README.md @@ -63,6 +63,7 @@ ESLint plugin. - [`object-hash`](./object-hash.md) - [`ora`](./ora.md) - [`path-exists`](./path-exists.md) +- [`portal-vue`](./portal-vue.md) - [`pkg-dir`](./pkg-dir.md) - [`qs`](./qs.md) - [`read-pkg`](./read-pkg.md) diff --git a/docs/modules/portal-vue.md b/docs/modules/portal-vue.md new file mode 100644 index 0000000..fbd75ff --- /dev/null +++ b/docs/modules/portal-vue.md @@ -0,0 +1,28 @@ +--- +description: Modern alternatives to the `portal-vue` package for making portals in Vue applications +--- + +# Replacements for `portal-vue` + +## Vue `Teleport` API + +Since Vue 3, the [Teleport](https://vuejs.org/guide/built-ins/teleport.html) component has been introduced which replaces portal-vue for most use cases, especially modals and overlays. + +`` only moves DOM nodes to an existing target — it does not manage destinations, layouts, or component structure. + +```html + +
+

Vue Teleport Example

+
+ +
+
+``` + +```html + + +

The content inside of Teleport will render in html body

+
+``` diff --git a/manifests/preferred.json b/manifests/preferred.json index eaa7abc..213c03e 100644 --- a/manifests/preferred.json +++ b/manifests/preferred.json @@ -2280,6 +2280,12 @@ "docPath": "find-up", "category": "preferred" }, + { + "type": "documented", + "moduleName": "portal-vue", + "docPath": "portal-vue", + "category": "preferred" + }, { "type": "documented", "moduleName": "q",