{"_id":"@altrudevelop/dweav-connect","_rev":"3-9a0764adbb6433dcf37d51d80e739e88","name":"@altrudevelop/dweav-connect","dist-tags":{"latest":"1.1.0"},"versions":{"1.0.0":{"name":"@altrudevelop/dweav-connect","version":"1.0.0","keywords":["dweav","dweav-trace","debugging","state-tracing","devtools","react","vue","svelte","redux","zustand","pinia"],"author":{"name":"Altru.dev"},"license":"MIT","_id":"@altrudevelop/dweav-connect@1.0.0","maintainers":[{"name":"altrudev","email":"altrudevelop@gmail.com"}],"homepage":"https://altru.dev","bugs":{"url":"https://github.com/altrudevelop/dweav-connect/issues"},"dist":{"shasum":"f67fa079deaf6e938c7b1b34cecb195efc6c5b59","tarball":"https://registry.npmjs.org/@altrudevelop/dweav-connect/-/dweav-connect-1.0.0.tgz","fileCount":11,"integrity":"sha512-5vzXJOEL84EwNat9QhjapPSvlDaWSFTUtMD/i0wwYlmEDfnjZG+nlfDKXZ268DA/uwtdsPjYSxvhulwLyBLNjg==","signatures":[{"sig":"MEQCIHeg6mho6BQWb/hbtKvFfWhkqbR9+at+uXi5joozX/9DAiA+03g2JcWAIIRCpdMqiD3+XMG5ZujMrwXwMCvNJXnOOQ==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":27619},"main":"./src/index.js","exports":{".":"./src/index.js","./vue":"./src/vue.js","./pinia":"./src/pinia.js","./react":"./src/react.js","./redux":"./src/redux.js","./svelte":"./src/svelte.js","./zustand":"./src/zustand.js"},"gitHead":"eb8e3872741483c1612d7841df91303d66cc8c8f","_npmUser":{"name":"altrudev","email":"altrudevelop@gmail.com"},"repository":{"url":"git+https://github.com/altrudevelop/dweav-connect.git","type":"git"},"_npmVersion":"11.11.0","description":"Framework adapters for Dweav Trace — connect React, Vue, Svelte, Redux, Zustand, and Pinia to the Dweav Trace Chrome extension with zero configuration.","directories":{},"sideEffects":false,"_nodeVersion":"24.14.1","_hasShrinkwrap":false,"devDependencies":{"vue":"^3.0.0","react":"^18.0.0"},"peerDependencies":{"vue":">=3.0.0","pinia":">=2.0.0","react":">=16.8.0","redux":">=4.0.0","svelte":">=3.0.0","zustand":">=4.0.0"},"peerDependenciesMeta":{"vue":{"optional":true},"pinia":{"optional":true},"react":{"optional":true},"redux":{"optional":true},"svelte":{"optional":true},"zustand":{"optional":true}},"_npmOperationalInternal":{"tmp":"tmp/dweav-connect_1.0.0_1777268277383_0.2556810940841203","host":"s3://npm-registry-packages-npm-production"}},"1.0.3":{"name":"@altrudevelop/dweav-connect","version":"1.0.3","keywords":["dweav","dweav-trace","debugging","state-tracing","devtools","react","vue","svelte","redux","zustand","pinia"],"author":{"name":"Altru.dev"},"license":"MIT","_id":"@altrudevelop/dweav-connect@1.0.3","maintainers":[{"name":"altrudev","email":"altrudevelop@gmail.com"}],"homepage":"https://altru.dev","bugs":{"url":"https://github.com/altrudevelop/dweav-connect/issues"},"dist":{"shasum":"ae77e056f214d9476f5c8bd755b99da839fb8da4","tarball":"https://registry.npmjs.org/@altrudevelop/dweav-connect/-/dweav-connect-1.0.3.tgz","fileCount":11,"integrity":"sha512-s4PkcqSAx1sAzVCTabfHIDoaKdfUPgkLC5FFY89ZUGyXPu7NlJELQzK9pld6MVroZE/ZS7QxbMCb8i8PsdRYhQ==","signatures":[{"sig":"MEUCIEu4o4esIO6hBf9H4LMFCaI5Du0A2Zf2nWgRy5zNfe4PAiEA9wUlDaV6gfFITbKFpSeQXXyRorJctAQJJSBgu2pZSPU=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":27619},"main":"./src/index.js","exports":{".":"./src/index.js","./vue":"./src/vue.js","./pinia":"./src/pinia.js","./react":"./src/react.js","./redux":"./src/redux.js","./svelte":"./src/svelte.js","./zustand":"./src/zustand.js"},"gitHead":"19c5755e35bc6b8ccd0ae11890cdb7f1f26f242c","_npmUser":{"name":"altrudev","email":"altrudevelop@gmail.com"},"repository":{"url":"git+https://github.com/altrudevelop/dweav-connect.git","type":"git"},"_npmVersion":"11.11.0","description":"Framework adapters for Dweav Trace — connect React, Vue, Svelte, Redux, Zustand, and Pinia to the Dweav Trace Chrome extension with zero configuration.","directories":{},"sideEffects":false,"_nodeVersion":"24.14.1","_hasShrinkwrap":false,"devDependencies":{"vue":"^3.0.0","react":"^18.0.0"},"peerDependencies":{"vue":">=3.0.0","pinia":">=2.0.0","react":">=16.8.0","redux":">=4.0.0","svelte":">=3.0.0","zustand":">=4.0.0"},"peerDependenciesMeta":{"vue":{"optional":true},"pinia":{"optional":true},"react":{"optional":true},"redux":{"optional":true},"svelte":{"optional":true},"zustand":{"optional":true}},"_npmOperationalInternal":{"tmp":"tmp/dweav-connect_1.0.3_1777270252951_0.8025182451514381","host":"s3://npm-registry-packages-npm-production"}},"1.1.0":{"name":"@altrudevelop/dweav-connect","version":"1.1.0","description":"Framework adapters for Dweav Trace — connect React, Vue, Svelte, Redux, Zustand, and Pinia to the Dweav Trace Chrome extension with zero configuration.","author":{"name":"Altru.dev"},"license":"MIT","homepage":"https://altru.dev","repository":{"type":"git","url":"git+https://github.com/altrudevelop/dweav-connect.git"},"keywords":["dweav","dweav-trace","debugging","state-tracing","devtools","react","vue","svelte","redux","zustand","pinia"],"main":"./src/index.js","exports":{".":"./src/index.js","./react":"./src/react.js","./vue":"./src/vue.js","./svelte":"./src/svelte.js","./redux":"./src/redux.js","./zustand":"./src/zustand.js","./pinia":"./src/pinia.js","./src/react.js":"./src/react.js","./src/vue.js":"./src/vue.js","./src/svelte.js":"./src/svelte.js","./src/redux.js":"./src/redux.js","./src/zustand.js":"./src/zustand.js","./src/pinia.js":"./src/pinia.js","./src/core.js":"./src/core.js","./src/index.js":"./src/index.js"},"sideEffects":false,"peerDependencies":{"react":">=16.8.0","vue":">=3.0.0","svelte":">=3.0.0","redux":">=4.0.0","zustand":">=4.0.0","pinia":">=2.0.0"},"peerDependenciesMeta":{"react":{"optional":true},"vue":{"optional":true},"svelte":{"optional":true},"redux":{"optional":true},"zustand":{"optional":true},"pinia":{"optional":true}},"devDependencies":{"react":"^18.0.0","vue":"^3.0.0"},"gitHead":"119c59c26aba744b3836b55594450e078749d103","_id":"@altrudevelop/dweav-connect@1.1.0","bugs":{"url":"https://github.com/altrudevelop/dweav-connect/issues"},"_nodeVersion":"24.14.1","_npmVersion":"11.11.0","dist":{"integrity":"sha512-eKV6JI6MXHNeSOqrdJ23/uRhT9ygU2cHQsQI3nwEnAJ7JopYG4RPOui+VByl4Bs9ZiZ/E8A1dV2YcKAaSV2TTw==","shasum":"db0a3ab5695eee5a910181d4d0be05c69660527d","tarball":"https://registry.npmjs.org/@altrudevelop/dweav-connect/-/dweav-connect-1.1.0.tgz","fileCount":11,"unpackedSize":28359,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCIBuiukaeX6fUPBc3RC6jVTsTXiFh71Wy6lCashZYN/o8AiEAnj8mRAgC1AnepZ1nd62Fa0Us78be/943Kamv0Q1DCGo="}]},"_npmUser":{"name":"altrudev","email":"altrudevelop@gmail.com"},"directories":{},"maintainers":[{"name":"altrudev","email":"altrudevelop@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/dweav-connect_1.1.0_1777273605356_0.38881733158536047"},"_hasShrinkwrap":false}},"time":{"created":"2026-04-27T05:37:57.301Z","modified":"2026-04-27T07:06:45.623Z","1.0.0":"2026-04-27T05:37:57.517Z","1.0.3":"2026-04-27T06:10:53.114Z","1.1.0":"2026-04-27T07:06:45.492Z"},"bugs":{"url":"https://github.com/altrudevelop/dweav-connect/issues"},"author":{"name":"Altru.dev"},"license":"MIT","homepage":"https://altru.dev","keywords":["dweav","dweav-trace","debugging","state-tracing","devtools","react","vue","svelte","redux","zustand","pinia"],"repository":{"type":"git","url":"git+https://github.com/altrudevelop/dweav-connect.git"},"description":"Framework adapters for Dweav Trace — connect React, Vue, Svelte, Redux, Zustand, and Pinia to the Dweav Trace Chrome extension with zero configuration.","maintainers":[{"name":"altrudev","email":"altrudevelop@gmail.com"}],"readme":"# @altrudevelop/dweav-connect\n\nFramework adapters for [Dweav Trace](https://altru.dev) — the privacy-first, offline-first state tracing Chrome extension.\n\nConnect React, Vue, Svelte, Redux, Zustand, and Pinia to Dweav Trace with a single line of code. Zero configuration. Zero cost in production if the extension is not installed.\n\n---\n\n## Installation\n\n```bash\nnpm install @altrudevelop/dweav-connect\n```\n\nCommit the change.\n\n---\n\n**Complete project status:**\n\n| Component | Status |\n|---|---|\n| Dweav Trace Chrome Extension | ✅ Built & tested |\n| Bug fixes (7 bugs) | ✅ Complete |\n| Phase 1 — Quality of life features | ✅ Complete |\n| Phase 2 — Power features | ✅ Complete |\n| `@altrudevelop/dweav-connect` NPM package | ✅ Published |\n\nQuite a journey to get that package published! What would you like to work on next?\n\n---\n\n## How it works\n\nDweav Trace exposes a `window.dweav()` global on every page where it is installed. This package provides thin, framework-native wrappers around that global so you never have to think about it. If the extension is not installed, every adapter silently no-ops — your app behaves identically in production.\n\n---\n\n## React / Next.js\n\n```js\nimport { useDweavTrace } from '@altrudevelop/dweav-connect/react';\n\nfunction UserProfile() {\n const [user, setUser] = useState({ name: 'Sean', role: 'guest' });\n\n // One line — traces every time `user` changes.\n useDweavTrace(user, 'User Profile');\n\n return
{user.name}
;\n}\n```\n\n### Drop-in useState replacement\n\n```js\nimport { useDweavRef } from '@altrudevelop/dweav-connect/react';\n\nfunction Counter() {\n // Identical API to useState — traces automatically on every update.\n const [count, setCount] = useDweavRef(0, 'Counter');\n return ;\n}\n```\n\n### Tracing React Context\n\n```js\nimport { useDweavContext } from '@altrudevelop/dweav-connect/react';\n\nfunction App() {\n const auth = useContext(AuthContext);\n useDweavContext(auth, 'Auth Context');\n ...\n}\n```\n\n---\n\n## Vue 3 (Composition API)\n\n```js\nimport { useDweav } from '@altrudevelop/dweav-connect/vue';\n\nconst profile = reactive({ role: 'admin', permissions: [] });\n\n// Deep watch — any nested mutation fires a trace automatically.\nuseDweav(profile, 'Admin Profile');\n\n// Mutations anywhere in the tree are captured:\nprofile.permissions.push('write'); // → card appears in Dweav Trace\n```\n\n### Tracing a ref()\n\n```js\nimport { useDweavRef } from '@altrudevelop/dweav-connect/vue';\n\nconst count = ref(0);\nuseDweavRef(count, 'Counter');\ncount.value++; // → card fires automatically\n```\n\n---\n\n## Svelte\n\n```js\nimport { attachDweav } from '@altrudevelop/dweav-connect/svelte';\nimport { onDestroy } from 'svelte';\nimport { userStore } from './stores.js';\n\nconst unsubscribe = attachDweav(userStore, 'User Store');\nonDestroy(unsubscribe); // Always clean up on component destroy\n```\n\n### Multiple stores at once\n\n```js\nimport { attachDweavMulti } from '@altrudevelop/dweav-connect/svelte';\n\nconst cleanup = attachDweavMulti(\n [userStore, cartStore, settingsStore],\n ['User', 'Cart', 'Settings']\n);\nonDestroy(cleanup);\n```\n\n---\n\n## Redux / Redux Toolkit\n\n```js\nimport { dweavMiddleware } from '@altrudevelop/dweav-connect/redux';\n\n// RTK (recommended)\nconst store = configureStore({\n reducer: rootReducer,\n middleware: (getDefaultMiddleware) =>\n getDefaultMiddleware().concat(dweavMiddleware),\n});\n\n// Every action now appears in Dweav Trace labelled with its action.type.\n// dispatch({ type: 'user/setRole', payload: 'admin' })\n// → card labelled \"⚡ user/setRole\" appears automatically\n```\n\n### With filtering (skip noisy actions)\n\n```js\nimport { createDweavMiddleware } from '@altrudevelop/dweav-connect/redux';\n\nconst middleware = createDweavMiddleware({\n filter: (action) => !action.type.startsWith('@@'), // skip internal Redux actions\n transform: (state) => state.user, // trace only the user slice\n prefix: '🔥',\n});\n```\n\n---\n\n## Zustand\n\n```js\nimport { dweav } from '@altrudevelop/dweav-connect/zustand';\nimport { create } from 'zustand';\n\nconst useUserStore = create(\n dweav(\n (set) => ({\n name: 'Sean',\n role: 'guest',\n setRole: (role) => set({ role }),\n }),\n 'User Store'\n )\n);\n\n// useUserStore().setRole('admin') → card fires automatically\n```\n\n### Attach to an existing store externally\n\n```js\nimport { attachDweavToStore } from '@altrudevelop/dweav-connect/zustand';\n\nconst unsubscribe = attachDweavToStore(useUserStore, 'User Store');\n```\n\n---\n\n## Pinia (Vue 3)\n\n### Trace all stores automatically (recommended)\n\n```js\nimport { createApp } from 'vue';\nimport { createPinia } from 'pinia';\nimport { DweavPiniaPlugin } from '@altrudevelop/dweav-connect/pinia';\n\nconst pinia = createPinia();\npinia.use(DweavPiniaPlugin); // ← one line traces every store in your app\n\ncreateApp(App).use(pinia).mount('#app');\n```\n\n### Trace a single store\n\n```js\nimport { tracePiniaStore } from '@altrudevelop/dweav-connect/pinia';\n\nconst authStore = useAuthStore();\nconst stop = tracePiniaStore(authStore, 'Auth');\n// stop() to unsubscribe\n```\n\n---\n\n## Core utilities\n\nAvailable from the root import if you need lower-level access:\n\n```js\nimport { isDweavAvailable, trace, watch } from '@altrudevelop/dweav-connect';\n\n// Check if the extension is installed\nif (isDweavAvailable()) {\n console.log('Dweav Trace is active');\n}\n\n// Safe wrapper around window.dweav() — no-ops if not installed\ntrace(myState, 'Manual trace');\n\n// Safe wrapper around window.dweav.watch()\nconst proxy = watch(myObject, 'Watched object');\n```\n\n---\n\n## Production safety\n\nEvery adapter checks for the presence of `window.dweav` before doing anything. If the Dweav Trace extension is not installed:\n\n- `useDweavTrace` — no-ops silently, no re-renders triggered\n- `useDweav` / `useDweavRef` — watcher still runs, trace call is skipped\n- `attachDweav` — subscribes but skips the trace call\n- `dweavMiddleware` — passes action through normally, skips trace\n- `dweav` (Zustand) — `set()` works normally, trace is skipped\n- `DweavPiniaPlugin` — `$subscribe` runs normally, trace is skipped\n\nZero performance cost in production beyond a single `typeof window.dweav === 'function'` check per trace call.\n\n---\n\n## SSR / Server Components\n\nAll adapters include `typeof window !== 'undefined'` guards. They are safe to import in SSR environments (Next.js App Router, Nuxt, SvelteKit). Tracing only activates client-side where the extension can be present.\n\nFor Next.js App Router, use `useDweavTrace` inside Client Components only (files with `'use client'` at the top).\n\n---\n\n## License\n\nMIT © [Altru.dev](https://altru.dev)\n","readmeFilename":"README.md"}