Socket
Socket
Sign inDemoInstall

@mekari/pixel-portal

Package Overview
Dependencies
Maintainers
4
Versions
12
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@mekari/pixel-portal - npm Package Compare versions

Comparing version 0.0.7 to 0.0.8

8

dist/mekari-pixel-portal.cjs.dev.js

@@ -45,6 +45,6 @@ 'use strict';

/**
* @description Creates portal target node. If node doesn't exist, it is created and returned
* @param {String} target
* @returns {HTMLElement}
*/
* @description Creates portal target node. If node doesn't exist, it is created and returned
* @param {String} target
* @returns {HTMLElement}
*/
createPortalTarget(target, tag) {

@@ -51,0 +51,0 @@ if (!pixelUtils.canUseDOM) {

@@ -45,6 +45,6 @@ 'use strict';

/**
* @description Creates portal target node. If node doesn't exist, it is created and returned
* @param {String} target
* @returns {HTMLElement}
*/
* @description Creates portal target node. If node doesn't exist, it is created and returned
* @param {String} target
* @returns {HTMLElement}
*/
createPortalTarget(target, tag) {

@@ -51,0 +51,0 @@ if (!pixelUtils.canUseDOM) {

@@ -41,6 +41,6 @@ import { MountingPortal } from 'portal-vue';

/**
* @description Creates portal target node. If node doesn't exist, it is created and returned
* @param {String} target
* @returns {HTMLElement}
*/
* @description Creates portal target node. If node doesn't exist, it is created and returned
* @param {String} target
* @returns {HTMLElement}
*/
createPortalTarget(target, tag) {

@@ -47,0 +47,0 @@ if (!canUseDOM) {

{
"name": "@mekari/pixel-portal",
"version": "0.0.7",
"version": "0.0.8",
"description": "Mekari Pixel | Portal component",

@@ -27,4 +27,4 @@ "homepage": "https://mekari.design/",

"dependencies": {
"@mekari/pixel-no-ssr": "^0.0.7",
"@mekari/pixel-utils": "^0.1.0",
"@mekari/pixel-no-ssr": "^0.0.8",
"@mekari/pixel-utils": "^0.2.0",
"portal-vue": "^2.1.7"

@@ -47,2 +47,2 @@ },

}
}
}

@@ -11,2 +11,2 @@ # @mekari/pixel-portal

npm i @mekari/pixel-portal
```
```

@@ -22,3 +22,3 @@ import { MountingPortal } from 'portal-vue'

},
data () {
data() {
return {

@@ -29,8 +29,9 @@ portalTarget: undefined,

},
created () {
created() {
if (!this.disabled) {
this.mountTarget()
this.unmountOnDestroy && this.$once('hook:destroyed', () => {
canUseDOM && document.body.removeChild(this.portalTarget)
})
this.unmountOnDestroy &&
this.$once('hook:destroyed', () => {
canUseDOM && document.body.removeChild(this.portalTarget)
})
}

@@ -40,7 +41,7 @@ },

/**
* @description Creates portal target node. If node doesn't exist, it is created and returned
* @param {String} target
* @returns {HTMLElement}
*/
createPortalTarget (target, tag) {
* @description Creates portal target node. If node doesn't exist, it is created and returned
* @param {String} target
* @returns {HTMLElement}
*/
createPortalTarget(target, tag) {
if (!canUseDOM) {

@@ -68,3 +69,3 @@ return

},
mountTarget () {
mountTarget() {
if (!canUseDOM) {

@@ -82,27 +83,33 @@ return

},
unmountTarget () {
unmountTarget() {
if (!this.disabled) {
(canUseDOM && this.portalTarget.isConnected) && document.body.removeChild(this.portalTarget)
canUseDOM && this.portalTarget.isConnected && document.body.removeChild(this.portalTarget)
}
}
},
render (h) {
render(h) {
const children = this.$slots.default
return !this.disabled ? h(MpNoSsr, [
h(MountingPortal, {
props: {
append: this.append,
mountTo: `#${this.targetId}`,
disabled: this.disabled,
name: this.name,
order: this.order,
slim: this.slim,
bail: this.bail,
targetSlim: this.targetSlim
},
attrs: {
'data-pixel-component': 'MpPortal'
}
}, children)
]) : children[0]
return !this.disabled
? h(MpNoSsr, [
h(
MountingPortal,
{
props: {
append: this.append,
mountTo: `#${this.targetId}`,
disabled: this.disabled,
name: this.name,
order: this.order,
slim: this.slim,
bail: this.bail,
targetSlim: this.targetSlim
},
attrs: {
'data-pixel-component': 'MpPortal'
}
},
children
)
])
: children[0]
}

@@ -109,0 +116,0 @@ }

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc