Skip to content

Conversation

@pangyajun123
Copy link
Contributor

@pangyajun123 pangyajun123 commented Sep 18, 2025

image

Summary by CodeRabbit

  • New Features

    • Added a hide option for form items, allowing fields to be programmatically hidden. Hidden fields are not rendered and skip visibility/validation logic.
    • Introduced a hide prop on form field components to control runtime visibility alongside existing conditions.
  • Documentation

    • Updated form schema docs to include the new hide field with usage details in interface and type sections.

@changeset-bot
Copy link

changeset-bot bot commented Sep 18, 2025

⚠️ No Changeset found

Latest commit: f0b967e

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

@coderabbitai
Copy link
Contributor

coderabbitai bot commented Sep 18, 2025

Walkthrough

A new optional boolean hide property is added to FormSchema and wired into FormField. Visibility computation and template gating now consider hide, preventing rendering when true. Documentation is updated accordingly. No other fields or behaviors are changed.

Changes

Cohort / File(s) Summary of changes
API: FormSchema hide
packages/@core/ui-kit/form-ui/src/types.ts, docs/src/components/common-ui/vben-form.md
Added hide?: boolean to FormSchema (after help?: CustomRenderType;). Documentation updated in both primary interface and TS details blocks.
FormField visibility logic
packages/@core/ui-kit/form-ui/src/form-render/form-field.vue
Introduced hide prop. Updated visible to !hide && isIf && isShow. Template now gated by !hide && isIf to skip rendering when hidden.

Sequence Diagram(s)

sequenceDiagram
  actor User
  participant FormRenderer as FormRenderer
  participant FormField as FormField (component)
  participant DOM as DOM

  User->>FormRenderer: Provide schema (may include hide)
  FormRenderer->>FormField: Pass props (hide, isIf, isShow, ...)
  Note over FormField: Compute visible = !hide && isIf && isShow

  alt hide is true OR visibility false
    FormField-->>DOM: Do not render field
    Note right of DOM: Validation/visibility logic bypassed
  else
    FormField->>DOM: Render field wrapper and content
  end
Loading

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

Poem

A twitch of whiskers, a checkbox to bide,
I hop through forms with a toggle to hide.
If, show, and logic in tidy array—
Now fields can vanish, then reappear someday.
Thump-thump: schema’s neat, my burrow’s wide! 🐇✨

Pre-merge checks and finishing touches

❌ Failed checks (1 warning)
Check name Status Explanation Resolution
Description Check ⚠️ Warning The PR description contains only an embedded image and does not follow the repository's required template; it lacks a textual Description, Type of change selection, the Checklist, and any explanation of what files changed or how to verify the change even though the raw_summary shows additions of hide?: boolean in types/docs and a hide prop in FormField. Because required template sections are missing, reviewers cannot assess scope, testing, or docs impact from the PR description alone. Please update the PR description to follow the repository template: add a clear textual "Description" that states the change (e.g., hide?: boolean added to FormSchema and hide prop added to FormField), select the appropriate "Type of change" checkbox, complete the Checklist items (docs, tests, build), and include testing steps or examples and any relevant screenshots so reviewers can verify and understand the change.
✅ Passed checks (2 passed)
Check name Status Explanation
Title Check ✅ Passed The title clearly describes the motivation (permission-based control for form display and limitations of dependencies.if) which matches the changes that add a hide property/prop to support permission-driven hiding; it therefore relates to the main intent of the changeset. The title is somewhat long and implementation-agnostic (it states the problem rather than the exact change), but it still communicates the primary reason for the PR.
Docstring Coverage ✅ Passed No functions found in the changes. Docstring coverage check skipped.
✨ Finishing touches
  • 📝 Generate Docstrings
🧪 Generate unit tests
  • Create PR with unit tests
  • Post copyable unit tests in a comment

Tip

👮 Agentic pre-merge checks are now available in preview!

