vue-property-decorator - npm Package Compare versions

Comparing version 3.4.0 to 4.0.0

lib/vue-property-decorator.d.ts

@@ -1,2 +0,2 @@
-import Vue = require('vue');
+import Vue from 'vue';
 import { PropOptions } from 'vue';
@@ -9,2 +9,14 @@ import VueClassComponent from 'vue-class-component';
 /**
+ * decorator of an inject
+ * @param key key
+ * @return PropertyDecorator
+ */
+export declare function Inject(key?: string | symbol): PropertyDecorator;
+/**
+ * decorator of model
+ * @param  event event name
+ * @return PropertyDecorator
+ */
+export declare function Model(event: string): PropertyDecorator;
+/**
  * decorator of a prop
@@ -11,0 +23,0 @@ * @param  options the options for the prop

lib/vue-property-decorator.js

@@ -1,7 +0,32 @@
-/* vue-property-decorator verson 3.4.0 MIT LICENSE copyright 2016 kaorun343 */
+/** vue-property-decorator verson 4.0.0 MIT LICENSE copyright 2017 kaorun343 */
 'use strict';
-var Vue = require("vue");
-var vue_class_component_1 = require("vue-class-component");
-require("reflect-metadata");
+import Vue from 'vue';
+import VueClassComponent, { createDecorator } from 'vue-class-component';
+import 'reflect-metadata';
 /**
+ * decorator of an inject
+ * @param key key
+ * @return PropertyDecorator
+ */
+export function Inject(key) {
+    return createDecorator(function (componentOptions, k) {
+        if (typeof componentOptions.inject === 'undefined') {
+            componentOptions.inject = {};
+        }
+        if (!Array.isArray(componentOptions.inject)) {
+            componentOptions.inject[k] = key || k;
+        }
+    });
+}
+/**
+ * decorator of model
+ * @param  event event name
+ * @return PropertyDecorator
+ */
+export function Model(event) {
+    return createDecorator(function (componentOptions, prop) {
+        componentOptions.model = { prop: prop, event: event };
+    });
+}
+/**
  * @brief  Makes a decorator for prop.
@@ -18,6 +43,11 @@ *
     return function (target, key) {
-        if (!(options instanceof Array) && typeof options.type === 'undefined') {
-            options.type = Reflect.getMetadata('design:type', target, key);
+        if (!Array.isArray(options) && typeof options.type === 'undefined') {
+            if (typeof Reflect === "object" && typeof Reflect.metadata === "function") {
+                options.type = Reflect.getMetadata('design:type', target, key);
+            }
+            else {
+                options.type = null;
+            }
         }
-        vue_class_component_1.createDecorator(function (componentOptions, k) {
+        createDecorator(function (componentOptions, k) {
             (componentOptions.props || (componentOptions.props = {}))[k] = options;
@@ -27,3 +57,3 @@ })(target, key);
 }
-function Prop(options, key) {
+export function Prop(options, key) {
     if (options === void 0) { options = {}; }
@@ -37,3 +67,2 @@ if (options instanceof Vue) {
 }
-exports.Prop = Prop;
 /**
@@ -45,6 +74,6 @@ * decorator of a watch function
  */
