WIP: TypeScript typings

package.json

@@ -3,6 +3,7 @@
   "version": "3.5.0",
   "description": "Async computed properties for Vue",
   "main": "dist/vue-async-computed.js",
+  "types": "src/index.d.ts",
   "files": [
     "bin/",
     "dist/"

src/index.d.ts

@@ -0,0 +1,39 @@
+import Vue, { PluginFunction } from "vue";
+
+export interface IAsyncComputedOptions {
+	errorHandler?: (error: string[]) => void;
+	useRawError?: boolean;
+	default?: any;
+}
+
+export default class AsyncComputed {
+	constructor(options?: IAsyncComputedOptions)
+	static install: PluginFunction<never>;
+	static version: string;
+}
+
+declare module "vue/types/options" {
+	interface ComputedOptions<T> {
+		asynchronous?: (() => T | Promise<T>) | {
+			get: (() => T | Promise<T>);
+			default?: T;
+			lazy?: boolean;
+		};
+	}
+}
+
+interface IASyncComputedState {
+	state: "updating" | "success" | "error";
+	updating: boolean;
+	success: boolean;
+	error: boolean;
+	exception: Error | null;
+	update: () => void;
+}
+
+declare module "vue/types/vue" {
+	// tslint:disable-next-line:interface-name
+	interface Vue {
+		$asyncComputed: {[K: string]: IASyncComputedState };
+	}
+}

src/index.js

@@ -20,46 +20,42 @@ const AsyncComputed = {
 
     Vue.mixin({
       beforeCreate () {
-        const optionData = this.$options.data
         const asyncComputed = this.$options.asyncComputed || {}
         this.$asyncComputed = {}
 
+        for (const key in this.$options.computed) {
+          if (this.$options.computed[key].asynchronous) {
+            asyncComputed[key] = this.$options.computed[key].asynchronous
+          }
+        }
+
         if (!Object.keys(asyncComputed).length) return
 
+        this.$options.asyncComputed = asyncComputed
+
         if (!this.$options.computed) this.$options.computed = {}
 
         for (const key in asyncComputed) {
           const getter = getterFn(key, this.$options.asyncComputed[key])
           this.$options.computed[prefix + key] = getter
+          const getset = makeLazyComputed(key)
+          this.$options.computed[key].get = getset.get
+          this.$options.computed[key].set = getset.set
         }
-
-        this.$options.data = function vueAsyncComputedInjectedDataFn () {
-          const data = (
-            (typeof optionData === 'function')
-              ? optionData.call(this)
-              : optionData
-          ) || {}
-          for (const key in asyncComputed) {
-            const item = this.$options.asyncComputed[key]
-            if (isComputedLazy(item)) {
-              initLazy(data, key)
-              this.$options.computed[key] = makeLazyComputed(key)
-            } else {
-              data[key] = null
-            }
-          }
-          return data
+      },
+      data () {
+        let ret = {}
+        const asyncComputed = this.$options.asyncComputed || {}
+        for (const key in asyncComputed) {
+          initLazy(ret, key)
         }
+        return ret
       },
       created () {
         for (const key in this.$options.asyncComputed || {}) {
           const item = this.$options.asyncComputed[key],
                 value = generateDefault.call(this, item, pluginOptions)
-          if (isComputedLazy(item)) {
-            silentSetLazy(this, key, value)
-          } else {
-            this[key] = value
-          }
+          silentSetLazy(this, key, value)
         }
 
         for (const key in this.$options.asyncComputed || {}) {
@@ -79,7 +75,7 @@ const AsyncComputed = {
             newPromise.then(value => {
               if (thisPromise !== promiseId) return
               setAsyncState(this.$asyncComputed[key], 'success')
-              this[key] = value
+              silentSetLazy(this, key, value)
             }).catch(err => {
               if (thisPromise !== promiseId) return