# makeit-tooltip

> Makeit Tooltip 气泡浮层组件，基于 Vue3.0 + Vite + JSX 开发，不承载复杂的文本信息，可以替代系统默认的 title 显示。

Latest version **1.1.2** (published 2021-06-28) · MIT license · 0 weekly downloads

## Install

```sh
npm install makeit-tooltip
pnpm add makeit-tooltip
yarn add makeit-tooltip
bun add makeit-tooltip
```

## Health

**Score 20/100 (F)** — status: abandoned.

Positive: esm support; no vulnerabilities.

Warnings: low downloads; no types.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.1.2 |
| Published | 2021-06-28 |
| First published | 2021-01-08 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | ESM + CommonJS |
| Dependencies | 2 |
| Unpacked size | 441.3 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 3 |
| Author | lirongtong |
| Maintainers | makeit.vip |
| Keywords | vue, vue3, vite, makeit, tooltip, miitvip, makeit.vip, admin-tooltip, 麦可易特网 |

## Links

- npm: https://www.npmjs.com/package/makeit-tooltip
- Repository: https://github.com/lirongtong/miitvip-tooltip
- Homepage: https://admin.makeit.vip/components/tooltip
- Issues: https://github.com/lirongtong/miitvip-tooltip/issues
- npm.io page: https://npm.io/package/makeit-tooltip

## Dependencies (2)

- [vue](https://npm.io/package/vue.md) ^3.0.4
- [vue-types](https://npm.io/package/vue-types.md) ^3.0.1

## Alternatives

- [raw-loader](https://npm.io/package/raw-loader.md) — 4.3M weekly downloads
- [plop](https://npm.io/package/plop.md) — 1.4M weekly downloads
- [webpack-deadcode-plugin](https://npm.io/package/webpack-deadcode-plugin.md) — 80.3K weekly downloads
- [@storybook/preact-vite](https://npm.io/package/@storybook/preact-vite.md) — 54.2K weekly downloads
- [vite-plugin-transform](https://npm.io/package/vite-plugin-transform.md) — 2.4K weekly downloads

## Recent versions

- 1.1.2 (latest) — 2021-06-28
- 1.1.1 — 2021-01-26
- 1.1.0 — 2021-01-25
- 1.0.9 — 2021-01-25
- 1.0.8 — 2021-01-21
- 1.0.7 — 2021-01-11
- 1.0.6 — 2021-01-11
- 1.0.5 — 2021-01-08
- 1.0.4 — 2021-01-08
- 1.0.3 — 2021-01-08
- 1.0.2 — 2021-01-08
- 1.0.1 — 2021-01-08

## README

<p align="center">
    <a href="https://admin.makeit.vip/">
        <img width="200" src="https://file.makeit.vip/MIIT/M00/00/00/ajRkHV_pUyOALE2LAAAtlj6Tt_s370.png">
    </a>
</p>

<h1 align="center" color="green">
    <a href="https://admin.makeit.vip/components/tooltip" target="_blank" style="color: #41b995">
        Makeit Tooltip
    </a>
</h1>

<div align="center">

基于 Vue3.0 + Vite 开发的气泡浮层，不承载复杂文本，可以替代系统默认的 title 显示的组件。

[![npm package](https://img.shields.io/npm/v/makeit-tooltip.svg?style=flat-square)](https://www.npmjs.org/package/makeit-tooltip)
[![npm_downloads](http://img.shields.io/npm/dm/makeit-tooltip.svg?style=flat-square)](http://www.npmtrends.com/makeit-tooltip)
![MIT](https://img.shields.io/badge/license-MIT-ff69b4.svg)
![webpack](https://img.shields.io/badge/webpack-5.3.2-orange.svg)
![vue](https://img.shields.io/badge/vue-3.0.4-green.svg)
![vite](https://img.shields.io/badge/vite-1.0.0-yellow.svg)
</div>

## 关于

> Makeit Tooltip 气泡浮层组件，基于 Vue3.0 + Vite + JSX 开发，不承载复杂的文本信息，可以替代系统默认的 title 显示，且能支持更多定制化的样式需求。

## 安装

```bash
npm i makeit-tooltip
```

## 使用
```ts
import { createApp } from 'vue'
import MakeitTooltip from 'makeit-tooltip'
import 'makeit-tooltip/dist/tooltip.min.css'
import App from './app.vue'

const app = createApp(App)
app.use(MakeitTooltip)
app.mount('#app')
```

## 示例
```vue
<!-- 基础效果 -->
<template>
    <mi-tooltip title="提示信息"></mi-tooltip>
</template>

<!-- 自定义 Title -->
<template>
    <mi-tooltip>
        <template v-slot:title>
            <p>提示信息</p>
        </template>
    </mi-tooltip>
</template>

<!-- 定制 Trigger 触发事件 -->
<template>
    <mi-tooltip title="提示信息" trigger="click"></mi-tooltip>
</template>

<!-- 自定义背景色 -->
<template>
    <mi-tooltip title="提示信息" bg-color="#f6ca9d"></mi-tooltip>
</template>

<!-- 自定义字体颜色 -->
<template>
    <mi-tooltip title="提示信息" text-color="#f6ca9d"></mi-tooltip>
</template>
```

## 更多
> 更多定制化内容及使用请查看在线示例：[https://admin.makeit.vip/components/tooltip](https://admin.makeit.vip/components/tooltip)

---
_Source: https://npm.io/package/makeit-tooltip · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._
