
Security News
npm ‘is’ Package Hijacked in Expanding Supply Chain Attack
The ongoing npm phishing campaign escalates as attackers hijack the popular 'is' package, embedding malware in multiple versions.
github.com/euvl/vue-js-dropdown
Install:
npm install vue-js-popover --save
Import:
import Vue from 'vue'
import Popover from 'vue-js-popover'
Vue.use(Popover)
Use:
<button v-popover:foo>Toggle popover</button>
<popover name="foo">
Hello 🎉
</popover>
Or:
<button v-popover="{ name: 'foo' }">Toggle popover</button>
Plugin contains a simple wrapper for Tooltip
. To use it you will have to:
Set tooltip
flag in your main.js
:
import VPopover from 'vue-js-popover'
Vue.use(VPopover, { tooltip: true })
Include tooltip
component anywhere in the application:
<tooltip/>
Assign message to any element:
<button v-popover:tooltip="'This is a string value'">My butt0n</button>
Tooltip component is simple af - 33 lines of code (mostly declarations). It demonstrates how easily you can create new things using the provided tool.
props: {
/* Tooltip name. */
name: { type: String, required: true },
width: { type: Number, default: 180 },
/* If set - will show a tiny tip. */
pointer: { type: Boolean, default: true },
/* Name of the event which triggeres
showing/hiding of the popover.
Possible values are: 'click', 'hover'. */
event: { type: String, default: 'click' }
}
You can use .left
, .right
, .top
, .bottom
modifiers to set the position of the popover.
Example:
<button v-popover:info.right>Edit (show popover right)</button>
<button v-popover.left="{ name: 'info' }">Edit</button>
Popover components have data-popover="name"
argument that allows to apply styles to it.
Example:
<popover name="foo" :pointer="false">Bar</popover>
div[data-popover="foo"] {
background: #444;
color: #f9f9f9;
font-size: 12px;
line-height: 1.5;
margin: 5px;
}
FAQs
Unknown package
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
The ongoing npm phishing campaign escalates as attackers hijack the popular 'is' package, embedding malware in multiple versions.
Security News
A critical flaw in the popular npm form-data package could allow HTTP parameter pollution, affecting millions of projects until patched versions are adopted.
Security News
Bun 1.2.19 introduces isolated installs for smoother monorepo workflows, along with performance boosts, new tooling, and key compatibility fixes.