# @mauromadeit/vue-commons

> > Reusable components, store, etc.

Latest version **0.5.5** (published 2018-12-26) · MIT license · 0 weekly downloads

## Install

```sh
npm install @mauromadeit/vue-commons
pnpm add @mauromadeit/vue-commons
yarn add @mauromadeit/vue-commons
bun add @mauromadeit/vue-commons
```

## Health

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

Positive: no vulnerabilities.

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

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.5.5 |
| Published | 2018-12-26 |
| First published | 2018-09-29 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 9 |
| Unpacked size | 8.7 MB |
| Known vulnerabilities | 0 (+5 in 3 direct dependencies) |
| Install scripts | no |
| Author | Mauro Perez |
| Maintainers | mauromadeit |

## Links

- npm: https://www.npmjs.com/package/@mauromadeit/vue-commons
- npm.io page: https://npm.io/package/@mauromadeit/vue-commons

## Dependencies (9)

- [vue](https://npm.io/package/vue.md) ^2.5.21
- [vuex](https://npm.io/package/vuex.md) ^3.0.1
- [vuetify](https://npm.io/package/vuetify.md) ^1.3.15
- [firebase](https://npm.io/package/firebase.md) ^5.7.1
- [showdown](https://npm.io/package/showdown.md) ^1.9.0
- [turndown](https://npm.io/package/turndown.md) ^5.0.1
- [vue-router](https://npm.io/package/vue-router.md) ^3.0.2
- [change-case](https://npm.io/package/change-case.md) ^3.0.2
- [medium-editor](https://npm.io/package/medium-editor.md) ^5.23.3

## Recent versions

- 0.5.5 (latest) — 2018-12-26
- 0.5.4 — 2018-12-26
- 0.5.3 — 2018-12-26
- 0.5.2 — 2018-12-22
- 0.5.1 — 2018-12-12
- 0.5.0 — 2018-12-06
- 0.4.11 — 2018-10-15
- 0.4.10 — 2018-10-12
- 0.4.9 — 2018-10-12
- 0.4.8 — 2018-10-12
- 0.4.7 — 2018-10-05
- 0.4.6 — 2018-10-04
- 0.4.3 — 2018-10-04
- 0.4.2 — 2018-10-04
- 0.4.1 — 2018-10-04
- … 23 more at https://npm.io/package/@mauromadeit/vue-commons/versions

## README

# commons-vue

> Reusable components, store, etc.

## Install
``` bash
yarn add https://github.com/maurop123/vue-commons.git
```

Then import

```js
import { components } from '@mauromadeit/vue-commons'
```

## Examples

### Table Editor

Based on https://vuetifyjs.com/en/components/data-tables#example-crud

```pug
table-editor(
  v-bind="{ headers, items }"
  @save="save" @delete="delete"
)
```

```js
methods: {
  save(item) { ... },
  delete(item) { ... },
}
```

For model of headers and items...
https://vuetifyjs.com/en/components/data-tables

### Masonry Component

```pug
masonry(:items="pages")
  v-card(slot-scope="page" class="mb-3")
    v-card-title(v-if="page.title") {{page.title}}
```

### Bus

```js
import { bus } from '@mauromadeit/vue-commons'
```

### Reusing firebase db

```js
// src/database.js
import { Database } from '@mauromadeit/vue-commons'
export default new Database({ ref: 'money-reports' })

// import and use anywhere
import db from '@/database'
db.get('items').subscribe(data => ...) // [{ id: 1, name: Al}, { id: 2, name: Bo }]
db.push('items', payload).subscribe()
```

### State Model and Texts

```pug
text-state-model(
  :stateProp="`enrollment.owners.${i}.city`"
  label="City"
  :rules="[required()]"
)

// which is equivalent to...

state-model(stateProp="enrollment.companyName")
  v-text-field(
    slot-scope="{ value, input }"
    :value="value" @input="input"
    label="Company Legal Name"
    :rules="[required()]"
  )
```

### SSL Cert

1. https://www.aidanwoods.com/blog/lets-encrypt-the-manual-certificate/
2. https://p3plcpnl0875.prod.phx3.secureserver.net:2083/cpsess4761954074/frontend/gl_paper_lantern/ssl/install.html

```bash
sudo ls /etc/letsencrypt/live/journal.mauromadeit.com/
# copy files below to site above
sudo cat /etc/letsencrypt/live/journal.mauromadeit.com/cert.pem
sudo cat /etc/letsencrypt/live/journal.mauromadeit.com/privkey.pem
sudo cat /etc/letsencrypt/live/journal.mauromadeit.com/chain.pem
```

### Update PWA Icons

- Download font awesome icon like here https://fontawesome.com/icons/journal-whills?style=solid
- Convert to png here https://cloudconvert.com/svg-to-png
  - 260px by 260px and +200dpi
- Gen icons here - https://realfavicongenerator.net
- Replace the files in /public

## Gotcha

May not work in runtime only builds

## Contributing

Initial setup
```bash
yarn install
```

Make changes and build. **Don't forget to build!**
```bash
yarn build
```

Test changes locally
```bash
rm -rf ../path/node_modules/mauromadeit-vue-commons/*
cp -r ./* ../path/node_modules/mauromadeit-vue-commons/
```

Bump version and push
```bash
npm version patch
git push
```

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