@buoy-gg/vue 0.0.0-stage → 7.0.75

package/LICENSE

@@ -0,0 +1,58 @@
+PROPRIETARY SOFTWARE LICENSE
+
+Copyright (c) 2024-present Buoy. All rights reserved.
+
+This software and its source code are proprietary and confidential.
+
+NOTICE: This is NOT open source software. This software is licensed,
+not sold, and is protected by copyright laws and international treaties.
+
+TERMS AND CONDITIONS:
+
+1. LICENSE GRANT
+   Subject to the terms of this Agreement and payment of applicable fees,
+   Buoy grants you a limited, non-exclusive, non-transferable license
+   to use the compiled software packages in your applications.
+
+2. RESTRICTIONS
+   You may NOT:
+   - Copy, modify, or distribute the source code
+   - Reverse engineer, decompile, or disassemble the software
+   - Remove or alter any proprietary notices or labels
+   - Sublicense, rent, lease, or lend the software
+   - Use the software to create competing products
+   - Share access credentials with unauthorized parties
+
+3. OWNERSHIP
+   React Buoy retains all right, title, and interest in the software,
+   including all intellectual property rights. This license does not
+   grant you any rights to trademarks or service marks.
+
+4. TERMINATION
+   This license is effective until terminated. Your rights under this
+   license will terminate automatically without notice if you fail to
+   comply with any of its terms. Upon termination, you must cease all
+   use and destroy all copies of the software.
+
+5. DISCLAIMER OF WARRANTIES
+   THE SOFTWARE IS PROVIDED "AS IS" WITHOUT WARRANTY OF ANY KIND,
+   EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
+   MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE, AND NONINFRINGEMENT.
+
+6. LIMITATION OF LIABILITY
+   IN NO EVENT SHALL BUOY BE LIABLE FOR ANY INDIRECT, INCIDENTAL,
+   SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES ARISING OUT OF OR IN
+   CONNECTION WITH THIS LICENSE OR THE USE OF THE SOFTWARE.
+
+7. GOVERNING LAW
+   This Agreement shall be governed by and construed in accordance with
+   the laws of the United States, without regard to its conflict of
+   law provisions.
+
+For licensing inquiries and subscription information:
+- Website: https://buoy.gg
+- Email: AustinLovesWorking@gmail.com
+
+Unauthorized reproduction or distribution of this software, or any
+portion of it, may result in severe civil and criminal penalties,
+and will be prosecuted to the maximum extent possible under the law.

package/README.md

@@ -1,3 +1,102 @@
-# Temporary Holding Version
+# Buoy for Vue and Nuxt
 
