docs: Make Managers page work for Vue; never import @data-client/core in examples

[ntucker]

Requested by Nathaniel · project thread

Motivation

/vue/concepts/managers showed React-only code: managers imported from @data-client/react, the IndexedDB restore rendered <DataProvider>, and the React Coin App demo appeared at the bottom. Other examples imported @data-client/core, which apps don't install directly (it's a transitive dependency), so those imports break under strict package managers.

Solution

Framework-agnostic code (managers, middleware) is written once with @data-client/react imports. A new framework-imports fence flag swaps them for @data-client/vue on Vue pages:

```ts framework-imports
import type { Manager, Middleware } from '@data-client/react';
```

React page:

import type { Manager, Middleware } from '@data-client/react';

Vue page:

import type { Manager, Middleware } from '@data-client/vue';

• website/framework-docs/remarkFramework.js adds the rewrite. It's opt-in, so React-only blocks (like DataProvider setups) are never relabeled as Vue code. Documented in framework-docs/README.md and the packages-documentation skill.
• The Playground editor now loads @data-client/vue types, so TypeScriptEditor blocks resolve on Vue pages (checked in the browser: no type errors on /vue/api/Manager).
• No example imports @data-client/core anymore: managers.md, Manager.md, Controller.md, the README StreamManager (now one block instead of a react/vue pair), render-as-you-fetch and resource.md.
• managers.md is split per framework only where the code differs: Sentry (@sentry/react vs @sentry/vue) and the IndexedDB restore, which gets a Vue main.ts:

const managers = [...getDefaultManagers(), new PersistManager()];
const initialState = await get('data-client');

const app = createApp(App);
app.use(DataClientPlugin, { initialState, managers });
app.mount('#app');

• The Coin App StackBlitz and the oversimplified useQuery/useCache hook examples are React-only. vue_title added.

Docs and website only, no changeset. Verified with yarn workspace rdc-website build: the Vue managers page shows only @data-client/vue imports and the React page only @data-client/react.

Open questions

Other shared blocks that still render React-only code on Vue pages (expiry-policy, normalization, mockInitialState, parts of Controller, _useCancelling/_useTransition) are handed off to a separate PR. Provider setups are covered by #4129.

🤖 Generated with Claude Code

https://claude.ai/code/session_01XbMoSgP3nZE1bn2HkHpXva

---

Note

Low Risk
Documentation, remark plugin, and Playground type stubs only; no runtime library or API behavior changes.

Overview
Fixes Vue /vue/concepts/managers showing React-only snippets and documents manager/middleware examples against installable packages (@data-client/react / @data-client/vue) instead of @data-client/core.

Adds an opt-in framework-imports code-fence flag handled by remarkFramework.js: authors write @data-client/react once and Vue builds rewrite it to @data-client/vue. Shared examples (logging, streams, DevTools predicates, etc.) collapse from duplicated :::react/:::vue pairs into single fences; framework-specific setup stays split (Sentry packages, IndexedDB restore with DataProvider vs DataClientPlugin + main.ts). Policy is documented in framework-docs/README.md and the packages-documentation skill.

Playground/Monaco now loads @data-client/vue editor types (copywebsitetypes.sh, typeLibs.ts) so TypeScriptEditor blocks type-check on Vue pages. Generated agent skill references mirror the doc edits. React-only Coin App StackBlitz is wrapped in :::react; vue_title added for the managers concept page.

^{Reviewed by Cursor Bugbot for commit 50ab2e0. Bugbot is set up for automated code reviews on this repo. Configure here.}

[changeset-bot]

⚠️ No Changeset found

Latest commit: 50ab2e0

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated
docs-site	Ready	Preview	Oct 5, 2026 7:30am UTC

[codecov]

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 98.06%. Comparing base (f7cb76b) to head (c84c5e3).
⚠️ Report is 2 commits behind head on master.

Additional details and impacted files

@@           Coverage Diff           @@
##           master    #4128   +/-   ##
=======================================
  Coverage   98.06%   98.06%           
=======================================
  Files         163      163           
  Lines        3095     3095           
  Branches      616      616           
=======================================
  Hits         3035     3035           
  Misses         18       18           
  Partials       42       42           

☔ View full report in Codecov by Harness.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:

• ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.