-function Watch(path, options) {
+export function Watch(path, options) {
     if (options === void 0) { options = {}; }
     var _a = options.deep, deep = _a === void 0 ? false : _a, _b = options.immediate, immediate = _b === void 0 ? false : _b;
-    return vue_class_component_1.createDecorator(function (componentOptions, handler) {
+    return createDecorator(function (componentOptions, handler) {
         if (typeof componentOptions.watch !== 'object') {
@@ -56,5 +85,4 @@ componentOptions.watch = Object.create(null);
 }
-exports.Watch = Watch;
-exports.prop = Prop;
-exports.watch = Watch;
-exports.Component = vue_class_component_1.default;
+export var prop = Prop;
+export var watch = Watch;
+export var Component = VueClassComponent;

package.json

 {
   "name": "vue-property-decorator",
-  "version": "3.4.0",
+  "version": "4.0.0",
   "description": "property decorators for Vue Component",
-  "main": "lib/vue-property-decorator.js",
+  "main": "lib/vue-property-decorator.common.js",
   "keywords": [
@@ -17,4 +17,4 @@ "vue",
   "scripts": {
-    "build": "tsc -p src/tsconfig.json",
-    "test": "tsc -p test/tsconfig.json && mocha"
+    "build": "tsc -p src/tsconfig.json && rollup -c",
+    "test": "npm run build && tsc -p test/tsconfig.json && mocha --compilers js:babel-register"
   },
@@ -26,8 +26,13 @@ "files": [
     "@types/mocha": "^2.2.38",
+    "@types/node": "^7.0.5",
     "@types/power-assert": "^1.4.29",
+    "babel": "^6.23.0",
+    "babel-core": "^6.23.1",
+    "babel-preset-es2015": "^6.22.0",
     "espower-typescript": "^7.0.0",
     "mocha": "^3.2.0",
     "power-assert": "^1.4.2",
-    "typescript": "^2.1.5",
-    "vue": "^2.1.10"
+    "rollup": "^0.41.4",
+    "typescript": "^2.2.1",
+    "vue": "^2.2.1"
   },
@@ -37,3 +42,3 @@ "typings": "./lib/vue-property-decorator.d.ts",
     "reflect-metadata": "^0.1.9",
-    "vue-class-component": "^4.4.0"
+    "vue-class-component": "^5.0.0"
   },
@@ -40,0 +45,0 @@ "repository": {

README.md

@@ -6,6 +6,8 @@ # Vue Property Decorator
 ## License
+
 MIT License
 
 ## Install
-```
+
+```bash
 npm i -S vue-property-decorator
@@ -16,4 +18,6 @@ ```
 
-There are 3 decorators:
+There are 5 decorators:
 
+* `@Inject`
+* `@Model`
 * `@Prop` (and `@prop`)
@@ -25,6 +29,16 @@ * `@Watch` (and `@watch`)
 import Vue = require('vue')
-import { Component Prop, Watch } from 'vue-property-decorator'
+import { Component, Model, Prop, Watch } from 'vue-property-decorator'
 
+const s = Symbol('baz')
+
 @Component
-export class Component extends Vue {
+export class MyComponent extends Vue {
+
+  @Inject() foo: string
+  @Inject('bar') bar: string
+  @Inject(s) baz: string
+
+  @Model('change')
+  checked: boolean
+
   @Prop
@@ -54,4 +68,15 @@ propA: number
 ```js
-export const Component = Vue.extend({
-  name: 'Component',
+const s = Symbol('baz')
+
+export const MyComponent = Vue.extend({
+  name: 'MyComponent',
+  inject: {
+    foo: 'foo',
+    bar: 'bar',
+    [s]: s
+  },
+  model: {
+    prop: 'checked',
+    event: 'change'
+  },
   props: {
@@ -85,3 +110,4 @@ propA: Number,
 
-As you can see at `propA` and `propB`, the type can be inferred automatically when it's a simple type. For more complex types like enums you do need to specify it specifically. Also this library needs to have `emitDecoratorMetadata` set to `true` for this to work.
+As you can see at `propA` and `propB`, the type can be inferred automatically when it's a simple type. For more complex types like enums you do need to specify it specifically.
+Also this library needs to have `emitDecoratorMetadata` set to `true` for this to work.
 
@@ -88,0 +114,0 @@ ## See also

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

11420

increased by70.93%

Number of package files

6

increased by20%

Lines of code

212

increased by168.35%

Number of lines in readme file

112

increased by30.23%

Worsened metrics

Dev dependency count

12

increased by71.43%

Dependency changes

• + Addedvue-class-component@5.0.2(transitive)

• - Removedvue-class-component@4.4.0(transitive)

• Updatedvue-class-component@^5.0.0