feat: Add disabled prop to FormFieldProps and all form field components with consistent data-disabled attribute on Field wrapper for label dimming

[kingston]

Summary by CodeRabbit

• New Features
  • Added disabled prop support across all form field components (input, select, checkbox, switch, textarea, date-picker, combobox, and more).
  • Field wrappers now emit a data-disabled attribute to enable styling of disabled states.
  • Added Storybook stories demonstrating disabled state behavior for multiple field components.

[cloudflare-workers-and-pages]

Deploying baseplate-storybook with    Cloudflare Pages

Latest commit:	4dee52f
Status:	✅  Deploy successful!
Preview URL:	https://394a14c8.baseplate-storybook.pages.dev
Branch Preview URL:	https://kingston-eng-1156-add-disabl.baseplate-storybook.pages.dev

View logs

[changeset-bot]

🦋 Changeset detected

Latest commit: 4dee52f

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 24 packages

Name	Type
@baseplate-dev/react-generators	Patch
@baseplate-dev/ui-components	Patch
@baseplate-dev/project-builder-server	Patch
@baseplate-dev/plugin-auth	Patch
@baseplate-dev/plugin-email	Patch
@baseplate-dev/plugin-observability	Patch
@baseplate-dev/plugin-storage	Patch
@baseplate-dev/project-builder-lib	Patch
@baseplate-dev/project-builder-web	Patch
@baseplate-dev/plugin-ai	Patch
@baseplate-dev/plugin-payments	Patch
@baseplate-dev/plugin-queue	Patch
@baseplate-dev/plugin-rate-limit	Patch
@baseplate-dev/create-project	Patch
@baseplate-dev/project-builder-cli	Patch
@baseplate-dev/project-builder-common	Patch
@baseplate-dev/project-builder-dev	Patch
@baseplate-dev/project-builder-test	Patch
@baseplate-dev/code-morph	Patch
@baseplate-dev/core-generators	Patch
@baseplate-dev/fastify-generators	Patch
@baseplate-dev/sync	Patch
@baseplate-dev/tools	Patch
@baseplate-dev/utils	Patch

Not sure what this means? Click here to learn what changesets are.

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

[coderabbitai]

Caution

Review failed

Pull request was closed or merged during review

📝 Walkthrough

Walkthrough

This change adds support for a disabled prop across form field components in the UI components library, React generators templates, and example applications. All affected field components now propagate the disabled state to underlying controls and add a data-disabled DOM attribute to the Field wrapper for consistent styling.

Changes

Cohort / File(s)	Summary
Changesets .changeset/add-disabled-prop-to-field-templates.md, .changeset/add-disabled-prop-to-fields.md	Added changeset entries documenting patch version bumps for @baseplate-dev/react-generators and @baseplate-dev/ui-components with support for disabled prop and data-disabled attributes.
Base Form Types examples/.../src/types/form.ts, packages/react-generators/.../src/types/form.ts, packages/ui-components/src/types/form.ts	Extended FormFieldProps interface to include optional disabled?: boolean property across all packages.
UI Components - Field Components packages/ui-components/src/components/ui/checkbox-field/checkbox-field.tsx, async-combobox-field/..., checkbox-field/..., code-editor-field/..., color-picker-field/..., combobox-field/..., date-picker-field/..., date-time-picker-field/..., input-field/..., multi-combobox-field/..., multi-switch-field/..., select-field/..., switch-field/..., textarea-field/...	Updated all field components to accept disabled prop and propagate it to underlying controls via disabled={disabled} and add data-disabled={disabled ?? undefined} to Field wrapper. Some components (async/combobox, date-picker, date-time-picker, multi-combobox, multi-switch) removed disabled from exported props interface while maintaining internal prop forwarding.
UI Components - Storybook Stories packages/ui-components/src/components/ui/checkbox-field/checkbox-field.stories.tsx, code-editor-field/..., input-field/..., select-field/..., switch-field/..., textarea-field/...	Added new Disabled story exports demonstrating disabled-state visualization for field components with disabled: true and supporting props.
React Generators Templates - Field Components packages/react-generators/.../templates/components/ui/checkbox-field.tsx, combobox-field/..., date-picker-field/..., date-time-picker-field/..., input-field/..., multi-combobox-field/..., select-field/..., switch-field/..., textarea-field/...	Updated template components to accept and forward disabled prop with consistent pattern: add data-disabled={disabled ?? undefined} to Field wrapper and pass disabled={disabled} to underlying controls. Some templates removed disabled from exported props interface.
Example Apps - blog-with-auth Field Components examples/blog-with-auth/apps/admin/src/components/ui/checkbox-field.tsx, combobox-field/..., date-picker-field/..., date-time-picker-field/..., input-field/..., multi-combobox-field/..., select-field/..., switch-field/..., textarea-field/...	Updated field components to accept disabled prop and propagate to Field wrapper and underlying controls. Some components removed disabled from props interface while preserving runtime usage.
Example Apps - blog-with-auth Form Types examples/blog-with-auth/apps/admin/src/types/form.ts	Added optional disabled?: boolean property to FormFieldProps interface.
Example Apps - todo-with-better-auth Field Components (Apps/admin) examples/todo-with-better-auth/apps/admin/src/components/ui/checkbox-field.tsx, combobox-field/..., date-picker-field/..., date-time-picker-field/..., input-field/..., multi-combobox-field/..., select-field/..., switch-field/..., textarea-field/...	Same disabled prop pattern applied: forward to controls and add data-disabled attribute to Field wrapper; some components removed disabled from exported props interface.
Example Apps - todo-with-better-auth Field Components (Apps/web) examples/todo-with-better-auth/apps/web/src/components/ui/checkbox-field.tsx, combobox-field/..., date-picker-field/..., date-time-picker-field/..., input-field/..., multi-combobox-field/..., select-field/..., switch-field/..., textarea-field/...	Applied disabled prop support with consistent pattern across web app field components.
Example Apps - todo-with-better-auth Form Types examples/todo-with-better-auth/apps/admin/src/types/form.ts, apps/web/src/types/form.ts	Added optional disabled?: boolean property to FormFieldProps interface in both admin and web apps.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~25 minutes

Possibly related PRs

• refactor: Split Stripe into separate payments plugin #829: Modifies the same UI form field component implementations (e.g., checkbox-field.tsx in react-generators/ui-components) with accessibility-related prop additions alongside disabled prop changes.
• feat: Update UI for admin interface #627: Updates UI components package field components (async-combobox, combobox, and related props/attributes) with overlapping code-level changes.
• feat: Update UI components for generated React components #580: Previous modifications to react-generators/ui-components templates and form types that this change builds upon with disabled prop and data-disabled attribute enhancements.

🚥 Pre-merge checks | ✅ 2 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 60.47% which is insufficient. The required threshold is 80.00%.	Write docstrings for the functions missing them to satisfy the coverage threshold.

✅ Passed checks (2 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The pull request title accurately summarizes the main change: adding a disabled prop to FormFieldProps and form field components with a consistent data-disabled attribute for styling purposes.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ 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 kingston/eng-1156-add-disabled-prop-to-fields

---

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 and usage tips.}