Refactor components for attribute fallthrough

[jakeboone02]

Summary by CodeRabbit

• New Features

  • Improved support for reactive query managers, including undo/redo behavior.
  • Enhanced bulk control customization with more precise targeting.
  • Added support for consumer-supplied attributes on built-in controls.

• Bug Fixes

  • Prevented unrelated control properties from appearing as HTML attributes.
  • Improved attribute forwarding while preserving component-specific behavior.

• Documentation

  • Updated customization, compatibility, and migration guidance.
  • Documented the removal of the package-level controlKeys export and updated core version requirements.

[coderabbitai]

Warning

Review limit reached

@jakeboone02, you've reached your PR review limit, so we couldn't start this review.

Next review available in: 104 minutes

You've used all free OSS reviews for now. Wait for the free limit to reset to keep reviewing this public repository.

How can I continue?

After more reviews become available, a review can be triggered using the @coderabbitai review command as a PR comment. Alternatively, push new commits to this PR.

To avoid repeated limits, reduce automatic review volume by pausing incremental auto-reviews earlier, using label-based review opt-in, excluding WIP or generated PR titles, or requesting reviews manually when the PR is ready. If your team needs uninterrupted high-volume reviews, an organization admin can enable usage-based reviews.

How do review limits work?

CodeRabbit enforces per-developer PR review limits for each organization. Most developers receive the normal plan review availability.

For paid Pro and Pro+ PR reviews, CodeRabbit uses adaptive limits for sustained high-volume activity. When a developer's recent PR review activity reaches the 95th percentile or higher among CodeRabbit users, additional reviews become available more gradually as earlier reviews age out of the rolling window.

Please refer docs for additional details.

Review details

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro Plus

Run ID: 89a74bef-89e7-45d4-8ee9-07f5d0ecdce3

📥 Commits

Reviewing files that changed from the base of the PR and between 948aa74 and 031e76e.

📒 Files selected for processing (1)

• packages/vue-querybuilder/src/components/controlProps.test.ts

📝 Walkthrough

Walkthrough

Changes

Vue control runtime updates

Layer / File(s)	Summary
Core metadata and bulk override resolution packages/vue-querybuilder/package.json, packages/vue-querybuilder/src/composables/context.ts, packages/vue-querybuilder/src/composables/context.test.ts, CHANGELOG.md, docs/differences-from-react-querybuilder.md	Core 8.23.0 metadata now defines supported control keys and bulk action or selector override membership.
Control prop contracts and attribute fallthrough packages/vue-querybuilder/src/components/*, packages/vue-querybuilder/src/internal/RuleComponents.vue, packages/vue-querybuilder/src/components/controlProps.test.ts, packages/vue-querybuilder/src/types/types.test-d.ts, docs/customization.md, AGENTS.md	Default controls allow attribute fallthrough. Shared rule props are passed selectively. Runtime and compile-time checks validate control prop declarations.
Reactive QueryManager handling packages/vue-querybuilder/src/composables/useQueryBuilder.ts, packages/vue-querybuilder/src/composables/useQueryBuilder.test.ts, packages/vue-querybuilder/src/components/UndoRedoActions.vue, packages/vue-querybuilder/src/components/UndoRedoActions.test.ts, docs/differences-from-react-querybuilder.md, AGENTS.md	QueryManager instances are accessed directly through Vue reactive proxies. Undo and reconfiguration paths no longer call toRaw().

Estimated code review effort: 3 (Moderate) | ~25 minutes

Mergeability Score: 🟡 Moderate · up to 948aa

The refactor changes how component attributes and optional control props are handled. MatchModeEditor can currently drop consumer attributes and listeners and emit Vue warnings, while ValueSelector may turn omitted Boolean options into false; these bounded compatibility issues should be fixed before merge.

Sequence Diagram(s)

sequenceDiagram
  participant QueryBuilder
  participant RuleComponents
  participant DefaultControl
  participant DOM
  QueryBuilder->>RuleComponents: Render query controls
  RuleComponents->>DefaultControl: Pass declared control props
  DefaultControl->>DOM: Forward consumer attributes

Loading

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title clearly summarizes the primary component changes for Vue attribute fallthrough documented and tested in the pull request.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.

✨ Finishing Touches

📝 Generate docstrings

• Create stacked PR
• Commit on current branch

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch idiomaticity-2

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}

[coderabbitai]

Actionable comments posted: 3

🤖 Prompt for all review comments with AI agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In `@packages/vue-querybuilder/src/components/controlProps.test.ts`:
- Around line 64-105: Add a list-valued field with a values collection and a
corresponding rule to the test fixtures, ensuring the QueryBuilder renders
valueSelector. After rendering, explicitly assert that received.valueSelector
has at least one recorded prop before evaluating the complete-coverage
assertion, so the gate cannot pass without exercising that control.

In `@packages/vue-querybuilder/src/components/MatchModeEditor.vue`:
- Around line 16-19: Update MatchModeEditor to explicitly route fallthrough
attributes, including id, class, and listeners, to the intended child control or
wrap both roots in a single element that receives $attrs. Preserve the existing
component structure and add regression coverage verifying these attributes reach
the rendered control.

In `@packages/vue-querybuilder/src/components/ValueSelector.vue`:
- Around line 19-25: Update the props declaration in ValueSelector using
VersatileSelectorProps to explicitly default disabled, multiple, and
listsAsArrays to undefined, preserving undefined when those optional Boolean
props are absent rather than allowing Vue to cast them to false.

🪄 Autofix

Fix all unresolved CodeRabbit comments on this PR:

• Push a commit to this branch (recommended)
• Create a new PR with the fixes

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro Plus

Run ID: bec355ca-8b47-4fae-a02b-580ea4d57f8e

📥 Commits

Reviewing files that changed from the base of the PR and between f8f5912 and 948aa74.

⛔ Files ignored due to path filters (1)

• bun.lock is excluded by !**/*.lock

📒 Files selected for processing (23)

• AGENTS.md
• CHANGELOG.md
• docs/customization.md
• docs/differences-from-react-querybuilder.md
• packages/vue-querybuilder/package.json
• packages/vue-querybuilder/src/components/ActionElement.vue
• packages/vue-querybuilder/src/components/InlineCombinator.vue
• packages/vue-querybuilder/src/components/MatchModeEditor.vue
• packages/vue-querybuilder/src/components/NotToggle.test.ts
• packages/vue-querybuilder/src/components/NotToggle.vue
• packages/vue-querybuilder/src/components/ShiftActions.test.ts
• packages/vue-querybuilder/src/components/ShiftActions.vue
• packages/vue-querybuilder/src/components/UndoRedoActions.test.ts
• packages/vue-querybuilder/src/components/UndoRedoActions.vue
• packages/vue-querybuilder/src/components/ValueEditor.vue
• packages/vue-querybuilder/src/components/ValueSelector.vue
• packages/vue-querybuilder/src/components/controlProps.test.ts
• packages/vue-querybuilder/src/composables/context.test.ts
• packages/vue-querybuilder/src/composables/context.ts
• packages/vue-querybuilder/src/composables/useQueryBuilder.test.ts
• packages/vue-querybuilder/src/composables/useQueryBuilder.ts
• packages/vue-querybuilder/src/internal/RuleComponents.vue
• packages/vue-querybuilder/src/types/types.test-d.ts