Skip to content

chore(git): sync next#31127

Draft
thetaPC wants to merge 177 commits intoionic-modularfrom
chore-sync-modular-with-next
Draft

chore(git): sync next#31127
thetaPC wants to merge 177 commits intoionic-modularfrom
chore-sync-modular-with-next

Conversation

@thetaPC
Copy link
Copy Markdown
Contributor

@thetaPC thetaPC commented May 8, 2026

Issue number: resolves #


What is the current behavior?

What is the new behavior?

Does this introduce a breaking change?

  • Yes
  • No

Other information

ShaneK and others added 30 commits December 17, 2025 00:11
Issue number: resolves #30448 

---------

<!-- 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 using ion-tabs with routes that share a common prefix (e.g.,
`/home`, `/home2`, `/home3`), navigating to `/home2` incorrectly
highlights the `/home` tab. This occurs because the tab matching logic
uses `pathname.startsWith(href)`, which causes `/home2` to match `/home`
since `/home2` starts with `/home`.

## What is the new behavior?

Tab selection now uses path segment matching instead of simple prefix
matching. A tab's href will only match if the pathname is an exact match
OR starts with the href followed by a / (for nested routes). This
ensures /home2 no longer incorrectly matches /home, while still allowing
/home/details to correctly match the /home tab.

## 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. -->

Current dev build:
```
8.7.13-dev.11765486444.14025098
```

---------

Co-authored-by: Maria Hutt <thetaPC@users.noreply.github.com>
Co-authored-by: Brandy Smith <brandyscarney@users.noreply.github.com>
v8.7.14

---------

Co-authored-by: ionitron <hi@ionicframework.com>
…er is present (#30878)

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 new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->

This pull request enhances the hardware back button functionality to
ensure a consistent user experience, especially when no custom handlers
are registered. The main improvement is the addition of a fallback
handler that triggers the default browser back navigation when no other
handlers are present.

**Hardware Back Button Improvements:**

* Added a fallback handler in `startHardwareBackButton` that navigates
back in browser history (`win?.history.back()`) if no custom handlers
are registered, ensuring the hardware back button always performs a
meaningful action.
* Introduced a constant `FALLBACK_BACK_BUTTON_PRIORITY` with a value of
`-1` to manage the priority of the fallback handler.

**Code Consistency:**

* Moved the import of `win` from `@utils/browser` to group it with other
imports for consistency.

## 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. -->

---------

Co-authored-by: ShaneK <shane@shanessite.net>
…30865)

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. -->

The safe area variables are only reliant on `env` variables that are
provided by devices.

## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->

