# wepy-com-paper-modal

> Wepy paper UI modal component

Latest version **1.0.4** (published 2018-05-20) · MIT license · 0 weekly downloads

## Install

```sh
npm install wepy-com-paper-modal
pnpm add wepy-com-paper-modal
yarn add wepy-com-paper-modal
bun add wepy-com-paper-modal
```

## Health

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

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.4 |
| Published | 2018-05-20 |
| First published | 2018-05-20 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 8.8 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 3 |
| Author | John Roberts |
| Maintainers | johncalvinroberts |
| Keywords | wepy, wxmp, weapp, wechat |

## Links

- npm: https://www.npmjs.com/package/wepy-com-paper-modal
- Repository: https://github.com/johncalvinroberts/wepy-com-paper-modal
- Homepage: https://github.com/johncalvinroberts/wepy-com-paper-modal#readme
- Issues: https://github.com/johncalvinroberts/wepy-com-paper-modal/issues
- npm.io page: https://npm.io/package/wepy-com-paper-modal

## Recent versions

- 1.0.4 (latest) — 2018-05-20
- 1.0.2 — 2018-05-20
- 1.0.1 — 2018-05-20
- 1.0.0 — 2018-05-20

## README

# wepy-com-paper-modal
A handsome modal component for use in the [wepyjs](https://github.com/wepyjs/wepy), a Vue-like framework for building WeChat mini programs.

## What it looks like
![modal](https://user-images.githubusercontent.com/11850362/40283133-1e82f29c-5cac-11e8-89b2-1010003807e1.gif)

## Usage
### installation
```
npm install wepy-com-paper-modal --save
```

### Importing the component

For example, on a page `index.wpy`
```javascript
// index.wpy
<template>
    <modal>
		// Slot, put your WXML content of modal here
    </modal>
</template>
<script>
    import wepy from 'wepy'
    import Toast from 'wepy-com-paper-modal'

    export default class Index extends wepy.page {
        components = {
            modal: Modal
        }
    }
</script>
```

### Showing the modal
Inside of a `@tap` handler (or anywhere in a wepy component or page),  you could invoke the modal to display, i.e. show the modal by calling the /toggle/ function
```javascript
// index.wpy
	this.$invoke('modal', 'toggle', null)
```

### Props
There are two props exposed on `wepy-com-paper-modal`

#### open
Default set to `true`
```javascript
    <modal :open.sync="customOpen">
		// slot
    </modal>
```

#### closeCLass
Set a custom class to the ‘x’ close icon 
```javascript
    <modal :closeClass.sync="customCloseClass">
		// slot
    </modal>
```

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