Skip to content

Conversation

@Advikkhandelwal
Copy link

Description

This PR implements booleanAttribute transforms for IonItem's boolean inputs, allowing cleaner syntax as requested in #30822.

Problem

Currently, Angular developers have to use explicit bindings for boolean attributes:

<ion-item [button]="true" [detail]="true" [disabled]="false"></ion-item>

This generates IDE warnings and is more verbose than the desired syntax.

Solution

Applied Angular's booleanAttribute transform to IonItem's button, detail, and disabled inputs. This allows:

<!-- Static boolean attributes -->
<ion-item button detail></ion-item>

<!-- Dynamic bindings still work -->
<ion-item [button]="someCondition" detail></ion-item>

Changes

  • Updated @stencil/angular-output-target from ^0.10.0 to ^1.1.1
  • Modified IonItem component in both regular and standalone Angular proxies
  • Removed button, detail, and disabled from @ProxyCmp and @Component inputs arrays
  • Added explicit @Input({ transform: booleanAttribute }) decorators with getters/setters
  • Added utility script for future automated application

Testing

✅ Core package builds successfully
✅ Angular package builds successfully
✅ Standalone package builds successfully
✅ All linting checks pass
✅ TypeScript compilation without errors
✅ No breaking changes to existing API

Type of Change

  • New feature (non-breaking change which adds functionality)
  • Enhancement (non-breaking change which improves existing functionality)

Closes #30822

This change allows using boolean attributes like <ion-item button detail>
instead of requiring explicit bindings like <ion-item [button]="true" [detail]="true">.

Applied to IonItem's button, detail, and disabled inputs using Angular's
booleanAttribute transform function.

Closes ionic-team#30822
@Advikkhandelwal Advikkhandelwal requested a review from a team as a code owner December 1, 2025 18:19
@vercel
Copy link

vercel bot commented Dec 1, 2025

Someone is attempting to deploy a commit to the Ionic Team on Vercel.

A member of the Team first needs to authorize it.

@github-actions github-actions bot added package: core @ionic/core package package: angular @ionic/angular package labels Dec 1, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

package: angular @ionic/angular package package: core @ionic/core package

Projects

None yet

Development

Successfully merging this pull request may close these issues.

feat: Angular - make certain inputs booleanAttributes

1 participant