This fixes the flaky/failing tests here:
`should not have visual regressions with a custom styled calendar`
<img width="1658" height="916" alt="CleanShot 2025-08-04 at 13 46 12@2x"
src="https://github.com/user-attachments/assets/b5d54ee8-b315-4db0-b09b-65d9cd2fa7ca"
/>
`should switch the calendar header when moving to a month with a
different number of days`
<img width="2104" height="1752" alt="CleanShot 2025-08-04 at 13 45
33@2x"
src="https://github.com/user-attachments/assets/8a0cdb0b-6e9d-4b5c-a2df-f9174431492b"
/>
You can run them locally using:
- `npm run test.e2e.docker src/components/datetime/test/datetime.e2e.ts
-- --repeat-each=10`
- `npm run test.e2e.docker
src/components/datetime/test/custom/datetime.e2e.ts -- --repeat-each=10`
---------
Co-authored-by: Brandy Smith <6577830+brandyscarney@users.noreply.github.com>
Issue number: resolves#30565
---------
## What is the current behavior?
Stencil is on v4.33.1
## What is the new behavior?
- Updates Stencil to v4.36.2
- Updates `children` references to `__children` in `reorder-group`
## Does this introduce a breaking change?
- [ ] Yes
- [x] No
## Other information
I searched through the repository for other components that may be
affected but did not find any.
Dev build: `8.7.1-dev.11753971948.1b297d94`
Reorder Example using dev build:
[StackBlitz](https://stackblitz.com/edit/5nrzhbja)
Router Example using dev build:
[StackBlitz](https://stackblitz.com/edit/rvpcflzx)
---------
Co-authored-by: Brandy Smith <6577830+brandyscarney@users.noreply.github.com>
Issue number: resolves#22469
---------
- Adds new responsive display classes with the following values: `none`, `inline`, `inline-block`, `block`, `flex`, `inline-flex`, `grid`, `inline-grid`, `table`, `table-cell`, `table-row`
- Adds new responsive flex util classes for the following properties: `align-content`, `align-items`, `align-self`, `justify-content`, `flex-direction`, `flex-wrap`, `flex`, `flex-grow` , `flex-shrink`, `order`
- Adds e2e tests to verify the correct classes are in the CSS files
---------
Co-authored-by: Brandy Smith <6577830+brandyscarney@users.noreply.github.com>
Issue number: resolves#29833
---------
- Adds the `border` property for customizing the border of highlighted dates
- Adds the `border` to the e2e test for highlightedDates
- Updates screenshots
---------
Co-authored-by: Brandy Smith <6577830+brandyscarney@users.noreply.github.com>
Issue number: resolves#30445
---------
Updates all packages to use the latest version of Ionicons v8
---------
Co-authored-by: Brandy Smith <6577830+brandyscarney@users.noreply.github.com>
Issue number: resolves #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. -->
Currently, we provide no injection access to angular modals, which makes
it difficult to connect to their events normally.
## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
This is an attempt to allow easier programmatic access to the internals
of injected modals.
## 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.6.2-dev.11749830167.1460aa73`
Issue number: resolves#23148resolves#27614
---------
The `ion-reorder-group` only emits an `ionItemReorder` event when the reorder gesture ends AND the item position has changed. There is no way to listen for when the gesture starts, is actively moving, or ends without the item changing position.
- Adds an `ionReorderStart` event that is fired without any details on the start of the gesture.
- Adds an `ionReorderMove` event that is fired continuously during gesture move and includes the `from` and `to` detail.
- Adds an `ionReorderEnd` event that is fired at the end of the gesture and always includes the `from` and `to` detail, even if they are the same.
- Deprecates the `ionItemReorder` event, recommending to use the `ionReorderEnd` instead.
- [ ] Yes
- [x] No
While this does not introduce a breaking change, it does deprecate the `ionItemReorder` event in favor of the `ionReorderEnd` event. This event behaves a bit differently since it is always emitted on end. If the `from` and `to` are the same, it will still emit them, so it's possible to check if they are the same to determine if `ionReorderEnd` fired without moving item positions.
----
Co-authored-by: sfinktah <sfinktah@github.spamtrak.org>
Co-authored-by: Brandy Smith <6577830+brandyscarney@users.noreply.github.com>
A major regression related to Reorder was found in Stencil v4.36. Downgrade Stencil until this can be resolved.
Co-authored-by: Brandy Smith <6577830+brandyscarney@users.noreply.github.com>
Issue number: resolves#30543
---------
## What is the current behavior?
On desktop Safari and Android the segment view is not switching to the
right segment content when the height is dynamically set or read in as
0. This can be reproduced in the following StackBlitz on Android:
https://6dhropnr-aheyyprl.stackblitz.io/
## What is the new behavior?
- Sets `min-height` to `1px` on `ion-segment-content` so that it
continues to work with a dynamically set height
- Adds an e2e test for Safari to verify the correct content is displayed
when it contains a dynamically loaded image
## Does this introduce a breaking change?
- [ ] Yes
- [x] No
## Other information
Dev build: `8.6.2-dev.11752524287.1d61cd78`
[Preview](https://ionic-framework-git-fw-6586-ionic1.vercel.app/src/components/segment-view/test/dynamic-height)
---------
Co-authored-by: Brandy Smith <6577830+brandyscarney@users.noreply.github.com>
Issue number: resolves 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. -->
Currently, if you have multiple card modals open in portrait view and
then transition to landscape, the background will not be transformed
properly and will not cover the entire screen as expected.
https://github.com/user-attachments/assets/bb2c7015-adb6-4c3b-8bc5-13360275fcf4
## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
Now, we're correctly targeting the right element and will transform it
as expected. This allows a more consistent UX for these transitions.
https://github.com/user-attachments/assets/fff72387-d78b-4df4-a234-d89b54f694c4
## 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. -->
[Relevant (broken) screen (main
branch)](https://ionic-framework-git-main-ionic1.vercel.app/src/components/modal/test/card?ionic:mode=ios)
[Relevant (fixed) screen (this
branch)](https://ionic-framework-git-fix-modal-landscape-background-ionic1.vercel.app/src/components/modal/test/card?ionic:mode=ios)
Issue number: resolves#29763
---------
<!-- 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. -->
If the nested content of an ion-item is conditionally rendered and goes
from containing zero interactive elements to one or more, a render is
not triggered in Angular and the item does not behave correctly for one
or more nested inputs.
## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
- A mutation observer is created in `connectedCallback()` to watch for
changes in item's child list. When the `childList` changes, two pieces
of state that track whether the item needs to be interactive and whether
there are multiple interactive elements are updated.
- Add `disconnectedCallback()` and logic to disconnect Mutation
Observer.
- Create new function `totalNestedInputs()` with logic from existing
`setMultipleInputs` function to be used for both `setMultipleInputs` and
new function `setIsInteractive`.
## 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. -->
I opted for the MutationObserver over a `slotchange` listener because
the `slotchange` fires synchronously on any slot within the shadowRoot,
and the MutationObserver fires once on the item element itself. I
attempted to add the minimum amount of logic to achieve this but there
may be a more elegant solution that combines what `multipleInputs` and
`isInteractive` are doing but requires more changes to existing code.
Issue number: resolves#30389
---------
<!-- 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. -->
Currently, when the element an ion-modal was presented from is removed,
the modal stays presented and can be broken depending on the framework.
This is unlike #30540, where children of open modals were being kept
open. In this case, specifically the DOM element is being removed for
whatever reason and the modal is staying open.
## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
We're now identifying our parent component on load and watching it with
a mutation observer to determine if it gets removed from the DOM. If it
does, we trigger a dismiss. This, conveniently, works nicely with #30540
and will dismiss all children and grandchildren as well.
## 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. -->
The issue this resolves was already marked closed, but on closer
inspection I determined that was a mistake. I believed this issue was
related to another one I was dealing with and it is, but it wasn't quite
the same.
After this issue is merged, I believe we will have handled all avenues
of possibly ending up with broken modals because of parent elements or
modals being removed.
[Relevant Test
Page](https://ionic-framework-git-fix-remove-modal-when-parent-removed-ionic1.vercel.app/src/components/modal/test/inline)
**Current dev build:**
```
8.6.5-dev.11752329407.10f7fc80
```
This PR contains the following updates:
| Package | Type | Update | Change |
|---|---|---|---|
| mcr.microsoft.com/playwright | final | patch | `v1.53.1` -> `v1.53.2`
|
---
### Configuration
📅 **Schedule**: Branch creation - "every weekday before 11am" (UTC),
Automerge - At any time (no schedule defined).
🚦 **Automerge**: Disabled by config. Please merge this manually once you
are satisfied.
♻ **Rebasing**: Never, or you tick the rebase/retry checkbox.
🔕 **Ignore**: Close this PR and you won't be reminded about this update
again.
---
- [ ] <!-- rebase-check -->If you want to rebase/retry this PR, check
this box
---
This PR was generated by [Mend Renovate](https://mend.io/renovate/).
View the [repository job
log](https://developer.mend.io/github/ionic-team/ionic-framework).
<!--renovate-debug:eyJjcmVhdGVkSW5WZXIiOiI0MC42Mi4xIiwidXBkYXRlZEluVmVyIjoiNDEuMjMuMiIsInRhcmdldEJyYW5jaCI6Im1haW4iLCJsYWJlbHMiOltdfQ==-->
Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>
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. -->
Maria is still getting assigned to issues during her out of office
(OOO).
## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
- Removed her until she returns.
## 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: resolves#30459
---------
## What is the current behavior?
1. Typing `"12345"` in a 4-box input-otp with `type="text"` is
incorrectly triggering autofill detection on Android, causing `"45"` to
be distributed across the first two boxes instead of replacing the `"4"`
with the `"5"`.
**Current Behavior**: Type `"12345"` → `["4", "5", "", ""]` (incorrectly
distributed)
**Expected Behavior**: Type `"12345"` → `["1", "2", "3", "5"]`
(correctly replaces last character)
2. Typing an invalid character (like `"w"` when `type="number"`) in an
input box with a value is inserted, ignoring the input validation.
**Current Behavior**: Type `"2"` in the first box, focus it again, type
`"w"` → `"2w"` appears
**Expected Behavior**: Type `"2"` in the first box, focus it again, type
`"w"` → `"2"` remains (invalid character rejected)
## What is the new behavior?
- Fixes autofill detection on Android devices
- Fixes invalid character insertion in filled input boxes
- Improves cursor position handling when typing in a filled box
- Adds e2e tests for more coverage
## Does this introduce a breaking change?
- [ ] Yes
- [x] No
## Other information
Dev build: `8.6.5-dev.11752245814.1253279a`
---------
Co-authored-by: Brandy Smith <6577830+brandyscarney@users.noreply.github.com>
Issue number: resolves#30389
---------
<!-- 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. -->
Currently, when a child modal is present and a parent modal is somehow
dismissed, the child modal stays open. This can cause issues in some
frameworks like React and Angular, where this cuts the connection to the
child modal and it can no longer be dismissed programmatically.
## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
This change enables modals to identify their children and close the
children when they're closed. This prevents orphaned modals that can
cause a poor UX. Note: This fix is only for inline modals, which is the
biggest cause of the above issue.
## 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. -->
[Relevant test
page](https://ionic-framework-git-fw-6597-ionic1.vercel.app/src/components/modal/test/inline)
**Current dev build**:
```
8.6.5-dev.11752242329.17d249a3
```
Issue number: resolves#29562
---------
<!-- 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?
When an input with a password toggle is given `disabled` or `readonly`,
hiding the password toggle causes a layout shift as it shrinks the
height of the input component.
## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
- Password toggle is given `visibility: hidden` instead of removing it
from the DOM with `display: none` so it retains it's space but is still
hidden and still removed from the accessibility tree.
## 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
This solution was suggested by @piotr-cz in the bug report.
<!-- Any other information that is important to this PR such as
screenshots of how the component looks before and after the change. -->
---------
Co-authored-by: Brandy Smith <6577830+brandyscarney@users.noreply.github.com>
Issue number: resolves#30296
---------
<!-- 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. -->
Currently, there is no support for moving between an iOS card view
(mobile, portrait modal with presenting element) to a non-card view when
the resolution changes (e.g., the device goes from a portrait layout to
landscape). This causes issues both way because modals that should be
card modals when the user transitions to a portrait view stay as
non-card modals and modals that were card modals when they were opened
but the user goes to landscape view end up with a black box stuck around
the edges of the screen.
## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
With this change, we now fully support transitioning between the two
modal views when the resolution changes. This should fix the issue where
the background could become stuck and should be a nicer experience for
users switching between the two orientations while using modals.
I also took the time to clean up the terminology in use here to refer to
"mobile view" (as it was meant here) to be portrait view and the other
view to be referred to as landscape view. I did this because I had
accidentally mixed them up while working on this and I had to do a
refactor to fix it, so I'm hoping that by clarifying the terminology now
it helps prevent similar mistakes for others in the future.
## 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. -->
[Relevant test
screen](https://ionic-framework-git-fw-6596-ionic1.vercel.app/src/components/modal/test/card?ionic:mode=ios)
Dev build: `8.6.3-dev.11751378808.12cc4a5c`
Adds test for https://github.com/ionic-team/ionic-framework/pull/29845
Must be merged after the fix in that PR is released. The test will fail
while using the older version of the CDN.
---------
Co-authored-by: Brandy Smith <6577830+brandyscarney@users.noreply.github.com>
Updates our PR title check to ignore titles with `chore` or `release` in
them, eliminating the need for a `release` label on release PRs &
allowing us to write commits like `chore: update dependency`.
I also specified which commit types are allowed and included `chore` and
`release` here even though they are skipped in case we ever remove the
if skipping them.
Co-authored-by: Brandy Smith <6577830+brandyscarney@users.noreply.github.com>