Pro plan users can now enable pre-merge checks in their settings to enforce checklists before merging PRs.

  • Built-in checks – Quickly apply ready-made checks to enforce title conventions, require pull request descriptions that follow templates, validate linked issues for compliance, and more.
  • Custom agentic checks – Define your own rules using CodeRabbit’s advanced agentic capabilities to enforce organization-specific policies and workflows. For example, you can instruct CodeRabbit’s agent to verify that API documentation is updated whenever API schema files are modified in a PR. Note: Upto 5 custom checks are currently allowed during the preview period. Pricing for this feature will be announced in a few weeks.

Please see the documentation for more information.

Example:

reviews:
  pre_merge_checks:
    custom_checks:
      - name: "Undocumented Breaking Changes"
        mode: "warning"
        instructions: |
          Pass/fail criteria: All breaking changes to public APIs, CLI flags, environment variables, configuration keys, database schemas, or HTTP/GraphQL endpoints must be documented in the "Breaking Change" section of the PR description and in CHANGELOG.md. Exclude purely internal or private changes (e.g., code not exported from package entry points or explicitly marked as internal).

Please share your feedback with us on this Discord post.


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

Comment @coderabbitai help to get the list of available commands and usage tips.

Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 0

🧹 Nitpick comments (4)
packages/@core/ui-kit/form-ui/src/types.ts (1)

258-259: Clarify hide semantics and priority in JSDoc

LGTM adding hide. To reduce ambiguity with dependencies.if/show, document that hide has highest priority (hard hide: not rendered, not validated) and is intended for permission gating.

Apply this diff to improve the comment:

-  /** 是否隐藏表单项 */
+  /** 是否隐藏表单项(最高优先级;为 true 时不渲染且不参与校验,适合权限控制) */
   hide?: boolean;
packages/@core/ui-kit/form-ui/src/form-render/form-field.vue (2)

98-101: De-duplicate visibility logic: introduce isRendered to avoid drift

Keep a single source of truth for render gating and derive visible from it. This preserves current behavior (CSS hide via isShow) while making the code harder to regress.

Apply this diff:

-const visible = computed(() => {
-  return !hide && isIf.value && isShow.value;
-});
+const isRendered = computed(() => !hide && isIf.value);
+const visible = computed(() => isRendered.value && isShow.value);

Note: When using hide for permission gating, confirm whether retaining field values on unmount is desired. Current keepValue: true preserves values even after the field becomes hidden; if that’s not intended for permissions, we can add a clearOnHide option or proactively clear the value on transition to hidden. Happy to provide a patch if needed.


287-288: Use the same computed for template gating

Bind the template gate to isRendered to keep parity with script logic.

Apply this diff:

-  <FormField
-    v-if="!hide && isIf"
+  <FormField
+    v-if="isRendered"
docs/src/components/common-ui/vben-form.md (1)

476-477: Document intent and precedence of hide

Spell out that hide has the highest priority and is aimed at permission-driven hard hide (no render, no validation).

Apply this diff:

-  /** 是否隐藏表单项 */
+  /** 是否隐藏表单项(最高优先级;true 时不渲染且不参与校验,适合权限控制) */
   hide?: boolean;
📜 Review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 482ce98 and f0b967e.

📒 Files selected for processing (3)
  • docs/src/components/common-ui/vben-form.md (1 hunks)
  • packages/@core/ui-kit/form-ui/src/form-render/form-field.vue (3 hunks)
  • packages/@core/ui-kit/form-ui/src/types.ts (1 hunks)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (7)
  • GitHub Check: Lint (windows-latest)
  • GitHub Check: Test (windows-latest)
  • GitHub Check: Check (ubuntu-latest)
  • GitHub Check: Check (windows-latest)
  • GitHub Check: Lint (ubuntu-latest)
  • GitHub Check: post-update (windows-latest)
  • GitHub Check: post-update (ubuntu-latest)
🔇 Additional comments (1)
packages/@core/ui-kit/form-ui/src/form-render/form-field.vue (1)

44-45: Prop plumbing looks correct

hide is correctly surfaced from schema into the component.

@jinmao88 jinmao88 merged commit 26f8d2a into vbenjs:main Sep 23, 2025
14 checks passed
@github-actions github-actions bot locked and limited conversation to collaborators Oct 24, 2025
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants