refactor(react-router): migrate stack manager to hooks

2026-03-13 10:22:08 +08:00 · 2023-08-01 16:03:17 -04:00
3285 changed files with 24989 additions and 25312 deletions
--- a/.github/CODEOWNERS
+++ b/.github/CODEOWNERS
@@ -15,9 +15,9 @@

 ## Angular

-/packages/angular/ @sean-perkins @thetaPC
-/packages/angular-server @sean-perkins @thetaPC
-/packages/angular/test @thetaPC
+/packages/angular/ @sean-perkins
+/packages/angular-server @sean-perkins
+/packages/angular/test

 ## React

@@ -28,23 +28,19 @@

 ## Vue

-/packages/vue/ @liamdebeasi @thetaPC
-/packages/vue-router/ @liamdebeasi @thetaPC
-/packages/vue/test/ @thetaPC
-/packages/vue-router/__tests__ @thetaPC
+/packages/vue/ @liamdebeasi
+/packages/vue-router/ @liamdebeasi
+/packages/vue/test/
+/packages/vue-router/__tests__

 # Components

 /core/src/components/accordion/ @liamdebeasi
 /core/src/components/accordion-group/ @liamdebeasi

-/core/src/components/checkbox/ @amandaejohnston
-
 /core/src/components/datetime/ @liamdebeasi @amandaejohnston @sean-perkins
 /core/src/components/datetime-button/ @liamdebeasi

-/core/src/components/item/ @brandyscarney
-
 /core/src/components/menu/ @amandaejohnston
 /core/src/components/menu-toggle/ @amandaejohnston

@@ -54,19 +50,9 @@
 /core/src/components/picker-internal/ @liamdebeasi
 /core/src/components/picker-column-internal/ @liamdebeasi

-/core/src/components/radio/ @amandaejohnston
-/core/src/components/radio-group/ @amandaejohnston
-
 /core/src/components/refresher/ @liamdebeasi
 /core/src/components/refresher-content/ @liamdebeasi

-/core/src/components/searchbar/ @brandyscarney
-
-/core/src/components/segment/ @brandyscarney
-/core/src/components/segment-button/ @brandyscarney
-
-/core/src/components/skeleton-text/ @brandyscarney
-
 # Utilities

 /core/src/utils/animation/ @liamdebeasi
@@ -78,13 +64,3 @@
 /core/src/utils/sanitization/ @liamdebeasi
 /core/src/utils/tap-click/ @liamdebeasi
 /core/src/utils/transition/ @liamdebeasi
-
-/core/src/css/ @brandyscarney
-/core/src/themes/ @brandyscarney
-
-# Tests
-
-**/datetime.e2e.ts @mapsandapps
-**/datetime-button.e2e.ts @mapsandapps
-**/icon.e2e.ts @mapsandapps
-**/loading.e2e.ts @mapsandapps
--- a/.github/workflows/actions/build-angular-server/action.yml
+++ b/.github/workflows/actions/build-angular-server/action.yml
@@ -5,7 +5,7 @@ runs:
  steps:
    - uses: actions/setup-node@v3
      with:
-        node-version: 18.x
+        node-version: 16.x

    - name: Install Angular Server Dependencies
      run: npm ci
--- a/.github/workflows/actions/build-angular/action.yml
+++ b/.github/workflows/actions/build-angular/action.yml
@@ -5,7 +5,7 @@ runs:
  steps:
    - uses: actions/setup-node@v3
      with:
-        node-version: 18.x
+        node-version: 16.x
    - uses: ./.github/workflows/actions/download-archive
      with:
        name: ionic-core
--- a/.github/workflows/actions/build-core-stencil-prerelease/action.yml
+++ b/.github/workflows/actions/build-core-stencil-prerelease/action.yml
@@ -11,7 +11,7 @@ runs:
    - uses: actions/checkout@v3
    - uses: actions/setup-node@v3
      with:
-        node-version: 18.x
+        node-version: 16.x

    - name: Install Dependencies
      run: npm ci
--- a/.github/workflows/actions/build-core/action.yml
+++ b/.github/workflows/actions/build-core/action.yml
@@ -6,7 +6,7 @@ runs:
    - uses: actions/checkout@v3
    - uses: actions/setup-node@v3
      with:
-        node-version: 18.x
+        node-version: 16.x
    - name: Install Dependencies
      run: npm install
      working-directory: ./core
--- a/.github/workflows/actions/build-react-router/action.yml
+++ b/.github/workflows/actions/build-react-router/action.yml
@@ -5,7 +5,7 @@ runs:
  steps:
    - uses: actions/setup-node@v3
      with:
-        node-version: 18.x
+        node-version: 16.x
    - uses: ./.github/workflows/actions/download-archive
      with:
        name: ionic-core
--- a/.github/workflows/actions/build-react/action.yml
+++ b/.github/workflows/actions/build-react/action.yml
@@ -5,7 +5,7 @@ runs:
  steps:
    - uses: actions/setup-node@v3
      with:
-        node-version: 18.x
+        node-version: 16.x
    - uses: ./.github/workflows/actions/download-archive
      with:
        name: ionic-core
--- a/.github/workflows/actions/build-vue-router/action.yml
+++ b/.github/workflows/actions/build-vue-router/action.yml
@@ -5,7 +5,7 @@ runs:
  steps:
    - uses: actions/setup-node@v3
      with:
-        node-version: 18.x
+        node-version: 16.x
    - uses: ./.github/workflows/actions/download-archive
      with:
        name: ionic-core
--- a/.github/workflows/actions/build-vue/action.yml
+++ b/.github/workflows/actions/build-vue/action.yml
@@ -5,7 +5,7 @@ runs:
  steps:
    - uses: actions/setup-node@v3
      with:
-        node-version: 18.x
+        node-version: 16.x
    - uses: ./.github/workflows/actions/download-archive
      with:
        name: ionic-core
--- a/.github/workflows/actions/download-archive/action.yml
+++ b/.github/workflows/actions/download-archive/action.yml
@@ -14,6 +14,6 @@ runs:
      with:
        name: ${{ inputs.name }}
        path: ${{ inputs.path }}
-    - name: Extract Archive
+    - name: Exract Archive
      run: unzip -q -o ${{ inputs.path }}/${{ inputs.filename }}
      shell: bash
--- a/.github/workflows/actions/publish-npm/action.yml
+++ b/.github/workflows/actions/publish-npm/action.yml
@@ -21,7 +21,7 @@ runs:
  steps:
    - uses: actions/setup-node@v3
      with:
-        node-version: 18.x
+        node-version: 16.x
    # Provenance requires npm 9.5.0+
    - name: Install latest npm
      run: npm install -g npm@latest
--- a/.github/workflows/actions/test-core-clean-build/action.yml
+++ b/.github/workflows/actions/test-core-clean-build/action.yml
@@ -5,7 +5,7 @@ runs:
  steps:
    - uses: actions/setup-node@v3
      with:
-        node-version: 18.x
+        node-version: 16.x

    - uses: ./.github/workflows/actions/download-archive
      with:
@@ -13,15 +13,6 @@ runs:
        path: ./core
        filename: CoreBuild.zip
    - name: Check Diff
-      run: |
-        git diff --exit-code || {
-          echo -e "\033[1;31m⚠️ Error: Differences Detected ⚠️\033[0m"
-          echo -e "\033[1;31mThere are uncommitted changes between the build outputs from CI and your branch.\033[0m"
-          echo -e "\033[1;31mPlease ensure you have followed these steps:\033[0m"
-          echo -e "\033[1;31m1. Run 'npm run build' locally to generate the latest build output.\033[0m"
-          echo -e "\033[1;31m2. Commit and push all necessary changes to your branch.\033[0m"
-          echo -e "\033[1;31m3. Compare and validate the differences before proceeding.\033[0m"
-          exit 1
-        }
+      run: git diff --exit-code
      shell: bash
      working-directory: ./core
--- a/.github/workflows/actions/test-core-lint/action.yml
+++ b/.github/workflows/actions/test-core-lint/action.yml
@@ -5,7 +5,7 @@ runs:
  steps:
    - uses: actions/setup-node@v3
      with:
-        node-version: 18.x
+        node-version: 16.x
    - name: Install Dependencies
      run: npm ci
      working-directory: ./core
--- a/.github/workflows/actions/test-core-screenshot/action.yml
+++ b/.github/workflows/actions/test-core-screenshot/action.yml
@@ -13,7 +13,7 @@ runs:
  steps:
    - uses: actions/setup-node@v3
      with:
-        node-version: 18.x
+        node-version: 16.x
    - uses: ./.github/workflows/actions/download-archive
      with:
        name: ionic-core
--- a/.github/workflows/actions/test-core-spec/action.yml
+++ b/.github/workflows/actions/test-core-spec/action.yml
@@ -1,23 +1,15 @@
 name: 'Test Core Spec'
 description: 'Test Core Spec'
-inputs:
-  stencil-version:
-    description: 'The NPM tag of @stencil/core to install.'
 runs:
  using: 'composite'
  steps:
    - uses: actions/setup-node@v3
      with:
-        node-version: 18.x
+        node-version: 16.x
    - name: Install Dependencies
-      run: npm ci
+      run: npm install
      working-directory: ./core
      shell: bash
-    - name: Install Stencil ${{ inputs.stencil-version }}
-      run: npm install @stencil/core@${{ inputs.stencil-version }}
-      shell: bash
-      working-directory: ./core
-      if: ${{ inputs.stencil-version != '' }}
    - uses: ./.github/workflows/actions/download-archive
      with:
        name: ionic-core
--- a/.github/workflows/actions/test-react-e2e/action.yml
+++ b/.github/workflows/actions/test-react-e2e/action.yml
@@ -8,7 +8,7 @@ runs:
  steps:
    - uses: actions/setup-node@v3
      with:
-        node-version: 18.x
+        node-version: 16.x
    - uses: ./.github/workflows/actions/download-archive
      with:
        name: ionic-core
--- a/.github/workflows/actions/test-react-router-e2e/action.yml
+++ b/.github/workflows/actions/test-react-router-e2e/action.yml
@@ -8,7 +8,7 @@ runs:
  steps:
    - uses: actions/setup-node@v3
      with:
-        node-version: 18.x
+        node-version: 16.x
    - uses: ./.github/workflows/actions/download-archive
      with:
        name: ionic-core
--- a/.github/workflows/actions/test-vue-e2e/action.yml
+++ b/.github/workflows/actions/test-vue-e2e/action.yml
@@ -8,7 +8,7 @@ runs:
  steps:
    - uses: actions/setup-node@v3
      with:
-        node-version: 18.x
+        node-version: 16.x
    - uses: ./.github/workflows/actions/download-archive
      with:
        name: ionic-core
--- a/.github/workflows/actions/update-reference-screenshots/action.yml
+++ b/.github/workflows/actions/update-reference-screenshots/action.yml
@@ -9,7 +9,7 @@ runs:
  steps:
    - uses: actions/setup-node@v3
      with:
-        node-version: 18.x
+        node-version: 16.x
    - uses: actions/download-artifact@v3
      with:
        path: ./artifacts
@@ -34,24 +34,8 @@ runs:
      run: |
        git config user.name ionitron
        git config user.email hi@ionicframework.com
-
-        # This adds an empty entry for new
-        # screenshot files so we can track them with
-        # git diff
-        git add src/\*.png --force -N
-
-        if git diff --exit-code; then
-          echo -e "\033[1;31m⚠️ Error: No new screenshots generated ⚠️\033[0m"
-          echo -e "\033[1;31mThis means that there were zero visual diffs when running screenshot tests.\033[0m"
-          echo -e "\033[1;31mMake sure you have pushed any code changes that would result in visual diffs.\033[0m"
-          exit 1
-        else
-          # This actually adds the contents
-          # of the screenshots (including new ones)
-          git add src/\*.png --force
-          git commit -m "chore(): add updated snapshots"
-          git push
-        fi
-
+        git add src/\*.png --force
+        git commit -m "chore(): add updated snapshots"
+        git push
      shell: bash
      working-directory: ./core
--- a/.github/workflows/stencil-nightly.yml
+++ b/.github/workflows/stencil-nightly.yml
@@ -8,12 +8,7 @@ on:
    # at 6:00 UTC (6:00 am UTC)
    - cron: '00 06 * * 1-5'
  workflow_dispatch:
-    inputs:
-      npm_release_tag:
-        required: true
-        type: string
-        description: What version should be pulled from NPM?
-        default: nightly
+    # allows for manual invocations in the GitHub UI

 # When pushing a new commit we should
 # cancel the previous test run to not
@@ -29,7 +24,7 @@ jobs:
      - uses: actions/checkout@v3
      - uses: ./.github/workflows/actions/build-core-stencil-prerelease
        with:
-          stencil-version: ${{ inputs.npm_release_tag || 'nightly' }}
+          stencil-version: nightly

  test-core-clean-build:
    needs: [build-core-with-stencil-nightly]
@@ -51,8 +46,6 @@ jobs:
    steps:
      - uses: actions/checkout@v3
      - uses: ./.github/workflows/actions/test-core-spec
-        with:
-          stencil-version: ${{ inputs.npm_release_tag || 'nightly' }}

  test-core-screenshot:
    strategy:
--- a/.stackblitz/codeflow.json
+++ b/.stackblitz/codeflow.json
@@ -4,7 +4,7 @@
      "enabled": false
    },
    "pullRequests": {
-      "enabled": false
+      "enabled": true
    }
  }
 }
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -3,220 +3,6 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.

-# [7.5.0](https://github.com/ionic-team/ionic-framework/compare/v7.4.4...v7.5.0) (2023-10-11)
-
-
-### Bug Fixes
-
-* **alert:** stop Enter keypress for checkboxes ([#28279](https://github.com/ionic-team/ionic-framework/issues/28279)) ([72b3899](https://github.com/ionic-team/ionic-framework/commit/72b389993df4b0dc392262a106d7949e176b13af))
-* **select:** use correct aria-haspopup value ([#28265](https://github.com/ionic-team/ionic-framework/issues/28265)) ([01167fc](https://github.com/ionic-team/ionic-framework/commit/01167fc185db9bbb45b3a4086aff98008a76af2c))
-* **toast:** toast does not warn when positionAnchor is undefined ([#28312](https://github.com/ionic-team/ionic-framework/issues/28312)) ([c37b3d8](https://github.com/ionic-team/ionic-framework/commit/c37b3d8bf4b440506fdc96455a532c6316e5673d))
-
-
-### Features
-
-* **a11y:** add dynamic font scaling ([#28314](https://github.com/ionic-team/ionic-framework/issues/28314)) ([f806781](https://github.com/ionic-team/ionic-framework/commit/f8067819eeb577db163bf3e0f95fc73064d62b8a)), closes [#24638](https://github.com/ionic-team/ionic-framework/issues/24638) [#18592](https://github.com/ionic-team/ionic-framework/issues/18592)
-* **angular, react, vue, core:** export openURL utility ([#28295](https://github.com/ionic-team/ionic-framework/issues/28295)) ([6da82aa](https://github.com/ionic-team/ionic-framework/commit/6da82aab816b28bfc174f7634ded1fc1e06502ab)), closes [#27911](https://github.com/ionic-team/ionic-framework/issues/27911)
-* **angular:** ship Ionic components as Angular standalone components ([#28311](https://github.com/ionic-team/ionic-framework/issues/28311)) ([57e2476](https://github.com/ionic-team/ionic-framework/commit/57e247637005b10f0d21d5ac5f5232bcb1908301))
-* **datetime:** add support for h11 and h24 hour formats ([#28219](https://github.com/ionic-team/ionic-framework/issues/28219)) ([597bc3f](https://github.com/ionic-team/ionic-framework/commit/597bc3f085c5ff1451c73d0cf4d7d664943e712f)), closes [#23750](https://github.com/ionic-team/ionic-framework/issues/23750)
-* **toast:** allow custom positioning relative to specific element ([#28248](https://github.com/ionic-team/ionic-framework/issues/28248)) ([897ff6f](https://github.com/ionic-team/ionic-framework/commit/897ff6f7493d8d7e4ab22c6ae59de066b43ce682)), closes [#17499](https://github.com/ionic-team/ionic-framework/issues/17499)
-
-
-
-
-
-## [7.4.4](https://github.com/ionic-team/ionic-framework/compare/v7.4.3...v7.4.4) (2023-10-11)
-
-
-### Bug Fixes
-
-* **animation:** play method resolves when animation is stopped ([#28264](https://github.com/ionic-team/ionic-framework/issues/28264)) ([e6031fb](https://github.com/ionic-team/ionic-framework/commit/e6031fbef0698dac0a346cd6202c47f2abf54f95))
-* **checkbox, radio, toggle:** disabled elements are not interactive ([#28294](https://github.com/ionic-team/ionic-framework/issues/28294)) ([c70432e](https://github.com/ionic-team/ionic-framework/commit/c70432e6934bcf1d570e1f7cf671c52d2bb52a8b)), closes [#28293](https://github.com/ionic-team/ionic-framework/issues/28293)
-* **content:** fullscreen offset is computed correctly with tab bar ([#28245](https://github.com/ionic-team/ionic-framework/issues/28245)) ([7375dd6](https://github.com/ionic-team/ionic-framework/commit/7375dd6abafdf7457f23deb53ad5f016456a6af2)), closes [#21130](https://github.com/ionic-team/ionic-framework/issues/21130)
-* **core:** allow fullscreen scroll content to flow outside container for translucent tab bar ([#28246](https://github.com/ionic-team/ionic-framework/issues/28246)) ([b297529](https://github.com/ionic-team/ionic-framework/commit/b297529afc4b93a93f7eaecd31dd5a88a3de5f4e)), closes [#17676](https://github.com/ionic-team/ionic-framework/issues/17676)
-* **core:** swipe to go back gesture has priority over other horizontal swipe gestures ([#28304](https://github.com/ionic-team/ionic-framework/issues/28304)) ([d5f0c77](https://github.com/ionic-team/ionic-framework/commit/d5f0c776dfb5cb40b8119c596805dad3adb621e0)), closes [#28303](https://github.com/ionic-team/ionic-framework/issues/28303)
-* **header:** collapsible large title main header does not flicker on load ([#28277](https://github.com/ionic-team/ionic-framework/issues/28277)) ([3259da0](https://github.com/ionic-team/ionic-framework/commit/3259da0de181c8f82c38d9de13733213c77d398f)), closes [#27060](https://github.com/ionic-team/ionic-framework/issues/27060)
-* **menu:** do not error if disabled or swipeGesture is changed mid-animation ([#28268](https://github.com/ionic-team/ionic-framework/issues/28268)) ([a169044](https://github.com/ionic-team/ionic-framework/commit/a1690441e5bcee8176da32700de6f9e3fde9635e)), closes [#20092](https://github.com/ionic-team/ionic-framework/issues/20092) [#19676](https://github.com/ionic-team/ionic-framework/issues/19676) [#19000](https://github.com/ionic-team/ionic-framework/issues/19000)
-* **segment:** scroll to active segment-button on first load ([#28276](https://github.com/ionic-team/ionic-framework/issues/28276)) ([1167a93](https://github.com/ionic-team/ionic-framework/commit/1167a9325fb930b6c727bc26889f5488d9620062)), closes [#28096](https://github.com/ionic-team/ionic-framework/issues/28096)
-
-
-
-
-
-## [7.4.3](https://github.com/ionic-team/ionic-framework/compare/v7.4.2...v7.4.3) (2023-10-04)
-
-
-### Bug Fixes
-
-* **fab-button:** position is correct with custom sizes ([#28195](https://github.com/ionic-team/ionic-framework/issues/28195)) ([eb41b55](https://github.com/ionic-team/ionic-framework/commit/eb41b556b57c97139b9c36dc3e3be3711d8afaca)), closes [#22564](https://github.com/ionic-team/ionic-framework/issues/22564)
-* **range:** knob positions are correct on initial render with custom elements build ([#28257](https://github.com/ionic-team/ionic-framework/issues/28257)) ([ac2c8e6](https://github.com/ionic-team/ionic-framework/commit/ac2c8e6c22da4d0d8224def24ddef56ee9d26246)), closes [#25444](https://github.com/ionic-team/ionic-framework/issues/25444)
-
-
-
-
-
-## [7.4.2](https://github.com/ionic-team/ionic-framework/compare/v7.4.1...v7.4.2) (2023-09-27)
-
-
-### Bug Fixes
-
-* **react:** Nav unmounts component while invoking popTo or popToRoot ([#27821](https://github.com/ionic-team/ionic-framework/issues/27821)) ([0edcb2c](https://github.com/ionic-team/ionic-framework/commit/0edcb2cd85133ae8c304c53c37ca829e5fbad447)), closes [#27798](https://github.com/ionic-team/ionic-framework/issues/27798)
-* **title:** large title uses custom font on transition ([#28231](https://github.com/ionic-team/ionic-framework/issues/28231)) ([71a7af0](https://github.com/ionic-team/ionic-framework/commit/71a7af0f52fe62937b1dea1ca2739e78801a2a6d))
-
-
-
-
-
-## [7.4.1](https://github.com/ionic-team/ionic-framework/compare/v7.4.0...v7.4.1) (2023-09-20)
-
-
-### Bug Fixes
-
-* **overlays:** correctly re-add root to accessibility tree ([#28183](https://github.com/ionic-team/ionic-framework/issues/28183)) ([81714d4](https://github.com/ionic-team/ionic-framework/commit/81714d45bd97f0ba91729959b60a0dc1d1d06533)), closes [#28180](https://github.com/ionic-team/ionic-framework/issues/28180)
-* **radio,toggle,checkbox,select:** padded space is clickable in items ([#28136](https://github.com/ionic-team/ionic-framework/issues/28136)) ([5b7e422](https://github.com/ionic-team/ionic-framework/commit/5b7e422dc0bfd4d58fb31f62715af47e62dabb57)), closes [#27169](https://github.com/ionic-team/ionic-framework/issues/27169)
-* **range:** knob is not cut off in item with modern syntax ([#28199](https://github.com/ionic-team/ionic-framework/issues/28199)) ([0104d89](https://github.com/ionic-team/ionic-framework/commit/0104d899270d73e16f2850a5fd7d2ba25a9e7ef0)), closes [#27199](https://github.com/ionic-team/ionic-framework/issues/27199)
-* **scroll-assist:** improve input scroll accuracy with native resizing ([#28169](https://github.com/ionic-team/ionic-framework/issues/28169)) ([b5c736f](https://github.com/ionic-team/ionic-framework/commit/b5c736f5ac829efebedf3256ddf77ab3daa7a5f6)), closes [#22940](https://github.com/ionic-team/ionic-framework/issues/22940)
-* **scroll-assist:** re-run when keyboard changes ([#28174](https://github.com/ionic-team/ionic-framework/issues/28174)) ([3f06da4](https://github.com/ionic-team/ionic-framework/commit/3f06da4cfc0d59c658e17e09ccb1ea28a29339f9)), closes [#22940](https://github.com/ionic-team/ionic-framework/issues/22940)
-
-
-
-
-
-# [7.4.0](https://github.com/ionic-team/ionic-framework/compare/v7.3.4...v7.4.0) (2023-09-14)
-
-
-### Bug Fixes
-
-* **datetime:** scroll to newly selected date when value changes ([#27806](https://github.com/ionic-team/ionic-framework/issues/27806)) ([32244fb](https://github.com/ionic-team/ionic-framework/commit/32244fbdd1931e59a9e3cedd2b143c8ee7d01459)), closes [#26391](https://github.com/ionic-team/ionic-framework/issues/26391)
-* **many:** add correct scale to stacked labels ([#28163](https://github.com/ionic-team/ionic-framework/issues/28163)) ([8cb8786](https://github.com/ionic-team/ionic-framework/commit/8cb878669e53bad25bbe2787826b6d02d292848a))
-* **range:** add correct margin in item ([#28161](https://github.com/ionic-team/ionic-framework/issues/28161)) ([1d2b867](https://github.com/ionic-team/ionic-framework/commit/1d2b867f2207d366e355265b081bc9aabe31ce7e))
-
-
-### Features
-
-* **checkbox, radio, toggle, range:** stacked labels for form controls ([#28075](https://github.com/ionic-team/ionic-framework/issues/28075)) ([e6c7bb6](https://github.com/ionic-team/ionic-framework/commit/e6c7bb60e7e61c965f45e2bf3e3bd16f5125ad56))
-* **datetime:** add disabled part ([#28134](https://github.com/ionic-team/ionic-framework/issues/28134)) ([cd8d509](https://github.com/ionic-team/ionic-framework/commit/cd8d5091a133804ac97d0394354dcf7cd73d9355))
-* **datetime:** add parts for calendar day, active, and today ([#27641](https://github.com/ionic-team/ionic-framework/issues/27641)) ([79b005d](https://github.com/ionic-team/ionic-framework/commit/79b005da704c2ce481e1e3bc4d24cdba06a36d04)), closes [#25340](https://github.com/ionic-team/ionic-framework/issues/25340)
-* export TransitionOptions interface and getIonPageElement ([#28140](https://github.com/ionic-team/ionic-framework/issues/28140)) ([19f3bb2](https://github.com/ionic-team/ionic-framework/commit/19f3bb23fd5587848fc41a744ca46ef5985c04d2)), closes [#28137](https://github.com/ionic-team/ionic-framework/issues/28137)
-
-
-
-
-
-## [7.3.4](https://github.com/ionic-team/ionic-framework/compare/v7.3.3...v7.3.4) (2023-09-13)
-
-
-### Bug Fixes
-
-* **menu:** remove app dir from safe area padding ([#28123](https://github.com/ionic-team/ionic-framework/issues/28123)) ([e0542a7](https://github.com/ionic-team/ionic-framework/commit/e0542a7867871fa45a7fe6a4986e7de633063b4b))
-
-
-
-
-
-## [7.3.3](https://github.com/ionic-team/ionic-framework/compare/v7.3.2...v7.3.3) (2023-09-06)
-
-
-### Bug Fixes
-
-* **modal:** swipe to dismiss resets status bar style ([#28110](https://github.com/ionic-team/ionic-framework/issues/28110)) ([176585f](https://github.com/ionic-team/ionic-framework/commit/176585f446b04a6a0cedab2e09417637dbfc78ee)), closes [#28105](https://github.com/ionic-team/ionic-framework/issues/28105)
-* **overlays:** prevent overlays from getting stuck open ([#28069](https://github.com/ionic-team/ionic-framework/issues/28069)) ([584e9d3](https://github.com/ionic-team/ionic-framework/commit/584e9d3be220343451c2d4b9bf90658ecd530de1)), closes [#27200](https://github.com/ionic-team/ionic-framework/issues/27200)
-* **popover:** dynamic width popover is positioned correctly ([#28072](https://github.com/ionic-team/ionic-framework/issues/28072)) ([2a80eb6](https://github.com/ionic-team/ionic-framework/commit/2a80eb6bd0b16a9dab9bea600bb7f935d25c0e1b)), closes [#27190](https://github.com/ionic-team/ionic-framework/issues/27190) [#24780](https://github.com/ionic-team/ionic-framework/issues/24780)
-* **react:** overlay content is shown with hook  ([#28109](https://github.com/ionic-team/ionic-framework/issues/28109)) ([7b551fd](https://github.com/ionic-team/ionic-framework/commit/7b551fd54b9e16a2538e5b82a13d72b3007fa045)), closes [#28102](https://github.com/ionic-team/ionic-framework/issues/28102)
-* **textarea:** cols property is respected ([#28081](https://github.com/ionic-team/ionic-framework/issues/28081)) ([6d4eabc](https://github.com/ionic-team/ionic-framework/commit/6d4eabcc1046c28c1abf69a8bda3e06f80cf3f8f)), closes [#22142](https://github.com/ionic-team/ionic-framework/issues/22142)
-
-
-
-
-
-## [7.3.2](https://github.com/ionic-team/ionic-framework/compare/v7.3.1...v7.3.2) (2023-08-30)
-
-
-### Bug Fixes
-
-* **datetime:** gracefully handle invalid min/max ([#28054](https://github.com/ionic-team/ionic-framework/issues/28054)) ([01fc9b4](https://github.com/ionic-team/ionic-framework/commit/01fc9b45116f7ad6ddc56c7fb1535dec798c2b3a)), closes [#28041](https://github.com/ionic-team/ionic-framework/issues/28041)
-
-
-
-
-
-## [7.3.1](https://github.com/ionic-team/ionic-framework/compare/v7.3.0...v7.3.1) (2023-08-23)
-
-
-### Bug Fixes
-
-* **angular:** ionTabsWillChange is fired before tab activation ([#27991](https://github.com/ionic-team/ionic-framework/issues/27991)) ([bbfb8f8](https://github.com/ionic-team/ionic-framework/commit/bbfb8f81a61475d7e73b63743db5d6a0cd979d21)), closes [#27212](https://github.com/ionic-team/ionic-framework/issues/27212)
-* **input, textarea:** clearOnEdit does not clear when pressing Tab ([#28005](https://github.com/ionic-team/ionic-framework/issues/28005)) ([444acc1](https://github.com/ionic-team/ionic-framework/commit/444acc1f1bca348b62dfb398067cc087529f67f1)), closes [#27746](https://github.com/ionic-team/ionic-framework/issues/27746)
-* **react:** avoid multiple invocations of onDidDismiss and onWillPresent ([#28020](https://github.com/ionic-team/ionic-framework/issues/28020)) ([0ac3df3](https://github.com/ionic-team/ionic-framework/commit/0ac3df3f378bdefc3a927adc798ebd9ec7a54fee)), closes [#28010](https://github.com/ionic-team/ionic-framework/issues/28010)
-
-
-
-
-
-# [7.3.0](https://github.com/ionic-team/ionic-framework/compare/v7.2.4...v7.3.0) (2023-08-16)
-
-
-### Bug Fixes
-
-* **alert:** radio and checkbox labels wrap to next line ([#27898](https://github.com/ionic-team/ionic-framework/issues/27898)) ([0d3127a](https://github.com/ionic-team/ionic-framework/commit/0d3127ad09df3c914a8c254f14931de5ca3beb31)), closes [#17269](https://github.com/ionic-team/ionic-framework/issues/17269)
-
-
-### Features
-
-* **action-sheet:** add htmlAttributes property for passing attributes to buttons ([#27863](https://github.com/ionic-team/ionic-framework/issues/27863)) ([5ce4ec0](https://github.com/ionic-team/ionic-framework/commit/5ce4ec0439e4f31aba31062fd8af4a2ad792a54f))
-* **alert:** add htmlAttributes property for passing attributes to buttons ([#27862](https://github.com/ionic-team/ionic-framework/issues/27862)) ([06be0e5](https://github.com/ionic-team/ionic-framework/commit/06be0e511164ebdaa6af9a3747d0585260c030a9))
-* **toast:** add htmlAttributes property for passing attributes to buttons   ([#27855](https://github.com/ionic-team/ionic-framework/issues/27855)) ([9a68588](https://github.com/ionic-team/ionic-framework/commit/9a685882b7085d911ff09eedacc367629e32348a))
-* **toast:** add shadow part for cancel button ([#27921](https://github.com/ionic-team/ionic-framework/issues/27921)) ([e9faf54](https://github.com/ionic-team/ionic-framework/commit/e9faf54d0a7409521706ce9c8b0d26f3fbe9ba41)), closes [#27920](https://github.com/ionic-team/ionic-framework/issues/27920)
-
-
-
-
-
-## [7.2.4](https://github.com/ionic-team/ionic-framework/compare/v7.2.3...v7.2.4) (2023-08-16)
-
-
-### Bug Fixes
-
-* **tap-click:** do not error in document-less environment ([#27972](https://github.com/ionic-team/ionic-framework/issues/27972)) ([28bd4ba](https://github.com/ionic-team/ionic-framework/commit/28bd4ba720bb77d5f5c48cd7a45e0015daddc9dd))
-* **title:** large title aligns with ios spec ([#27969](https://github.com/ionic-team/ionic-framework/issues/27969)) ([8fa12fc](https://github.com/ionic-team/ionic-framework/commit/8fa12fc88857df27a1ca11249f0085e100fe1474)), closes [#27966](https://github.com/ionic-team/ionic-framework/issues/27966)
-
-
-
-
-
-## [7.2.3](https://github.com/ionic-team/ionic-framework/compare/v7.2.2...v7.2.3) (2023-08-09)
-
-
-### Bug Fixes
-
-* **button:** hidden button is added when form is set async ([#27955](https://github.com/ionic-team/ionic-framework/issues/27955)) ([e9fa300](https://github.com/ionic-team/ionic-framework/commit/e9fa30002bd5dec4f2f56a15c84eec1b3e794942)), closes [#27952](https://github.com/ionic-team/ionic-framework/issues/27952)
-* **datetime:** changing months work if partially visible ([#27917](https://github.com/ionic-team/ionic-framework/issues/27917)) ([eb19c28](https://github.com/ionic-team/ionic-framework/commit/eb19c289d6581639f6df7aff002bebdf2b27d31c)), closes [#27913](https://github.com/ionic-team/ionic-framework/issues/27913)
-* **item-sliding:** account for options added before watcher ([#27915](https://github.com/ionic-team/ionic-framework/issues/27915)) ([a0b3ef0](https://github.com/ionic-team/ionic-framework/commit/a0b3ef02af718e232246515bb873ad8c090fa55d)), closes [#27910](https://github.com/ionic-team/ionic-framework/issues/27910)
-* **many:** overlays present if isOpen is true on load ([#27933](https://github.com/ionic-team/ionic-framework/issues/27933)) ([a0e6ac6](https://github.com/ionic-team/ionic-framework/commit/a0e6ac6013552c5e3acdde33575d4aaf4d4c0bda)), closes [#27928](https://github.com/ionic-team/ionic-framework/issues/27928)
-* **modal:** setCurrentBreakpoint respects animated prop ([#27924](https://github.com/ionic-team/ionic-framework/issues/27924)) ([da55ab9](https://github.com/ionic-team/ionic-framework/commit/da55ab949ef1894738da5a6241176089b7a2b6e3)), closes [#27923](https://github.com/ionic-team/ionic-framework/issues/27923)
-* **nav:** improve reliability of swipe back gesture when quickly swiping back ([#27904](https://github.com/ionic-team/ionic-framework/issues/27904)) ([9500769](https://github.com/ionic-team/ionic-framework/commit/9500769f114d180613f0340b1a328b5e631b7188)), closes [#27893](https://github.com/ionic-team/ionic-framework/issues/27893)
-* **tab-button:** update event type interface on React ([#27950](https://github.com/ionic-team/ionic-framework/issues/27950)) ([1cf1eca](https://github.com/ionic-team/ionic-framework/commit/1cf1eca00239f3e98854466116e42f9a2e7b4590)), closes [#27949](https://github.com/ionic-team/ionic-framework/issues/27949)
-
-
-
-
-
-## [7.2.2](https://github.com/ionic-team/ionic-framework/compare/v7.2.1...v7.2.2) (2023-08-02)
-
-
-### Bug Fixes
-
-* **datetime-button:** render correct text when passing partial date values ([#27816](https://github.com/ionic-team/ionic-framework/issues/27816)) ([bd1910b](https://github.com/ionic-team/ionic-framework/commit/bd1910ba69348877ad5f99d9db2b59d06693b91e)), closes [#27797](https://github.com/ionic-team/ionic-framework/issues/27797)
-* **input, textarea:** input does not block floating label ([#27870](https://github.com/ionic-team/ionic-framework/issues/27870)) ([f14c440](https://github.com/ionic-team/ionic-framework/commit/f14c440d6321ef9f168b272338e5cd21cab384ef)), closes [#27812](https://github.com/ionic-team/ionic-framework/issues/27812)
-* **item-options:** use correct safe area padding ([#27853](https://github.com/ionic-team/ionic-framework/issues/27853)) ([0b8f1bc](https://github.com/ionic-team/ionic-framework/commit/0b8f1bc7dd4170a2a8c9ed3aede173dd489b25ea))
-* **radio:** radios can be focused and are announced with group ([#27817](https://github.com/ionic-team/ionic-framework/issues/27817)) ([ba2f49b](https://github.com/ionic-team/ionic-framework/commit/ba2f49b8a460520d20ac198db800ea2d9e5b015f)), closes [#27438](https://github.com/ionic-team/ionic-framework/issues/27438)
-* **react, vue:** custom animations are used when going back ([#27895](https://github.com/ionic-team/ionic-framework/issues/27895)) ([824033f](https://github.com/ionic-team/ionic-framework/commit/824033f1d4b4a3e5d4c6a978a39e5bb1f33b5bb4)), closes [#27873](https://github.com/ionic-team/ionic-framework/issues/27873)
-* **select:** popover uses modern form syntax ([#27818](https://github.com/ionic-team/ionic-framework/issues/27818)) ([0c117cf](https://github.com/ionic-team/ionic-framework/commit/0c117cfe7f383b7c7837d27de5a6eee12ddd6c2f)), closes [#27071](https://github.com/ionic-team/ionic-framework/issues/27071) [#27786](https://github.com/ionic-team/ionic-framework/issues/27786)
-
-
-
-
-
 ## [7.2.1](https://github.com/ionic-team/ionic-framework/compare/v7.2.0...v7.2.1) (2023-07-26)


--- a/README.md
+++ b/README.md
@@ -55,7 +55,7 @@
 | Project | Package | Version | Downloads| Links |
 | ------- | ------- | ------- | -------- |:-----:|
 | **Core** | [`@ionic/core`](https://www.npmjs.com/package/@ionic/core) | [![version](https://img.shields.io/npm/v/@ionic/core/latest.svg)](https://www.npmjs.com/package/@ionic/core) | <a href="https://www.npmjs.com/package/@ionic/core" target="_blank"><img src="https://img.shields.io/npm/dm/@ionic/core.svg" alt="NPM Downloads" /></a> | [`README.md`](core/README.md)
-| **Angular** | [`@ionic/angular`](https://www.npmjs.com/package/@ionic/angular) | [![version](https://img.shields.io/npm/v/@ionic/angular/latest.svg)](https://www.npmjs.com/package/@ionic/angular) | <a href="https://www.npmjs.com/package/@ionic/angular" target="_blank"><img src="https://img.shields.io/npm/dm/@ionic/angular.svg" alt="NPM Downloads" /></a> | [`README.md`](packages/angular/README.md)
+| **Angular** | [`@ionic/angular`](https://www.npmjs.com/package/@ionic/angular) | [![version](https://img.shields.io/npm/v/@ionic/angular/latest.svg)](https://www.npmjs.com/package/@ionic/angular) | <a href="https://www.npmjs.com/package/@ionic/angular" target="_blank"><img src="https://img.shields.io/npm/dm/@ionic/angular.svg" alt="NPM Downloads" /></a> | [`README.md`](angular/README.md)
 | **Vue** | [`@ionic/vue`](https://www.npmjs.com/package/@ionic/vue) | [![version](https://img.shields.io/npm/v/@ionic/vue/latest.svg)](https://www.npmjs.com/package/@ionic/vue) | <a href="https://www.npmjs.com/package/@ionic/vue" target="_blank"><img src="https://img.shields.io/npm/dm/@ionic/vue.svg" alt="NPM Downloads" /></a> | [`README.md`](packages/vue/README.md)
 | **React** | [`@ionic/react`](https://www.npmjs.com/package/@ionic/react) | [![version](https://img.shields.io/npm/v/@ionic/react/latest.svg)](https://www.npmjs.com/package/@ionic/react) | <a href="https://www.npmjs.com/package/@ionic/react" target="_blank"><img src="https://img.shields.io/npm/dm/@ionic/react.svg" alt="NPM Downloads" /></a> |[`README.md`](packages/react/README.md)

--- a/core/.eslintrc.js
+++ b/core/.eslintrc.js
@@ -46,8 +46,7 @@ module.exports = {
    {
      "files": ["*.e2e.ts"],
      "rules": {
-        "custom-rules/await-playwright-promise-assertion": "error",
-        "custom-rules/no-playwright-to-match-snapshot-assertion": "error"
+        "custom-rules/await-playwright-promise-assertion": "error"
      }
    }
  ]
--- a/core/CHANGELOG.md
+++ b/core/CHANGELOG.md
@@ -3,214 +3,6 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.

-# [7.5.0](https://github.com/ionic-team/ionic-framework/compare/v7.4.4...v7.5.0) (2023-10-11)
-
-
-### Bug Fixes
-
-* **alert:** stop Enter keypress for checkboxes ([#28279](https://github.com/ionic-team/ionic-framework/issues/28279)) ([72b3899](https://github.com/ionic-team/ionic-framework/commit/72b389993df4b0dc392262a106d7949e176b13af))
-* **select:** use correct aria-haspopup value ([#28265](https://github.com/ionic-team/ionic-framework/issues/28265)) ([01167fc](https://github.com/ionic-team/ionic-framework/commit/01167fc185db9bbb45b3a4086aff98008a76af2c))
-* **toast:** toast does not warn when positionAnchor is undefined ([#28312](https://github.com/ionic-team/ionic-framework/issues/28312)) ([c37b3d8](https://github.com/ionic-team/ionic-framework/commit/c37b3d8bf4b440506fdc96455a532c6316e5673d))
-
-
-### Features
-
-* **a11y:** add dynamic font scaling ([#28314](https://github.com/ionic-team/ionic-framework/issues/28314)) ([f806781](https://github.com/ionic-team/ionic-framework/commit/f8067819eeb577db163bf3e0f95fc73064d62b8a)), closes [#24638](https://github.com/ionic-team/ionic-framework/issues/24638) [#18592](https://github.com/ionic-team/ionic-framework/issues/18592)
-* **angular, react, vue, core:** export openURL utility ([#28295](https://github.com/ionic-team/ionic-framework/issues/28295)) ([6da82aa](https://github.com/ionic-team/ionic-framework/commit/6da82aab816b28bfc174f7634ded1fc1e06502ab)), closes [#27911](https://github.com/ionic-team/ionic-framework/issues/27911)
-* **angular:** ship Ionic components as Angular standalone components ([#28311](https://github.com/ionic-team/ionic-framework/issues/28311)) ([57e2476](https://github.com/ionic-team/ionic-framework/commit/57e247637005b10f0d21d5ac5f5232bcb1908301))
-* **datetime:** add support for h11 and h24 hour formats ([#28219](https://github.com/ionic-team/ionic-framework/issues/28219)) ([597bc3f](https://github.com/ionic-team/ionic-framework/commit/597bc3f085c5ff1451c73d0cf4d7d664943e712f)), closes [#23750](https://github.com/ionic-team/ionic-framework/issues/23750)
-* **toast:** allow custom positioning relative to specific element ([#28248](https://github.com/ionic-team/ionic-framework/issues/28248)) ([897ff6f](https://github.com/ionic-team/ionic-framework/commit/897ff6f7493d8d7e4ab22c6ae59de066b43ce682)), closes [#17499](https://github.com/ionic-team/ionic-framework/issues/17499)
-
-
-
-
-
-## [7.4.4](https://github.com/ionic-team/ionic-framework/compare/v7.4.3...v7.4.4) (2023-10-11)
-
-
-### Bug Fixes
-
-* **animation:** play method resolves when animation is stopped ([#28264](https://github.com/ionic-team/ionic-framework/issues/28264)) ([e6031fb](https://github.com/ionic-team/ionic-framework/commit/e6031fbef0698dac0a346cd6202c47f2abf54f95))
-* **checkbox, radio, toggle:** disabled elements are not interactive ([#28294](https://github.com/ionic-team/ionic-framework/issues/28294)) ([c70432e](https://github.com/ionic-team/ionic-framework/commit/c70432e6934bcf1d570e1f7cf671c52d2bb52a8b)), closes [#28293](https://github.com/ionic-team/ionic-framework/issues/28293)
-* **content:** fullscreen offset is computed correctly with tab bar ([#28245](https://github.com/ionic-team/ionic-framework/issues/28245)) ([7375dd6](https://github.com/ionic-team/ionic-framework/commit/7375dd6abafdf7457f23deb53ad5f016456a6af2)), closes [#21130](https://github.com/ionic-team/ionic-framework/issues/21130)
-* **core:** allow fullscreen scroll content to flow outside container for translucent tab bar ([#28246](https://github.com/ionic-team/ionic-framework/issues/28246)) ([b297529](https://github.com/ionic-team/ionic-framework/commit/b297529afc4b93a93f7eaecd31dd5a88a3de5f4e)), closes [#17676](https://github.com/ionic-team/ionic-framework/issues/17676)
-* **core:** swipe to go back gesture has priority over other horizontal swipe gestures ([#28304](https://github.com/ionic-team/ionic-framework/issues/28304)) ([d5f0c77](https://github.com/ionic-team/ionic-framework/commit/d5f0c776dfb5cb40b8119c596805dad3adb621e0)), closes [#28303](https://github.com/ionic-team/ionic-framework/issues/28303)
-* **header:** collapsible large title main header does not flicker on load ([#28277](https://github.com/ionic-team/ionic-framework/issues/28277)) ([3259da0](https://github.com/ionic-team/ionic-framework/commit/3259da0de181c8f82c38d9de13733213c77d398f)), closes [#27060](https://github.com/ionic-team/ionic-framework/issues/27060)
-* **menu:** do not error if disabled or swipeGesture is changed mid-animation ([#28268](https://github.com/ionic-team/ionic-framework/issues/28268)) ([a169044](https://github.com/ionic-team/ionic-framework/commit/a1690441e5bcee8176da32700de6f9e3fde9635e)), closes [#20092](https://github.com/ionic-team/ionic-framework/issues/20092) [#19676](https://github.com/ionic-team/ionic-framework/issues/19676) [#19000](https://github.com/ionic-team/ionic-framework/issues/19000)
-* **segment:** scroll to active segment-button on first load ([#28276](https://github.com/ionic-team/ionic-framework/issues/28276)) ([1167a93](https://github.com/ionic-team/ionic-framework/commit/1167a9325fb930b6c727bc26889f5488d9620062)), closes [#28096](https://github.com/ionic-team/ionic-framework/issues/28096)
-
-
-
-
-
-## [7.4.3](https://github.com/ionic-team/ionic-framework/compare/v7.4.2...v7.4.3) (2023-10-04)
-
-
-### Bug Fixes
-
-* **fab-button:** position is correct with custom sizes ([#28195](https://github.com/ionic-team/ionic-framework/issues/28195)) ([eb41b55](https://github.com/ionic-team/ionic-framework/commit/eb41b556b57c97139b9c36dc3e3be3711d8afaca)), closes [#22564](https://github.com/ionic-team/ionic-framework/issues/22564)
-* **range:** knob positions are correct on initial render with custom elements build ([#28257](https://github.com/ionic-team/ionic-framework/issues/28257)) ([ac2c8e6](https://github.com/ionic-team/ionic-framework/commit/ac2c8e6c22da4d0d8224def24ddef56ee9d26246)), closes [#25444](https://github.com/ionic-team/ionic-framework/issues/25444)
-
-
-
-
-
-## [7.4.2](https://github.com/ionic-team/ionic-framework/compare/v7.4.1...v7.4.2) (2023-09-27)
-
-
-### Bug Fixes
-
-* **title:** large title uses custom font on transition ([#28231](https://github.com/ionic-team/ionic-framework/issues/28231)) ([71a7af0](https://github.com/ionic-team/ionic-framework/commit/71a7af0f52fe62937b1dea1ca2739e78801a2a6d))
-
-
-
-
-
-## [7.4.1](https://github.com/ionic-team/ionic-framework/compare/v7.4.0...v7.4.1) (2023-09-20)
-
-
-### Bug Fixes
-
-* **overlays:** correctly re-add root to accessibility tree ([#28183](https://github.com/ionic-team/ionic-framework/issues/28183)) ([81714d4](https://github.com/ionic-team/ionic-framework/commit/81714d45bd97f0ba91729959b60a0dc1d1d06533)), closes [#28180](https://github.com/ionic-team/ionic-framework/issues/28180)
-* **radio,toggle,checkbox,select:** padded space is clickable in items ([#28136](https://github.com/ionic-team/ionic-framework/issues/28136)) ([5b7e422](https://github.com/ionic-team/ionic-framework/commit/5b7e422dc0bfd4d58fb31f62715af47e62dabb57)), closes [#27169](https://github.com/ionic-team/ionic-framework/issues/27169)
-* **range:** knob is not cut off in item with modern syntax ([#28199](https://github.com/ionic-team/ionic-framework/issues/28199)) ([0104d89](https://github.com/ionic-team/ionic-framework/commit/0104d899270d73e16f2850a5fd7d2ba25a9e7ef0)), closes [#27199](https://github.com/ionic-team/ionic-framework/issues/27199)
-* **scroll-assist:** improve input scroll accuracy with native resizing ([#28169](https://github.com/ionic-team/ionic-framework/issues/28169)) ([b5c736f](https://github.com/ionic-team/ionic-framework/commit/b5c736f5ac829efebedf3256ddf77ab3daa7a5f6)), closes [#22940](https://github.com/ionic-team/ionic-framework/issues/22940)
-* **scroll-assist:** re-run when keyboard changes ([#28174](https://github.com/ionic-team/ionic-framework/issues/28174)) ([3f06da4](https://github.com/ionic-team/ionic-framework/commit/3f06da4cfc0d59c658e17e09ccb1ea28a29339f9)), closes [#22940](https://github.com/ionic-team/ionic-framework/issues/22940)
-
-
-
-
-
-# [7.4.0](https://github.com/ionic-team/ionic-framework/compare/v7.3.4...v7.4.0) (2023-09-14)
-
-
-### Bug Fixes
-
-* **datetime:** scroll to newly selected date when value changes ([#27806](https://github.com/ionic-team/ionic-framework/issues/27806)) ([32244fb](https://github.com/ionic-team/ionic-framework/commit/32244fbdd1931e59a9e3cedd2b143c8ee7d01459)), closes [#26391](https://github.com/ionic-team/ionic-framework/issues/26391)
-* **many:** add correct scale to stacked labels ([#28163](https://github.com/ionic-team/ionic-framework/issues/28163)) ([8cb8786](https://github.com/ionic-team/ionic-framework/commit/8cb878669e53bad25bbe2787826b6d02d292848a))
-* **range:** add correct margin in item ([#28161](https://github.com/ionic-team/ionic-framework/issues/28161)) ([1d2b867](https://github.com/ionic-team/ionic-framework/commit/1d2b867f2207d366e355265b081bc9aabe31ce7e))
-
-
-### Features
-
-* **checkbox, radio, toggle, range:** stacked labels for form controls ([#28075](https://github.com/ionic-team/ionic-framework/issues/28075)) ([e6c7bb6](https://github.com/ionic-team/ionic-framework/commit/e6c7bb60e7e61c965f45e2bf3e3bd16f5125ad56))
-* **datetime:** add disabled part ([#28134](https://github.com/ionic-team/ionic-framework/issues/28134)) ([cd8d509](https://github.com/ionic-team/ionic-framework/commit/cd8d5091a133804ac97d0394354dcf7cd73d9355))
-* **datetime:** add parts for calendar day, active, and today ([#27641](https://github.com/ionic-team/ionic-framework/issues/27641)) ([79b005d](https://github.com/ionic-team/ionic-framework/commit/79b005da704c2ce481e1e3bc4d24cdba06a36d04)), closes [#25340](https://github.com/ionic-team/ionic-framework/issues/25340)
-* export TransitionOptions interface and getIonPageElement ([#28140](https://github.com/ionic-team/ionic-framework/issues/28140)) ([19f3bb2](https://github.com/ionic-team/ionic-framework/commit/19f3bb23fd5587848fc41a744ca46ef5985c04d2)), closes [#28137](https://github.com/ionic-team/ionic-framework/issues/28137)
-
-
-
-
-
-## [7.3.4](https://github.com/ionic-team/ionic-framework/compare/v7.3.3...v7.3.4) (2023-09-13)
-
-
-### Bug Fixes
-
-* **menu:** remove app dir from safe area padding ([#28123](https://github.com/ionic-team/ionic-framework/issues/28123)) ([e0542a7](https://github.com/ionic-team/ionic-framework/commit/e0542a7867871fa45a7fe6a4986e7de633063b4b))
-
-
-
-
-
-## [7.3.3](https://github.com/ionic-team/ionic-framework/compare/v7.3.2...v7.3.3) (2023-09-06)
-
-
-### Bug Fixes
-
-* **modal:** swipe to dismiss resets status bar style ([#28110](https://github.com/ionic-team/ionic-framework/issues/28110)) ([176585f](https://github.com/ionic-team/ionic-framework/commit/176585f446b04a6a0cedab2e09417637dbfc78ee)), closes [#28105](https://github.com/ionic-team/ionic-framework/issues/28105)
-* **overlays:** prevent overlays from getting stuck open ([#28069](https://github.com/ionic-team/ionic-framework/issues/28069)) ([584e9d3](https://github.com/ionic-team/ionic-framework/commit/584e9d3be220343451c2d4b9bf90658ecd530de1)), closes [#27200](https://github.com/ionic-team/ionic-framework/issues/27200)
-* **popover:** dynamic width popover is positioned correctly ([#28072](https://github.com/ionic-team/ionic-framework/issues/28072)) ([2a80eb6](https://github.com/ionic-team/ionic-framework/commit/2a80eb6bd0b16a9dab9bea600bb7f935d25c0e1b)), closes [#27190](https://github.com/ionic-team/ionic-framework/issues/27190) [#24780](https://github.com/ionic-team/ionic-framework/issues/24780)
-* **textarea:** cols property is respected ([#28081](https://github.com/ionic-team/ionic-framework/issues/28081)) ([6d4eabc](https://github.com/ionic-team/ionic-framework/commit/6d4eabcc1046c28c1abf69a8bda3e06f80cf3f8f)), closes [#22142](https://github.com/ionic-team/ionic-framework/issues/22142)
-
-
-
-
-
-## [7.3.2](https://github.com/ionic-team/ionic-framework/compare/v7.3.1...v7.3.2) (2023-08-30)
-
-
-### Bug Fixes
-
-* **datetime:** gracefully handle invalid min/max ([#28054](https://github.com/ionic-team/ionic-framework/issues/28054)) ([01fc9b4](https://github.com/ionic-team/ionic-framework/commit/01fc9b45116f7ad6ddc56c7fb1535dec798c2b3a)), closes [#28041](https://github.com/ionic-team/ionic-framework/issues/28041)
-
-
-
-
-
-## [7.3.1](https://github.com/ionic-team/ionic-framework/compare/v7.3.0...v7.3.1) (2023-08-23)
-
-
-### Bug Fixes
-
-* **input, textarea:** clearOnEdit does not clear when pressing Tab ([#28005](https://github.com/ionic-team/ionic-framework/issues/28005)) ([444acc1](https://github.com/ionic-team/ionic-framework/commit/444acc1f1bca348b62dfb398067cc087529f67f1)), closes [#27746](https://github.com/ionic-team/ionic-framework/issues/27746)
-
-
-
-
-
-# [7.3.0](https://github.com/ionic-team/ionic-framework/compare/v7.2.4...v7.3.0) (2023-08-16)
-
-
-### Bug Fixes
-
-* **alert:** radio and checkbox labels wrap to next line ([#27898](https://github.com/ionic-team/ionic-framework/issues/27898)) ([0d3127a](https://github.com/ionic-team/ionic-framework/commit/0d3127ad09df3c914a8c254f14931de5ca3beb31)), closes [#17269](https://github.com/ionic-team/ionic-framework/issues/17269)
-
-
-### Features
-
-* **action-sheet:** add htmlAttributes property for passing attributes to buttons ([#27863](https://github.com/ionic-team/ionic-framework/issues/27863)) ([5ce4ec0](https://github.com/ionic-team/ionic-framework/commit/5ce4ec0439e4f31aba31062fd8af4a2ad792a54f))
-* **alert:** add htmlAttributes property for passing attributes to buttons ([#27862](https://github.com/ionic-team/ionic-framework/issues/27862)) ([06be0e5](https://github.com/ionic-team/ionic-framework/commit/06be0e511164ebdaa6af9a3747d0585260c030a9))
-* **toast:** add htmlAttributes property for passing attributes to buttons   ([#27855](https://github.com/ionic-team/ionic-framework/issues/27855)) ([9a68588](https://github.com/ionic-team/ionic-framework/commit/9a685882b7085d911ff09eedacc367629e32348a))
-* **toast:** add shadow part for cancel button ([#27921](https://github.com/ionic-team/ionic-framework/issues/27921)) ([e9faf54](https://github.com/ionic-team/ionic-framework/commit/e9faf54d0a7409521706ce9c8b0d26f3fbe9ba41)), closes [#27920](https://github.com/ionic-team/ionic-framework/issues/27920)
-
-
-
-
-
-## [7.2.4](https://github.com/ionic-team/ionic-framework/compare/v7.2.3...v7.2.4) (2023-08-16)
-
-
-### Bug Fixes
-
-* **tap-click:** do not error in document-less environment ([#27972](https://github.com/ionic-team/ionic-framework/issues/27972)) ([28bd4ba](https://github.com/ionic-team/ionic-framework/commit/28bd4ba720bb77d5f5c48cd7a45e0015daddc9dd))
-* **title:** large title aligns with ios spec ([#27969](https://github.com/ionic-team/ionic-framework/issues/27969)) ([8fa12fc](https://github.com/ionic-team/ionic-framework/commit/8fa12fc88857df27a1ca11249f0085e100fe1474)), closes [#27966](https://github.com/ionic-team/ionic-framework/issues/27966)
-
-
-
-
-
-## [7.2.3](https://github.com/ionic-team/ionic-framework/compare/v7.2.2...v7.2.3) (2023-08-09)
-
-
-### Bug Fixes
-
-* **button:** hidden button is added when form is set async ([#27955](https://github.com/ionic-team/ionic-framework/issues/27955)) ([e9fa300](https://github.com/ionic-team/ionic-framework/commit/e9fa30002bd5dec4f2f56a15c84eec1b3e794942)), closes [#27952](https://github.com/ionic-team/ionic-framework/issues/27952)
-* **datetime:** changing months work if partially visible ([#27917](https://github.com/ionic-team/ionic-framework/issues/27917)) ([eb19c28](https://github.com/ionic-team/ionic-framework/commit/eb19c289d6581639f6df7aff002bebdf2b27d31c)), closes [#27913](https://github.com/ionic-team/ionic-framework/issues/27913)
-* **item-sliding:** account for options added before watcher ([#27915](https://github.com/ionic-team/ionic-framework/issues/27915)) ([a0b3ef0](https://github.com/ionic-team/ionic-framework/commit/a0b3ef02af718e232246515bb873ad8c090fa55d)), closes [#27910](https://github.com/ionic-team/ionic-framework/issues/27910)
-* **many:** overlays present if isOpen is true on load ([#27933](https://github.com/ionic-team/ionic-framework/issues/27933)) ([a0e6ac6](https://github.com/ionic-team/ionic-framework/commit/a0e6ac6013552c5e3acdde33575d4aaf4d4c0bda)), closes [#27928](https://github.com/ionic-team/ionic-framework/issues/27928)
-* **modal:** setCurrentBreakpoint respects animated prop ([#27924](https://github.com/ionic-team/ionic-framework/issues/27924)) ([da55ab9](https://github.com/ionic-team/ionic-framework/commit/da55ab949ef1894738da5a6241176089b7a2b6e3)), closes [#27923](https://github.com/ionic-team/ionic-framework/issues/27923)
-* **nav:** improve reliability of swipe back gesture when quickly swiping back ([#27904](https://github.com/ionic-team/ionic-framework/issues/27904)) ([9500769](https://github.com/ionic-team/ionic-framework/commit/9500769f114d180613f0340b1a328b5e631b7188)), closes [#27893](https://github.com/ionic-team/ionic-framework/issues/27893)
-
-
-
-
-
-## [7.2.2](https://github.com/ionic-team/ionic-framework/compare/v7.2.1...v7.2.2) (2023-08-02)
-
-
-### Bug Fixes
-
-* **datetime-button:** render correct text when passing partial date values ([#27816](https://github.com/ionic-team/ionic-framework/issues/27816)) ([bd1910b](https://github.com/ionic-team/ionic-framework/commit/bd1910ba69348877ad5f99d9db2b59d06693b91e)), closes [#27797](https://github.com/ionic-team/ionic-framework/issues/27797)
-* **input, textarea:** input does not block floating label ([#27870](https://github.com/ionic-team/ionic-framework/issues/27870)) ([f14c440](https://github.com/ionic-team/ionic-framework/commit/f14c440d6321ef9f168b272338e5cd21cab384ef)), closes [#27812](https://github.com/ionic-team/ionic-framework/issues/27812)
-* **item-options:** use correct safe area padding ([#27853](https://github.com/ionic-team/ionic-framework/issues/27853)) ([0b8f1bc](https://github.com/ionic-team/ionic-framework/commit/0b8f1bc7dd4170a2a8c9ed3aede173dd489b25ea))
-* **radio:** radios can be focused and are announced with group ([#27817](https://github.com/ionic-team/ionic-framework/issues/27817)) ([ba2f49b](https://github.com/ionic-team/ionic-framework/commit/ba2f49b8a460520d20ac198db800ea2d9e5b015f)), closes [#27438](https://github.com/ionic-team/ionic-framework/issues/27438)
-* **select:** popover uses modern form syntax ([#27818](https://github.com/ionic-team/ionic-framework/issues/27818)) ([0c117cf](https://github.com/ionic-team/ionic-framework/commit/0c117cfe7f383b7c7837d27de5a6eee12ddd6c2f)), closes [#27071](https://github.com/ionic-team/ionic-framework/issues/27071) [#27786](https://github.com/ionic-team/ionic-framework/issues/27786)
-
-
-
-
-
 ## [7.2.1](https://github.com/ionic-team/ionic-framework/compare/v7.2.0...v7.2.1) (2023-07-26)


--- a/core/api.txt
+++ b/core/api.txt
@@ -289,13 +289,12 @@ ion-card-title,prop,mode,"ios" | "md",undefined,false,false
 ion-card-title,css-prop,--color

 ion-checkbox,shadow
-ion-checkbox,prop,alignment,"center" | "start",'center',false,false
 ion-checkbox,prop,checked,boolean,false,false,false
 ion-checkbox,prop,color,"danger" | "dark" | "light" | "medium" | "primary" | "secondary" | "success" | "tertiary" | "warning" | string & Record<never, never> | undefined,undefined,false,true
 ion-checkbox,prop,disabled,boolean,false,false,false
 ion-checkbox,prop,indeterminate,boolean,false,false,false
 ion-checkbox,prop,justify,"end" | "space-between" | "start",'space-between',false,false
-ion-checkbox,prop,labelPlacement,"end" | "fixed" | "stacked" | "start",'start',false,false
+ion-checkbox,prop,labelPlacement,"end" | "fixed" | "start",'start',false,false
 ion-checkbox,prop,legacy,boolean | undefined,undefined,false,false
 ion-checkbox,prop,mode,"ios" | "md",undefined,false,false
 ion-checkbox,prop,name,string,this.inputId,false,false
@@ -394,7 +393,7 @@ ion-datetime,prop,disabled,boolean,false,false,false
 ion-datetime,prop,doneText,string,'Done',false,false
 ion-datetime,prop,firstDayOfWeek,number,0,false,false
 ion-datetime,prop,highlightedDates,((dateIsoString: string) => DatetimeHighlightStyle | undefined) | DatetimeHighlight[] | undefined,undefined,false,false
-ion-datetime,prop,hourCycle,"h11" | "h12" | "h23" | "h24" | undefined,undefined,false,false
+ion-datetime,prop,hourCycle,"h12" | "h23" | undefined,undefined,false,false
 ion-datetime,prop,hourValues,number | number[] | string | undefined,undefined,false,false
 ion-datetime,prop,isDateEnabled,((dateIsoString: string) => boolean) | undefined,undefined,false,false
 ion-datetime,prop,locale,string,'default',false,false
@@ -428,10 +427,6 @@ ion-datetime,css-prop,--background-rgb
 ion-datetime,css-prop,--title-color
 ion-datetime,css-prop,--wheel-fade-background-rgb
 ion-datetime,css-prop,--wheel-highlight-background
-ion-datetime,part,calendar-day
-ion-datetime,part,calendar-day active
-ion-datetime,part,calendar-day disabled
-ion-datetime,part,calendar-day today
 ion-datetime,part,month-year-button
 ion-datetime,part,time-button
 ion-datetime,part,time-button active
@@ -1013,11 +1008,10 @@ ion-progress-bar,part,stream
 ion-progress-bar,part,track

 ion-radio,shadow
-ion-radio,prop,alignment,"center" | "start",'center',false,false
 ion-radio,prop,color,"danger" | "dark" | "light" | "medium" | "primary" | "secondary" | "success" | "tertiary" | "warning" | string & Record<never, never> | undefined,undefined,false,true
 ion-radio,prop,disabled,boolean,false,false,false
 ion-radio,prop,justify,"end" | "space-between" | "start",'space-between',false,false
-ion-radio,prop,labelPlacement,"end" | "fixed" | "stacked" | "start",'start',false,false
+ion-radio,prop,labelPlacement,"end" | "fixed" | "start",'start',false,false
 ion-radio,prop,legacy,boolean | undefined,undefined,false,false
 ion-radio,prop,mode,"ios" | "md",undefined,false,false
 ion-radio,prop,name,string,this.inputId,false,false
@@ -1044,7 +1038,7 @@ ion-range,prop,debounce,number | undefined,undefined,false,false
 ion-range,prop,disabled,boolean,false,false,false
 ion-range,prop,dualKnobs,boolean,false,false,false
 ion-range,prop,label,string | undefined,undefined,false,false
-ion-range,prop,labelPlacement,"end" | "fixed" | "stacked" | "start",'start',false,false
+ion-range,prop,labelPlacement,"end" | "fixed" | "start",'start',false,false
 ion-range,prop,legacy,boolean | undefined,undefined,false,false
 ion-range,prop,max,number,100,false,false
 ion-range,prop,min,number,0,false,false
@@ -1370,7 +1364,7 @@ ion-textarea,prop,autocapitalize,string,'none',false,false
 ion-textarea,prop,autofocus,boolean,false,false,false
 ion-textarea,prop,clearOnEdit,boolean,false,false,false
 ion-textarea,prop,color,"danger" | "dark" | "light" | "medium" | "primary" | "secondary" | "success" | "tertiary" | "warning" | string & Record<never, never> | undefined,undefined,false,true
-ion-textarea,prop,cols,number | undefined,undefined,false,true
+ion-textarea,prop,cols,number | undefined,undefined,false,false
 ion-textarea,prop,counter,boolean,false,false,false
 ion-textarea,prop,counterFormatter,((inputLength: number, maxLength: number) => string) | undefined,undefined,false,false
 ion-textarea,prop,debounce,number | undefined,undefined,false,false
@@ -1445,7 +1439,6 @@ ion-toast,prop,leaveAnimation,((baseEl: any, opts?: any) => Animation) | undefin
 ion-toast,prop,message,IonicSafeString | string | undefined,undefined,false,false
 ion-toast,prop,mode,"ios" | "md",undefined,false,false
 ion-toast,prop,position,"bottom" | "middle" | "top",'bottom',false,false
-ion-toast,prop,positionAnchor,HTMLElement | string | undefined,undefined,false,false
 ion-toast,prop,translucent,boolean,false,false,false
 ion-toast,prop,trigger,string | undefined,undefined,false,false
 ion-toast,method,dismiss,dismiss(data?: any, role?: string) => Promise<boolean>
@@ -1478,20 +1471,18 @@ ion-toast,css-prop,--start
 ion-toast,css-prop,--white-space
 ion-toast,css-prop,--width
 ion-toast,part,button
-ion-toast,part,button cancel
 ion-toast,part,container
 ion-toast,part,header
 ion-toast,part,icon
 ion-toast,part,message

 ion-toggle,shadow
-ion-toggle,prop,alignment,"center" | "start",'center',false,false
 ion-toggle,prop,checked,boolean,false,false,false
 ion-toggle,prop,color,"danger" | "dark" | "light" | "medium" | "primary" | "secondary" | "success" | "tertiary" | "warning" | string & Record<never, never> | undefined,undefined,false,true
 ion-toggle,prop,disabled,boolean,false,false,false
 ion-toggle,prop,enableOnOffLabels,boolean | undefined,config.get('toggleOnOffLabels'),false,false
 ion-toggle,prop,justify,"end" | "space-between" | "start",'space-between',false,false
-ion-toggle,prop,labelPlacement,"end" | "fixed" | "stacked" | "start",'start',false,false
+ion-toggle,prop,labelPlacement,"end" | "fixed" | "start",'start',false,false
 ion-toggle,prop,legacy,boolean | undefined,undefined,false,false
 ion-toggle,prop,mode,"ios" | "md",undefined,false,false
 ion-toggle,prop,name,string,this.inputId,false,false
--- a/core/custom-rules/index.js
+++ b/core/custom-rules/index.js
@@ -1,7 +1,6 @@
 module.exports = {
  rules: {
    'no-component-on-ready-method': require('./no-component-on-ready-method.js'),
-    'await-playwright-promise-assertion': require('./await-playwright-promise-assertion.js'),
-    'no-playwright-to-match-snapshot-assertion': require('./no-playwright-to-match-snapshot-assertion.js')
+    'await-playwright-promise-assertion': require('./await-playwright-promise-assertion.js')
  }
 }
--- a/core/custom-rules/no-playwright-to-match-snapshot-assertion.js
+++ b/core/custom-rules/no-playwright-to-match-snapshot-assertion.js
@@ -1,29 +0,0 @@
-module.exports = {
-  meta: {
-    messages: {
-      noPlaywrightToMatchSnapshotAssertion: '"toHaveScreenshot" assertions should be used in favor of "toMatchSnapshot". "toHaveScreenshot" brings file size reductions and anti-flake behaviors such as disabling animations by default.',
-    },
-  },
-  create(context) {
-    return {
-      ExpressionStatement(node) {
-        if (node.expression.callee === undefined) {
-          return;
-        }
-
-        const { property } = node.expression.callee;
-
-        /**
-         * Check to see if toMatchSnapshot is being used
-         */
-        if (
-          property !== undefined &&
-          property.type === 'Identifier' &&
-          property.name === 'toMatchSnapshot'
-        ) {
-          context.report({ node: node, messageId: 'noPlaywrightToMatchSnapshotAssertion' });
-        }
-      }
-    }
-  }
-};
--- a/core/package-lock.json
+++ b/core/package-lock.json
--- a/core/package.json
+++ b/core/package.json
@@ -1,6 +1,6 @@
 {
  "name": "@ionic/core",
-  "version": "7.5.0",
+  "version": "7.2.1",
  "description": "Base components for Ionic",
  "keywords": [
    "ionic",
@@ -31,30 +31,30 @@
    "loader/"
  ],
  "dependencies": {
-    "@stencil/core": "^4.4.1",
-    "ionicons": "^7.2.1",
+    "@stencil/core": "^3.4.0",
+    "ionicons": "7.1.0",
    "tslib": "^2.1.0"
  },
  "devDependencies": {
    "@axe-core/playwright": "^4.7.3",
-    "@capacitor/core": "^5.4.2",
+    "@capacitor/core": "^5.2.2",
    "@capacitor/haptics": "^5.0.6",
    "@capacitor/keyboard": "^5.0.6",
    "@capacitor/status-bar": "^5.0.6",
    "@ionic/eslint-config": "^0.3.0",
    "@ionic/prettier-config": "^2.0.0",
    "@jest/core": "^27.5.1",
-    "@playwright/test": "^1.38.1",
+    "@playwright/test": "^1.36.2",
    "@rollup/plugin-node-resolve": "^8.4.0",
    "@rollup/plugin-virtual": "^2.0.3",
-    "@stencil/angular-output-target": "^0.8.2",
+    "@stencil/angular-output-target": "^0.7.1",
    "@stencil/react-output-target": "^0.5.3",
-    "@stencil/sass": "^3.0.6",
+    "@stencil/sass": "^3.0.5",
    "@stencil/vue-output-target": "^0.8.6",
    "@types/jest": "^27.5.2",
    "@types/node": "^14.6.0",
-    "@typescript-eslint/eslint-plugin": "^6.7.2",
-    "@typescript-eslint/parser": "^6.7.2",
+    "@typescript-eslint/eslint-plugin": "^5.17.0",
+    "@typescript-eslint/parser": "^5.17.0",
    "clean-css-cli": "^5.6.1",
    "domino": "^2.1.6",
    "eslint": "^7.32.0",
@@ -66,10 +66,11 @@
    "jest-cli": "^27.5.1",
    "prettier": "^2.6.1",
    "rollup": "^2.26.4",
-    "sass": "^1.33.0",
+    "sass": "^1.26.10",
    "serve": "^14.0.1",
    "stylelint": "^13.13.1",
-    "stylelint-order": "^4.1.0"
+    "stylelint-order": "^4.1.0",
+    "typescript": "^4.0.5"
  },
  "scripts": {
    "build": "npm run clean && npm run build.css && stencil build --es5 --docs-json dist/docs.json",
@@ -94,7 +95,6 @@
    "test.spec": "stencil test --spec --max-workers=2",
    "test.spec.debug": "npx --node-arg=\"--inspect-brk\" stencil test --spec",
    "test.e2e": "npx playwright test",
-    "test.e2e.update-snapshots": "npm run test.e2e -- --update-snapshots",
    "test.watch": "jest --watch --no-cache",
    "test.treeshake": "node scripts/treeshaking.js dist/index.js",
    "validate": "npm run lint && npm run test && npm run build && npm run test.treeshake"
--- a/core/playwright.config.ts
+++ b/core/playwright.config.ts
@@ -55,21 +55,21 @@ const config: PlaywrightTestConfig = {
    timeout: 5000,
    toHaveScreenshot: {
      threshold: 0.1
+    },
+    toMatchSnapshot: {
+      threshold: 0.1
    }
  },
  /* Fail the build on CI if you accidentally left test.only in the source code. */
  forbidOnly: !!process.env.CI,
-  maxFailures: 0,
-  /* Test retries help catch flaky tests on CI */
-  retries: process.env.CI ? 2 : 0,
-  reportSlowTests: null,
+  /* Fail fast on CI */
+  maxFailures: process.env.CI ? 1 : 0,
+  /* Flaky test should be either addressed or disabled until we can address them */
+  retries: 0,
  /* Opt out of parallel tests on CI. */
  workers: process.env.CI ? 1 : undefined,
  /* Reporter to use. See https://playwright.dev/docs/test-reporters */
-  reporter: [
-    ['html'],
-    ['github']
-  ],
+  reporter: 'html',
  /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
  use: {
    /* Maximum time each action such as `click()` can take. Defaults to 0 (no limit). */
--- a/core/scripts/testing/styles.css
+++ b/core/scripts/testing/styles.css
--- a/core/src/components.d.ts
+++ b/core/src/components.d.ts
@@ -15,7 +15,7 @@ import { RouteID, RouterDirection, RouterEventDetail, RouteWrite } from "./compo
 import { BreadcrumbCollapsedClickEventDetail } from "./components/breadcrumb/breadcrumb-interface";
 import { CheckboxChangeEventDetail } from "./components/checkbox/checkbox-interface";
 import { ScrollBaseDetail, ScrollDetail } from "./components/content/content-interface";
-import { DatetimeChangeEventDetail, DatetimeHighlight, DatetimeHighlightCallback, DatetimeHourCycle, DatetimePresentation, TitleSelectedDatesFormatter } from "./components/datetime/datetime-interface";
+import { DatetimeChangeEventDetail, DatetimeHighlight, DatetimeHighlightCallback, DatetimePresentation, TitleSelectedDatesFormatter } from "./components/datetime/datetime-interface";
 import { SpinnerTypes } from "./components/spinner/spinner-configs";
 import { InputChangeEventDetail, InputInputEventDetail } from "./components/input/input-interface";
 import { CounterFormatter } from "./components/item/item-interface";
@@ -39,7 +39,7 @@ import { SelectChangeEventDetail, SelectCompareFn, SelectInterface } from "./com
 import { SelectPopoverOption } from "./components/select-popover/select-popover-interface";
 import { TabBarChangedEventDetail, TabButtonClickEventDetail, TabButtonLayout } from "./components/tab-bar/tab-bar-interface";
 import { TextareaChangeEventDetail, TextareaInputEventDetail } from "./components/textarea/textarea-interface";
-import { ToastButton, ToastDismissOptions, ToastLayout, ToastPosition, ToastPresentOptions } from "./components/toast/toast-interface";
+import { ToastButton, ToastLayout, ToastPosition } from "./components/toast/toast-interface";
 import { ToggleChangeEventDetail } from "./components/toggle/toggle-interface";
 export { AccordionGroupChangeEventDetail } from "./components/accordion-group/accordion-group-interface";
 export { AnimationBuilder, AutocompleteTypes, Color, ComponentProps, ComponentRef, FrameworkDelegate, StyleEventDetail, TextFieldTypes } from "./interface";
@@ -51,7 +51,7 @@ export { RouteID, RouterDirection, RouterEventDetail, RouteWrite } from "./compo
 export { BreadcrumbCollapsedClickEventDetail } from "./components/breadcrumb/breadcrumb-interface";
 export { CheckboxChangeEventDetail } from "./components/checkbox/checkbox-interface";
 export { ScrollBaseDetail, ScrollDetail } from "./components/content/content-interface";
-export { DatetimeChangeEventDetail, DatetimeHighlight, DatetimeHighlightCallback, DatetimeHourCycle, DatetimePresentation, TitleSelectedDatesFormatter } from "./components/datetime/datetime-interface";
+export { DatetimeChangeEventDetail, DatetimeHighlight, DatetimeHighlightCallback, DatetimePresentation, TitleSelectedDatesFormatter } from "./components/datetime/datetime-interface";
 export { SpinnerTypes } from "./components/spinner/spinner-configs";
 export { InputChangeEventDetail, InputInputEventDetail } from "./components/input/input-interface";
 export { CounterFormatter } from "./components/item/item-interface";
@@ -75,7 +75,7 @@ export { SelectChangeEventDetail, SelectCompareFn, SelectInterface } from "./com
 export { SelectPopoverOption } from "./components/select-popover/select-popover-interface";
 export { TabBarChangedEventDetail, TabButtonClickEventDetail, TabButtonLayout } from "./components/tab-bar/tab-bar-interface";
 export { TextareaChangeEventDetail, TextareaInputEventDetail } from "./components/textarea/textarea-interface";
-export { ToastButton, ToastDismissOptions, ToastLayout, ToastPosition, ToastPresentOptions } from "./components/toast/toast-interface";
+export { ToastButton, ToastLayout, ToastPosition } from "./components/toast/toast-interface";
 export { ToggleChangeEventDetail } from "./components/toggle/toggle-interface";
 export namespace Components {
    interface IonAccordion {
@@ -602,10 +602,6 @@ export namespace Components {
        "mode"?: "ios" | "md";
    }
    interface IonCheckbox {
-        /**
-          * How to control the alignment of the checkbox and label on the cross axis. `"start"`: The label and control will appear on the left of the cross axis in LTR, and on the right side in RTL. `"center"`: The label and control will appear at the center of the cross axis in both LTR and RTL.
-         */
-        "alignment": 'start' | 'center';
        /**
          * If `true`, the checkbox is selected.
         */
@@ -627,9 +623,9 @@ export namespace Components {
         */
        "justify": 'start' | 'end' | 'space-between';
        /**
-          * Where to place the label relative to the checkbox. `"start"`: The label will appear to the left of the checkbox in LTR and to the right in RTL. `"end"`: The label will appear to the right of the checkbox in LTR and to the left in RTL. `"fixed"`: The label has the same behavior as `"start"` except it also has a fixed width. Long text will be truncated with ellipses ("..."). `"stacked"`: The label will appear above the checkbox regardless of the direction. The alignment of the label can be controlled with the `alignment` property.
+          * Where to place the label relative to the checkbox. `"start"`: The label will appear to the left of the checkbox in LTR and to the right in RTL. `"end"`: The label will appear to the right of the checkbox in LTR and to the left in RTL. `"fixed"`: The label has the same behavior as `"start"` except it also has a fixed width. Long text will be truncated with ellipses ("...").
         */
-        "labelPlacement": 'start' | 'end' | 'fixed' | 'stacked';
+        "labelPlacement": 'start' | 'end' | 'fixed';
        /**
          * Set the `legacy` property to `true` to forcibly use the legacy form control markup. Ionic will only opt checkboxes in to the modern form markup when they are using either the `aria-label` attribute or have text in the default slot. As a result, the `legacy` property should only be used as an escape hatch when you want to avoid this automatic opt-in behavior.  Note that this property will be removed in an upcoming major release of Ionic, and all form components will be opted-in to using the modern form markup.
         */
@@ -865,7 +861,7 @@ export namespace Components {
        /**
          * The hour cycle of the `ion-datetime`. If no value is set, this is specified by the current locale.
         */
-        "hourCycle"?: DatetimeHourCycle;
+        "hourCycle"?: 'h23' | 'h12';
        /**
          * Values used to create the list of selectable hours. By default the hour values range from `0` to `23` for 24-hour, or `1` to `12` for 12-hour. However, to control exactly which hours to display, the `hourValues` input can take a number, an array of numbers, or a string of comma separated numbers.
         */
@@ -1281,6 +1277,9 @@ export namespace Components {
          * The shape of the input. If "round" it will have an increased border radius.
         */
        "shape"?: 'round';
+        /**
+          * The initial size of the control. This value is in pixels unless the value of the type attribute is `"text"` or `"password"`, in which case it is an integer number of characters. This attribute applies only when the `type` attribute is set to `"text"`, `"search"`, `"tel"`, `"url"`, `"email"`, or `"password"`, otherwise it is ignored.
+         */
        "size"?: number;
        /**
          * If `true`, the element will have its spelling and grammar checked.
@@ -1336,7 +1335,6 @@ export namespace Components {
        "download": string | undefined;
        /**
          * The fill for the item. If `"solid"` the item will have a background. If `"outline"` the item will be transparent with a border. Only available in `md` mode.
-          * @deprecated Use the `fill` property on `ion-input` or `ion-textarea` instead.
         */
        "fill"?: 'outline' | 'solid';
        /**
@@ -2221,10 +2219,6 @@ export namespace Components {
        "value": number;
    }
    interface IonRadio {
-        /**
-          * How to control the alignment of the radio and label on the cross axis. `"start"`: The label and control will appear on the left of the cross axis in LTR, and on the right side in RTL. `"center"`: The label and control will appear at the center of the cross axis in both LTR and RTL.
-         */
-        "alignment": 'start' | 'center';
        /**
          * The color to use from your application's color palette. Default options are: `"primary"`, `"secondary"`, `"tertiary"`, `"success"`, `"warning"`, `"danger"`, `"light"`, `"medium"`, and `"dark"`. For more information on colors, see [theming](/docs/theming/basics).
         */
@@ -2238,9 +2232,9 @@ export namespace Components {
         */
        "justify": 'start' | 'end' | 'space-between';
        /**
-          * Where to place the label relative to the radio. `"start"`: The label will appear to the left of the radio in LTR and to the right in RTL. `"end"`: The label will appear to the right of the radio in LTR and to the left in RTL. `"fixed"`: The label has the same behavior as `"start"` except it also has a fixed width. Long text will be truncated with ellipses ("..."). `"stacked"`: The label will appear above the radio regardless of the direction. The alignment of the label can be controlled with the `alignment` property.
+          * Where to place the label relative to the radio. `"start"`: The label will appear to the left of the radio in LTR and to the right in RTL. `"end"`: The label will appear to the right of the radio in LTR and to the left in RTL. `"fixed"`: The label has the same behavior as `"start"` except it also has a fixed width. Long text will be truncated with ellipses ("...").
         */
-        "labelPlacement": 'start' | 'end' | 'fixed' | 'stacked';
+        "labelPlacement": 'start' | 'end' | 'fixed';
        /**
          * Set the `legacy` property to `true` to forcibly use the legacy form control markup. Ionic will only opt components in to the modern form markup when they are using either the `aria-label` attribute or the default slot that contains the label text. As a result, the `legacy` property should only be used as an escape hatch when you want to avoid this automatic opt-in behavior. Note that this property will be removed in an upcoming major release of Ionic, and all form components will be opted-in to using the modern form markup.
         */
@@ -2300,9 +2294,9 @@ export namespace Components {
         */
        "label"?: string;
        /**
-          * Where to place the label relative to the range. `"start"`: The label will appear to the left of the range in LTR and to the right in RTL. `"end"`: The label will appear to the right of the range in LTR and to the left in RTL. `"fixed"`: The label has the same behavior as `"start"` except it also has a fixed width. Long text will be truncated with ellipses ("..."). `"stacked"`: The label will appear above the range regardless of the direction.
+          * Where to place the label relative to the range. `"start"`: The label will appear to the left of the range in LTR and to the right in RTL. `"end"`: The label will appear to the right of the range in LTR and to the left in RTL. `"fixed"`: The label has the same behavior as `"start"` except it also has a fixed width. Long text will be truncated with ellipses ("...").
         */
-        "labelPlacement": 'start' | 'end' | 'fixed' | 'stacked';
+        "labelPlacement": 'start' | 'end' | 'fixed';
        /**
          * Set the `legacy` property to `true` to forcibly use the legacy form control markup. Ionic will only opt components in to the modern form markup when they are using either the `aria-label` attribute or the `label` property. As a result, the `legacy` property should only be used as an escape hatch when you want to avoid this automatic opt-in behavior. Note that this property will be removed in an upcoming major release of Ionic, and all form components will be opted-in to using the modern form markup.
         */
@@ -3157,13 +3151,9 @@ export namespace Components {
        "onWillDismiss": <T = any>() => Promise<OverlayEventDetail<T>>;
        "overlayIndex": number;
        /**
-          * The starting position of the toast on the screen. Can be tweaked further using the `positionAnchor` property.
+          * The position of the toast on the screen.
         */
        "position": ToastPosition;
-        /**
-          * The element to anchor the toast's position to. Can be set as a direct reference or the ID of the element. With `position="bottom"`, the toast will sit above the chosen element. With `position="top"`, the toast will sit below the chosen element. With `position="middle"`, the value of `positionAnchor` is ignored.
-         */
-        "positionAnchor"?: HTMLElement | string;
        /**
          * Present the toast overlay after it has been created.
         */
@@ -3178,10 +3168,6 @@ export namespace Components {
        "trigger": string | undefined;
    }
    interface IonToggle {
-        /**
-          * How to control the alignment of the toggle and label on the cross axis. ``"start"`: The label and control will appear on the left of the cross axis in LTR, and on the right side in RTL. `"center"`: The label and control will appear at the center of the cross axis in both LTR and RTL.
-         */
-        "alignment": 'start' | 'center';
        /**
          * If `true`, the toggle is selected.
         */
@@ -3203,9 +3189,9 @@ export namespace Components {
         */
        "justify": 'start' | 'end' | 'space-between';
        /**
-          * Where to place the label relative to the input. `"start"`: The label will appear to the left of the toggle in LTR and to the right in RTL. `"end"`: The label will appear to the right of the toggle in LTR and to the left in RTL. `"fixed"`: The label has the same behavior as `"start"` except it also has a fixed width. Long text will be truncated with ellipses ("..."). `"stacked"`: The label will appear above the toggle regardless of the direction. The alignment of the label can be controlled with the `alignment` property.
+          * Where to place the label relative to the input. `"start"`: The label will appear to the left of the toggle in LTR and to the right in RTL. `"end"`: The label will appear to the right of the toggle in LTR and to the left in RTL. `"fixed"`: The label has the same behavior as `"start"` except it also has a fixed width. Long text will be truncated with ellipses ("...").
         */
-        "labelPlacement": 'start' | 'end' | 'fixed' | 'stacked';
+        "labelPlacement": 'start' | 'end' | 'fixed';
        /**
          * Set the `legacy` property to `true` to forcibly use the legacy form control markup. Ionic will only opt components in to the modern form markup when they are using either the `aria-label` attribute or the default slot that contains the label text. As a result, the `legacy` property should only be used as an escape hatch when you want to avoid this automatic opt-in behavior. Note that this property will be removed in an upcoming major release of Ionic, and all form components will be opted-in to using the modern form markup.
         */
@@ -4642,10 +4628,6 @@ declare namespace LocalJSX {
        "mode"?: "ios" | "md";
    }
    interface IonCheckbox {
-        /**
-          * How to control the alignment of the checkbox and label on the cross axis. `"start"`: The label and control will appear on the left of the cross axis in LTR, and on the right side in RTL. `"center"`: The label and control will appear at the center of the cross axis in both LTR and RTL.
-         */
-        "alignment"?: 'start' | 'center';
        /**
          * If `true`, the checkbox is selected.
         */
@@ -4667,9 +4649,9 @@ declare namespace LocalJSX {
         */
        "justify"?: 'start' | 'end' | 'space-between';
        /**
-          * Where to place the label relative to the checkbox. `"start"`: The label will appear to the left of the checkbox in LTR and to the right in RTL. `"end"`: The label will appear to the right of the checkbox in LTR and to the left in RTL. `"fixed"`: The label has the same behavior as `"start"` except it also has a fixed width. Long text will be truncated with ellipses ("..."). `"stacked"`: The label will appear above the checkbox regardless of the direction. The alignment of the label can be controlled with the `alignment` property.
+          * Where to place the label relative to the checkbox. `"start"`: The label will appear to the left of the checkbox in LTR and to the right in RTL. `"end"`: The label will appear to the right of the checkbox in LTR and to the left in RTL. `"fixed"`: The label has the same behavior as `"start"` except it also has a fixed width. Long text will be truncated with ellipses ("...").
         */
-        "labelPlacement"?: 'start' | 'end' | 'fixed' | 'stacked';
+        "labelPlacement"?: 'start' | 'end' | 'fixed';
        /**
          * Set the `legacy` property to `true` to forcibly use the legacy form control markup. Ionic will only opt checkboxes in to the modern form markup when they are using either the `aria-label` attribute or have text in the default slot. As a result, the `legacy` property should only be used as an escape hatch when you want to avoid this automatic opt-in behavior.  Note that this property will be removed in an upcoming major release of Ionic, and all form components will be opted-in to using the modern form markup.
         */
@@ -4893,7 +4875,7 @@ declare namespace LocalJSX {
        /**
          * The hour cycle of the `ion-datetime`. If no value is set, this is specified by the current locale.
         */
-        "hourCycle"?: DatetimeHourCycle;
+        "hourCycle"?: 'h23' | 'h12';
        /**
          * Values used to create the list of selectable hours. By default the hour values range from `0` to `23` for 24-hour, or `1` to `12` for 12-hour. However, to control exactly which hours to display, the `hourValues` input can take a number, an array of numbers, or a string of comma separated numbers.
         */
@@ -5357,6 +5339,9 @@ declare namespace LocalJSX {
          * The shape of the input. If "round" it will have an increased border radius.
         */
        "shape"?: 'round';
+        /**
+          * The initial size of the control. This value is in pixels unless the value of the type attribute is `"text"` or `"password"`, in which case it is an integer number of characters. This attribute applies only when the `type` attribute is set to `"text"`, `"search"`, `"tel"`, `"url"`, `"email"`, or `"password"`, otherwise it is ignored.
+         */
        "size"?: number;
        /**
          * If `true`, the element will have its spelling and grammar checked.
@@ -5412,7 +5397,6 @@ declare namespace LocalJSX {
        "download"?: string | undefined;
        /**
          * The fill for the item. If `"solid"` the item will have a background. If `"outline"` the item will be transparent with a border. Only available in `md` mode.
-          * @deprecated Use the `fill` property on `ion-input` or `ion-textarea` instead.
         */
        "fill"?: 'outline' | 'solid';
        /**
@@ -6248,10 +6232,6 @@ declare namespace LocalJSX {
        "value"?: number;
    }
    interface IonRadio {
-        /**
-          * How to control the alignment of the radio and label on the cross axis. `"start"`: The label and control will appear on the left of the cross axis in LTR, and on the right side in RTL. `"center"`: The label and control will appear at the center of the cross axis in both LTR and RTL.
-         */
-        "alignment"?: 'start' | 'center';
        /**
          * The color to use from your application's color palette. Default options are: `"primary"`, `"secondary"`, `"tertiary"`, `"success"`, `"warning"`, `"danger"`, `"light"`, `"medium"`, and `"dark"`. For more information on colors, see [theming](/docs/theming/basics).
         */
@@ -6265,9 +6245,9 @@ declare namespace LocalJSX {
         */
        "justify"?: 'start' | 'end' | 'space-between';
        /**
-          * Where to place the label relative to the radio. `"start"`: The label will appear to the left of the radio in LTR and to the right in RTL. `"end"`: The label will appear to the right of the radio in LTR and to the left in RTL. `"fixed"`: The label has the same behavior as `"start"` except it also has a fixed width. Long text will be truncated with ellipses ("..."). `"stacked"`: The label will appear above the radio regardless of the direction. The alignment of the label can be controlled with the `alignment` property.
+          * Where to place the label relative to the radio. `"start"`: The label will appear to the left of the radio in LTR and to the right in RTL. `"end"`: The label will appear to the right of the radio in LTR and to the left in RTL. `"fixed"`: The label has the same behavior as `"start"` except it also has a fixed width. Long text will be truncated with ellipses ("...").
         */
-        "labelPlacement"?: 'start' | 'end' | 'fixed' | 'stacked';
+        "labelPlacement"?: 'start' | 'end' | 'fixed';
        /**
          * Set the `legacy` property to `true` to forcibly use the legacy form control markup. Ionic will only opt components in to the modern form markup when they are using either the `aria-label` attribute or the default slot that contains the label text. As a result, the `legacy` property should only be used as an escape hatch when you want to avoid this automatic opt-in behavior. Note that this property will be removed in an upcoming major release of Ionic, and all form components will be opted-in to using the modern form markup.
         */
@@ -6345,9 +6325,9 @@ declare namespace LocalJSX {
         */
        "label"?: string;
        /**
-          * Where to place the label relative to the range. `"start"`: The label will appear to the left of the range in LTR and to the right in RTL. `"end"`: The label will appear to the right of the range in LTR and to the left in RTL. `"fixed"`: The label has the same behavior as `"start"` except it also has a fixed width. Long text will be truncated with ellipses ("..."). `"stacked"`: The label will appear above the range regardless of the direction.
+          * Where to place the label relative to the range. `"start"`: The label will appear to the left of the range in LTR and to the right in RTL. `"end"`: The label will appear to the right of the range in LTR and to the left in RTL. `"fixed"`: The label has the same behavior as `"start"` except it also has a fixed width. Long text will be truncated with ellipses ("...").
         */
-        "labelPlacement"?: 'start' | 'end' | 'fixed' | 'stacked';
+        "labelPlacement"?: 'start' | 'end' | 'fixed';
        /**
          * Set the `legacy` property to `true` to forcibly use the legacy form control markup. Ionic will only opt components in to the modern form markup when they are using either the `aria-label` attribute or the `label` property. As a result, the `legacy` property should only be used as an escape hatch when you want to avoid this automatic opt-in behavior. Note that this property will be removed in an upcoming major release of Ionic, and all form components will be opted-in to using the modern form markup.
         */
@@ -6980,7 +6960,6 @@ declare namespace LocalJSX {
         */
        "mode"?: "ios" | "md";
        "onIonTabBarChanged"?: (event: IonTabBarCustomEvent<TabBarChangedEventDetail>) => void;
-        "onIonTabBarLoaded"?: (event: IonTabBarCustomEvent<void>) => void;
        /**
          * The selected tab component
         */
@@ -7312,13 +7291,9 @@ declare namespace LocalJSX {
        "onWillPresent"?: (event: IonToastCustomEvent<void>) => void;
        "overlayIndex": number;
        /**
-          * The starting position of the toast on the screen. Can be tweaked further using the `positionAnchor` property.
+          * The position of the toast on the screen.
         */
        "position"?: ToastPosition;
-        /**
-          * The element to anchor the toast's position to. Can be set as a direct reference or the ID of the element. With `position="bottom"`, the toast will sit above the chosen element. With `position="top"`, the toast will sit below the chosen element. With `position="middle"`, the value of `positionAnchor` is ignored.
-         */
-        "positionAnchor"?: HTMLElement | string;
        /**
          * If `true`, the toast will be translucent. Only applies when the mode is `"ios"` and the device supports [`backdrop-filter`](https://developer.mozilla.org/en-US/docs/Web/CSS/backdrop-filter#Browser_compatibility).
         */
@@ -7329,10 +7304,6 @@ declare namespace LocalJSX {
        "trigger"?: string | undefined;
    }
    interface IonToggle {
-        /**
-          * How to control the alignment of the toggle and label on the cross axis. ``"start"`: The label and control will appear on the left of the cross axis in LTR, and on the right side in RTL. `"center"`: The label and control will appear at the center of the cross axis in both LTR and RTL.
-         */
-        "alignment"?: 'start' | 'center';
        /**
          * If `true`, the toggle is selected.
         */
@@ -7354,9 +7325,9 @@ declare namespace LocalJSX {
         */
        "justify"?: 'start' | 'end' | 'space-between';
        /**
-          * Where to place the label relative to the input. `"start"`: The label will appear to the left of the toggle in LTR and to the right in RTL. `"end"`: The label will appear to the right of the toggle in LTR and to the left in RTL. `"fixed"`: The label has the same behavior as `"start"` except it also has a fixed width. Long text will be truncated with ellipses ("..."). `"stacked"`: The label will appear above the toggle regardless of the direction. The alignment of the label can be controlled with the `alignment` property.
+          * Where to place the label relative to the input. `"start"`: The label will appear to the left of the toggle in LTR and to the right in RTL. `"end"`: The label will appear to the right of the toggle in LTR and to the left in RTL. `"fixed"`: The label has the same behavior as `"start"` except it also has a fixed width. Long text will be truncated with ellipses ("...").
         */
-        "labelPlacement"?: 'start' | 'end' | 'fixed' | 'stacked';
+        "labelPlacement"?: 'start' | 'end' | 'fixed';
        /**
          * Set the `legacy` property to `true` to forcibly use the legacy form control markup. Ionic will only opt components in to the modern form markup when they are using either the `aria-label` attribute or the default slot that contains the label text. As a result, the `legacy` property should only be used as an escape hatch when you want to avoid this automatic opt-in behavior. Note that this property will be removed in an upcoming major release of Ionic, and all form components will be opted-in to using the modern form markup.
         */
--- a/core/src/components/accordion/test/basic/accordion.e2e.ts-snapshots/accordion-basic-ios-ltr-Mobile-Chrome-linux.png
+++ b/core/src/components/accordion/test/basic/accordion.e2e.ts-snapshots/accordion-basic-ios-ltr-Mobile-Chrome-linux.png
--- a/core/src/components/accordion/test/basic/accordion.e2e.ts-snapshots/accordion-basic-ios-ltr-Mobile-Firefox-linux.png
+++ b/core/src/components/accordion/test/basic/accordion.e2e.ts-snapshots/accordion-basic-ios-ltr-Mobile-Firefox-linux.png
--- a/core/src/components/accordion/test/basic/accordion.e2e.ts-snapshots/accordion-basic-ios-ltr-Mobile-Safari-linux.png
+++ b/core/src/components/accordion/test/basic/accordion.e2e.ts-snapshots/accordion-basic-ios-ltr-Mobile-Safari-linux.png
--- a/core/src/components/accordion/test/basic/accordion.e2e.ts-snapshots/accordion-basic-ios-rtl-Mobile-Chrome-linux.png
+++ b/core/src/components/accordion/test/basic/accordion.e2e.ts-snapshots/accordion-basic-ios-rtl-Mobile-Chrome-linux.png
--- a/core/src/components/accordion/test/basic/accordion.e2e.ts-snapshots/accordion-basic-ios-rtl-Mobile-Firefox-linux.png
+++ b/core/src/components/accordion/test/basic/accordion.e2e.ts-snapshots/accordion-basic-ios-rtl-Mobile-Firefox-linux.png
--- a/core/src/components/accordion/test/basic/accordion.e2e.ts-snapshots/accordion-basic-ios-rtl-Mobile-Safari-linux.png
+++ b/core/src/components/accordion/test/basic/accordion.e2e.ts-snapshots/accordion-basic-ios-rtl-Mobile-Safari-linux.png
--- a/core/src/components/accordion/test/multiple/accordion.e2e.ts-snapshots/accordion-one-open-ios-ltr-Mobile-Chrome-linux.png
+++ b/core/src/components/accordion/test/multiple/accordion.e2e.ts-snapshots/accordion-one-open-ios-ltr-Mobile-Chrome-linux.png
--- a/core/src/components/accordion/test/multiple/accordion.e2e.ts-snapshots/accordion-two-open-ios-ltr-Mobile-Chrome-linux.png
+++ b/core/src/components/accordion/test/multiple/accordion.e2e.ts-snapshots/accordion-two-open-ios-ltr-Mobile-Chrome-linux.png
--- a/core/src/components/accordion/test/multiple/accordion.e2e.ts-snapshots/accordion-zero-open-ios-ltr-Mobile-Chrome-linux.png
+++ b/core/src/components/accordion/test/multiple/accordion.e2e.ts-snapshots/accordion-zero-open-ios-ltr-Mobile-Chrome-linux.png
--- a/core/src/components/accordion/test/nested/accordion.e2e.ts-snapshots/accordion-child-disabled-ios-ltr-Mobile-Chrome-linux.png
+++ b/core/src/components/accordion/test/nested/accordion.e2e.ts-snapshots/accordion-child-disabled-ios-ltr-Mobile-Chrome-linux.png
--- a/core/src/components/accordion/test/nested/accordion.e2e.ts-snapshots/accordion-nested-enabled-ios-ltr-Mobile-Chrome-linux.png
+++ b/core/src/components/accordion/test/nested/accordion.e2e.ts-snapshots/accordion-nested-enabled-ios-ltr-Mobile-Chrome-linux.png
--- a/core/src/components/accordion/test/nested/accordion.e2e.ts-snapshots/accordion-parent-disabled-ios-ltr-Mobile-Chrome-linux.png
+++ b/core/src/components/accordion/test/nested/accordion.e2e.ts-snapshots/accordion-parent-disabled-ios-ltr-Mobile-Chrome-linux.png
--- a/core/src/components/action-sheet/action-sheet-interface.ts
+++ b/core/src/components/action-sheet/action-sheet-interface.ts
@@ -23,7 +23,6 @@ export interface ActionSheetButton<T = any> {
  icon?: string;
  cssClass?: string | string[];
  id?: string;
-  htmlAttributes?: { [key: string]: any };
  handler?: () => boolean | void | Promise<boolean | void>;
  data?: T;
 }
--- a/core/src/components/action-sheet/action-sheet.ios.scss
+++ b/core/src/components/action-sheet/action-sheet.ios.scss
@@ -131,11 +131,11 @@
 .action-sheet-button {
  @include padding($action-sheet-ios-button-padding);

-  min-height: $action-sheet-ios-button-height;
+  height: $action-sheet-ios-button-height;

  font-size: $action-sheet-ios-button-font-size;

-  contain: content;
+  contain: strict;
 }

 .action-sheet-button .action-sheet-icon {
--- a/core/src/components/action-sheet/action-sheet.ios.vars.scss
+++ b/core/src/components/action-sheet/action-sheet.ios.vars.scss
@@ -50,7 +50,7 @@ $action-sheet-ios-title-padding-start:                            $action-sheet-
 $action-sheet-ios-title-color:                                    $text-color-step-600 !default;

 /// @prop - Font size of the action sheet title
-$action-sheet-ios-title-font-size:                                dynamic-font-min(1, 13px) !default;
+$action-sheet-ios-title-font-size:                                13px !default;

 /// @prop - Font weight of the action sheet title
 $action-sheet-ios-title-font-weight:                              400 !default;
@@ -75,7 +75,7 @@ $action-sheet-ios-title-border-color:                             rgba($text-col
 // --------------------------------------------------

 /// @prop - Font size of the action sheet sub title
-$action-sheet-ios-sub-title-font-size:                            dynamic-font-min(1, 13px) !default;
+$action-sheet-ios-sub-title-font-size:                            13px !default;

 /// @prop - Padding top of the action sheet sub title
 $action-sheet-ios-sub-title-padding-top:                          6px !default;
@@ -97,19 +97,19 @@ $action-sheet-ios-sub-title-padding-start:                        $action-sheet-
 $action-sheet-ios-button-height:                                  56px !default;

 /// @prop - Padding of the action sheet button
-$action-sheet-ios-button-padding:                                 14px !default;
+$action-sheet-ios-button-padding:                                 18px !default;

 /// @prop - Text color of the action sheet button
 $action-sheet-ios-button-text-color:                              ion-color(primary, base) !default;

 /// @prop - Font size of the action sheet button icon
-$action-sheet-ios-button-icon-font-size:                          dynamic-font-min(1, 28px) !default;
+$action-sheet-ios-button-icon-font-size:                          28px !default;

 /// @prop - Padding right of the action sheet button icon
 $action-sheet-ios-button-icon-padding-right:                      .3em !default;

 /// @prop - Font size of the action sheet button
-$action-sheet-ios-button-font-size:                               dynamic-font-min(1, 20px) !default;
+$action-sheet-ios-button-font-size:                               20px !default;

 /// @prop - Border color alpha of the action sheet button
 $action-sheet-ios-button-border-color-alpha:                      .08 !default;
--- a/core/src/components/action-sheet/action-sheet.md.scss
+++ b/core/src/components/action-sheet/action-sheet.md.scss
@@ -67,13 +67,13 @@

  position: relative;

-  min-height: $action-sheet-md-button-height;
+  height: $action-sheet-md-button-height;

  font-size: $action-sheet-md-button-font-size;

  text-align: $action-sheet-md-text-align;

-  contain: content;
+  contain: strict;
  overflow: hidden;
 }

--- a/core/src/components/action-sheet/action-sheet.md.vars.scss
+++ b/core/src/components/action-sheet/action-sheet.md.vars.scss
@@ -26,7 +26,7 @@ $action-sheet-md-title-height:                          60px !default;
 $action-sheet-md-title-color:                           rgba($text-color-rgb, 0.54) !default;

 /// @prop - Font size of the action sheet title
-$action-sheet-md-title-font-size:                       dynamic-font(16px) !default;
+$action-sheet-md-title-font-size:                       16px !default;

 /// @prop - Padding top of the action sheet title
 $action-sheet-md-title-padding-top:                     20px !default;
@@ -45,7 +45,7 @@ $action-sheet-md-title-padding-start:                   $action-sheet-md-title-p
 // --------------------------------------------------

 /// @prop - Font size of the action sheet sub title
-$action-sheet-md-sub-title-font-size:                   dynamic-font(14px) !default;
+$action-sheet-md-sub-title-font-size:                   14px !default;

 /// @prop - Padding top of the action sheet sub title
 $action-sheet-md-sub-title-padding-top:                 16px !default;
@@ -70,10 +70,10 @@ $action-sheet-md-button-height:                         52px !default;
 $action-sheet-md-button-text-color:                     $text-color-step-150 !default;

 /// @prop - Font size of the action sheet button
-$action-sheet-md-button-font-size:                      dynamic-font(16px) !default;
+$action-sheet-md-button-font-size:                      16px !default;

 /// @prop - Padding top of the action sheet button
-$action-sheet-md-button-padding-top:                    12px !default;
+$action-sheet-md-button-padding-top:                    0 !default;

 /// @prop - Padding end of the action sheet button
 $action-sheet-md-button-padding-end:                    16px !default;
@@ -91,7 +91,7 @@ $action-sheet-md-button-background:                     transparent !default;
 // --------------------------------------------------

 /// @prop - Font size of the icon in the action sheet button
-$action-sheet-md-icon-font-size:                        dynamic-font(24px) !default;
+$action-sheet-md-icon-font-size:                        24px !default;

 /// @prop - Margin top of the icon in the action sheet button
 $action-sheet-md-icon-margin-top:                       0 !default;
--- a/core/src/components/action-sheet/action-sheet.scss
+++ b/core/src/components/action-sheet/action-sheet.scss
@@ -126,10 +126,7 @@
  justify-content: flex-end;

  height: 100%;
-
-  /* Fallback for browsers that do not support dvh */
  max-height: 100vh;
-  max-height: 100dvh;
 }

 .action-sheet-group {
--- a/core/src/components/action-sheet/action-sheet.tsx
+++ b/core/src/components/action-sheet/action-sheet.tsx
@@ -2,8 +2,6 @@ import type { ComponentInterface, EventEmitter } from '@stencil/core';
 import { Watch, Component, Element, Event, Host, Method, Prop, h, readTask } from '@stencil/core';
 import type { Gesture } from '@utils/gesture';
 import { createButtonActiveGesture } from '@utils/gesture/button-active';
-import { raf } from '@utils/helpers';
-import { createLockController } from '@utils/lock-controller';
 import {
  BACKDROP,
  createDelegateController,
@@ -41,8 +39,8 @@ import { mdLeaveAnimation } from './animations/md.leave';
 })
 export class ActionSheet implements ComponentInterface, OverlayInterface {
  private readonly delegateController = createDelegateController(this);
-  private readonly lockController = createLockController();
  private readonly triggerController = createTriggerController();
+  private currentTransition?: Promise<any>;
  private wrapperEl?: HTMLElement;
  private groupEl?: HTMLElement;
  private gesture?: Gesture;
@@ -199,13 +197,25 @@ export class ActionSheet implements ComponentInterface, OverlayInterface {
   */
  @Method()
  async present(): Promise<void> {
-    const unlock = await this.lockController.lock();
+    /**
+     * When using an inline action sheet
+     * and dismissing a action sheet it is possible to
+     * quickly present the action sheet while it is
+     * dismissing. We need to await any current
+     * transition to allow the dismiss to finish
+     * before presenting again.
+     */
+    if (this.currentTransition !== undefined) {
+      await this.currentTransition;
+    }

    await this.delegateController.attachViewToDom();

-    await present(this, 'actionSheetEnter', iosEnterAnimation, mdEnterAnimation);
+    this.currentTransition = present(this, 'actionSheetEnter', iosEnterAnimation, mdEnterAnimation);

-    unlock();
+    await this.currentTransition;
+
+    this.currentTransition = undefined;
  }

  /**
@@ -219,16 +229,13 @@ export class ActionSheet implements ComponentInterface, OverlayInterface {
   */
  @Method()
  async dismiss(data?: any, role?: string): Promise<boolean> {
-    const unlock = await this.lockController.lock();
-
-    const dismissed = await dismiss(this, data, role, 'actionSheetLeave', iosLeaveAnimation, mdLeaveAnimation);
+    this.currentTransition = dismiss(this, data, role, 'actionSheetLeave', iosLeaveAnimation, mdLeaveAnimation);
+    const dismissed = await this.currentTransition;

    if (dismissed) {
      this.delegateController.removeViewFromDom();
    }

-    unlock();
-
    return dismissed;
  }

@@ -311,32 +318,25 @@ export class ActionSheet implements ComponentInterface, OverlayInterface {

  componentDidLoad() {
    /**
-     * Only create gesture if:
-     * 1. A gesture does not already exist
-     * 2. App is running in iOS mode
-     * 3. A wrapper ref exists
-     * 4. A group ref exists
+     * Do not create gesture if:
+     * 1. A gesture already exists
+     * 2. App is running in MD mode
+     * 3. A wrapper ref does not exist
     */
    const { groupEl, wrapperEl } = this;
-    if (!this.gesture && getIonMode(this) === 'ios' && wrapperEl && groupEl) {
-      readTask(() => {
-        const isScrollable = groupEl.scrollHeight > groupEl.clientHeight;
-        if (!isScrollable) {
-          this.gesture = createButtonActiveGesture(wrapperEl, (refEl: HTMLElement) =>
-            refEl.classList.contains('action-sheet-button')
-          );
-          this.gesture.enable(true);
-        }
-      });
+    if (this.gesture || getIonMode(this) === 'md' || !wrapperEl || !groupEl) {
+      return;
    }

-    /**
-     * If action sheet was rendered with isOpen="true"
-     * then we should open action sheet immediately.
-     */
-    if (this.isOpen === true) {
-      raf(() => this.present());
-    }
+    readTask(() => {
+      const isScrollable = groupEl.scrollHeight > groupEl.clientHeight;
+      if (!isScrollable) {
+        this.gesture = createButtonActiveGesture(wrapperEl, (refEl: HTMLElement) =>
+          refEl.classList.contains('action-sheet-button')
+        );
+        this.gesture.enable(true);
+      }
+    });
  }

  render() {
@@ -386,13 +386,7 @@ export class ActionSheet implements ComponentInterface, OverlayInterface {
                </div>
              )}
              {buttons.map((b) => (
-                <button
-                  {...b.htmlAttributes}
-                  type="button"
-                  id={b.id}
-                  class={buttonClass(b)}
-                  onClick={() => this.buttonClick(b)}
-                >
+                <button type="button" id={b.id} class={buttonClass(b)} onClick={() => this.buttonClick(b)}>
                  <span class="action-sheet-button-inner">
                    {b.icon && <ion-icon icon={b.icon} aria-hidden="true" lazy={false} class="action-sheet-icon" />}
                    {b.text}
@@ -404,12 +398,7 @@ export class ActionSheet implements ComponentInterface, OverlayInterface {

            {cancelButton && (
              <div class="action-sheet-group action-sheet-group-cancel">
-                <button
-                  {...cancelButton.htmlAttributes}
-                  type="button"
-                  class={buttonClass(cancelButton)}
-                  onClick={() => this.buttonClick(cancelButton)}
-                >
+                <button type="button" class={buttonClass(cancelButton)} onClick={() => this.buttonClick(cancelButton)}>
                  <span class="action-sheet-button-inner">
                    {cancelButton.icon && (
                      <ion-icon icon={cancelButton.icon} aria-hidden="true" lazy={false} class="action-sheet-icon" />
--- a/core/src/components/action-sheet/test/a11y/action-sheet.e2e.ts
+++ b/core/src/components/action-sheet/test/a11y/action-sheet.e2e.ts
@@ -10,36 +10,16 @@ const testAria = async (page: E2EPage, buttonID: string, expectedAriaLabelledBy:
  await button.click();
  await didPresent.next();

-  const actionSheet = page.locator('ion-action-sheet');
+  const alert = page.locator('ion-action-sheet');

  /**
   * expect().toHaveAttribute() can't check for a null value, so grab and check
   * the value manually instead.
   */
-  const ariaLabelledBy = await actionSheet.getAttribute('aria-labelledby');
+  const ariaLabelledBy = await alert.getAttribute('aria-labelledby');

  expect(ariaLabelledBy).toBe(expectedAriaLabelledBy);
 };
-
-const testAriaButton = async (
-  page: E2EPage,
-  buttonID: string,
-  expectedAriaLabelledBy: string,
-  expectedAriaLabel: string
-) => {
-  const didPresent = await page.spyOnEvent('ionActionSheetDidPresent');
-
-  const button = page.locator(`#${buttonID}`);
-  await button.click();
-
-  await didPresent.next();
-
-  const actionSheetButton = page.locator('ion-action-sheet .action-sheet-button');
-
-  await expect(actionSheetButton).toHaveAttribute('aria-labelledby', expectedAriaLabelledBy);
-  await expect(actionSheetButton).toHaveAttribute('aria-label', expectedAriaLabel);
-};
-
 configs({ directions: ['ltr'] }).forEach(({ config, title }) => {
  test.describe(title('action-sheet: a11y'), () => {
    test.beforeEach(async ({ page }) => {
@@ -72,51 +52,5 @@ configs({ directions: ['ltr'] }).forEach(({ config, title }) => {
    test('should allow for manually specifying aria attributes', async ({ page }) => {
      await testAria(page, 'customAria', 'Custom title');
    });
-
-    test('should have aria-labelledby and aria-label added to the button when htmlAttributes is set', async ({
-      page,
-    }) => {
-      await testAriaButton(page, 'ariaLabelButton', 'close-label', 'close button');
-    });
-
-    test('should have aria-labelledby and aria-label added to the cancel button when htmlAttributes is set', async ({
-      page,
-    }) => {
-      await testAriaButton(page, 'ariaLabelCancelButton', 'cancel-label', 'cancel button');
-    });
-  });
-});
-
-configs({ directions: ['ltr'] }).forEach(({ title, screenshot, config }) => {
-  test.describe(title('action-sheet: font scaling'), () => {
-    test('should scale text on larger font sizes', async ({ page }) => {
-      await page.setContent(
-        `
-        <style>
-          html {
-            font-size: 36px;
-          }
-        </style>
-
-        <ion-action-sheet></ion-action-sheet>
-
-        <script>
-          const actionSheet = document.querySelector('ion-action-sheet');
-          actionSheet.header = 'Header';
-          actionSheet.subHeader = 'Sub Header';
-          actionSheet.buttons = ['Ok', { role: 'cancel', text: 'Cancel' }];
-        </script>
-      `,
-        config
-      );
-
-      const ionActionSheetDidPresent = await page.spyOnEvent('ionActionSheetDidPresent');
-      const actionSheet = page.locator('ion-action-sheet');
-
-      await actionSheet.evaluate((el: HTMLIonActionSheetElement) => el.present());
-      await ionActionSheetDidPresent.next();
-
-      await expect(actionSheet).toHaveScreenshot(screenshot(`action-sheet-scale`));
-    });
  });
 });
--- a/core/src/components/action-sheet/test/a11y/action-sheet.e2e.ts-snapshots/action-sheet-scale-ios-ltr-Mobile-Chrome-linux.png
+++ b/core/src/components/action-sheet/test/a11y/action-sheet.e2e.ts-snapshots/action-sheet-scale-ios-ltr-Mobile-Chrome-linux.png
--- a/core/src/components/action-sheet/test/a11y/action-sheet.e2e.ts-snapshots/action-sheet-scale-ios-ltr-Mobile-Firefox-linux.png
+++ b/core/src/components/action-sheet/test/a11y/action-sheet.e2e.ts-snapshots/action-sheet-scale-ios-ltr-Mobile-Firefox-linux.png
--- a/core/src/components/action-sheet/test/a11y/action-sheet.e2e.ts-snapshots/action-sheet-scale-ios-ltr-Mobile-Safari-linux.png
+++ b/core/src/components/action-sheet/test/a11y/action-sheet.e2e.ts-snapshots/action-sheet-scale-ios-ltr-Mobile-Safari-linux.png
--- a/core/src/components/action-sheet/test/a11y/action-sheet.e2e.ts-snapshots/action-sheet-scale-md-ltr-Mobile-Chrome-linux.png
+++ b/core/src/components/action-sheet/test/a11y/action-sheet.e2e.ts-snapshots/action-sheet-scale-md-ltr-Mobile-Chrome-linux.png
--- a/core/src/components/action-sheet/test/a11y/action-sheet.e2e.ts-snapshots/action-sheet-scale-md-ltr-Mobile-Firefox-linux.png
+++ b/core/src/components/action-sheet/test/a11y/action-sheet.e2e.ts-snapshots/action-sheet-scale-md-ltr-Mobile-Firefox-linux.png
--- a/core/src/components/action-sheet/test/a11y/action-sheet.e2e.ts-snapshots/action-sheet-scale-md-ltr-Mobile-Safari-linux.png
+++ b/core/src/components/action-sheet/test/a11y/action-sheet.e2e.ts-snapshots/action-sheet-scale-md-ltr-Mobile-Safari-linux.png
--- a/core/src/components/action-sheet/test/a11y/index.html
+++ b/core/src/components/action-sheet/test/a11y/index.html
@@ -23,10 +23,6 @@
      <ion-button id="subHeaderOnly" expand="block" onclick="presentSubHeaderOnly()">Subheader Only</ion-button>
      <ion-button id="noHeaders" expand="block" onclick="presentNoHeaders()">No Headers</ion-button>
      <ion-button id="customAria" expand="block" onclick="presentCustomAria()">Custom Aria</ion-button>
-      <ion-button id="ariaLabelButton" expand="block" onclick="presentAriaLabelButton()">Aria Label Button</ion-button>
-      <ion-button id="ariaLabelCancelButton" expand="block" onclick="presentAriaLabelCancelButton()"
-        >Aria Label Cancel Button</ion-button
-      >
    </main>

    <script>
@@ -67,39 +63,6 @@
          },
        });
      }
-
-      function presentAriaLabelButton() {
-        openActionSheet({
-          header: 'Header',
-          subHeader: 'Subtitle',
-          buttons: [
-            {
-              text: 'Close',
-              htmlAttributes: {
-                'aria-label': 'close button',
-                'aria-labelledby': 'close-label',
-              },
-            },
-          ],
-        });
-      }
-
-      function presentAriaLabelCancelButton() {
-        openActionSheet({
-          header: 'Header',
-          subHeader: 'Subtitle',
-          buttons: [
-            {
-              text: 'Cancel',
-              role: 'cancel',
-              htmlAttributes: {
-                'aria-label': 'cancel button',
-                'aria-labelledby': 'cancel-label',
-              },
-            },
-          ],
-        });
-      }
    </script>
  </body>
 </html>
--- a/core/src/components/action-sheet/test/is-open/action-sheet.e2e.ts
+++ b/core/src/components/action-sheet/test/is-open/action-sheet.e2e.ts
@@ -30,10 +30,5 @@ configs({ directions: ['ltr'], modes: ['ios'] }).forEach(({ config, title }) =>

      await expect(actionSheet).toBeHidden();
    });
-
-    test('should open if isOpen is true on load', async ({ page }) => {
-      await page.setContent('<ion-action-sheet is-open="true"></ion-action-sheet>', config);
-      await expect(page.locator('ion-action-sheet')).toBeVisible();
-    });
  });
 });
--- a/core/src/components/alert/alert-interface.ts
+++ b/core/src/components/alert/alert-interface.ts
@@ -48,7 +48,6 @@ export interface AlertButton {
  role?: 'cancel' | 'destructive' | string;
  cssClass?: string | string[];
  id?: string;
-  htmlAttributes?: { [key: string]: any };
  // TODO(FW-2832): type
  handler?: (value: any) => AlertButtonOverlayHandler | Promise<AlertButtonOverlayHandler>;
 }
--- a/core/src/components/alert/alert.ios.scss
+++ b/core/src/components/alert/alert.ios.scss
@@ -123,7 +123,7 @@
 }

 .alert-tappable {
-  min-height: $alert-ios-tappable-height;
+  height: $alert-ios-tappable-height;
 }


@@ -137,6 +137,12 @@
  order: 0;

  color: $alert-ios-radio-label-text-color;
+
+  text-overflow: ellipsis;
+
+  white-space: nowrap;
+
+  overflow: hidden;
 }


@@ -190,6 +196,12 @@
  flex: 1;

  color: $alert-ios-checkbox-label-text-color;
+
+  text-overflow: ellipsis;
+
+  white-space: nowrap;
+
+  overflow: hidden;
 }

 // iOS Alert Checkbox Outer Circle: Unchecked
@@ -255,19 +267,13 @@
 }

 .alert-button {
-  /**
-   * This padding ensures that alerts
-   * with multiple buttons render on separate lines
-   * so the text does not run up against the edge of the button.
-   */
-  @include padding-horizontal($alert-ios-button-padding);
  @include margin($alert-ios-button-margin);
  @include border-radius($alert-ios-button-border-radius);

  flex: $alert-ios-button-flex;

  min-width: $alert-ios-button-min-width;
-  height: $alert-ios-button-height;
+  height: $alert-ios-button-min-height;

  border-top: $alert-ios-button-border-width $alert-ios-button-border-style $alert-ios-button-border-color;
  border-right: $alert-ios-button-border-width $alert-ios-button-border-style $alert-ios-button-border-color;
--- a/core/src/components/alert/alert.ios.vars.scss
+++ b/core/src/components/alert/alert.ios.vars.scss
@@ -6,10 +6,10 @@
 // --------------------------------------------------

 /// @prop - Font size of the alert
-$alert-ios-font-size:                                   dynamic-font-min(1, 14px) !default;
+$alert-ios-font-size:                                   14px !default;

 /// @prop - Max width of the alert
-$alert-ios-max-width:                                   dynamic-font-clamp(1, 270px, 1.2) !default;
+$alert-ios-max-width:                                   270px !default;

 /// @prop - Border radius of the alert
 $alert-ios-border-radius:                               13px !default;
@@ -48,13 +48,13 @@ $alert-ios-title-color:                                 $text-color !default;
 $alert-ios-title-margin-top:                            8px !default;

 /// @prop - Font size of the alert title
-$alert-ios-title-font-size:                             dynamic-font-min(1, 17px) !default;
+$alert-ios-title-font-size:                             17px !default;

 /// @prop - Font weight of the alert title
 $alert-ios-title-font-weight:                           600 !default;

 /// @prop - Font size of the alert sub title
-$alert-ios-sub-title-font-size:                         dynamic-font-min(1, 14px) !default;
+$alert-ios-sub-title-font-size:                         14px !default;

 /// @prop - Text color of the alert sub title
 $alert-ios-sub-title-text-color:                        $text-color-step-400 !default;
@@ -72,7 +72,7 @@ $alert-ios-message-padding-bottom:                      21px !default;
 $alert-ios-message-padding-start:                       $alert-ios-message-padding-end !default;

 /// @prop - Font size of the alert message
-$alert-ios-message-font-size:                           dynamic-font-min(1, 13px) !default;
+$alert-ios-message-font-size:                           13px !default;

 /// @prop - Text align of the alert message
 $alert-ios-message-text-align:                          center !default;
@@ -137,23 +137,11 @@ $alert-ios-button-margin:                               0 !default;
 /// @prop - Min width of the alert button
 $alert-ios-button-min-width:                            50% !default;

-/// @prop - Height of the alert button
-/**
- * We want the height of the button to
- * scale with the text so the next never runs
- * into the edge of the button. We change the height
- * instead of adding padding because we would need to offset
- * the height the padding and the border. Since the border uses
- * a hairline (<1px) width, this will cause subpixel rendering
- * differences across browsers.
- */
-$alert-ios-button-height:                           dynamic-font-min(1, 44px) !default;
-
-/// @prop - Padding of the alert button
-$alert-ios-button-padding: 8px !default;
+/// @prop - Minimum height of the alert button
+$alert-ios-button-min-height:                           44px !default;

 /// @prop - Font size of the alert button
-$alert-ios-button-font-size:                            dynamic-font-min(1, 17px) !default;
+$alert-ios-button-font-size:                            17px !default;

 /// @prop - Color of the text in the alert button
 $alert-ios-button-text-color:                           ion-color(primary, base) !default;
@@ -264,10 +252,10 @@ $alert-ios-checkbox-margin-bottom:                      10px !default;
 $alert-ios-checkbox-margin-start:                       16px !default;

 /// @prop - Size of the checkbox in the alert
-$alert-ios-checkbox-size:                               dynamic-font-max(24px, 2.75) !default;
+$alert-ios-checkbox-size:                               24px !default;

 /// @prop - Border width of the checkbox in the alert
-$alert-ios-checkbox-border-width:                       dynamic-font(1px) !default;
+$alert-ios-checkbox-border-width:                       1px !default;

 /// @prop - Border style of the checkbox in the alert
 $alert-ios-checkbox-border-style:                       solid !default;
@@ -288,16 +276,16 @@ $alert-ios-checkbox-background-color-off:               $item-ios-background !de
 $alert-ios-checkbox-background-color-on:                ion-color(primary, base) !default;

 /// @prop - Top of the icon in the checkbox alert
-$alert-ios-checkbox-icon-top:                           calc($alert-ios-checkbox-size / 6) !default;
+$alert-ios-checkbox-icon-top:                           math.div($alert-ios-checkbox-size, 6) !default;

 /// @prop - Start of the icon in the checkbox alert
-$alert-ios-checkbox-icon-start:                         calc($alert-ios-checkbox-size / 3 + 1px) !default;
+$alert-ios-checkbox-icon-start:                         math.div($alert-ios-checkbox-size, 3) + 1px !default;

 /// @prop - Width of the icon in the checkbox alert
-$alert-ios-checkbox-icon-width:                         calc($alert-ios-checkbox-size / 6 + 1px) !default;
+$alert-ios-checkbox-icon-width:                         math.div($alert-ios-checkbox-size, 6) + 1px !default;

 /// @prop - Height of the icon in the checkbox alert
-$alert-ios-checkbox-icon-height:                        calc($alert-ios-checkbox-size * 0.5) !default;
+$alert-ios-checkbox-icon-height:                        $alert-ios-checkbox-size * 0.5 !default;

 /// @prop - Border width of the icon in the checkbox alert
 $alert-ios-checkbox-icon-border-width:                  $alert-ios-checkbox-border-width !default;
--- a/core/src/components/alert/alert.md.scss
+++ b/core/src/components/alert/alert.md.scss
@@ -113,7 +113,9 @@
 .alert-tappable {
  position: relative;

-  min-height: $alert-md-tappable-height;
+  height: $alert-md-tappable-height;
+
+  overflow: hidden;
 }


@@ -128,6 +130,12 @@
  color: $alert-md-radio-label-text-color;

  font-size: $alert-md-radio-label-font-size;
+
+  text-overflow: ellipsis;
+
+  white-space: nowrap;
+
+  overflow: hidden;
 }

 // Material Design Alert Radio Unchecked Circle
@@ -192,13 +200,15 @@

  flex: 1;

-  // Required for the checkbox icon to stay on the screen without
-  // being squished when the font size scales up.
-  width: calc(100% - $alert-md-checkbox-label-padding-start);
-
  color: $alert-md-checkbox-label-text-color;

  font-size: $alert-md-checkbox-label-font-size;
+
+  text-overflow: ellipsis;
+
+  white-space: nowrap;
+
+  overflow: hidden;
 }


--- a/core/src/components/alert/alert.md.vars.scss
+++ b/core/src/components/alert/alert.md.vars.scss
@@ -5,7 +5,7 @@
 // --------------------------------------------------

 /// @prop - Font size of the alert
-$alert-md-font-size:                          dynamic-font(14px) !default;
+$alert-md-font-size:                          14px !default;

 /// @prop - Max width of the alert
 $alert-md-max-width:                          280px !default;
@@ -38,13 +38,13 @@ $alert-md-head-text-align:                    start !default;
 $alert-md-title-color:                        $text-color !default;

 /// @prop - Font size of the alert title
-$alert-md-title-font-size:                    dynamic-font(20px) !default;
+$alert-md-title-font-size:                    20px !default;

 /// @prop - Font weight of the alert title
 $alert-md-title-font-weight:                  500 !default;

 /// @prop - Font size of the alert sub title
-$alert-md-sub-title-font-size:                dynamic-font(16px) !default;
+$alert-md-sub-title-font-size:                16px !default;

 /// @prop - Text color of the alert sub title
 $alert-md-sub-title-text-color:               $text-color !default;
@@ -62,7 +62,7 @@ $alert-md-message-padding-bottom:             $alert-md-message-padding-top !def
 $alert-md-message-padding-start:              $alert-md-message-padding-end !default;

 /// @prop - Font size of the alert message
-$alert-md-message-font-size:                  dynamic-font(16px) !default;
+$alert-md-message-font-size:                  16px !default;

 /// @prop - Text color of the alert message
 $alert-md-message-text-color:                 $text-color-step-450 !default;
@@ -239,7 +239,7 @@ $alert-md-radio-label-padding-bottom:         $alert-md-radio-label-padding-top
 $alert-md-radio-label-padding-start:          $alert-md-radio-label-padding-end + 26px !default;

 /// @prop - Font size of the label for the radio alert
-$alert-md-radio-label-font-size:              dynamic-font(16px) !default;
+$alert-md-radio-label-font-size:              16px !default;

 /// @prop - Text color of the label for the radio alert
 $alert-md-radio-label-text-color:             $text-color-step-150 !default;
@@ -314,7 +314,7 @@ $alert-md-checkbox-label-padding-start:       $alert-md-checkbox-label-padding-e
 $alert-md-checkbox-label-text-color:          $text-color-step-150 !default;

 /// @prop - Font size of the label for the checkbox in the alert
-$alert-md-checkbox-label-font-size:           dynamic-font(16px) !default;
+$alert-md-checkbox-label-font-size:           16px !default;

 /// @prop - Height of the tappable inputs in the checkbox alert
 $alert-md-tappable-height:                    $item-md-min-height !default;
--- a/core/src/components/alert/alert.scss
+++ b/core/src/components/alert/alert.scss
@@ -152,8 +152,6 @@

  width: 100%;
  height: 100%;
-
-  min-height: inherit;
 }


@@ -186,7 +184,7 @@
  text-align: start;
  appearance: none;

-  contain: content;
+  contain: strict;
 }

 .alert-button,
--- a/core/src/components/alert/alert.tsx
+++ b/core/src/components/alert/alert.tsx
@@ -3,8 +3,6 @@ import { Component, Element, Event, Host, Listen, Method, Prop, Watch, forceUpda
 import { ENABLE_HTML_CONTENT_DEFAULT } from '@utils/config';
 import type { Gesture } from '@utils/gesture';
 import { createButtonActiveGesture } from '@utils/gesture/button-active';
-import { raf } from '@utils/helpers';
-import { createLockController } from '@utils/lock-controller';
 import {
  createDelegateController,
  createTriggerController,
@@ -47,7 +45,6 @@ import { mdLeaveAnimation } from './animations/md.leave';
 })
 export class Alert implements ComponentInterface, OverlayInterface {
  private readonly delegateController = createDelegateController(this);
-  private readonly lockController = createLockController();
  private readonly triggerController = createTriggerController();
  private customHTMLEnabled = config.get('innerHTMLTemplatesEnabled', ENABLE_HTML_CONTENT_DEFAULT);
  private activeId?: string;
@@ -56,6 +53,7 @@ export class Alert implements ComponentInterface, OverlayInterface {
  private processedButtons: AlertButton[] = [];
  private wrapperEl?: HTMLElement;
  private gesture?: Gesture;
+  private currentTransition?: Promise<any>;

  presented = false;
  lastFocus?: HTMLElement;
@@ -228,15 +226,6 @@ export class Alert implements ComponentInterface, OverlayInterface {
  onKeydown(ev: any) {
    const inputTypes = new Set(this.processedInputs.map((i) => i.type));

-    /**
-     * Based on keyboard navigation requirements, the
-     * checkbox should not respond to the enter keydown event.
-     */
-    if (inputTypes.has('checkbox') && ev.key === 'Enter') {
-      ev.preventDefault();
-      return;
-    }
-
    // The only inputs we want to navigate between using arrow keys are the radios
    // ignore the keydown event if it is not on a radio button
    if (
@@ -357,25 +346,19 @@ export class Alert implements ComponentInterface, OverlayInterface {

  componentDidLoad() {
    /**
-     * Only create gesture if:
-     * 1. A gesture does not already exist
-     * 2. App is running in iOS mode
-     * 3. A wrapper ref exists
+     * Do not create gesture if:
+     * 1. A gesture already exists
+     * 2. App is running in MD mode
+     * 3. A wrapper ref does not exist
     */
-    if (!this.gesture && getIonMode(this) === 'ios' && this.wrapperEl) {
-      this.gesture = createButtonActiveGesture(this.wrapperEl, (refEl: HTMLElement) =>
-        refEl.classList.contains('alert-button')
-      );
-      this.gesture.enable(true);
+    if (this.gesture || getIonMode(this) === 'md' || !this.wrapperEl) {
+      return;
    }

-    /**
-     * If alert was rendered with isOpen="true"
-     * then we should open alert immediately.
-     */
-    if (this.isOpen === true) {
-      raf(() => this.present());
-    }
+    this.gesture = createButtonActiveGesture(this.wrapperEl, (refEl: HTMLElement) =>
+      refEl.classList.contains('alert-button')
+    );
+    this.gesture.enable(true);
  }

  /**
@@ -383,13 +366,23 @@ export class Alert implements ComponentInterface, OverlayInterface {
   */
  @Method()
  async present(): Promise<void> {
-    const unlock = await this.lockController.lock();
+    /**
+     * When using an inline alert
+     * and dismissing an alert it is possible to
+     * quickly present the alert while it is
+     * dismissing. We need to await any current
+     * transition to allow the dismiss to finish
+     * before presenting again.
+     */
+    if (this.currentTransition !== undefined) {
+      await this.currentTransition;
+    }

    await this.delegateController.attachViewToDom();

-    await present(this, 'alertEnter', iosEnterAnimation, mdEnterAnimation);
-
-    unlock();
+    this.currentTransition = present(this, 'alertEnter', iosEnterAnimation, mdEnterAnimation);
+    await this.currentTransition;
+    this.currentTransition = undefined;
  }

  /**
@@ -403,16 +396,13 @@ export class Alert implements ComponentInterface, OverlayInterface {
   */
  @Method()
  async dismiss(data?: any, role?: string): Promise<boolean> {
-    const unlock = await this.lockController.lock();
-
-    const dismissed = await dismiss(this, data, role, 'alertLeave', iosLeaveAnimation, mdLeaveAnimation);
+    this.currentTransition = dismiss(this, data, role, 'alertLeave', iosLeaveAnimation, mdLeaveAnimation);
+    const dismissed = await this.currentTransition;

    if (dismissed) {
      this.delegateController.removeViewFromDom();
    }

-    unlock();
-
    return dismissed;
  }

@@ -676,7 +666,6 @@ export class Alert implements ComponentInterface, OverlayInterface {
      <div class={alertButtonGroupClass}>
        {buttons.map((button) => (
          <button
-            {...button.htmlAttributes}
            type="button"
            id={button.id}
            class={buttonClass(button)}
--- a/core/src/components/alert/alert.vars.scss
+++ b/core/src/components/alert/alert.vars.scss
@@ -10,10 +10,10 @@ $alert-min-width:                 250px !default;
 $alert-max-height:                90% !default;

 /// @prop - Line height of the alert button
-$alert-button-line-height:        dynamic-font(20px) !default;
+$alert-button-line-height:        20px !default;

 /// @prop - Font size of the alert button
-$alert-button-font-size:          dynamic-font(14px) !default;
+$alert-button-font-size:          14px !default;

 /// @prop - Minimum height of a textarea in the alert
 $alert-input-min-height:          37px !default;
--- a/core/src/components/alert/test/a11y/alert.e2e.ts
+++ b/core/src/components/alert/test/a11y/alert.e2e.ts
@@ -60,174 +60,5 @@ configs({ directions: ['ltr'] }).forEach(({ config, title }) => {
    test('should allow for manually specifying aria attributes', async ({ page }) => {
      await testAria(page, 'customAria', 'Custom title', 'Custom description');
    });
-
-    test('should have aria-labelledby and aria-label added to the button when htmlAttributes is set', async ({
-      page,
-    }) => {
-      const didPresent = await page.spyOnEvent('ionAlertDidPresent');
-
-      const button = page.locator('#ariaLabelButton');
-      await button.click();
-
-      await didPresent.next();
-
-      const alertButton = page.locator('ion-alert .alert-button');
-
-      await expect(alertButton).toHaveAttribute('aria-labelledby', 'close-label');
-      await expect(alertButton).toHaveAttribute('aria-label', 'close button');
-    });
-
-    test('should not toggle the checkbox when pressing the Enter key', async ({ page }) => {
-      const didPresent = await page.spyOnEvent('ionAlertDidPresent');
-
-      const button = page.locator('#checkbox');
-      await button.click();
-
-      await didPresent.next();
-
-      const alertCheckbox = page.locator('ion-alert .alert-checkbox');
-      const ariaChecked = await alertCheckbox.getAttribute('aria-checked');
-
-      await expect(alertCheckbox).toHaveAttribute('aria-checked', ariaChecked!);
-
-      await alertCheckbox.press('Enter');
-      await expect(alertCheckbox).toHaveAttribute('aria-checked', ariaChecked!);
-    });
-  });
-});
-
-/**
- * This behavior does not vary across directions
- */
-configs({ directions: ['ltr'] }).forEach(({ title, screenshot, config }) => {
-  test.describe(title('alert: font scaling'), () => {
-    test('should scale text on larger font sizes', async ({ page }) => {
-      await page.setContent(
-        `
-        <style>
-          html {
-            font-size: 36px;
-          }
-        </style>
-
-
-        <ion-alert header="Header" sub-header="Sub Header" message="Message"></ion-alert>
-
-        <script>
-          const alert = document.querySelector('ion-alert');
-          alert.buttons = ['Ok', 'Cancel'];
-        </script>
-      `,
-        config
-      );
-
-      const alert = page.locator('ion-alert');
-      const ionAlertDidPresent = await page.spyOnEvent('ionAlertDidPresent');
-
-      await alert.evaluate((el: HTMLIonAlertElement) => el.present());
-      await ionAlertDidPresent.next();
-
-      await expect(page).toHaveScreenshot(screenshot(`alert-scale`));
-    });
-    test('should scale text on larger font sizes with checkboxes', async ({ page }) => {
-      await page.setContent(
-        `
-        <style>
-          html {
-            font-size: 36px;
-          }
-        </style>
-
-
-        <ion-alert header="Header" sub-header="Sub Header" message="Message"></ion-alert>
-
-        <script>
-          const alert = document.querySelector('ion-alert');
-          alert.inputs = [
-            { type: 'checkbox', value: 'a', label: 'Checkbox A', checked: true },
-            { type: 'checkbox', value: 'b', label: 'Checkbox B' },
-            { type: 'checkbox', value: 'c', label: 'Checkbox C' },
-            { type: 'checkbox', value: 'd', label: 'Checkbox D' },
-          ];
-          alert.buttons = ['Ok', 'Cancel'];
-        </script>
-      `,
-        config
-      );
-
-      const alert = page.locator('ion-alert');
-      const ionAlertDidPresent = await page.spyOnEvent('ionAlertDidPresent');
-
-      await alert.evaluate((el: HTMLIonAlertElement) => el.present());
-      await ionAlertDidPresent.next();
-
-      await expect(page).toHaveScreenshot(screenshot(`alert-checkbox-scale`));
-    });
-    test('should scale text on larger font sizes with radios', async ({ page }) => {
-      await page.setContent(
-        `
-        <style>
-          html {
-            font-size: 36px;
-          }
-        </style>
-
-
-        <ion-alert header="Header" sub-header="Sub Header" message="Message"></ion-alert>
-
-        <script>
-          const alert = document.querySelector('ion-alert');
-          alert.inputs = [
-            { type: 'radio', value: 'a', label: 'Radio A', checked: true },
-            { type: 'radio', value: 'b', label: 'Radio B' },
-            { type: 'radio', value: 'c', label: 'Radio C' },
-            { type: 'radio', value: 'd', label: 'Radio D' },
-          ];
-          alert.buttons = ['Ok', 'Cancel'];
-        </script>
-      `,
-        config
-      );
-
-      const alert = page.locator('ion-alert');
-      const ionAlertDidPresent = await page.spyOnEvent('ionAlertDidPresent');
-
-      await alert.evaluate((el: HTMLIonAlertElement) => el.present());
-      await ionAlertDidPresent.next();
-
-      await expect(page).toHaveScreenshot(screenshot(`alert-radio-scale`));
-    });
-    test('should scale text on larger font sizes with text fields', async ({ page }) => {
-      await page.setContent(
-        `
-        <style>
-          html {
-            font-size: 36px;
-          }
-        </style>
-
-
-        <ion-alert header="Header" sub-header="Sub Header" message="Message"></ion-alert>
-
-        <script>
-          const alert = document.querySelector('ion-alert');
-          alert.inputs = [
-            { type: 'text', value: 'My Input', label: 'Input' },
-            { type: 'textarea', value: 'My Textarea', label: 'Textarea' },
-          ];
-          alert.buttons = ['Ok', 'Cancel'];
-        </script>
-      `,
-        config
-      );
-
-      const alert = page.locator('ion-alert');
-      const ionAlertDidPresent = await page.spyOnEvent('ionAlertDidPresent');
-
-      await alert.evaluate((el: HTMLIonAlertElement) => el.present());
-      await ionAlertDidPresent.next();
-
-      await expect(page).toHaveScreenshot(screenshot(`alert-text-fields-scale`));
-    });
  });
 });
--- a/core/src/components/alert/test/a11y/alert.e2e.ts-snapshots/alert-checkbox-scale-ios-ltr-Mobile-Chrome-linux.png
+++ b/core/src/components/alert/test/a11y/alert.e2e.ts-snapshots/alert-checkbox-scale-ios-ltr-Mobile-Chrome-linux.png
--- a/core/src/components/alert/test/a11y/alert.e2e.ts-snapshots/alert-checkbox-scale-ios-ltr-Mobile-Firefox-linux.png
+++ b/core/src/components/alert/test/a11y/alert.e2e.ts-snapshots/alert-checkbox-scale-ios-ltr-Mobile-Firefox-linux.png
--- a/core/src/components/alert/test/a11y/alert.e2e.ts-snapshots/alert-checkbox-scale-ios-ltr-Mobile-Safari-linux.png
+++ b/core/src/components/alert/test/a11y/alert.e2e.ts-snapshots/alert-checkbox-scale-ios-ltr-Mobile-Safari-linux.png
--- a/core/src/components/alert/test/a11y/alert.e2e.ts-snapshots/alert-checkbox-scale-md-ltr-Mobile-Chrome-linux.png
+++ b/core/src/components/alert/test/a11y/alert.e2e.ts-snapshots/alert-checkbox-scale-md-ltr-Mobile-Chrome-linux.png
--- a/core/src/components/alert/test/a11y/alert.e2e.ts-snapshots/alert-checkbox-scale-md-ltr-Mobile-Firefox-linux.png
+++ b/core/src/components/alert/test/a11y/alert.e2e.ts-snapshots/alert-checkbox-scale-md-ltr-Mobile-Firefox-linux.png
--- a/core/src/components/alert/test/a11y/alert.e2e.ts-snapshots/alert-checkbox-scale-md-ltr-Mobile-Safari-linux.png
+++ b/core/src/components/alert/test/a11y/alert.e2e.ts-snapshots/alert-checkbox-scale-md-ltr-Mobile-Safari-linux.png
--- a/core/src/components/alert/test/a11y/alert.e2e.ts-snapshots/alert-radio-scale-ios-ltr-Mobile-Chrome-linux.png
+++ b/core/src/components/alert/test/a11y/alert.e2e.ts-snapshots/alert-radio-scale-ios-ltr-Mobile-Chrome-linux.png
--- a/core/src/components/alert/test/a11y/alert.e2e.ts-snapshots/alert-radio-scale-ios-ltr-Mobile-Firefox-linux.png
+++ b/core/src/components/alert/test/a11y/alert.e2e.ts-snapshots/alert-radio-scale-ios-ltr-Mobile-Firefox-linux.png
--- a/core/src/components/alert/test/a11y/alert.e2e.ts-snapshots/alert-radio-scale-ios-ltr-Mobile-Safari-linux.png
+++ b/core/src/components/alert/test/a11y/alert.e2e.ts-snapshots/alert-radio-scale-ios-ltr-Mobile-Safari-linux.png
--- a/core/src/components/alert/test/a11y/alert.e2e.ts-snapshots/alert-radio-scale-md-ltr-Mobile-Chrome-linux.png
+++ b/core/src/components/alert/test/a11y/alert.e2e.ts-snapshots/alert-radio-scale-md-ltr-Mobile-Chrome-linux.png
--- a/core/src/components/alert/test/a11y/alert.e2e.ts-snapshots/alert-radio-scale-md-ltr-Mobile-Firefox-linux.png
+++ b/core/src/components/alert/test/a11y/alert.e2e.ts-snapshots/alert-radio-scale-md-ltr-Mobile-Firefox-linux.png
--- a/core/src/components/alert/test/a11y/alert.e2e.ts-snapshots/alert-radio-scale-md-ltr-Mobile-Safari-linux.png
+++ b/core/src/components/alert/test/a11y/alert.e2e.ts-snapshots/alert-radio-scale-md-ltr-Mobile-Safari-linux.png
--- a/core/src/components/alert/test/a11y/alert.e2e.ts-snapshots/alert-scale-ios-ltr-Mobile-Chrome-linux.png
+++ b/core/src/components/alert/test/a11y/alert.e2e.ts-snapshots/alert-scale-ios-ltr-Mobile-Chrome-linux.png
--- a/core/src/components/alert/test/a11y/alert.e2e.ts-snapshots/alert-scale-ios-ltr-Mobile-Firefox-linux.png
+++ b/core/src/components/alert/test/a11y/alert.e2e.ts-snapshots/alert-scale-ios-ltr-Mobile-Firefox-linux.png
--- a/core/src/components/alert/test/a11y/alert.e2e.ts-snapshots/alert-scale-ios-ltr-Mobile-Safari-linux.png
+++ b/core/src/components/alert/test/a11y/alert.e2e.ts-snapshots/alert-scale-ios-ltr-Mobile-Safari-linux.png
--- a/core/src/components/alert/test/a11y/alert.e2e.ts-snapshots/alert-scale-md-ltr-Mobile-Chrome-linux.png
+++ b/core/src/components/alert/test/a11y/alert.e2e.ts-snapshots/alert-scale-md-ltr-Mobile-Chrome-linux.png
--- a/core/src/components/alert/test/a11y/alert.e2e.ts-snapshots/alert-scale-md-ltr-Mobile-Firefox-linux.png
+++ b/core/src/components/alert/test/a11y/alert.e2e.ts-snapshots/alert-scale-md-ltr-Mobile-Firefox-linux.png
--- a/core/src/components/alert/test/a11y/alert.e2e.ts-snapshots/alert-scale-md-ltr-Mobile-Safari-linux.png
+++ b/core/src/components/alert/test/a11y/alert.e2e.ts-snapshots/alert-scale-md-ltr-Mobile-Safari-linux.png
--- a/core/src/components/alert/test/a11y/alert.e2e.ts-snapshots/alert-text-fields-scale-ios-ltr-Mobile-Chrome-linux.png
+++ b/core/src/components/alert/test/a11y/alert.e2e.ts-snapshots/alert-text-fields-scale-ios-ltr-Mobile-Chrome-linux.png
--- a/core/src/components/alert/test/a11y/alert.e2e.ts-snapshots/alert-text-fields-scale-ios-ltr-Mobile-Firefox-linux.png
+++ b/core/src/components/alert/test/a11y/alert.e2e.ts-snapshots/alert-text-fields-scale-ios-ltr-Mobile-Firefox-linux.png
--- a/core/src/components/alert/test/a11y/alert.e2e.ts-snapshots/alert-text-fields-scale-ios-ltr-Mobile-Safari-linux.png
+++ b/core/src/components/alert/test/a11y/alert.e2e.ts-snapshots/alert-text-fields-scale-ios-ltr-Mobile-Safari-linux.png
--- a/core/src/components/alert/test/a11y/alert.e2e.ts-snapshots/alert-text-fields-scale-md-ltr-Mobile-Chrome-linux.png
+++ b/core/src/components/alert/test/a11y/alert.e2e.ts-snapshots/alert-text-fields-scale-md-ltr-Mobile-Chrome-linux.png
--- a/core/src/components/alert/test/a11y/alert.e2e.ts-snapshots/alert-text-fields-scale-md-ltr-Mobile-Firefox-linux.png
+++ b/core/src/components/alert/test/a11y/alert.e2e.ts-snapshots/alert-text-fields-scale-md-ltr-Mobile-Firefox-linux.png
--- a/core/src/components/alert/test/a11y/alert.e2e.ts-snapshots/alert-text-fields-scale-md-ltr-Mobile-Safari-linux.png
+++ b/core/src/components/alert/test/a11y/alert.e2e.ts-snapshots/alert-text-fields-scale-md-ltr-Mobile-Safari-linux.png
--- a/core/src/components/alert/test/a11y/index.html
+++ b/core/src/components/alert/test/a11y/index.html
@@ -24,8 +24,6 @@
      <ion-button id="noHeaders" expand="block" onclick="presentNoHeaders()">No Headers</ion-button>
      <ion-button id="noMessage" expand="block" onclick="presentNoMessage()">No Message</ion-button>
      <ion-button id="customAria" expand="block" onclick="presentCustomAria()">Custom Aria</ion-button>
-      <ion-button id="ariaLabelButton" expand="block" onclick="presentAriaLabelButton()">Aria Label Button</ion-button>
-      <ion-button id="checkbox" expand="block" onclick="presentAlertCheckbox()">Checkbox</ion-button>
    </main>

    <script>
@@ -78,38 +76,6 @@
          },
        });
      }
-
-      function presentAriaLabelButton() {
-        openAlert({
-          header: 'Header',
-          subHeader: 'Subtitle',
-          message: 'This is an alert message with custom aria attributes passed to the button.',
-          buttons: [
-            {
-              text: 'Close',
-              htmlAttributes: {
-                'aria-label': 'close button',
-                'aria-labelledby': 'close-label',
-              },
-            },
-          ],
-        });
-      }
-
-      function presentAlertCheckbox() {
-        openAlert({
-          header: 'Checkbox',
-          inputs: [
-            {
-              type: 'checkbox',
-              label: 'Checkbox 1',
-              value: 'value1',
-              checked: true,
-            },
-          ],
-          buttons: ['OK'],
-        });
-      }
    </script>
  </body>
 </html>
--- a/core/src/components/alert/test/basic/alert.e2e.ts-snapshots/alert-checkbox-ios-ltr-Mobile-Chrome-linux.png
+++ b/core/src/components/alert/test/basic/alert.e2e.ts-snapshots/alert-checkbox-ios-ltr-Mobile-Chrome-linux.png
--- a/core/src/components/alert/test/basic/alert.e2e.ts-snapshots/alert-checkbox-ios-ltr-Mobile-Firefox-linux.png
+++ b/core/src/components/alert/test/basic/alert.e2e.ts-snapshots/alert-checkbox-ios-ltr-Mobile-Firefox-linux.png
--- a/core/src/components/alert/test/basic/alert.e2e.ts-snapshots/alert-checkbox-ios-ltr-Mobile-Safari-linux.png
+++ b/core/src/components/alert/test/basic/alert.e2e.ts-snapshots/alert-checkbox-ios-ltr-Mobile-Safari-linux.png
--- a/core/src/components/alert/test/basic/alert.e2e.ts-snapshots/alert-checkbox-ios-rtl-Mobile-Chrome-linux.png
+++ b/core/src/components/alert/test/basic/alert.e2e.ts-snapshots/alert-checkbox-ios-rtl-Mobile-Chrome-linux.png
--- a/core/src/components/alert/test/basic/alert.e2e.ts-snapshots/alert-checkbox-ios-rtl-Mobile-Firefox-linux.png
+++ b/core/src/components/alert/test/basic/alert.e2e.ts-snapshots/alert-checkbox-ios-rtl-Mobile-Firefox-linux.png
--- a/Show More
+++ b/Show More