-This version is a temporary placeholder for this package. An operational version to replace this has been submitted for review and is awaiting a staged release.
+Buoy runs in Vue 3.3 and up, built with Vite, as a beta.
+It runs in Nuxt 4 too.
+Your app stays all Vue.
+Buoy uses React for its own screens and brings it along.
+The full guide is the [Vue page](https://buoy.gg/buoy/latest/docs/web/vue).
+
+## Install and sign in
+
+Run these from your app folder:
+
+```sh
+npm install --save-dev @buoy-gg/core @buoy-gg/vue @buoy-gg/network
+npx --package=@buoy-gg/core buoy login
+```
+
+Add more tools the same way.
+Use the same version for all Buoy packages.
+`buoy login` writes `VITE_BUOY_KEY` to a file Git ignores.
+
+## Set up in Vue
+
+Add the Vite plugin:
+
+```ts
+// vite.config.ts
+import vue from '@vitejs/plugin-vue';
+import { buoy } from '@buoy-gg/core/vite';
+
+export default defineConfig({ plugins: [vue(), buoy()] });
+```
+
+Add the Buoy plugin to your app:
+
+```ts
+import { buoy } from '@buoy-gg/vue';
+
+createApp(App).use(router).use(pinia).use(buoy).mount('#app');
+```
+
+That's all.
+The Vite plugin finds your tools and adds the early hook.
+It leaves Buoy out of prod builds.
+`app.use(buoy)` reads your key and starts Buoy when your app mounts.
+It finds Vue Router, Pinia and Vue Query by itself.
+It stops Buoy when your app unmounts.
+
+## Set up in Nuxt
+
+```ts
+// nuxt.config.ts
+export default defineNuxtConfig({ modules: ['@buoy-gg/vue/nuxt'] });
+```
+
+That's all.
+Pass options with the `buoy` key, as plain data.
+For options with functions, set `buoy: { setup: false }`.
+Then call `nuxtApp.vueApp.use(buoy, options)` in your own client plugin.
+
+## Options
+
+`app.use(buoy, options)` takes the same options as `mountBuoy` from `@buoy-gg/core/web`, plus these:
+
+| Option | What it does |
+|---|---|
+| `load` | Loads app settings with Buoy. Use a dev check so prod drops the file |
+| `modules` | Your own tool list, in place of the plugin's |
+| `enableInRelease` | Starts Buoy in a release build too. Set `buoy({ enableInRelease: true })` as well |
+| `onMount` | Called with the stop function once Buoy is up |
+| `onDestroy` | Called when Buoy stops |
+
+`startBuoy(options)` starts Buoy with no Vue app.
+Pass `router`, `pinia` and `queryClient` yourself.
+
+## Pinia and refs
+
+Pinia stores show in the Zustand tool by themselves.
+To show a plain `ref` or `reactive`, wrap it:
+
+```ts
+import { buoyVueRef } from '@buoy-gg/vue/pinia';
+
+app.use(buoy, { zustandStores: { count: buoyVueRef(count) } });
+```
+
+You can read and edit them in the tool.
+An edit keeps the fields you did not change.
+
+## Entry points
+
+| Import | Holds |
+|---|---|
+| `@buoy-gg/vue` | `buoy`, `startBuoy` |
+| `@buoy-gg/vue/register` | The early hook. The Vite plugin adds it for you |
+| `@buoy-gg/vue/router` | `connectBuoyRouter`, for a router link by hand |
+| `@buoy-gg/vue/pinia` | `watchPiniaStores`, `buoyVueRef` |
+| `@buoy-gg/vue/highlights` | `connectBuoyHighlights`, for Highlight by hand |
+| `@buoy-gg/vue/nuxt` | The Nuxt module |
+
+Each app entry has a `buoy-disabled` build that does nothing.
+The Vite plugin picks it for prod builds.

package/lib/disabled/highlights.d.ts

@@ -0,0 +1,7 @@
+import type { BuoyHighlightController, VueInstance } from '../highlights';
+export declare function componentName(_instance: VueInstance): string;
+export declare function hostElements(_instance: VueInstance): HTMLElement[];
+export declare function connectBuoyHighlights(_controller: BuoyHighlightController): () => void;
+export declare function elementComponentName(_element: Element): string | undefined;
+export declare function elementComponentSource(_element: Element): undefined;
+export declare function onVueRender(_listener?: (instance: VueInstance) => void): () => void;

package/lib/disabled/highlights.mjs

@@ -0,0 +1 @@
+function e(n){return"Anonymous"}function o(n){return[]}function t(n){return()=>{}}function u(n){}function r(n){}function c(n){return()=>{}}export{e as componentName,t as connectBuoyHighlights,u as elementComponentName,r as elementComponentSource,o as hostElements,c as onVueRender};

package/lib/disabled/index.d.ts

@@ -0,0 +1,10 @@
+import type { BuoyOptions, BuoyVueApp } from '../index';
+/** The buoy-disabled build condition keeps no loader and no tools. */
+export declare const buoy: {
+    install(_app: BuoyVueApp, _options?: BuoyOptions): void;
+};
+export default buoy;
+export declare function startBuoy(_options?: BuoyOptions): () => void;
+export declare function isBuoyDevBuild(): boolean;
+export declare function findQueryClient(_app: BuoyVueApp): unknown;
+export declare function appLinks(_app: BuoyVueApp): Pick<BuoyOptions, 'router' | 'pinia' | 'queryClient'>;

package/lib/disabled/index.mjs

@@ -0,0 +1 @@
+var t={install(n,e={}){}},u=t;function a(n={}){return()=>{}}function s(){return false}function i(n){}function r(n){return{}}export{r as appLinks,t as buoy,u as default,i as findQueryClient,s as isBuoyDevBuild,a as startBuoy};

package/lib/disabled/pinia.d.ts

@@ -0,0 +1,5 @@
+import type { BuoyPinia, BuoyPiniaStore, BuoyStoreApi } from '../pinia';
+export declare function plainCopy<T>(value: T): T;
+export declare function piniaStoreApi(_store: BuoyPiniaStore): BuoyStoreApi<Record<string, unknown>>;
+export declare function watchPiniaStores(_pinia: BuoyPinia, _zustand: unknown): () => void;
+export declare function buoyVueRef<T extends object>(_source: T): BuoyStoreApi<unknown>;

package/lib/disabled/pinia.mjs

@@ -0,0 +1 @@
+var e={getState:()=>({}),getInitialState:()=>({}),setState:()=>{},subscribe:()=>()=>{}};function n(t){return t}function a(t){return e}function i(t,u){return()=>{}}function r(t){return e}export{r as buoyVueRef,a as piniaStoreApi,n as plainCopy,i as watchPiniaStores};

package/lib/disabled/register.d.ts

@@ -0,0 +1,4 @@
+/** Keep the early entry inert when the build has disabled Buoy. */
+export declare function registerBrowserNetwork(_options?: {
+    enableInRelease?: boolean;
+}): boolean;

package/lib/disabled/register.mjs

@@ -0,0 +1 @@
+function r(e={}){return false}export{r as registerBrowserNetwork};

package/lib/disabled/router.d.ts

@@ -0,0 +1,4 @@
+import type { BuoyVueRouter } from '../router';
+export declare function vueRouteTemplate(pattern: string): string;
+export declare function vueRoutePaths(_router: Pick<BuoyVueRouter, 'getRoutes'>): string[];
+export declare function connectBuoyRouter(_router: BuoyVueRouter): () => void;

package/lib/disabled/router.mjs

@@ -0,0 +1 @@
+function e(t){return t}function u(t){return[]}function n(t){return()=>{}}export{n as connectBuoyRouter,u as vueRoutePaths,e as vueRouteTemplate};

package/lib/highlights.d.ts

@@ -0,0 +1,87 @@
+/** The parts of a Vue 3 component instance Highlight reads. All are Vue's own and may be missing. */
+export interface VueInstance {
+    uid?: number;
+    type?: {
+        name?: string;
+        __name?: string;
+        __file?: string;
+    };
+    subTree?: VueVNode | null;
+    parent?: VueInstance | null;
+    isMounted?: boolean;
+    isUnmounted?: boolean;
+    isDeactivated?: boolean;
+}
+interface VueVNode {
+    el?: Node | null;
+    anchor?: Node | null;
+    type?: unknown;
+    children?: unknown;
+    component?: VueInstance | null;
+    target?: Element | null;
+}
+export interface VueRenderBatch {
+    host: HTMLElement;
+    name: string;
+    count: number;
+}
+export interface BuoyHighlightController {
+    isEnabled(): boolean;
+    subscribe(listener: (enabled: boolean) => void): () => void;
+    connectRenderSource(available: boolean): {
+        recordRenders(renders: VueRenderBatch[]): void;
+        disconnect(): void;
+    };
+}
+/** A component's display name: its `name`, the SFC name Vue sets in dev, or its file name. */
+export declare function componentName(instance: VueInstance): string;
+/**
+ * The elements a component put on the page, for its boxes. Elements only, and
+ * only ones still on the page. A fragment gives every element between its
+ * start and end markers. A Teleport gives what it moved to its target. A
+ * component whose root is another component gives that one's elements.
+ */
+export declare function hostElements(instance: VueInstance, depth?: number): HTMLElement[];
+/**
+ * Hear each real component render. Vue also sends "updated" when a slot
+ * runs, naming the component that wrote the slot even though it didn't
+ * render. A real render gives the component a new `subTree`, so an event that
+ * leaves it the same is skipped, as are events during a first mount. Each
+ * component's tree is noted from the first call on; the early hook calls
+ * this at once, so components made before Highlight turns on are known too.
+ */
+export declare function onVueRender(listener?: (instance: VueInstance) => void): () => void;
+/**
+ * Feed Vue updates to Highlight Updates. Vue tells its dev hook about each
+ * component it updated; Buoy counts those while Highlight is on, and finds
+ * the names and boxes in the next animation frame, after Vue has finished.
+ * Only real renders count (see onVueRender).
+ */
+export declare function connectBuoyHighlights(controller: BuoyHighlightController): () => void;
+/**
+ * The app component an element belongs to, for Buoy's screen tools
+ * (describeScreen, hitTest). In dev, Vue marks each element with the
+ * component that rendered it.
+ */
+/**
+ * The component behind a page element and the components around it, with the
+ * file each one lives in. Vue sets `__file` on SFCs in dev builds. Same shape
+ * as Buoy's React component source; Vue has no line numbers to give.
+ */
+/** One component in the chain, in the shape Buoy's component source tool returns. */
+export interface VueComponentSourceEntry {
+    name: string;
+    source?: {
+        fileName: string;
+    };
+    memo: false;
+    forwardRef: false;
+    reason?: string;
+}
+export declare function elementComponentSource(element: Element): {
+    found: true;
+    component: VueComponentSourceEntry;
+    owners: VueComponentSourceEntry[];
+} | undefined;
+export declare function elementComponentName(element: Element): string | undefined;
+export {};

package/lib/highlights.mjs

@@ -0,0 +1 @@
+var H=Symbol.for("buoy.vue.hook"),M=2500;function _(){let e=globalThis;return e[H]??={listeners:new Set,wrappers:new WeakMap,armed:false}}function g(e,t){for(let n of _().listeners)try{n(e,t)}catch(r){console.error("[Buoy]",r)}}function u(e){let{wrappers:t}=_(),n=t.get(e);if(n&&e.emit===n)return true;let r=e.emit,o=function(l,...i){return g(l,i),r?.apply(this??e,[l,...i])};try{Object.defineProperty(e,"emit",{configurable:true,enumerable:true,get:()=>o,set:l=>{l!==o&&(r=l)}})}catch{let l=e.on;if(typeof l!="function")return false;for(let i of["component:added","component:updated","component:removed","perf:start","perf:end","app:init","app:unmount"])l.call(e,i,(...s)=>g(i,s))}return t.set(e,o),true}function b(){let e=new Map;return{enabled:false,apps:[],events:e,on(t,n){return e.has(t)||e.set(t,[]),e.get(t).push(n),()=>this.off(t,n)},once(t,n){let r=(...o)=>{this.off(t,r),n(...o)};this.on(t,r)},off(t,n){let r=e.get(t),o=r?.indexOf(n)??-1;r&&o!==-1&&r.splice(o,1)},emit(t,...n){for(let r of[...e.get(t)??[]])r(...n)}}}function B(){return typeof window>"u"||!window.HTMLElement?false:!window.navigator?.userAgent?.includes("jsdom")}function D(){let e=globalThis,t=_(),n=e.__VUE_DEVTOOLS_GLOBAL_HOOK__;if(n){u(n),t.armed=true;return}if(t.armed)return;if(t.armed=true,!B()){let r=b();u(r),e.__VUE_DEVTOOLS_GLOBAL_HOOK__=r;return}(e.__VUE_DEVTOOLS_HOOK_REPLAY__||=[]).push(r=>{u(r)}),setTimeout(()=>{if(e.__VUE_DEVTOOLS_GLOBAL_HOOK__){u(e.__VUE_DEVTOOLS_GLOBAL_HOOK__);return}let r=b();u(r),e.__VUE_DEVTOOLS_GLOBAL_HOOK__=r;let o=e.__VUE_DEVTOOLS_HOOK_REPLAY__??[];e.__VUE_DEVTOOLS_HOOK_REPLAY__=[];for(let l of o)try{l(r)}catch(i){console.error("[Buoy]",i)}},M)}function K(e){D();let{listeners:t}=_();return t.add(e),()=>{t.delete(e)}}var m=new Set(["BaseTransition","Transition","TransitionGroup","KeepAlive","Suspense","Teleport"]);function f(e){let t=e.type??{};return t.name?t.name:t.__name?t.__name:t.__file?.split(/[\\/]/).pop()?.replace(/\.\w+$/,"")||"Anonymous"}var O=e=>typeof HTMLElement<"u"&&e instanceof HTMLElement&&e.isConnected;function U(e){return!!(e&&typeof e=="object"&&e.__isTeleport)}function h(e,t=0){let n=e.subTree;return!n||t>20?[]:w(n,t)}function w(e,t){if(e.component)return h(e.component,t+1);if(U(e.type))return(Array.isArray(e.children)?e.children:[]).flatMap(o=>w(o,t+1));let n=e.el;if(!n)return[];if(e.anchor&&e.anchor!==n){let o=[];for(let l=n;l&&o.length<20&&(O(l)&&o.push(l),l!==e.anchor);l=l.nextSibling);return o}if(O(n))return[n];let r=n.parentElement;return n.nodeType===3&&O(r)?[r]:[]}var y=new WeakMap,R=Symbol.for("buoy.vue.renders");function G(){let e=globalThis;return e[R]??={trees:new WeakMap,listeners:new Set,installed:false}}function v(e){let t=G();return t.installed||(t.installed=true,K((n,r)=>{if(n!=="component:added"&&n!=="component:updated")return;let o=r[3];if(!o||typeof o!="object"||r[0]?._instance?.type?.devtools?.hide)return;let l=o.subTree,i=t.trees.has(o),s=t.trees.get(o)!==l;if(t.trees.set(o,l),!(n==="component:added"||!o.isMounted||i&&!s))for(let c of t.listeners)c(o)})),e?(t.listeners.add(e),()=>{t.listeners.delete(e)}):()=>{}}function P(e){let t=y.get(e);if(!t){let o=e.connectRenderSource(true),l=new Map,i,s=e.isEnabled(),c=false,S=()=>{if(i=void 0,c||!s){l.clear();return}let a=new Map;for(let[p,E]of l){if(p.isUnmounted||p.isDeactivated)continue;let L=f(p);if(!m.has(L))for(let d of h(p)){let T=a.get(d);T?T.count+=E:a.set(d,{host:d,name:L,count:E})}}l.clear(),a.size&&o.recordRenders([...a.values()])},V=v(a=>{s&&(l.set(a,(l.get(a)??0)+1),i??=requestAnimationFrame(S))}),A=e.subscribe(a=>{s=a,a||l.clear()});t={users:0,stop:()=>{c=true,V(),A(),i!==void 0&&cancelAnimationFrame(i),l.clear(),o.disconnect()}},y.set(e,t)}t.users++;let n=false,r=t;return()=>{n||(n=true,--r.users===0&&(r.stop(),y.delete(e)))}}function C(e){let t;for(let r=e;r&&!t;r=r.parentElement)t=r.__vueParentComponent;let n=[];for(let r=0;t&&r<200&&n.length<7;r++,t=t.parent??void 0){let o=f(t);if(m.has(o)||!t.parent&&!t.type?.__file)continue;let l=t.type?.__file;n.push({name:o,...l?{source:{fileName:l}}:{reason:"It comes from a library, so it has no file in the app."},memo:false,forwardRef:false})}if(n.length)return{found:true,component:n[0],owners:n.slice(1)}}function k(e){for(let t=e;t;t=t.parentElement){let n=t.__vueParentComponent;for(;n&&m.has(f(n));)n=n.parent??void 0;if(n)return f(n)}}export{f as componentName,P as connectBuoyHighlights,k as elementComponentName,C as elementComponentSource,h as hostElements,v as onVueRender};

package/lib/index.d.ts

@@ -0,0 +1,81 @@
+/** A tool's browser module, as its `/web` entry exports it. */
+type Modules = Record<string, unknown>;
+/**
+ * Buoy's props, kept here so a Vue app's TypeScript never loads the React
+ * types behind @buoy-gg/core. The common ones are named; the rest of
+ * `FloatingDevTools`' props pass through as they are.
+ */
+export interface BuoyMountOptions {
+    environment?: 'local' | 'dev' | 'qa' | 'staging' | 'prod';
+    userRole?: 'admin' | 'internal' | 'user';
+    /** Defaults to VITE_BUOY_KEY, which `buoy login` writes. */
+    licenseKey?: string;
+    /** The app's TanStack Query client. Found from VueQueryPlugin when left out. */
+    queryClient?: unknown;
+    /** Stores for the Zustand tool: vanilla Zustand stores, or buoyVueRef() wrappers. */
+    zustandStores?: Record<string, unknown>;
+    /** Custom tools made with createWebTool. */
+    apps?: unknown[];
+    requiredEnvVars?: unknown[];
+    requiredStorageKeys?: unknown[];
+    externalSync?: boolean | {
+        socketURL?: string;
+        deviceName?: string;
+        enableInRelease?: boolean;
+    };
+    sentryGetClient?: () => unknown;
+    [prop: string]: unknown;
+}
+export interface BuoyOptions extends BuoyMountOptions {
+    /** Start in a release build as well. App access rules still apply. */
+    enableInRelease?: boolean;
+    /** The tools to load. Defaults to every tool the buoy() Vite plugin found. */
+    modules?: Modules | (() => Promise<Modules>);
+    /** The app's Vue Router. Found on the app when Buoy is installed with app.use(). */
+    router?: unknown;
+    /** The app's Pinia. Found on the app when Buoy is installed with app.use(). */
+    pinia?: unknown;
+    /**
+     * Load app settings and links with Buoy, such as `apps` or `zustandStores`.
+     * Use a dev-only dynamic import here so a production build leaves them out.
+     */
+    load?: () => Promise<Omit<BuoyOptions, 'load' | 'enableInRelease'>>;
+    /** Called once Buoy is mounted. The stop function is safe to call twice. */
+    onMount?: (stop: () => void) => void;
+    /** Called when Buoy stops, to remove app hooks the loader added. */
+    onDestroy?: () => void;
+}
+/** Whether Buoy starts by default: the phone app's debug flag in a Capacitor shell, otherwise a dev build. */
+export declare function isBuoyDevBuild(): boolean;
+/**
+ * Mount Buoy with no Vue app. Pass `queryClient`, `router` and `pinia`
+ * yourself. Returns a stop function that is safe to call before Buoy has
+ * finished loading.
+ */
+export declare function startBuoy(options?: BuoyOptions): () => void;
+/** The parts of a Vue 3 app Buoy reads. `_context` and `_container` are Vue's own. */
+export interface BuoyVueApp {
+    mount(...args: unknown[]): unknown;
+    unmount(...args: unknown[]): unknown;
+    onUnmount?: (fn: () => void) => void;
+    config: {
+        globalProperties: Record<string, unknown>;
+    };
+    _context?: {
+        provides?: Record<string | symbol, unknown>;
+    };
+    _container?: unknown;
+}
+/** The Query client the app provided: VueQueryPlugin puts it in provides, under a key the app may change. */
+export declare function findQueryClient(app: BuoyVueApp): unknown;
+/** The router, Pinia and Query client the app installed. Read after mount, so plugin order doesn't matter. */
+export declare function appLinks(app: BuoyVueApp): Pick<BuoyOptions, 'router' | 'pinia' | 'queryClient'>;
+/**
+ * Buoy for a Vue app: `createApp(App).use(buoy).mount('#app')`. It finds the
+ * app's router, Pinia and Vue Query client when the app mounts, so it can go
+ * anywhere in the `use` chain. It renders nothing in the app.
+ */
+export declare const buoy: {
+    install(app: BuoyVueApp, options?: BuoyOptions): void;
+};
+export default buoy;

package/lib/index.mjs

@@ -0,0 +1 @@
+function N(){try{return import.meta.env.VITE_BUOY_KEY||void 0}catch{return}}function B(){if(typeof window>"u")return false;let e=window.Capacitor,t=false;try{t=e?.isNativePlatform?.()===true}catch{t=false}return t?e?.DEBUG===true:typeof __DEV__<"u"?!!__DEV__:process.env.NODE_ENV!=="production"}function O(e={}){if(typeof window>"u"||typeof document>"u")return()=>{};let{enableInRelease:t,modules:o,router:n,pinia:c,onMount:p,onDestroy:r,load:l,...h}=e;if(!B()&&!t)return()=>{};let g=globalThis;g.__BUOY_FRAMEWORK__!=="nuxt"&&(g.__BUOY_FRAMEWORK__="vue");let i=false,_,s=[];r&&s.push(r);let v=()=>{for(let u of s.splice(0).reverse())try{u()}catch(a){console.error("[Buoy]",a)}},E=async u=>{let a=await u();typeof a=="function"&&(i?a():s.push(a))};(async()=>{let u=l?await l():{},{modules:a,onDestroy:w,onMount:k,router:S,pinia:Y,...$}=u;if(w){if(i){w();return}s.push(w)}if(i)return;let y={...h,...$},m=a??o,f=typeof m=="function"?await m():m??(await import("@buoy-gg/core/web/installed-tools")).installedTools;if(i)return;let R=f["highlight-updates"]?.HighlightUpdatesController;if(R){let{connectBuoyHighlights:x}=await import("@buoy-gg/vue/highlights");if(i)return;try{s.push(x(R))}catch(I){console.warn("[Buoy] Highlight Updates already has a render source, so Vue updates are not shown.",I)}}let d={router:S??n,pinia:Y??c};if(d.router&&f["route-events"]&&(await E(async()=>(await import("@buoy-gg/vue/router")).connectBuoyRouter(d.router)),i))return;let U={...y.zustandStores??{}};if(d.pinia&&f.zustand&&(await E(async()=>(await import("@buoy-gg/vue/pinia")).watchPiniaStores(d.pinia,f.zustand)),i))return;let{mountBuoy:q}=await import("@buoy-gg/core/web");if(i)return;let C=y.queryClient,D=y.licenseKey??N();_=q({...y,modules:f,...Object.keys(U).length?{zustandStores:U}:{},...C?{queryClient:C}:{},...D?{licenseKey:D}:{}}),p?.(b)})().catch(u=>{v(),console.error("[Buoy] Buoy did not start.",u)});function b(){if(i)return;i=true;let u=_;_=void 0,u?.(),v()}return b}function K(e){let t=e._context?.provides;if(t)for(let o of Reflect.ownKeys(t)){let n=t[o];if(n&&typeof n.getQueryCache=="function")return n}}function V(e){let t=e.config.globalProperties,o={};t.$router&&(o.router=t.$router),t.$pinia&&(o.pinia=t.$pinia);let n=K(e);return n&&(o.queryClient=n),o}var z=Symbol.for("buoy.vue.installed"),M={install(e,t={}){if(typeof window>"u"||!B()&&!t.enableInRelease)return;let o=e;if(o[z])return;o[z]=true;let n,c=()=>{if(n)return;let r=V(e);n=O({...r,...t})},p=()=>{let r=n;n=void 0,r?.()};if(e._container)c();else{let r=e.mount;e.mount=function(...l){let h=r.apply(this??e,l);return c(),h}}if(typeof e.onUnmount=="function")e.onUnmount(p);else{let r=e.unmount;e.unmount=function(...l){return p(),r.apply(this??e,l)}}}},P=M;export{V as appLinks,M as buoy,P as default,K as findQueryClient,B as isBuoyDevBuild,O as startBuoy};

package/lib/nuxt-plugin.mjs

@@ -0,0 +1 @@
+import{defineNuxtPlugin as o,useRuntimeConfig as i}from"#app";import{buoy as p}from"@buoy-gg/vue";var s=o(e=>{let u=i().public.buoy??{};e.vueApp.use(p,{...u})});export{s as default};

package/lib/nuxt.d.ts

@@ -0,0 +1,44 @@
+/** Options for `modules: [['@buoy-gg/vue/nuxt', { ... }]]` or the `buoy` key in nuxt.config. */
+export interface BuoyNuxtOptions {
+    /** Keep Buoy in a production build. App access rules still apply. */
+    enableInRelease?: boolean;
+    /** Installed tools to leave out, by package name, such as `['tv-remote']`. */
+    exclude?: string[];
+    /** Props for Buoy, the same as `app.use(buoy, options)` takes. They must be plain data. */
+    options?: Record<string, unknown>;
+    /**
+     * Set to false to call `nuxtApp.vueApp.use(buoy, options)` in your own
+     * client plugin, for options that aren't plain data (a `load` function).
+     * The module still adds the Vite plugin and the early hook.
+     */
+    setup?: boolean;
+}
+/** The parts of a Nuxt instance the module uses. */
+interface NuxtLike {
+    options: {
+        dev: boolean;
+        plugins: (string | {
+            src: string;
+            mode?: 'client' | 'server' | 'all';
+        })[];
+        runtimeConfig: {
+            public: Record<string, unknown>;
+        };
+        buoy?: BuoyNuxtOptions;
+    };
+    hook(name: 'vite:extendConfig', fn: (config: {
+        plugins?: unknown[];
+    }, env: {
+        isClient: boolean;
+    }) => void): void;
+}
+/**
+ * Buoy for Nuxt: `modules: ['@buoy-gg/vue/nuxt']`. In the browser build only,
+ * it adds the buoy() Vite plugin, puts Buoy's early hook on the first line of
+ * Nuxt's client entry (before Nuxt makes the Vue app), and adds a client
+ * plugin that runs `app.use(buoy)`. The server build gets none of it. In a
+ * production build, Buoy's imports resolve to their disabled builds unless
+ * `enableInRelease` is set.
+ */
+export default function buoyNuxt(inline: BuoyNuxtOptions, nuxt: NuxtLike): void;
+export {};

package/lib/nuxt.mjs

@@ -0,0 +1,3 @@
+import{buoy as u}from"@buoy-gg/core/vite";var r=/[\\/]nuxt[\\/]dist[\\/]app[\\/]entry(?:\.async)?\.js$/;function i(s={},e){let n={...e.options.buoy,...s},t=!!n.enableInRelease;if(!e.options.dev&&!t){e.hook("vite:extendConfig",o=>{o.plugins??=[],o.plugins.push(u({exclude:n.exclude,register:false}))});return}e.options.runtimeConfig.public.buoy={...n.options??{},...t?{enableInRelease:t}:{}},n.setup!==false&&e.options.plugins.push({src:new URL("./nuxt-plugin.mjs",import.meta.url).pathname,mode:"client"}),e.hook("vite:extendConfig",(o,{isClient:l})=>{l&&(o.plugins??=[],o.plugins.push(u({exclude:n.exclude,enableInRelease:t,register:false}),{name:"buoy-nuxt-early-hook",enforce:"pre",transform(a,p){if(r.test(p.split("?")[0]??""))return{code:`import '@buoy-gg/vue/register';
+globalThis.__BUOY_FRAMEWORK__ = 'nuxt';
+${a}`,map:null}}}))})}i.meta={name:"@buoy-gg/vue/nuxt",configKey:"buoy"};export{i as default};

package/lib/pinia.d.ts

@@ -0,0 +1,45 @@
+/** The parts of a Pinia store the bridge reads. */
+export interface BuoyPiniaStore {
+    $id: string;
+    $state: Record<string, unknown>;
+    $patch(mutate: (state: Record<string, unknown>) => void): void;
+    $subscribe(callback: () => void, options?: {
+        detached?: boolean;
+        flush?: 'sync' | 'pre' | 'post';
+    }): () => void;
+}
+/** The parts of Pinia the store link reads. `_s` is Pinia's own map of live stores. */
+export interface BuoyPinia {
+    _s: Map<string, BuoyPiniaStore>;
+    use(plugin: (context: {
+        store: BuoyPiniaStore;
+    }) => void): void;
+}
+/** What Buoy's Zustand tool reads and writes. */
+export interface BuoyStoreApi<T> {
+    getState(): T;
+    getInitialState(): T;
+    setState(partial: Partial<T> | ((state: T) => Partial<T>), replace?: boolean): void;
+    subscribe(listener: (state: T, previous: T) => void): () => void;
+}
+/**
+ * A plain copy. Buoy keeps old states by reference, so it must never see the
+ * live store. Refs and reactive objects are unwrapped at every depth: a setup
+ * store keeps refs in its raw state, and `toRaw` alone only unwraps the top.
+ */
+export declare function plainCopy<T>(value: T, seen?: WeakMap<object, unknown>): T;
+/**
+ * One Pinia store as a store the Zustand tool can read and edit. The same
+ * contract as @buoy-gg/solid's store bridge: a read returns a plain copy,
+ * kept until the store changes; after a full replace, `getState()` returns
+ * the object handed in, which is how a Time Machine restore checks it took.
+ */
+export declare function piniaStoreApi(store: BuoyPiniaStore): BuoyStoreApi<Record<string, unknown>>;
+/**
+ * Show every Pinia store in the Zustand tool, by its id. Stores that exist
+ * now are added at once; Pinia makes the rest the first time the app uses
+ * them, and they are added then.
+ */
+export declare function watchPiniaStores(pinia: BuoyPinia, zustand: unknown): () => void;
+/** A `ref` or `reactive` as a store for the Zustand tool. A bare value shows as `{ value }`. */
+export declare function buoyVueRef<T extends object>(source: T): BuoyStoreApi<unknown>;

package/lib/pinia.mjs

@@ -0,0 +1 @@
+import{isRef as v,toRaw as $,watch as A}from"vue";function y(t,u=new WeakMap){let r=t;for(;v(r);)r=r.value;if(r===null||typeof r!="object")return r;let e=$(r);if(e instanceof Date)return new Date(e.getTime());if(u.has(e))return u.get(e);if(Array.isArray(e)){let n=[];u.set(e,n);for(let f of e)n.push(y(f,u));return n}let a={};u.set(e,a);for(let n of Object.keys(e))a[n]=y(e[n],u);return a}function d(t){let u=new Set,r=()=>y(t.$state),e=r(),a=e,n=false,f,i=(l,p)=>{for(let o of[...u])o(l,p)},w=()=>f?e:e=r(),g=()=>{f=t.$subscribe(()=>{if(n)return;let l=e;e=r(),i(e,l)},{detached:true,flush:"sync"})};return{getState:w,getInitialState:()=>a,setState(l,p){let o=w(),c=typeof l=="function"?l(o):l;if(c===null||typeof c!="object"||Array.isArray(c))return;let b=p?c:{...o,...c};n=true;try{t.$patch(h=>{for(let s of Object.keys(b))h[s]=y(b[s]);if(!p)return;let S=$(h);for(let s of Object.keys(S))s in b||(v(S[s])?h[s]=void 0:delete h[s])})}finally{n=false}let j=o;e=b,i(e,j)},subscribe(l){return u.add(l),f||g(),()=>{u.delete(l),u.size||(f?.(),f=void 0)}}}}function k(t,u){let r=u?.watchStores;if(typeof r!="function")return()=>{};let e=[],a=new WeakSet,n=true,f=i=>{!n||a.has(i)||(a.add(i),e.push(r({[i.$id]:Object.assign(d(i),{buoyLibrary:"pinia"})})))};for(let i of t._s.values())f(i);return t.use(({store:i})=>{f(i)}),()=>{if(n){n=false;for(let i of e.splice(0))i()}}}function O(t){let u=a=>a!==null&&typeof a=="object"&&!Array.isArray(a),r=v(t)&&!u($(t.value)),e={get $state(){return r?{value:t.value}:v(t)?t.value:t}};return d({$id:"ref",get $state(){return e.$state},$patch(a){if(r){let n={value:t.value};a(n),t.value=n.value;return}a(e.$state)},$subscribe:a=>A(t,a,{deep:true,flush:"sync"})})}export{O as buoyVueRef,d as piniaStoreApi,y as plainCopy,k as watchPiniaStores};

package/lib/register.d.ts

@@ -0,0 +1,2 @@
+import '@buoy-gg/core/web/register-network';
+export { registerBrowserNetwork } from '@buoy-gg/core/web/register-network';

package/lib/register.mjs

@@ -0,0 +1 @@
+import"@buoy-gg/core/web/register-network";var w=Symbol.for("buoy.vue.hook"),g=2500;function p(){let t=globalThis;return t[w]??={listeners:new Set,wrappers:new WeakMap,armed:false}}function d(t,e){for(let r of p().listeners)try{r(t,e)}catch(o){console.error("[Buoy]",o)}}function _(t){let{wrappers:e}=p(),r=e.get(t);if(r&&t.emit===r)return true;let o=t.emit,n=function(s,...i){return d(s,i),o?.apply(this??t,[s,...i])};try{Object.defineProperty(t,"emit",{configurable:true,enumerable:true,get:()=>n,set:s=>{s!==n&&(o=s)}})}catch{let s=t.on;if(typeof s!="function")return false;for(let i of["component:added","component:updated","component:removed","perf:start","perf:end","app:init","app:unmount"])s.call(t,i,(...a)=>d(i,a))}return e.set(t,n),true}function c(){let t=new Map;return{enabled:false,apps:[],events:t,on(e,r){return t.has(e)||t.set(e,[]),t.get(e).push(r),()=>this.off(e,r)},once(e,r){let o=(...n)=>{this.off(e,o),r(...n)};this.on(e,o)},off(e,r){let o=t.get(e),n=o?.indexOf(r)??-1;o&&n!==-1&&o.splice(n,1)},emit(e,...r){for(let o of[...t.get(e)??[]])o(...r)}}}function L(){return typeof window>"u"||!window.HTMLElement?false:!window.navigator?.userAgent?.includes("jsdom")}function O(){let t=globalThis,e=p(),r=t.__VUE_DEVTOOLS_GLOBAL_HOOK__;if(r){_(r),e.armed=true;return}if(e.armed)return;if(e.armed=true,!L()){let o=c();_(o),t.__VUE_DEVTOOLS_GLOBAL_HOOK__=o;return}(t.__VUE_DEVTOOLS_HOOK_REPLAY__||=[]).push(o=>{_(o)}),setTimeout(()=>{if(t.__VUE_DEVTOOLS_GLOBAL_HOOK__){_(t.__VUE_DEVTOOLS_GLOBAL_HOOK__);return}let o=c();_(o),t.__VUE_DEVTOOLS_GLOBAL_HOOK__=o;let n=t.__VUE_DEVTOOLS_HOOK_REPLAY__??[];t.__VUE_DEVTOOLS_HOOK_REPLAY__=[];for(let s of n)try{s(o)}catch(i){console.error("[Buoy]",i)}},g)}function h(t){O();let{listeners:e}=p();return e.add(t),()=>{e.delete(t)}}var y=new Set(["BaseTransition","Transition","TransitionGroup","KeepAlive","Suspense","Teleport"]);function m(t){let e=t.type??{};return e.name?e.name:e.__name?e.__name:e.__file?.split(/[\\/]/).pop()?.replace(/\.\w+$/,"")||"Anonymous"}var T=Symbol.for("buoy.vue.renders");function S(){let t=globalThis;return t[T]??={trees:new WeakMap,listeners:new Set,installed:false}}function b(t){let e=S();return e.installed||(e.installed=true,h((r,o)=>{if(r!=="component:added"&&r!=="component:updated")return;let n=o[3];if(!n||typeof n!="object"||o[0]?._instance?.type?.devtools?.hide)return;let s=n.subTree,i=e.trees.has(n),a=e.trees.get(n)!==s;if(e.trees.set(n,s),!(r==="component:added"||!n.isMounted||i&&!a))for(let f of e.listeners)f(n)})),t?(e.listeners.add(t),()=>{e.listeners.delete(t)}):()=>{}}function v(t){let e;for(let o=t;o&&!e;o=o.parentElement)e=o.__vueParentComponent;let r=[];for(let o=0;e&&o<200&&r.length<7;o++,e=e.parent??void 0){let n=m(e);if(y.has(n)||!e.parent&&!e.type?.__file)continue;let s=e.type?.__file;r.push({name:n,...s?{source:{fileName:s}}:{reason:"It comes from a library, so it has no file in the app."},memo:false,forwardRef:false})}if(r.length)return{found:true,component:r[0],owners:r.slice(1)}}function V(t){for(let e=t;e;e=e.parentElement){let r=e.__vueParentComponent;for(;r&&y.has(m(r));)r=r.parent??void 0;if(r)return m(r)}}var A=15;function M(){let t=null;return{isSupported:()=>true,start(){t?.();let e=new Map,r=0,o=false,n=(a,f)=>{let l=m(a),u=e.get(l)??{mount:0,updates:0};u[f]+=1,e.set(l,u),o||(o=true,r+=1,queueMicrotask(()=>{o=false}))},s=h((a,f)=>{let l=f[3];a==="component:added"&&l&&typeof l=="object"&&n(l,"mount")}),i=b(a=>n(a,"updates"));t=()=>{s(),i();let a=[...e].map(([l,u])=>({name:l,renders:u.mount+u.updates,totalMs:0,maxMs:0,avgMs:0,causes:{...u.mount?{mount:u.mount}:{},...u.updates?{hooks:u.updates}:{}}})),f={mount:0,hooks:0};for(let l of a)f.mount+=l.causes.mount??0,f.hooks+=l.causes.hooks??0;return{totalCommits:r,totalRenders:a.reduce((l,u)=>l+u.renders,0),capturedDurations:false,totalRenderMs:0,causes:f,topComponents:a.sort((l,u)=>u.renders-l.renders).slice(0,A)}}},stop(){let e=t;return t=null,e?e():null}}}import{registerBrowserNetwork as k}from"@buoy-gg/core/web/register-network";var E=globalThis;E.__BUOY_FRAMEWORK__!=="nuxt"&&(E.__BUOY_FRAMEWORK__="vue");O();b();globalThis[Symbol.for("buoy.dom.componentName")]=V;globalThis[Symbol.for("buoy.dom.componentSource")]=v;globalThis[Symbol.for("buoy.framework.renderCapture")]=M();export{k as registerBrowserNetwork};

package/lib/router.d.ts

@@ -0,0 +1,41 @@
+/** The parts of a Vue Router location the Routes link reads. */
+export interface BuoyVueRouteLocation {
+    path: string;
+    fullPath: string;
+    name?: string | symbol | null;
+    params: Record<string, string | string[] | undefined>;
+    query: Record<string, unknown>;
+    matched: {
+        path: string;
+    }[];
+}
+/** The parts of a Vue Router 4 or 5 instance the Routes link reads. */
+export interface BuoyVueRouter {
+    afterEach(guard: (to: BuoyVueRouteLocation, from: BuoyVueRouteLocation, failure?: unknown) => unknown): () => void;
+    isReady(): Promise<unknown>;
+    currentRoute: {
+        value: BuoyVueRouteLocation;
+    };
+    getRoutes(): {
+        path: string;
+        children?: unknown[];
+    }[];
+    push(to: string): Promise<unknown>;
+    replace(to: string): Promise<unknown>;
+    back(): void;
+    addRoute?: (...args: never[]) => unknown;
+    removeRoute?: (...args: never[]) => unknown;
+}
+/**
+ * Vue Router paths in the Routes tool's form. `:id`, `:id?` and `:id(\\d+)`
+ * become `[id]`; repeatable `:id+` and `:id*` become `[...id]`.
+ */
+export declare function vueRouteTemplate(pattern: string): string;
+/** Every page path the router knows, as templates. Routes with only children are layouts, not pages. */
+export declare function vueRoutePaths(router: Pick<BuoyVueRouter, 'getRoutes'>): string[];
+/**
+ * Report Vue Router page changes to the Routes tool with their names and
+ * params, and let the tool's Go button and the MCP navigate through the
+ * router. Raw history capture stops adding its own events while this runs.
+ */
+export declare function connectBuoyRouter(router: BuoyVueRouter): () => void;

package/lib/router.mjs

@@ -0,0 +1 @@
+import{claimBrowserRouteEvents as $,registerBrowserRoutes as d,routeObserver as k}from"@buoy-gg/route-events/web";import{registerBrowserRouter as S}from"@buoy-gg/shared-ui/web/utils";function f(t){return`/${t}`.replace(/\/+/g,"/").replace(/(.)\/$/,"$1").replace(/:(\w+)(\((?:[^()]|\([^()]*\))*\))?([?+*])?/g,(a,r,n,s)=>s==="+"||s==="*"?`[...${r}]`:`[${r}]`)}function h(t){let a=t.getRoutes().filter(r=>!r.children?.length).map(r=>f(r.path));return[...new Set(a)]}function O(t){let a={};for(let[r,n]of Object.entries(t))Array.isArray(n)?a[r]=n.filter(s=>s!=null).map(String):n!=null&&(a[r]=String(n));return a}function E(t){let a=$(),r=d(h(t)),n=()=>{r(),r=d(h(t))},s=e=>{e.catch(()=>{})},b=S({push:e=>s(t.push(e)),replace:e=>s(t.replace(e)),back:()=>t.back(),canGoBack:()=>typeof history<"u"&&!!history.state?.back}),m=[];for(let e of["addRoute","removeRoute"]){let o=t[e];typeof o=="function"&&(t[e]=function(...l){let u=o.apply(this??t,l);return n(),u},m.push(()=>{t[e]=o}))}let g,i,v,c=true,y=e=>{if(!c||e.fullPath===v)return;v=e.fullPath;let o=e.matched[e.matched.length-1]?.path??e.path,l=f(o),u=O(e.query);for(let[P,R]of Object.entries(e.params))R!==void 0&&(u[P]=R);let B=typeof e.name=="string"?e.name:o,p=Date.now();k.emit({pathname:e.path,params:u,segments:l.split("/").filter(Boolean),routeName:B,matchedPath:o,previousPathname:g,timestamp:p,timeSincePrevious:i===void 0?void 0:p-i}),g=e.path,i=p},w=t.afterEach((e,o,l)=>{l||y(e)});return t.isReady().then(()=>y(t.currentRoute.value),()=>{}),()=>{if(c){c=false,w();for(let e of m.splice(0))e();r(),a(),b()}}}export{E as connectBuoyRouter,h as vueRoutePaths,f as vueRouteTemplate};

package/package.json

@@ -1,6 +1,99 @@
 {
   "name": "@buoy-gg/vue",
-  "version": "0.0.0-stage",
-  "stub": true,
-  "description": "Temporary package placeholder for staged publishing"
+  "version": "7.0.75",
+  "description": "Run Buoy in a Vue or Nuxt app.",
+  "type": "module",
+  "exports": {
+    ".": {
+      "types": "./lib/index.d.ts",
+      "buoy-disabled": "./lib/disabled/index.mjs",
+      "default": "./lib/index.mjs"
+    },
+    "./register": {
+      "types": "./lib/register.d.ts",
+      "buoy-disabled": "./lib/disabled/register.mjs",
+      "default": "./lib/register.mjs"
+    },
+    "./router": {
+      "types": "./lib/router.d.ts",
+      "buoy-disabled": "./lib/disabled/router.mjs",
+      "default": "./lib/router.mjs"
+    },
+    "./pinia": {
+      "types": "./lib/pinia.d.ts",
+      "buoy-disabled": "./lib/disabled/pinia.mjs",
+      "default": "./lib/pinia.mjs"
+    },
+    "./highlights": {
+      "types": "./lib/highlights.d.ts",
+      "buoy-disabled": "./lib/disabled/highlights.mjs",
+      "default": "./lib/highlights.mjs"
+    },
+    "./nuxt": {
+      "types": "./lib/nuxt.d.ts",
+      "default": "./lib/nuxt.mjs"
+    },
+    "./package.json": "./package.json"
+  },
+  "types": "./lib/index.d.ts",
+  "files": [
+    "lib",
+    "README.md"
+  ],
+  "sideEffects": [
+    "./lib/register.mjs",
+    "./lib/disabled/register.mjs"
+  ],
+  "dependencies": {
+    "react": "^19.2.0",
+    "react-dom": "^19.2.0",
+    "react-native-web": "^0.21.2",
+    "@buoy-gg/shared-ui": "^7.0.75",
+    "@buoy-gg/core": "^7.0.75"
+  },
+  "peerDependencies": {
+    "vue": ">=3.3 <4"
+  },
+  "peerDependenciesMeta": {
+    "vue-router": {
+      "optional": true
+    },
+    "pinia": {
+      "optional": true
+    },
+    "@tanstack/vue-query": {
+      "optional": true
+    },
+    "@tanstack/react-query": {
+      "optional": true
+    },
+    "@buoy-gg/route-events": {
+      "optional": true
+    },
+    "@buoy-gg/zustand": {
+      "optional": true
+    },
+    "@buoy-gg/highlight-updates": {
+      "optional": true
+    },
+    "nuxt": {
+      "optional": true
+    }
+  },
+  "devDependencies": {
+    "vue": "3.5.44",
+    "vue-router": "5.4.0",
+    "pinia": "4.1.0",
+    "@tanstack/vue-query": "5.104.5",
+    "esbuild": "^0.25.0",
+    "jsdom": "^26.1.0",
+    "typescript": "~5.8.3",
+    "vitest": "^3.2.0",
+    "@buoy-gg/zustand": "^7.0.75",
+    "@buoy-gg/route-events": "^7.0.75"
+  },
+  "scripts": {
+    "build": "node build.mjs && node ../../scripts/minify-lib.mjs && node ../../scripts/assert-minified.mjs",
+    "test": "vitest run --config vitest.config.mjs"
+  }
 }