Issue number: resolves#20632
---------
## What is the current behavior?
When using the `routerLink` directive in Angular, it automatically adds
`tabindex="0"` to the element. This creates issues with Ionic components
that render native button or anchor elements, as they have their own
focus management. As a result, when navigating between list items with
`routerLink` using the `Tab` key, you need to press the `Tab` key twice
to move to the next item. This problem is illustrated in the following
demo:
[](https://stackblitz.com/edit/angular-blfa7h?file=src%2Fapp%2Fexample.component.html)
Related Angular issue: https://github.com/angular/angular/issues/28345
## What is the new behavior?
Updated our `RouterLinkDelegateDirective` to check if the element using
`routerLink` is one of the following Ionic components:
`ion-back-button`, `ion-breadcrumb`, `ion-button`, `ion-card`,
`ion-fab-button`, `ion-item`, `ion-item-option`, `ion-menu-button`,
`ion-segment-button`, or `ion-tab-button`. If so, it removes the
`tabindex` attribute from the element. This allows these Ionic
components to let the native button or anchor element handle the focus.
This solution is demonstrated in the following demo:
[](https://stackblitz.com/edit/angular-blfa7h-svmguh?file=src%2Fapp%2Fexample.component.html)
> [!NOTE]
> I did not include the `ion-router-link` component in the list to
remove `tabindex` because [the router link
documentation](https://ionicframework.com/docs/api/router-link) does not
recommend using it with Angular:
>> Note: this component should only be used with vanilla and Stencil
JavaScript projects. For Angular projects, use an `<a>` and `routerLink`
with the Angular router.
## Does this introduce a breaking change?
- [ ] Yes
- [x] No
## Other information
Dev build: `8.2.7-dev.11722448707.1e8c66e6`
Issue number: resolves#29728
---------
<!-- Please do not submit updates to dependencies unless it fixes an
issue. -->
<!-- Please try to limit your pull request to one type (bugfix, feature,
etc). Submit multiple pull requests if needed. -->
## What is the current behavior?
<!-- Please describe the current behavior that you are modifying. -->
The `focusTrap` property was missed when adding focus trapping
configuration to the modal and popover. This results in a type error
when developers attempt to assign to the property.
## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
- Adds `focusTrap` property to `ion-modal` and `ion-popover` for the
angular component wrappers
- Resolves type warnings when using the property in angular
## Does this introduce a breaking change?
- [ ] Yes
- [x] No
<!--
If this introduces a breaking change:
1. Describe the impact and migration path for existing applications
below.
2. Update the BREAKING.md file with the breaking change.
3. Add "BREAKING CHANGE: [...]" to the commit description when merging.
See
https://github.com/ionic-team/ionic-framework/blob/main/docs/CONTRIBUTING.md#footer
for more information.
-->
## Other information
<!-- Any other information that is important to this PR such as
screenshots of how the component looks before and after the change. -->
Dev-build: `8.2.6-dev.11721672792.195afb09`
Issue number: resolves#29640
---------
## What is the current behavior?
(Angular) If a list inside of a popover contains a disabled item and is
included in the following way:
```html
<ion-list>
<ion-item [button]="true">Option 1</ion-item>
<ion-item [button]="true" [disabled]="true">Option 2</ion-item>
<ion-item [button]="true">Option 3</ion-item>
</ion-list>
```
when you try to navigate using the arrow down keys, it will stop at the
disabled item instead of continuing over it.
Note that changing the item to the following will work:
```html
<ion-item [button]="true" disabled="true">Option 2</ion-item>
```
## What is the new behavior?
Reflect the `disabled` property in the item so that when items are
queried in the popover, the arrow down key skips over the disabled item.
## Does this introduce a breaking change?
- [ ] Yes
- [x] No
## Other information
This can be tested in the Angular test app by following the
documentation here:
https://github.com/ionic-team/ionic-framework/blob/main/docs/angular/testing.md
Removing my fix in `core`, then running `npm run build` and re-syncing
the test app should reproduce the problem.
Issue number: internal
---------
<!-- Please do not submit updates to dependencies unless it fixes an
issue. -->
<!-- Please try to limit your pull request to one type (bugfix, feature,
etc). Submit multiple pull requests if needed. -->
## What is the current behavior?
<!-- Please describe the current behavior that you are modifying. -->
Angular 18 test app was using an RC.
## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
- Updated to the official release.
- Removed the `--legacy-peer-deps` that is no longer needed
## Does this introduce a breaking change?
- [ ] Yes
- [x] No
<!--
If this introduces a breaking change:
1. Describe the impact and migration path for existing applications
below.
2. Update the BREAKING.md file with the breaking change.
3. Add "BREAKING CHANGE: [...]" to the commit description when merging.
See
https://github.com/ionic-team/ionic-framework/blob/main/docs/CONTRIBUTING.md#footer
for more information.
-->
## Other information
<!-- Any other information that is important to this PR such as
screenshots of how the component looks before and after the change. -->
N/A
Issue number: N/A
---------
<!-- Please do not submit updates to dependencies unless it fixes an
issue. -->
<!-- Please try to limit your pull request to one type (bugfix, feature,
etc). Submit multiple pull requests if needed. -->
## What is the current behavior?
<!-- Please describe the current behavior that you are modifying. -->
Angular 18 will be releases ~ May 20th. Ionic Framework does not
currently have test infrastructure to check if the RC is compatible with
Ionic Framework.
## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
- Adds an Angular 18 test app to the test infrastructure
- Added tech debt tickets for additional investigation and removing the
`--legacy-peer-deps` arg after v18 GA.
## Does this introduce a breaking change?
- [ ] Yes
- [x] No
<!--
If this introduces a breaking change:
1. Describe the impact and migration path for existing applications
below.
2. Update the BREAKING.md file with the breaking change.
3. Add "BREAKING CHANGE: [...]" to the commit description when merging.
See
https://github.com/ionic-team/ionic-framework/blob/main/docs/CONTRIBUTING.md#footer
for more information.
-->
## Other information
<!-- Any other information that is important to this PR such as
screenshots of how the component looks before and after the change. -->
Issue number: resolves#28876
---------
<!-- Please do not submit updates to dependencies unless it fixes an
issue. -->
<!-- Please try to limit your pull request to one type (bugfix, feature,
etc). Submit multiple pull requests if needed. -->
## What is the current behavior?
<!-- Please describe the current behavior that you are modifying. -->
When assigning `componentProps` as inputs to an Angular component, we do
`Object.assign`. When using the newer Angular Signals API for inputs the
value of an input is a function:
```js
myInput = input<string>('foo') // this is a function
```
The developer accesses the value of `myInput` in a template by doing
`myInput()` since `myInput` is a function.
If a developer passes `componentProps: { myInput: 'bar' }` then the
value of `myInput` is set to this string value, overriding the function.
As a result, calling `myInput()` results in an error because `myInput`
is a string not a function.
## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
- Angular 14.1 introduced `setInput` which lets us hand off setting
inputs to Angular. This will set input values properly even when using a
Signals-based input.
## Does this introduce a breaking change?
- [x] Yes
- [ ] No
<!--
If this introduces a breaking change:
1. Describe the impact and migration path for existing applications
below.
2. Update the BREAKING.md file with the breaking change.
3. Add "BREAKING CHANGE: [...]" to the commit description when merging.
See
https://github.com/ionic-team/ionic-framework/blob/main/.github/CONTRIBUTING.md#footer
for more information.
-->
As part of this `NavParams` has been deprecated as it is incompatible
with the `setInput` API. The old `Object.assign` worked to allow devs to
get all of the `componentProp` key value pairs via `NavParams` even if
they are not defined as `Inputs`. Using `setInput` will now throw an
error, so developers need to create an `@Input` for each parameter. This
means that `NavParams` has no purpose and can safely be retired in favor
of Angular's Input API. Not removing NavParms would make it difficult
for us to support new Angular APIs such as this Signals-based input API.
## Other information
<!-- Any other information that is important to this PR such as
screenshots of how the component looks before and after the change. -->
Dev build: `8.1.1-dev.11715021973.16675b67`
You will need to update the Ionic config to opt-in to the new option:
```ts
useSetInputAPI: true,
```
---------
Co-authored-by: Liam DeBeasi <liamdebeasi@users.noreply.github.com>
Issue number: resolves#29464
---------
<!-- Please do not submit updates to dependencies unless it fixes an
issue. -->
<!-- Please try to limit your pull request to one type (bugfix, feature,
etc). Submit multiple pull requests if needed. -->
## What is the current behavior?
<!-- Please describe the current behavior that you are modifying. -->
The standalone component for `ion-datetime` is missing the
`formatOptions` property. This component wrapper is manually maintained
and was missed when developing the feature.
## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
- Adds the missing `formatOptions` property to the `ion-datetime` for
the angular standalone component
## Does this introduce a breaking change?
- [ ] Yes
- [x] No
<!--
If this introduces a breaking change:
1. Describe the impact and migration path for existing applications
below.
2. Update the BREAKING.md file with the breaking change.
3. Add "BREAKING CHANGE: [...]" to the commit description when merging.
See
https://github.com/ionic-team/ionic-framework/blob/main/docs/CONTRIBUTING.md#footer
for more information.
-->
## Other information
<!-- Any other information that is important to this PR such as
screenshots of how the component looks before and after the change. -->
Issue number: resolves
https://github.com/ionic-team/ionic-docs/issues/3588
---------
<!-- Please do not submit updates to dependencies unless it fixes an
issue. -->
<!-- Please try to limit your pull request to one type (bugfix, feature,
etc). Submit multiple pull requests if needed. -->
## What is the current behavior?
<!-- Please describe the current behavior that you are modifying. -->
The documentation around `ionChange` not being emitted when
programmatically changing the property associated to the "value" is
either inconsistent or missing from certain components.
## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
- Adds the documentation to the missing components.
- Makes the documentation consistent across components.
## Does this introduce a breaking change?
- [ ] Yes
- [x] No
<!--
If this introduces a breaking change:
1. Describe the impact and migration path for existing applications
below.
2. Update the BREAKING.md file with the breaking change.
3. Add "BREAKING CHANGE: [...]" to the commit description when merging.
See
https://github.com/ionic-team/ionic-framework/blob/main/docs/CONTRIBUTING.md#footer
for more information.
-->
## Other information
<!-- Any other information that is important to this PR such as
screenshots of how the component looks before and after the change. -->