Capacitor 8 has released [safe area variable
fallbacks](https://capacitorjs.com/docs/apis/system-bars#android-note)
to provide consistent behaviors with older Android devices:

> Due to a [bug](https://issues.chromium.org/issues/40699457) in some
older versions of Android WebView (< 140), correct safe area values are
not available via the safe-area-inset-x CSS env variables. This plugin
will inject the correct inset values into a new CSS variable(s) named
--safe-area-inset-x that you can use as a fallback in your frontend
styles.

- Updated safe area variables to use the fallbacks provided by
Capacitor.

## 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.7.13-dev.11765920447.1a01ab8b`

---------

Co-authored-by: Brandy Smith <brandyscarney@users.noreply.github.com>
…ws (#30866)

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. -->

The safe area variables are only reliant on `env` variables that are
provided by devices.

## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->

Capacitor 8 has released [safe area variable
fallbacks](https://capacitorjs.com/docs/apis/system-bars#android-note)
to provide consistent behaviors with older Android devices:

> Due to a [bug](https://issues.chromium.org/issues/40699457) in some
older versions of Android WebView (< 140), correct safe area values are
not available via the safe-area-inset-x CSS env variables. This plugin
will inject the correct inset values into a new CSS variable(s) named
--safe-area-inset-x that you can use as a fallback in your frontend
styles.

- Updated safe area variables to use the fallbacks provided by
Capacitor.

## 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. -->

Changes to the [core
file](https://github.com/ionic-team/ionic-framework/blob/2ee52d77c86ef29756370f1ed732998589ca2fd8/core/src/css/core.scss#L253-L260)
will be done on `main`.

---------

Co-authored-by: Brandy Smith <6577830+brandyscarney@users.noreply.github.com>
Co-authored-by: ionitron <hi@ionicframework.com>
Issue number: resolves #30030

---------

## What is the current behavior?
When modals are presented one after another with matching IDs and then
dismissed by ID it will dismiss the first presented modal.

## What is the new behavior?
- When modals are presented one after another with matching IDs and then
dismissed by ID it will dismiss the last (top-most) presented modal.
- Added e2e tests to verify this behavior works the same as the default
dismiss (not passing an ID).

## Does this introduce a breaking change?

- [ ] Yes
- [x] No

## Other information

[Modal: Dismiss
Behavior](https://ionic-framework-git-fw-7016-ionic1.vercel.app/src/components/modal/test/dismiss-behavior)

---------

Co-authored-by: Brandy Smith <6577830+brandyscarney@users.noreply.github.com>
Issue number: resolves #

---------

<!-- 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?
The checkbox component does not currently match our UX designs for the
ionic theme.

## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
- Changed typography to use correct design token.


## 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 #29929

---------

## What is the current behavior?
When forcing `mode=ios` in a collapsible header,
`.header-collapse-condense` would still be applied from the
`header.md.scss` file, leaving the collapsible header always hidden.

## What is the new behavior?
When forcing `mode=ios` in a collapsible header, the
`.header-collapse-condense` styles from the `header.md.scss` file won't
be applied, and the collapsible header will be visible.

## Does this introduce a breaking change?

- [ ] Yes
- [x] No


## Other information
Something worth mentioning is that this behavior only appears after
initial load: if the route is loaded refreshing the page, the header
will appear and work correctly, but navigating forth and back will apply
both the .ios and .md style files.

I showcase this with a modal because It'll always display the broken
hehavior.

| Before | After |
|--------|-------|
| <video
src="https://github.com/user-attachments/assets/1307ee9f-452a-4b00-877d-0b8e360d3bf7">
| <video
src="https://github.com/user-attachments/assets/f9ee3851-ce94-4a27-9947-37aa1f5433b9">
|

---------

Co-authored-by: ShaneK <shane@shanessite.net>
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?

The `ion-input-password-toggle` button uses `role="switch"` with
`aria-checked`, causing screen readers like VoiceOver to announce both a
state ("On/Off") and an action ("Show/Hide password"). This results in
confusing, redundant output such as "On, Hide Password" or "Off, Show
Password".

## What is the new behavior?

The password toggle button now uses `aria-pressed` instead of
`role="switch"` with `aria-checked`. Screen readers announce the
action-based label ("Show password" or "Hide password") along with the
pressed state, and properly announce state changes when the button is
activated.

## 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. -->

[Old
Preview](https://ionic-framework-git-main-ionic1.vercel.app/src/components/input-password-toggle/test/basic)

[New
Preview](https://ionic-framework-git-fw-6920-ionic1.vercel.app/src/components/input-password-toggle/test/basic)

Current dev build:
```
8.7.15-dev.11766421552.180757ca
```
v8.7.15

---------

Co-authored-by: ionitron <hi@ionicframework.com>
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 new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
- guarantee that every child of segment-button has color: primary-color
when checked;

## 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.
-->

<!-- Any other information that is important to this PR such as
screenshots of how the component looks before and after the change. -->

Sample:
https://ionic-framework-git-rou-12439-ionic1.vercel.app/src/components/segment/test/basic?ionic:theme=ionic
…l is closed (#30894)

Issue number: resolves #30679

---------

<!-- 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 a page contains a card modal with a `presentingElement`, resizing
the viewport (e.g., rotating from portrait to landscape) triggers the
card modal's "lean back" animation on the presenting element, even when
the modal has never been opened.

## What is the new behavior?
Viewport resize events no longer trigger the presenting element
animation when the modal is not presented. The animation only runs when
the modal is actually open.

## 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. -->

Current dev build:
```
8.7.16-dev.11767028735.16932cea
```
)

Issue number: resolves #

---------

<!-- 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?
Helper and Error text style it's not uniform between elements.

## What is the new behavior?
* Changed the typography for `.checkbox-bottom` and `.toggle-bottom` to
use `globals.$ion-body-sm-medium` for a more consistent appearance with
other components.
[[1]](diffhunk://#diff-796ffc72b6171910c25d5aad085bc245095c38f104d55e253e06282702205066L116-R116)
[[2]](diffhunk://#diff-ad6128c5d08f42a970eab3a8c7081eaad590bd4ebbcd19ec4e6110a6f7977040L59-R70)
* Updated the color of `.input-bottom .helper-text` and `.input-bottom
.counter` to use `globals.$ion-text-subtlest` instead of
`globals.$ion-primitives-neutral-800`, and `.input-bottom .error-text`
to use `globals.$ion-text-danger`.
* Standardized `.textarea-bottom .error-text` to use
`globals.$ion-text-danger` and reordered the CSS for clarity, while
`.textarea-bottom .helper-text` and `.textarea-bottom .counter` use
`globals.$ion-text-subtlest`.
* Updated `.toggle-bottom .error-text` to use `globals.$ion-text-danger`
and `.toggle-bottom .helper-text` to use `globals.$ion-text-subtlest`
for improved semantic clarity and consistency.

## 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.
-->

---------

Co-authored-by: ionitron <hi@ionicframework.com>
…l is closed (#30894)

Issue number: resolves #30679

---------

<!-- 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 a page contains a card modal with a `presentingElement`, resizing
the viewport (e.g., rotating from portrait to landscape) triggers the
card modal's "lean back" animation on the presenting element, even when
the modal has never been opened.

## What is the new behavior?
Viewport resize events no longer trigger the presenting element
animation when the modal is not presented. The animation only runs when
the modal is actually open.

## 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. -->

Current dev build:
```
8.7.16-dev.11767028735.16932cea
```
v8.7.16

---------

Co-authored-by: ionitron <hi@ionicframework.com>
…mproved styling consistency (#30905)

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. -->
- Previously in iOS, when using something different than the `ion-label`
to add a text inside the `segment-button`, the default color attributed
to it was blue.
<img width="357" height="103" alt="image"
src="https://github.com/user-attachments/assets/2196e548-f0b7-4e7f-b093-e58c88b2a6cb"
/>

- In Android, the expected color is not attributed either, but it
defaults to black instead of blue.

## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
- Now, all the slotted elements will respect the color defined by the
`color` CSS variable.

## 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. -->
…roll assist (#30896)

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?
On iOS, when focusing an `ion-input` or `ion-textarea` that requires
scrolling into view (scroll assist), the placeholder text shifts to the
left and overlaps any content in the start slot (e.g., icons). This
occurs because the cloned input used during scroll assist is positioned
at the container's left edge rather than at the native input's actual
position. Additionally, when quickly switching between inputs before
scroll assist completes, focus jumps back to the original input.

## What is the new behavior?
The cloned input is now positioned at the same offset as the native
input, preventing the placeholder from shifting or overlapping start
slot content during scroll assist. This works correctly for both LTR and
RTL layouts. Also, scroll assist no longer steals focus back if the user
has moved focus to another element while scrolling was in progress.

## 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. -->

Current dev build:
```
8.7.16-dev.11767042721.11309185
```
…unmount (#30906)

Issue number: resolves internal

---------

## What is the current behavior?
When `ion-tab-bar` is rapidly mounted and unmounted, a race condition in
connectedCallback can cause the keyboard controller to be created after
the component has been disconnected. This results in orphaned event
listeners (`keyboardWillShow`, `keyboardWillHide`) on the window object
that are never cleaned up, causing a memory leak.

## What is the new behavior?
The keyboard controller is now properly destroyed in all scenarios:
- If the component is disconnected while createKeyboardController is
pending, the promise is tracked and destroyed when it resolves
- If a new connectedCallback runs before the previous async completes,
the stale controller is destroyed

The promise tracking pattern ensures only the most recent async
operation assigns its result

## 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. -->
Current dev build:
```
8.7.17-dev.11767895575.16ea7cef
```

I was unable to find a way to create tests that accurately identified if
this problem was occurring. Memory leaks are notoriously difficult to
created automated tests for. I ultimately removed my previous attempts
because I didn't want to give a false sense of security.
ShaneK and others added 19 commits April 29, 2026 13:51
…rfaces (#31093)

Issue number: resolves #30561

---------

<!-- 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 an `ion-select` with `interface="popover"` or `interface="modal"`
is opened with the keyboard, pressing Enter on a focused option doesn't
commit the value or dismiss the overlay. Only Space works. The `onKeyUp`
handlers in `select-popover.tsx` and `select-modal.tsx` only checked for
`' '`, despite the comment claiming Enter was supported, and
`ion-radio-group`'s arrow-key handler never committed the focused value
on Enter the way native `<select>` does.

## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->

Pressing Enter on a focused option in the popover or modal interface now
commits that option as the select's value and dismisses the overlay,
matching Space and native `<select>` behavior. `radio-group.tsx` gains
an Enter branch inside its select-interface arrow-key handler that sets
`value` to the focused radio and emits `ionChange` when it differs from
the previous value. `select-popover.tsx` and `select-modal.tsx` track
the `onKeyDown` target so `onKeyUp` only dismisses when the Enter press
started on the same option. That guard stops a held Enter on the
triggering `ion-select` from re-firing inside the just-opened overlay
and auto-dismissing it. The `!ev.repeat` check on keydown covers the
same case for the radio-group commit.

## 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 keydown/keyup target-matching pattern is the same trick the browser
uses to avoid firing a click when keydown and keyup happen on different
elements. It's needed here because Enter on the `ion-select` trigger
opens the overlay on keydown, and without the guard the corresponding
keyup (now inside the overlay) would immediately commit and dismiss.

Preview page:
- [select /
basic](https://ionic-framework-git-fw-6754-ionic1.vercel.app/src/components/select/test/basic?ionic)
Issue number: resolves internal

Co-authored-by: Shane <shane@shanessite.net>
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?

`generate_dir_index` in `core/scripts/vercel-build.sh` writes child
links like `<a href="basic/">` and an up-link `<a href="../">`. Vercel
doesn't 308-redirect to add a trailing slash, so visiting a preview
directory URL like `/src/components/progress-bar/test` (no slash)
returns the index page but the browser resolves `basic/` against the
parent directory. That path doesn't exist, and Vercel's fallback serves
the root landing page, so navigation looks like it "circles back" to the
preview home instead of opening the test scenario.

## What is the new behavior?

The dir-index generator now emits absolute hrefs based on the
directory's `url_path`, including the `../` up-link. Trailing-slash
quirks no longer affect navigation between component test scenarios on
Vercel previews.

## 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

Test page:

-
https://ionic-framework-git-fix-vercel-preview-links-ionic1.vercel.app/src/components/progress-bar/test

Versus the broken version on main:

-
https://ionic-framework-git-main-ionic1.vercel.app/src/components/progress-bar/test
…class on initial entry (#31108)

Issue number: internal

---------

## What is the current behavior?
`ion-datetime` runs two IntersectionObservers: one to detect when the
host becomes visible (which adds `datetime-ready`) and one to detect
when it becomes hidden (which removes the class and tears down
listeners). When the host mounts offscreen, both observers receive an
initial "not intersecting" entry on `observe()`. The hidden-state
observer treats that initial entry as a real visible-to-hidden
transition, queues a `writeTask` to remove `datetime-ready`, and races
the layout-based fallback (`ensureReadyIfVisible`) that adds the class
after 100ms. On WebKit the remove wins often enough that the e2e test
for the fallback (added in #30793 to fix #30706) had to be skipped on
Mobile Safari. Anything in production that adds `datetime-ready` outside
of a real `isIntersecting: true` event is exposed to the same race.

## What is the new behavior?
A `hasBeenIntersecting` flag is set true only when `visibleCallback`
observes `isIntersecting: true`. The hidden-state observer's teardown is
gated on this flag, so the synthetic initial "not intersecting" entry is
ignored. The flag is reset when the host actually transitions to hidden
and on `disconnectedCallback`. The previously duplicated init-listeners
+ ready-class block is consolidated into a single `markReady` helper.
The WebKit skip on the IO-fallback e2e test has been removed.

## Does this introduce a breaking change?
- [ ] Yes
- [x] No

<!-- If yes, please describe the impact and migration path for existing
applications below. -->

## Other information
The asymmetry where `ensureReadyIfVisible` (the layout fallback)
deliberately does NOT set `hasBeenIntersecting` is load-bearing: the
flag must reflect a real observer signal, not a fallback-driven write,
otherwise the bug returns. This is called out at the guard site so
future cleanups don't undo it.

This test was most likely to fail in docker testing Linux Webkit with
`--repeat-each=20` because it was pretty flaky. I was able to force it
to fail under these conditions and, after fixing it, it no longer
failed.

## Relevant Preview Link:

-
https://ionic-framework-git-fw-7284-ionic1.vercel.app/src/components/datetime/test/basic
This PR contains the following updates:

| Package | Type | Update | Change |
|---|---|---|---|
|
[pozil/auto-assign-issue](https://redirect.github.com/pozil/auto-assign-issue)
| action | major | `v2.2.0` → `v3.0.0` |

---

### Release Notes

<details>
<summary>pozil/auto-assign-issue (pozil/auto-assign-issue)</summary>

###
[`v3.0.0`](https://redirect.github.com/pozil/auto-assign-issue/releases/tag/v3.0.0):
- Switch to EcmaScript Module

[Compare
Source](https://redirect.github.com/pozil/auto-assign-issue/compare/v2.2.0...v3.0.0)

- feat: switch to EcmaScript Module
- build: bump dependencies

</details>

---

### Configuration

📅 **Schedule**: (UTC)

- Branch creation
  - "every weekday before 11am"
- 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:eyJjcmVhdGVkSW5WZXIiOiI0My4xMzkuNyIsInVwZGF0ZWRJblZlciI6IjQzLjEzOS43IiwidGFyZ2V0QnJhbmNoIjoibWFpbiIsImxhYmVscyI6W119-->

Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>
…uttons (#31109)

Issue number: resolves #31090

---------

## What is the current behavior?

Buttons configured with `role: "selected"` no longer receive the
`action-sheet-selected` CSS class. Userland styling that targets
`.action-sheet-selected` (the documented hook for marking the active
option — bold text, custom checkmarks, etc.) silently stopped working as
of `8.7.12`.

This regressed in #30769 (`fix(select, action-sheet): use radio role for
options`). The new render path computes the button's class as:

```tsx
class={{
  ...buttonClass(b),
  'action-sheet-selected': isActiveRadio,
}}
```

`buttonClass(b)` already emits `'action-sheet-selected': true` for
`role: "selected"` (via `[action-sheet-${button.role}]]: button.role !==
undefined`), but the second key with the same name overrides it. For any
non-radio button `isActiveRadio` is `false`, so the class is dropped
from the rendered `<button>`.

### Repro

```html
<ion-action-sheet id="sheet" header="Choose"></ion-action-sheet>
<script type="module">
  await customElements.whenDefined("ion-action-sheet");
  const sheet = document.getElementById("sheet");
  sheet.buttons = [
    { text: "Option A" },
    { text: "Option B", role: "selected" },
    { text: "Cancel", role: "cancel" },
  ];
  await sheet.present();
</script>
```

In `8.7.11` the Option B button gets `action-sheet-selected`. In
`8.7.12+` it does not.

## What is the new behavior?

- Only override `action-sheet-selected` based on `isActiveRadio` when
the button actually participates in the radio group
(`b.htmlAttributes?.role === 'radio'`). For non-radio buttons, the class
map produced by `buttonClass(b)` is left untouched, so `role:
"selected"` keeps emitting `action-sheet-selected` exactly as it has
since the component was introduced.
- Adds a spec-test regression covering the `role: "selected"` case.

This preserves the new radio-group behavior introduced in #30769 (when
the button is a radio, `action-sheet-selected` follows `activeRadioId`)
and restores the documented public API.

## Does this introduce a breaking change?

- [ ] Yes
- [x] No

## Other information

- The minified output for the lazy + custom-elements bundles becomes
`Object.assign(Object.assign({}, buttonClass(b)), isRadio &&
{"action-sheet-selected": isActiveRadio})`. When `isRadio` is `false`,
`Object.assign(target, false)` is a no-op and the class set by
`buttonClass(b)` is preserved.
- Verified in a real consumer app on 8.8.4: with this patch built and
installed locally, `role: "selected"` once again renders `class="...
action-sheet-selected ..."` on the `<button>`.


Made with [Cursor](https://cursor.com)
…31112)

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?
- When the first segment is disabled and the last item is selected, if
the user swipes the `segment-view`, the first `segment-button` gets
checked even if it is disabled, and the view is presenting other
`segment-view`.

## What is the new behavior?

- A validation was added to ensure that the `segment-button` can only be
checked if it is not disabled

## 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.
-->
…tent item is present (#31113)

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 there is a single content item present the `scrollRatio` is
computed as `NaN` or `Infinity` resulting in a console error.

<img width="833" height="434" alt="Screenshot 2026-05-05 at 1 42 51 PM"
src="https://github.com/user-attachments/assets/242975a5-d03f-4947-b740-0e6069de27b7"
/>

## What is the new behavior?
Updates `handleScroll` in `ion-segment-view` to skip `handleScroll` if
`max <= 0`
## Does this introduce a breaking change?

- [ ] 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/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. -->
@vercel
Copy link
Copy Markdown

vercel Bot commented May 8, 2026

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
ionic-framework Ready Ready Preview, Comment May 8, 2026 6:33pm

Request Review

@thetaPC thetaPC changed the title Chore sync modular with next chore(git): sync next May 8, 2026
@github-actions github-actions Bot added package: core @ionic/core package package: angular @ionic/angular package package: vue @ionic/vue package package: react @ionic/react package labels May 8, 2026
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 package: react @ionic/react package package: vue @ionic/vue package

Projects

None yet

Development

Successfully merging this pull request may close these issues.