build(deps-dev): bump @vue/devtools-api

Author: pikax

docs/api/vue-composable.api.md

@@ -87,6 +87,14 @@ export interface CancellablePromiseResult<TCancel = any> {
     cancelled: Ref<boolean>;
 }
 
+// @public (undocumented)
+export interface ClipboardItem {
+    // (undocumented)
+    new (input: {
+        [contentType: string]: Blob;
+    }): ClipboardItem;
+}
+
 // @public (undocumented)
 export const COMMIT: string;
 
@@ -857,9 +865,7 @@ export function useBreakpointTailwindCSS<T extends TailwindConfigEmpty>(): Break
 // Warning: (ae-forgotten-export) The symbol "DefaultTailwindBreakpoints" needs to be exported by the entry point index.d.ts
 //
 // @public (undocumented)
-export function useBreakpointTailwindCSS(): BreakpointReturn<
-  DefaultTailwindBreakpoints
->;
+export function useBreakpointTailwindCSS(): BreakpointReturn<DefaultTailwindBreakpoints>;
 
 // @public (undocumented)
 export function useBreakpointTailwindCSS<T extends BreakpointObject>(): BreakpointReturn<T>;
@@ -906,6 +912,27 @@ export function useCancellablePromise<T = any>(fn: () => T, options: Cancellable
 // @public (undocumented)
 export function useCancellablePromise<T extends Promise<TR>, TR>(fn: () => T): PromiseResultFactory<T> & CancellablePromiseResult;
 
+// @public (undocumented)
+export interface UseClipboard {
+    // (undocumented)
+    data: Ref<DataTransfer | undefined>;
+    // (undocumented)
+    read(): Promise<DataTransfer | undefined>;
+    // (undocumented)
+    readText(): Promise<string | undefined>;
+    // (undocumented)
+    supported: boolean;
+    // (undocumented)
+    text: Ref<string | undefined>;
+    // (undocumented)
+    write(items: ClipboardItem[]): Promise<void>;
+    // (undocumented)
+    writeText(text: string): Promise<void>;
+}
+
+// @public (undocumented)
+export function useClipboard(): UseClipboard;
+
 // @public
 export type UseCssVariables<T> = CssVariableObject<T> & CssVariablesMethods;
 
@@ -993,6 +1020,9 @@ export function useEvent<T extends {
 // @public (undocumented)
 export function useEvent<K extends keyof WindowEventMap>(el: RefTyped<Window>, name: K, listener: (this: Document, ev: WindowEventMap[K]) => any, options?: boolean | AddEventListenerOptions): RemoveEventFunction;
 
+// @public (undocumented)
+export function useEvent(el: Window, name: string, listener: (this: Document, ev: Event) => any, options?: boolean | AddEventListenerOptions): RemoveEventFunction;
+
 // @public (undocumented)
 export function useEvent<K extends keyof DocumentEventMap>(el: Element | Ref<Element | undefined>, name: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): RemoveEventFunction;
 

packages/vue-composable/package.json

@@ -44,7 +44,7 @@
     "vue-composable-fix": "./scripts/postinstall.js"
   },
   "dependencies": {
-    "@vue/devtools-api": "^6.0.0-beta.2"
+    "@vue/devtools-api": "^6.0.0-beta.3"
   },
   "peerDependencies3": {
     "@vue/runtime-core": "^3.0.0"

packages/vue-composable/src/devtools/app.ts

@@ -2,6 +2,7 @@ import { App } from "../api";
 import ProxyApi from "./proxy";
 import { setDevtools } from "./api";
 import { NO_OP } from "../utils";
+import { DevtoolsPluginApi } from "@vue/devtools-api";
 
 let setupDevtoolsPlugin: Function = NO_OP;
 // NOTE maybe change this to other flag
@@ -16,12 +17,12 @@ export const UseDevtoolsApp = (
   id = "vue-composable",
   label = "Vue-composable devtools plugin"
 ) => {
-  const promise: any = new Promise((res) => {
+  const promise = new Promise<DevtoolsPluginApi>(res => {
     setupDevtoolsPlugin(
       {
         id,
         label,
-        app,
+        app
       },
       res
     );

packages/vue-composable/src/devtools/proxy.ts

@@ -19,33 +19,33 @@ async function pushEventsToApi(
       "addInspector",
       "sendInspectorTree",
       "sendInspectorState",
-      "addTimelineEvent",
+      "addTimelineEvent"
     ];
 
     for (const k of priority) {
-      for (const it of ApiQueue.filter((x) => x.type === k)) {
+      for (const it of ApiQueue.filter(x => x.type === k)) {
         // @ts-ignore
         api[k](...it.args);
       }
       await promisedTimeout(20);
     }
 
     new Set(
-      ApiQueue.filter((x) => x.type === "notifyComponentUpdate").map(
-        (x) => x.args[0]
+      ApiQueue.filter(x => x.type === "notifyComponentUpdate").map(
+        x => x.args[0]
       )
-    ).forEach((x) => api.notifyComponentUpdate(x));
+    ).forEach(x => api.notifyComponentUpdate(x));
 
     // @ts-ignore
-    EventQueue.forEach((x) => api.on[x.type](...x.args));
+    EventQueue.forEach(x => api.on[x.type](...x.args));
 
     EventQueue.length = 0;
     ApiQueue.length = 0;
   }, 100);
 }
 
 if (__VUE_2__) {
-  apiProxyFactory = (promiseApi) => {
+  apiProxyFactory = promiseApi => {
     const EventQueue: OnEvent[] = [];
     const ApiQueue: ApiEvent[] = [];
     let api: DevtoolsPluginApi;
@@ -59,7 +59,7 @@ if (__VUE_2__) {
       }
     }
 
-    promiseApi.then((x) => {
+    promiseApi.then(x => {
       api = x;
       pushEventsToApi(api, EventQueue, ApiQueue);
     });
@@ -85,12 +85,19 @@ if (__VUE_2__) {
         queueEvent("sendInspectorState", arguments);
       },
 
+      getComponentBounds(_): any {
+        queueEvent("getComponentBounds", arguments);
+      },
+      getComponentName(_): any {
+        queueEvent("getComponentName", arguments);
+      },
+
       on: {
         transformCall(handler): any {
           if (api) {
             api.on.transformCall(handler);
           } else {
-            //@ts-ignore2
+            //@ts-ignore
             EventQueue.push({ type: "transformCall", args: arguments });
           }
         },
@@ -166,7 +173,32 @@ if (__VUE_2__) {
             EventQueue.push({ type: "getElementComponent", args: arguments });
           }
         },
-
+        getComponentRootElements(handler): any {
+          if (api) {
+            api.on.getComponentRootElements(handler);
+          } else {
+            EventQueue.push({
+              type: "getComponentRootElements",
+              args: arguments
+            } as any);
+          }
+        },
+        editComponentState(handler): any {
+          if (api) {
+            api.on.editComponentState(handler);
+          } else {
+            //@ts-ignore
+            EventQueue.push({ type: "editComponentState", args: arguments });
+          }
+        },
+        inspectTimelineEvent(handler): any {
+          if (api) {
+            api.on.inspectTimelineEvent(handler);
+          } else {
+            //@ts-ignore
+            EventQueue.push({ type: "inspectTimelineEvent", args: arguments });
+          }
+        },
         getInspectorTree(handler): any {
           if (api) {
             api.on.getInspectorTree(handler);
@@ -183,13 +215,21 @@ if (__VUE_2__) {
             EventQueue.push({ type: "getInspectorState", args: arguments });
           }
         },
-      },
+        editInspectorState(handler): any {
+          if (api) {
+            api.on.editInspectorState(handler);
+          } else {
+            //@ts-ignore
+            EventQueue.push({ type: "editInspectorState", args: arguments });
+          }
+        }
+      }
     };
 
     return proxyApi;
   };
 } else {
-  apiProxyFactory = (promiseApi) => {
+  apiProxyFactory = promiseApi => {
     let api: DevtoolsPluginApi;
     const EventQueue: OnEvent[] = [];
     const ApiQueue: ApiEvent[] = [];
@@ -208,16 +248,16 @@ if (__VUE_2__) {
             return (target[prop] = (...args) => {
               EventQueue.push({
                 type: prop,
-                args,
+                args
               });
             });
           }
-        },
+        }
       }
     );
     const proxy = new Proxy(
       {
-        on: onProxy,
+        on: onProxy
       },
       {
         get: (target, prop: keyof DevtoolsPluginApi) => {
@@ -237,14 +277,14 @@ if (__VUE_2__) {
           return (target[prop] = (...args) => {
             ApiQueue.push({
               type: prop,
-              args,
+              args
             });
           });
-        },
+        }
       }
     );
 
-    promiseApi.then((x) => {
+    promiseApi.then(x => {
       api = x;
       pushEventsToApi(api, EventQueue, ApiQueue);
     });

yarn.lock

@@ -1628,10 +1628,10 @@
   dependencies:
     tslib "^2.0.1"
 
-"@vue/devtools-api@^6.0.0-beta.2":
-  version "6.0.0-beta.2"
-  resolved "https://registry.yarnpkg.com/@vue/devtools-api/-/devtools-api-6.0.0-beta.2.tgz#833ad3335f97ae9439e26247d97f9baf7b5a6116"
-  integrity sha512-5k0A8ffjNNukOiceImBdx1e3W5Jbpwqsu7xYHiZVu9mn4rYxFztIt+Q25mOHm7nwvDnMHrE7u5KtY2zmd+81GA==
+"@vue/devtools-api@^6.0.0-beta.3":
+  version "6.0.0-beta.3"
+  resolved "https://registry.yarnpkg.com/@vue/devtools-api/-/devtools-api-6.0.0-beta.3.tgz#5a66cc8beed688fe18c272ee7a8bd8ed7e35a54c"
+  integrity sha512-iJQhVyWzWIJxYIMjbZpljZQfU4gL2IMD5YQm3HXO8tQRU7RqqnD3f1WHn+vrqvrSvM8Qw2BeNugwdBBmbK8Oxg==
 
 "@vue/reactivity@3.0.5", "@vue/reactivity@^3.0.5":
   version "3.0.5"