docs(skills): Add data-client-vue agent skill

[ntucker]

Requested by Nathaniel · project thread

Motivation

Vue users were pointed at the data-client-react skill, and the setup/rest/endpoint/graphql skills already say "apply skill data-client-react or data-client-vue", but data-client-vue didn't exist. The Vue Agent Skills page also listed the React-only skills, and the OpenSkills install tab failed whenever specific skills were listed (openskills has no --skill option).

Solution

Adds .agents/skills/data-client-vue, mirroring the React skill's structure (pairs with the existing data-client-vue-testing):

• DataClientPlugin setup, every composable, mutations via useController()/$dataClient, useLoading, useDebounce, Query, managers, best practices.
• Vue-specific guidance: results are refs (.value in script, unwrapped in templates); pass getter args so data follows props (links the shared _vueArgs docs); <Suspense> + onErrorCaptured instead of AsyncBoundary.

<script setup lang="ts">
const props = defineProps<{ id: number }>();
// refetches when props.id changes
const todo = await useSuspense(TodoResource.get, () => ({ id: props.id }));
</script>

• references.json generates the Vue sections of the shared docs with yarn build:skills (docs(skills): Generate skill references from the docs #4170).
• evals/evals.json with a Vue port of the batch ctrl.set([Entity], rows) eval, plus a reactive-prop-args eval.

data-client-vue-testing fixes:

• Adds a vue-test-utilities reference (a copy of packages/vue/src/test/README.md, since generated references only read docs/), the Vue guide for renderDataCompose()/mountDataClient().
• The skill and that README said async setup can't follow prop changes; with getter args it does, so both now show getters:

// before: read once, never refetches when props.id changes
const article = await useSuspense(MyResource.get, { id: props.id });
// after
const article = await useSuspense(MyResource.get, () => ({ id: props.id }));

Docs:

• agent-skills.md: React pages list /data-client-react and /data-client-react-testing; Vue pages list /data-client-vue and /data-client-vue-testing. The OpenSkills tab installs that framework's recommended skills (shared + framework), since OpenSkills has no picker groups.
• SkillTabs: the OpenSkills tab installs each listed skill by path instead of the unsupported --skill flag. This also fixes the REST pages:

# before (fails: unknown option '--skill')
npx openskills install reactive/data-client --skill data-client-rest
# after
npx openskills install reactive/data-client/.agents/skills/data-client-rest

• debugging.md points Vue pages at the Vue skill and drops docs: Vue versions in debugging guide #4116's "the skill is named for React" note.

No changeset (skills and docs only).

Open questions

Follow-ups: grouping skills (Core/React/Vue) in the npx skills add picker ships in #4153; once #4143 merges, link the DataClientPlugin reference.

🤖 Generated with Claude Code

https://claude.ai/code/session_01WEpX2AVQj3Xmn2Q51om3J4

---

Note

Low Risk
Documentation and agent-skill content only; no runtime or application code changes.

Overview
Introduces the data-client-vue agent skill so Vue projects get first-class guidance for @data-client/vue (DataClientPlugin, composables, Suspense/onErrorCaptured, getter-based reactive args, batch ctrl.set([Entity], rows)), with generated reference docs, references.json, and evals for CSV import and reactive prop fetching.

data-client-vue-testing is aligned with that model: it documents mountDataClient / renderDataCompose in a new vue-test-utilities reference, and replaces the old “async setup can’t follow props” note with getter arguments for useSuspense (same fix in packages/vue/src/test/README.md).

Docs/site: agent-skills.md splits React vs Vue skill lists; SkillTabs OpenSkills tab installs each skill by path (npx openskills install …/.agents/skills/<name>) instead of unsupported --skill; debugging.md points Vue readers at the Vue skill.

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

[changeset-bot]

⚠️ No Changeset found

Latest commit: 0e3e008

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.

1 Skipped Deployment

Project	Deployment	Actions	Updated
docs-site	Ignored	Preview	Oct 5, 2026 3:39am UTC

[github-actions]

Size Change: 0 B

Total Size: 103 kB

ℹ️ View Unchanged

Filename	Size
examples/test-bundlesize/dist/App.js	1.46 kB
examples/test-bundlesize/dist/polyfill.js	307 B
examples/test-bundlesize/dist/rdcClient.js	10.9 kB
examples/test-bundlesize/dist/rdcEndpoint.js	8.07 kB
examples/test-bundlesize/dist/rdcNextjs.js	12.3 kB
examples/test-bundlesize/dist/rdcPipeableStream.js	9.64 kB
examples/test-bundlesize/dist/react.js	59.7 kB
examples/test-bundlesize/dist/webpack-runtime.js	784 B

_{compressed-size-action}

[codecov]

Codecov Report

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

Additional details and impacted files

@@           Coverage Diff           @@
##           master    #4126   +/-   ##
=======================================
  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.

[ntucker]

Staff engineer (Cursor agent): Follow-up after merge, no change needed on this PR.

At 826baf6b, the Vue references now come from references.json the same way as the other skills, and _vueArgs.md is generated too. That's the right direction.

The exception is data-client-vue-testing/references/vue-test-utilities.md. It's a byte-for-byte copy of packages/vue/src/test/README.md (307 lines) with no generated header. The skills check (yarn build:skills --check) only covers files generated from docs/, so when the README or the @data-client/vue/test API changes, nothing catches this copy going stale. The only safeguard is the "update hand-written references" line in .cursor/rules/skills-sync.mdc.

Later: move the Vue testing guide into docs/ (Vue has no testing page there yet, since the unit-testing-* guides are React-only) and list it in data-client-vue-testing/references.json, so the generator owns it and the README can link to the doc. This is the same follow-up as the copied DevTools guide in #4153, and both could go in one pass.