vue-paycard - npm Package Compare versions

Comparing version 0.6.0 to 0.7.0

package.json

 {
   "name": "vue-paycard",
-  "version": "0.6.0",
+  "version": "0.7.0",
   "private": false,
@@ -24,41 +24,41 @@ "description": "Credit card component made with Vue.js",
   "dependencies": {
-    "vue": "^2.6.12"
+    "vue": "^2.6.14"
   },
   "devDependencies": {
-    "@babel/core": "^7.12.10",
-    "@commitlint/cli": "^11.0.0",
-    "@commitlint/config-conventional": "^11.0.0",
-    "@storybook/addon-a11y": "^6.1.14",
-    "@storybook/addon-controls": "^6.1.14",
-    "@storybook/addon-docs": "^6.1.14",
-    "@storybook/addons": "^6.1.14",
-    "@storybook/theming": "^6.1.14",
-    "@storybook/vue": "^6.1.14",
-    "@vue/cli-plugin-babel": "~4.5.10",
-    "@vue/cli-plugin-eslint": "~4.5.10",
-    "@vue/cli-plugin-unit-jest": "~4.5.10",
-    "@vue/cli-service": "~4.5.10",
-    "@vue/eslint-config-standard": "^6.0.0",
-    "@vue/test-utils": "^1.1.2",
-    "autoprefixer": "^10.2.1",
+    "@babel/core": "^7.16.0",
+    "@commitlint/cli": "^15.0.0",
+    "@commitlint/config-conventional": "^15.0.0",
+    "@storybook/addon-a11y": "^6.4.8",
+    "@storybook/addon-controls": "^6.4.8",
+    "@storybook/addon-docs": "^6.4.8",
+    "@storybook/addons": "^6.4.8",
+    "@storybook/theming": "^6.4.8",
+    "@storybook/vue": "^6.4.8",
+    "@vue/cli-plugin-babel": "~4.5.15",
+    "@vue/cli-plugin-eslint": "~4.5.15",
+    "@vue/cli-plugin-unit-jest": "~4.5.15",
+    "@vue/cli-service": "~4.5.15",
+    "@vue/eslint-config-standard": "^6.1.0",
+    "@vue/test-utils": "^1.3.0",
+    "autoprefixer": "^10.4.0",
     "babel-eslint": "^10.1.0",
-    "babel-loader": "^8.2.2",
+    "babel-loader": "^8.2.3",
     "babel-preset-vue": "^2.0.2",
-    "clean-css-cli": "^4.3.0",
-    "commitizen": "^4.2.3",
-    "core-js": "^3.8.2",
-    "eslint": "^7.18.0",
-    "eslint-plugin-import": "^2.22.1",
+    "clean-css-cli": "^5.4.2",
+    "commitizen": "^4.2.4",
+    "core-js": "^3.19.3",
+    "eslint": "^7.32.0",
+    "eslint-plugin-import": "^2.25.3",
     "eslint-plugin-node": "^11.1.0",
-    "eslint-plugin-promise": "^4.2.1",
+    "eslint-plugin-promise": "^5.2.0",
     "eslint-plugin-standard": "^4.1.0",
-    "eslint-plugin-vue": "^7.4.1",
-    "husky": "^4.3.8",
-    "lint-staged": "^10.5.3",
-    "postcss": "^8.2.4",
-    "postcss-cli": "^8.3.1",
+    "eslint-plugin-vue": "^8.2.0",
+    "husky": "^7.0.4",
+    "lint-staged": "^12.1.2",
+    "postcss": "^8.4.4",
+    "postcss-cli": "^9.0.2",
     "rimraf": "^3.0.2",
-    "sass": "^1.32.4",
-    "sass-loader": "^10.1.1",
-    "vue-template-compiler": "^2.6.12"
+    "sass": "^1.44.0",
+    "sass-loader": "^12.4.0",
+    "vue-template-compiler": "^2.6.14"
   },
@@ -65,0 +65,0 @@ "eslintConfig": {

README.md

@@ -6,3 +6,3 @@ <div align="center">
 <p align="center">
-  Credit card component made with Vue.js
+  Credit card component made with Vue.js (Works with Vue 2 & 3)
 </p>
@@ -15,3 +15,2 @@
 [![Downloads](https://img.shields.io/npm/dt/vue-paycard.svg)](https://www.npmjs.com/package/vue-paycard)
-[![Dependencies](https://img.shields.io/david/guastallaigor/vue-paycard.svg)](https://github.com/guastallaigor/vue-paycard/blob/master/package.json)
 [![Netlify Status](https://api.netlify.com/api/v1/badges/a87b7690-b534-4c67-b4a6-60e586bd79b5/deploy-status)](https://app.netlify.com/sites/vue-paycard/deploys)
@@ -71,2 +70,17 @@
 
+For Vue 3
+
+```js
+import { createApp, h } from "vue";
+import VuePaycard from "vue-paycard";
+
+const app = createApp({
+  render: () => h(App),
+});
+
+app.use(VuePaycard);
+
+app.mount("#app");
+```
+
 Or locally in any component
@@ -134,3 +148,10 @@
 | background-image       | [String, Number] | ''                                                                                                                                  | Set a background image link to the card (overrides `has-random-backgrounds` prop), or you can pass a single valid number that matches the images name we have in `src/assets/images`                                                                                                                                                                                                 |
+| set-type               | String           | ''                                                                                                                                  | Set a card type from the supported card types ['visaelectron', 'visa', 'elo', 'amex', 'mastercard', 'discover', 'unionpay', 'troy', 'dinersclub', 'jcb', 'laser', 'dankort', 'uatp', 'mir', 'hipercard', 'aura', 'maestro']. Note that this will override the type generated from card number                                                                                        |
 
+## Events
+
+| Event name | Type   | Default | Description                               |
+| ---------- | ------ | ------- | ----------------------------------------- |
+| get-type   | String | null    | Emits the type generated from card number |
+
 ## Supported card types
@@ -137,0 +158,0 @@

No alert changes

Improved metrics

Total package byte prevSize

924838

0.22%

Number of lines in readme file

226

10.24%

Dependency changes

• Updated

  vue@^2.6.14