* fix(@vben-core/form-ui): strip native name attr when fieldName collides with form properties
An <input name="nodeName"> inside a vben form hijacks the form.nodeName
accessor: it returns the control element instead of the string "FORM".
When a TreeSelect dropdown opens, popper/floating computation walks the
ancestor chain and calls getNodeName(form) -> form.nodeName.toLowerCase(),
which throws. Strip the native name attribute only for field names that
collide with <form> built-in properties (nodeName, action, id, name,
title, ...); the outer tanstack Field name binding used for field
location is unaffected.
closes#8214
Co-Authored-By: EvoX <evox@evomap.ai>
* fix(@vben-core/form-ui): 字段名与 <form> 固有属性冲突时剥离原生 name (#8214)
Co-Authored-By: EvoX <evox@evomap.ai>
* fix(@vben-core/form-ui): keep name-resolved model bindings intact in conflict sweep (#8214)
Co-Authored-By: EvoX <evox@evomap.ai>
* fix(@vben-core/form-ui): preserve declared name props in conflict sweep (#8214)
Co-Authored-By: EvoX <evox@evomap.ai>
* fix(@vben-core/form-ui): resolve string components before name-prop introspection (#8214)
Co-Authored-By: EvoX <evox@evomap.ai>
---------
Co-authored-by: EvoX <evox@evomap.ai>
* feat(@vben-core/form-ui): support labelWidth auto alignment
Measure horizontal labels and align them to the widest one when
labelWidth is set to auto, allow string widths, and expose a single
form-render context that also carries the label-width registry.
Co-authored-by: Cursor <cursoragent@cursor.com>
* feat(@vben/playground): add form labelWidth auto demo
Provide an interactive example under Examples -> Form -> Label Auto
Width, with locales and route wiring, to showcase auto alignment.
Co-authored-by: Cursor <cursoragent@cursor.com>
---------
Co-authored-by: Cursor <cursoragent@cursor.com>
* refactor(@vben-core/form-ui)!: group field slot component props
* fix(@vben-core/form-ui): stabilize grouped field slot bindings
Resolve function-based common component props with field context.
Preserve internal model and event bindings when custom field slots spread componentProps.
Add regression coverage for array contexts, disabled precedence, and stale binding isolation.
* feat(@vben/vite-config): warn about field slot migration
Print the temporary field-slot migration warning when the development server starts.
Inject the same message into the browser console and keep the plugin serve-only.
* docs(@vben/docs): document field slot migration
Place the breaking field-slot notice at the start of both form documents.
Explain old and new bindings, development warnings, and planned notice removal.
* feat(@vben/playground): extend custom form example
Add a switchable input and select field to demonstrate schema component updates.
Update the composite phone field to emit new tuple values so validation observes changes.
* feat(@vben-core/form-ui): add typed form value codecs
* test(@vben-core/form-ui): cover codec value boundaries
* refactor(project): propagate form codec generics
* feat(@vben/plugins): propagate form codecs through vxe grids
* refactor(@vben/playground): migrate form codec examples
* refactor(@vben/playground): migrate query forms to codecs
* docs(@vben/docs): document form value codecs
* build(@vben-core/form-ui): update form validation dependencies
* refactor(@vben-core/form-ui): replace vee-validate with TanStack Form
* test(@vben-core/form-ui): cover TanStack Form migration
* docs(@vben/docs): document Zod 4 form migration
* refactor(project): update form adapters
* refactor(project): migrate application form consumers
* refactor(@vben/playground): migrate form examples
* docs(@vben/docs): fix validate return type and required rule empty check in form docs
* fix(@vben-core/form-ui): resolve oxlint and eslint errors
- rewrite nested ternary expressions as if/else in form-field-array.vue and form-runtime.ts
- sort @tanstack/vue-form before @vben-core/composables in package.json
* chore: fix merge artifacts and formatting
- move dependencies before devDependencies in root package.json
- update preferences snapshot for widget positioning fields
- format form-array demo README
* refactor(@vben-core/form-ui): optimize form runtime and value flow
- add fine-grained field selectors and atomic dependency resolution
- expose raw and formatted value snapshots with focused regression coverage
* fix(@vben/layouts): dispose sortable instance on unmount
* docs(@vben/docs): document form runtime API changes
- list added, changed, removed, and deprecated form APIs
- document atomic dependencies and raw versus formatted values
* feat(@vben-core/form-ui): support schema valueFormat on getValues
Some form fields emit UI-friendly structures such as time-range arrays,
while consumers and backend APIs often need a different payload shape.
This adds schema-level `valueFormat` hooks so `getValues()` can
normalize field output at read time without forcing callers to
post-process every submission path.
Constraint: Must preserve existing range-time mapping and nested field behavior
Constraint: Must not mutate live vee-validate form state while formatting output
Rejected: Global formatter config | too coarse for per-field payload shaping
Rejected: Post-submit-only transform | misses reset/query/change handlers
Confidence: high
Scope-risk: narrow
Reversibility: clean
Directive: Keep `getValues()` output derivation side-effect free
Directive: Clone raw form values before formatting derived payloads
Tested: vitest form-api test for valueFormat and existing getValues paths
Tested: oxlint on changed form-ui source and test files
Not-tested: Full repo typecheck baseline has unrelated .vue module resolution errors
* fix(@vben-core/form-ui): restore mount compatibility and share field path parsing
Follow-up review found two real regressions and one missing assertion in the
new value formatting flow. `FormApi.mount()` had become breaking by requiring
`componentRefMap`, and delete path resolution duplicated field-name parsing
instead of sharing the reader grammar. This patch restores backward
compatibility, centralizes field-name path parsing, and extends the test to
prove formatting does not mutate live form values.
Constraint: Must preserve current valueFormat behavior and nested field support
Constraint: Must not reintroduce mutation of live vee-validate values
Rejected: Keep duplicated delete parsing | risks grammar drift from read path
Rejected: Only loosen mount tests | would leave consumer-facing API breakage
Confidence: high
Scope-risk: narrow
Reversibility: clean
Directive: Reuse shared field-name parsing for read/delete semantics in form-ui
Tested: vitest form-api test suite
Tested: oxlint on changed form-ui files
Not-tested: Full repo typecheck baseline has unrelated .vue module resolution errors
EOF && git push hekx feature-form-value-format
* fix(@vben-core/form-ui): clear stale component refs on unmount
A follow-up review found that `unmount()` left the private component ref map
populated. Because `mount()` now accepts an optional `componentRefMap`, a later
mount without a new map could silently reuse stale refs from a prior form
instance. This change clears the ref map on unmount and adds a regression test
covering remount behavior without a new ref map.
Constraint: Must preserve backward-compatible optional `mount()` ref map behavior
Constraint: Focus and field-ref lookups must not observe stale refs after unmount
Rejected: Clear refs only during next mount | stale state would still leak between lifecycle calls
Rejected: Remove mount fallback entirely | would undo the compatibility fix
Confidence: high
Scope-risk: narrow
Reversibility: clean
Directive: When mount falls back to internal refs, unmount must always reset that cache
Tested: vitest form-api test suite
Tested: oxlint on changed form-api source and test files
Not-tested: Full repo typecheck baseline has unrelated .vue module resolution errors
* refactor(@vben-core/form-ui): trim redundant valueFormat plumbing
Review feedback identified a few small cleanups in the value formatting path.
This removes an unnecessary shallow clone in `getValues()`, reuses the
already-parsed `rawKey` from `resolveFieldNamePath()` instead of re-resolving
it in multiple helpers, and clarifies the `FormValueFormat` contract for
undefined-as-delete decomposition behavior.
Constraint: Must not change runtime valueFormat behavior or payload shape
Constraint: Documentation and helper cleanup should stay behavior-preserving
Rejected: Leave duplicate raw-key resolution in place | adds needless parsing churn
Rejected: Expand the formatter API further | outside the scope of this cleanup
Confidence: high
Scope-risk: narrow
Reversibility: clean
Directive: Keep read/format helper plumbing lean and avoid duplicate field-name parsing
Tested: vitest form-api test suite
Tested: oxlint on changed form-ui source and test files
Not-tested: Full repo typecheck baseline has unrelated .vue module resolution errors
* feat(@vben-core/form-ui): document valueFormat with live examples
The new `valueFormat` feature needed a concrete usage path in both the
playground and the docs so users can understand how raw component values differ
from the final payload returned by `getValues()`. This adds a dedicated form
example, wires it into the playground menu, and documents the API with an
interactive docs demo. The preview panels now stay in sync when values are set,
reset, or submitted.
Constraint: Must demonstrate both return-value and setValue decomposition flows
Constraint: Example previews must react to setValues, reset, and manual edits
Rejected: Only document via markdown snippet | insufficient for verifying live payload behavior
Rejected: Reuse an existing basic form page | would bury feature-specific behavior
Confidence: high
Scope-risk: narrow
Reversibility: clean
Directive: Keep playground and docs demos behaviorally aligned when extending valueFormat examples
Tested: eslint on playground/docs valueFormat demo files and route module
Tested: oxlint on playground route module
Not-tested: Full docs/playground app runtime was not launched in this session
* chore(@vben-core/form-ui): normalize valueFormat demo formatting
The previous feature/docs commit left a few formatter-only adjustments unstaged
after hooks rewrote line wrapping in the new demo and docs pages. This commit
captures those final non-behavioral formatting updates so the branch matches the
current working tree.
Constraint: Must not change runtime behavior or docs meaning
Rejected: Leave post-hook diffs unstaged | branch would not reflect local state
Confidence: high
Scope-risk: narrow
Reversibility: clean
Directive: After hook-driven rewrites, verify the working tree is clean before final push
Tested: Git diff inspection of remaining changes
Not-tested: No additional runtime verification needed; formatting-only follow-up
EOF && git push hekx feature-form-value-format
* fix(@vben-core/form-ui): remove docs demo dayjs dependency
The docs valueFormat demo imported `dayjs` directly even though the docs
package does not declare it as a dependency. That caused `@vben/docs:build`
to fail in CI during VitePress bundling. This change removes the direct
import, keeps the preview formatter generic for day-like values, and drops
the docs-only preset button that required constructing dayjs instances.
Constraint: Docs build must succeed without adding new package dependencies
Constraint: Playground example should remain unchanged and fully interactive
Rejected: Add dayjs to docs dependencies | unnecessary for a small display demo
Rejected: Externalize dayjs in VitePress build | hides a package boundary issue
Confidence: high
Scope-risk: narrow
Reversibility: clean
Directive: Docs demos should avoid imports only available through transitive deps
Tested: pnpm exec eslint docs/src/demos/vben-form/value-format/index.vue
Tested: pnpm --dir docs run build
Not-tested: No browser-side manual verification of the docs demo in this session
---------
Co-authored-by: caisin <caisin@caisins-Mac-mini.local>
* feat(@vben-core/form-ui): support schema valueFormat on getValues
Some form fields emit UI-friendly structures such as time-range arrays,
while consumers and backend APIs often need a different payload shape.
This adds schema-level `valueFormat` hooks so `getValues()` can
normalize field output at read time without forcing callers to
post-process every submission path.
Constraint: Must preserve existing range-time mapping and nested field behavior
Constraint: Must not mutate live vee-validate form state while formatting output
Rejected: Global formatter config | too coarse for per-field payload shaping
Rejected: Post-submit-only transform | misses reset/query/change handlers
Confidence: high
Scope-risk: narrow
Reversibility: clean
Directive: Keep `getValues()` output derivation side-effect free
Directive: Clone raw form values before formatting derived payloads
Tested: vitest form-api test for valueFormat and existing getValues paths
Tested: oxlint on changed form-ui source and test files
Not-tested: Full repo typecheck baseline has unrelated .vue module resolution errors
* fix(@vben-core/form-ui): restore mount compatibility and share field path parsing
Follow-up review found two real regressions and one missing assertion in the
new value formatting flow. `FormApi.mount()` had become breaking by requiring
`componentRefMap`, and delete path resolution duplicated field-name parsing
instead of sharing the reader grammar. This patch restores backward
compatibility, centralizes field-name path parsing, and extends the test to
prove formatting does not mutate live form values.
Constraint: Must preserve current valueFormat behavior and nested field support
Constraint: Must not reintroduce mutation of live vee-validate values
Rejected: Keep duplicated delete parsing | risks grammar drift from read path
Rejected: Only loosen mount tests | would leave consumer-facing API breakage
Confidence: high
Scope-risk: narrow
Reversibility: clean
Directive: Reuse shared field-name parsing for read/delete semantics in form-ui
Tested: vitest form-api test suite
Tested: oxlint on changed form-ui files
Not-tested: Full repo typecheck baseline has unrelated .vue module resolution errors
EOF && git push hekx feature-form-value-format
* fix(@vben-core/form-ui): clear stale component refs on unmount
A follow-up review found that `unmount()` left the private component ref map
populated. Because `mount()` now accepts an optional `componentRefMap`, a later
mount without a new map could silently reuse stale refs from a prior form
instance. This change clears the ref map on unmount and adds a regression test
covering remount behavior without a new ref map.
Constraint: Must preserve backward-compatible optional `mount()` ref map behavior
Constraint: Focus and field-ref lookups must not observe stale refs after unmount
Rejected: Clear refs only during next mount | stale state would still leak between lifecycle calls
Rejected: Remove mount fallback entirely | would undo the compatibility fix
Confidence: high
Scope-risk: narrow
Reversibility: clean
Directive: When mount falls back to internal refs, unmount must always reset that cache
Tested: vitest form-api test suite
Tested: oxlint on changed form-api source and test files
Not-tested: Full repo typecheck baseline has unrelated .vue module resolution errors
* refactor(@vben-core/form-ui): trim redundant valueFormat plumbing
Review feedback identified a few small cleanups in the value formatting path.
This removes an unnecessary shallow clone in `getValues()`, reuses the
already-parsed `rawKey` from `resolveFieldNamePath()` instead of re-resolving
it in multiple helpers, and clarifies the `FormValueFormat` contract for
undefined-as-delete decomposition behavior.
Constraint: Must not change runtime valueFormat behavior or payload shape
Constraint: Documentation and helper cleanup should stay behavior-preserving
Rejected: Leave duplicate raw-key resolution in place | adds needless parsing churn
Rejected: Expand the formatter API further | outside the scope of this cleanup
Confidence: high
Scope-risk: narrow
Reversibility: clean
Directive: Keep read/format helper plumbing lean and avoid duplicate field-name parsing
Tested: vitest form-api test suite
Tested: oxlint on changed form-ui source and test files
Not-tested: Full repo typecheck baseline has unrelated .vue module resolution errors
* feat(@vben-core/form-ui): document valueFormat with live examples
The new `valueFormat` feature needed a concrete usage path in both the
playground and the docs so users can understand how raw component values differ
from the final payload returned by `getValues()`. This adds a dedicated form
example, wires it into the playground menu, and documents the API with an
interactive docs demo. The preview panels now stay in sync when values are set,
reset, or submitted.
Constraint: Must demonstrate both return-value and setValue decomposition flows
Constraint: Example previews must react to setValues, reset, and manual edits
Rejected: Only document via markdown snippet | insufficient for verifying live payload behavior
Rejected: Reuse an existing basic form page | would bury feature-specific behavior
Confidence: high
Scope-risk: narrow
Reversibility: clean
Directive: Keep playground and docs demos behaviorally aligned when extending valueFormat examples
Tested: eslint on playground/docs valueFormat demo files and route module
Tested: oxlint on playground route module
Not-tested: Full docs/playground app runtime was not launched in this session
* chore(@vben-core/form-ui): normalize valueFormat demo formatting
The previous feature/docs commit left a few formatter-only adjustments unstaged
after hooks rewrote line wrapping in the new demo and docs pages. This commit
captures those final non-behavioral formatting updates so the branch matches the
current working tree.
Constraint: Must not change runtime behavior or docs meaning
Rejected: Leave post-hook diffs unstaged | branch would not reflect local state
Confidence: high
Scope-risk: narrow
Reversibility: clean
Directive: After hook-driven rewrites, verify the working tree is clean before final push
Tested: Git diff inspection of remaining changes
Not-tested: No additional runtime verification needed; formatting-only follow-up
EOF && git push hekx feature-form-value-format
* fix(@vben-core/form-ui): remove docs demo dayjs dependency
The docs valueFormat demo imported `dayjs` directly even though the docs
package does not declare it as a dependency. That caused `@vben/docs:build`
to fail in CI during VitePress bundling. This change removes the direct
import, keeps the preview formatter generic for day-like values, and drops
the docs-only preset button that required constructing dayjs instances.
Constraint: Docs build must succeed without adding new package dependencies
Constraint: Playground example should remain unchanged and fully interactive
Rejected: Add dayjs to docs dependencies | unnecessary for a small display demo
Rejected: Externalize dayjs in VitePress build | hides a package boundary issue
Confidence: high
Scope-risk: narrow
Reversibility: clean
Directive: Docs demos should avoid imports only available through transitive deps
Tested: pnpm exec eslint docs/src/demos/vben-form/value-format/index.vue
Tested: pnpm --dir docs run build
Not-tested: No browser-side manual verification of the docs demo in this session
---------
Co-authored-by: caisin <caisin@caisins-Mac-mini.local>
github-actions[bot]
俞可 · YU KE
dream-weave
Zehui Chan
JyQAQ
Dream
xingyu4j
layhuts
金毛88
雪忆天堂
Saleri
AxiosLeo
allen
Caisin
dullathanol
过冬