diff --git a/.github/COMPONENT-GUIDE.md b/.github/COMPONENT-GUIDE.md
index 2212d55949..15c74b82e4 100644
--- a/.github/COMPONENT-GUIDE.md
+++ b/.github/COMPONENT-GUIDE.md
@@ -93,6 +93,11 @@ The following styles should be set for the CSS to work properly. Note that the `
 
 The activated state should be enabled for elements with actions on "press". It usually changes the opacity or background of an element.
 
+> [!WARNING]
+>`:active` should not be used here as it is not received on mobile Safari unless the element has a `touchstart` listener (which we don't necessarily want to have to add to every element). From [Safari Web Content Guide](https://developer.apple.com/library/archive/documentation/AppleApplications/Reference/SafariWebContent/AdjustingtheTextSize/AdjustingtheTextSize.html):
+>
+>> On iOS, mouse events are sent so quickly that the down or active state is never received. Therefore, the `:active` pseudo state is triggered only when there is a touch event set on the HTML element
+
 > Make sure the component has the correct [component structure](#component-structure) before continuing.
 
 #### JavaScript
@@ -109,7 +114,7 @@ render() {
 }
 ```
 
-Once that is done, the element will get the `ion-activated` class added on press.
+Once that is done, the element will get the `ion-activated` class added on press after a small delay. This delay exists so that the active state does not show up when an activatable element is tapped while scrolling.
 
 In addition to setting that class, `ion-activatable-instant` can be set in order to have an instant press with no delay:
 
@@ -212,7 +217,13 @@ TODO
 
 ### Focused
 
-The focused state should be enabled for elements with actions when tabbed to via the keyboard. This will only work inside of an `ion-app`. It usually changes the opacity or background of an element.
+The focused state should be enabled for elements with actions when tabbed to via the keyboard. This will only work inside of an `ion-app`. It usually changes the opacity or background of an element. 
+
+> [!WARNING]
+> Do not use `:focus` because that will cause the focus to apply even when an element is tapped (because the element is now focused). Instead, we only want the focus state to be shown when it makes sense which is what the `.ion-focusable` utility mentioned below does.
+
+> [!NOTE]
+> The [`:focus-visible`](https://developer.mozilla.org/en-US/docs/Web/CSS/:focus-visible) pseudo-class mostly does the same thing as our JavaScript-driven utility. However, it does not work well with Shadow DOM components as the element that receives focus is typically inside of the Shadow DOM, but we usually want to set the `:focus-visible` state on the host so we can style other parts of the component. Using other combinations such as `:has(:focus-visible)` does not work because `:has` does not pierce the Shadow DOM (as that would leak implementation details about the Shadow DOM contents). `:focus-within` does work with the Shadow DOM, but that has the same problem as `:focus` that was mentioned before. Unfortunately, a [`:focus-visible-within` pseudo-class does not exist yet](https://github.com/WICG/focus-visible/issues/151).
 
 > Make sure the component has the correct [component structure](#component-structure) before continuing.
 
@@ -275,7 +286,10 @@ ion-button {
 
 ### Hover
 
-The [hover state](https://developer.mozilla.org/en-US/docs/Web/CSS/:hover) happens when a user moves their cursor on top of an element without pressing on it. It should not happen on mobile, only on desktop devices that support hover.
+The [hover state](https://developer.mozilla.org/en-US/docs/Web/CSS/:hover) happens when a user moves their cursor on top of an element without pressing on it. It should not happen on mobile, only on desktop devices that support hover. 
+
+> [!NOTE]
+> Some Android devices [incorrectly report their inputs](https://issues.chromium.org/issues/40855702) which can result in certain devices receiving hover events when they should not.
 
 > Make sure the component has the correct [component structure](#component-structure) before continuing.
 
diff --git a/.github/dependabot.yml b/.github/dependabot.yml
deleted file mode 100644
index 8484a6f0af..0000000000
--- a/.github/dependabot.yml
+++ /dev/null
@@ -1,20 +0,0 @@
-version: 2
-updates:
-  - package-ecosystem: "npm"
-    directory: "/core"
-    schedule:
-      interval: "daily"
-    versioning-strategy: increase
-    allow:
-      - dependency-name: "@playwright/test"
-      - dependency-name: "@axe-core/playwright"
-      - dependency-name: "@stencil/angular-output-target"
-      - dependency-name: "@stencil/core"
-      - dependency-name: "@stencil/react-output-target"
-      - dependency-name: "@stencil/sass"
-      - dependency-name: "@stencil/vue-output-target"
-      - dependency-name: "ionicons"
-      - dependency-name: "@capacitor/core"
-      - dependency-name: "@capacitor/keyboard"
-      - dependency-name: "@capacitor/haptics"
-      - dependency-name: "@capacitor/status-bar"
diff --git a/.github/workflows/actions/build-angular-server/action.yml b/.github/workflows/actions/build-angular-server/action.yml
index cd74630fa2..3c289e35dc 100644
--- a/.github/workflows/actions/build-angular-server/action.yml
+++ b/.github/workflows/actions/build-angular-server/action.yml
@@ -3,7 +3,7 @@ description: 'Build Ionic Angular Server'
 runs:
   using: 'composite'
   steps:
-    - uses: actions/setup-node@v3
+    - uses: actions/setup-node@v4
       with:
         node-version: 18.x
     - uses: pnpm/action-setup@v2
diff --git a/.github/workflows/actions/build-angular/action.yml b/.github/workflows/actions/build-angular/action.yml
index 64c77673ab..326b4a8632 100644
--- a/.github/workflows/actions/build-angular/action.yml
+++ b/.github/workflows/actions/build-angular/action.yml
@@ -3,7 +3,7 @@ description: 'Build Ionic Angular'
 runs:
   using: 'composite'
   steps:
-    - uses: actions/setup-node@v3
+    - uses: actions/setup-node@v4
       with:
         node-version: 18.x
     - uses: pnpm/action-setup@v2
diff --git a/.github/workflows/actions/build-core-stencil-prerelease/action.yml b/.github/workflows/actions/build-core-stencil-prerelease/action.yml
index 5343c0600e..46dad3dbc2 100644
--- a/.github/workflows/actions/build-core-stencil-prerelease/action.yml
+++ b/.github/workflows/actions/build-core-stencil-prerelease/action.yml
@@ -8,8 +8,8 @@ inputs:
 runs:
   using: 'composite'
   steps:
-    - uses: actions/checkout@v3
-    - uses: actions/setup-node@v3
+    - uses: actions/checkout@v4
+    - uses: actions/setup-node@v4
       with:
         node-version: 18.x
     - uses: pnpm/action-setup@v2
@@ -24,7 +24,7 @@ runs:
       run: pnpm i @stencil/core@${{ inputs.stencil-version }}
       shell: bash
     - name: Build Core
-      run: pnpm run build --ci
+      run: pnpm npm run build -- --ci --debug --verbose
       working-directory: ./core
       shell: bash
     - uses: ./.github/workflows/actions/upload-archive
diff --git a/.github/workflows/actions/build-core/action.yml b/.github/workflows/actions/build-core/action.yml
index 925bd7f303..78428b61be 100644
--- a/.github/workflows/actions/build-core/action.yml
+++ b/.github/workflows/actions/build-core/action.yml
@@ -8,8 +8,8 @@ inputs:
 runs:
   using: 'composite'
   steps:
-    - uses: actions/checkout@v3
-    - uses: actions/setup-node@v3
+    - uses: actions/checkout@v4
+    - uses: actions/setup-node@v4
       with:
         node-version: 18.x
     - uses: pnpm/action-setup@v2
diff --git a/.github/workflows/actions/build-react-router/action.yml b/.github/workflows/actions/build-react-router/action.yml
index 807bb8f927..867eda8ec0 100644
--- a/.github/workflows/actions/build-react-router/action.yml
+++ b/.github/workflows/actions/build-react-router/action.yml
@@ -3,7 +3,7 @@ description: 'Build Ionic React Router'
 runs:
   using: 'composite'
   steps:
-    - uses: actions/setup-node@v3
+    - uses: actions/setup-node@v4
       with:
         node-version: 18.x
     - uses: pnpm/action-setup@v2
diff --git a/.github/workflows/actions/build-react/action.yml b/.github/workflows/actions/build-react/action.yml
index 1be8b5a379..668cb77774 100644
--- a/.github/workflows/actions/build-react/action.yml
+++ b/.github/workflows/actions/build-react/action.yml
@@ -3,7 +3,7 @@ description: 'Build Ionic React'
 runs:
   using: 'composite'
   steps:
-    - uses: actions/setup-node@v3
+    - uses: actions/setup-node@v4
       with:
         node-version: 18.x
     - uses: pnpm/action-setup@v2
diff --git a/.github/workflows/actions/build-vue-router/action.yml b/.github/workflows/actions/build-vue-router/action.yml
index d7db00d461..a4f5845bd3 100644
--- a/.github/workflows/actions/build-vue-router/action.yml
+++ b/.github/workflows/actions/build-vue-router/action.yml
@@ -3,7 +3,7 @@ description: 'Builds Ionic Vue Router'
 runs:
   using: 'composite'
   steps:
-    - uses: actions/setup-node@v3
+    - uses: actions/setup-node@v4
       with:
         node-version: 18.x
     - uses: pnpm/action-setup@v2
diff --git a/.github/workflows/actions/build-vue/action.yml b/.github/workflows/actions/build-vue/action.yml
index d2b63dc46a..bc24a2e220 100644
--- a/.github/workflows/actions/build-vue/action.yml
+++ b/.github/workflows/actions/build-vue/action.yml
@@ -3,7 +3,7 @@ description: 'Build Ionic Vue'
 runs:
   using: 'composite'
   steps:
-    - uses: actions/setup-node@v3
+    - uses: actions/setup-node@v4
       with:
         node-version: 18.x
     - uses: pnpm/action-setup@v2
diff --git a/.github/workflows/actions/download-archive/action.yml b/.github/workflows/actions/download-archive/action.yml
index 18108e506b..04cf5108f2 100644
--- a/.github/workflows/actions/download-archive/action.yml
+++ b/.github/workflows/actions/download-archive/action.yml
@@ -10,7 +10,7 @@ inputs:
 runs:
   using: 'composite'
   steps:
-    - uses: actions/download-artifact@v3
+    - uses: actions/download-artifact@v4
       with:
         name: ${{ inputs.name }}
         path: ${{ inputs.path }}
diff --git a/.github/workflows/actions/publish-npm/action.yml b/.github/workflows/actions/publish-npm/action.yml
index cfa69f930e..adb3b55739 100644
--- a/.github/workflows/actions/publish-npm/action.yml
+++ b/.github/workflows/actions/publish-npm/action.yml
@@ -19,7 +19,7 @@ inputs:
 runs:
   using: 'composite'
   steps:
-    - uses: actions/setup-node@v3
+    - uses: actions/setup-node@v4
       with:
         node-version: 18.x
     - uses: pnpm/action-setup@v2
diff --git a/.github/workflows/actions/test-angular-e2e/action.yml b/.github/workflows/actions/test-angular-e2e/action.yml
index 819803141f..7f4db51ded 100644
--- a/.github/workflows/actions/test-angular-e2e/action.yml
+++ b/.github/workflows/actions/test-angular-e2e/action.yml
@@ -6,7 +6,7 @@ inputs:
 runs:
   using: 'composite'
   steps:
-    - uses: actions/setup-node@v3
+    - uses: actions/setup-node@v4
       with:
         node-version: 18
     - uses: pnpm/action-setup@v2
diff --git a/.github/workflows/actions/test-core-clean-build/action.yml b/.github/workflows/actions/test-core-clean-build/action.yml
index 1cef45dcd9..8832e71748 100644
--- a/.github/workflows/actions/test-core-clean-build/action.yml
+++ b/.github/workflows/actions/test-core-clean-build/action.yml
@@ -3,7 +3,7 @@ description: 'Test Core Clean Build'
 runs:
   using: 'composite'
   steps:
-    - uses: actions/setup-node@v3
+    - uses: actions/setup-node@v4
       with:
         node-version: 18.x
 
diff --git a/.github/workflows/actions/test-core-lint/action.yml b/.github/workflows/actions/test-core-lint/action.yml
index 9a3926dc4c..de51576fe2 100644
--- a/.github/workflows/actions/test-core-lint/action.yml
+++ b/.github/workflows/actions/test-core-lint/action.yml
@@ -3,7 +3,7 @@ description: 'Test Core Lint'
 runs:
   using: 'composite'
   steps:
-    - uses: actions/setup-node@v3
+    - uses: actions/setup-node@v4
       with:
         node-version: 18.x
     - uses: pnpm/action-setup@v2
diff --git a/.github/workflows/actions/test-core-screenshot/action.yml b/.github/workflows/actions/test-core-screenshot/action.yml
index 348b47b951..093256e4bb 100644
--- a/.github/workflows/actions/test-core-screenshot/action.yml
+++ b/.github/workflows/actions/test-core-screenshot/action.yml
@@ -13,7 +13,7 @@ inputs:
 runs:
   using: 'composite'
   steps:
-    - uses: actions/setup-node@v3
+    - uses: actions/setup-node@v4
       with:
         node-version: 18.x
     - uses: pnpm/action-setup@v2
@@ -85,7 +85,7 @@ runs:
       working-directory: ./core
     - name: Archive Updated Screenshots
       if: inputs.update == 'true' && steps.test-and-update.outputs.hasUpdatedScreenshots == 'true'
-      uses: actions/upload-artifact@v3
+      uses: actions/upload-artifact@v4
       with:
         name: updated-screenshots-${{ inputs.shard }}-${{ inputs.totalShards }}
         path: UpdatedScreenshots-${{ inputs.shard }}-${{ inputs.totalShards }}.zip
diff --git a/.github/workflows/actions/test-core-spec/action.yml b/.github/workflows/actions/test-core-spec/action.yml
index 4dd641bb08..2426dc4574 100644
--- a/.github/workflows/actions/test-core-spec/action.yml
+++ b/.github/workflows/actions/test-core-spec/action.yml
@@ -6,7 +6,7 @@ inputs:
 runs:
   using: 'composite'
   steps:
-    - uses: actions/setup-node@v3
+    - uses: actions/setup-node@v4
       with:
         node-version: 18.x
     - uses: pnpm/action-setup@v2
diff --git a/.github/workflows/actions/test-react-e2e/action.yml b/.github/workflows/actions/test-react-e2e/action.yml
index 6987026558..0253289512 100644
--- a/.github/workflows/actions/test-react-e2e/action.yml
+++ b/.github/workflows/actions/test-react-e2e/action.yml
@@ -6,7 +6,7 @@ inputs:
 runs:
   using: 'composite'
   steps:
-    - uses: actions/setup-node@v3
+    - uses: actions/setup-node@v4
       with:
         node-version: 18.x
     - uses: pnpm/action-setup@v2
diff --git a/.github/workflows/actions/test-react-router-e2e/action.yml b/.github/workflows/actions/test-react-router-e2e/action.yml
index 9f6ce331b1..d8985a2138 100644
--- a/.github/workflows/actions/test-react-router-e2e/action.yml
+++ b/.github/workflows/actions/test-react-router-e2e/action.yml
@@ -6,7 +6,7 @@ inputs:
 runs:
   using: 'composite'
   steps:
-    - uses: actions/setup-node@v3
+    - uses: actions/setup-node@v4
       with:
         node-version: 18.x
     - uses: pnpm/action-setup@v2
diff --git a/.github/workflows/actions/test-vue-e2e/action.yml b/.github/workflows/actions/test-vue-e2e/action.yml
index a52fd35137..a19bb89654 100644
--- a/.github/workflows/actions/test-vue-e2e/action.yml
+++ b/.github/workflows/actions/test-vue-e2e/action.yml
@@ -6,7 +6,7 @@ inputs:
 runs:
   using: 'composite'
   steps:
-    - uses: actions/setup-node@v3
+    - uses: actions/setup-node@v4
       with:
         node-version: 18.x
     - uses: pnpm/action-setup@v2
diff --git a/.github/workflows/actions/update-reference-screenshots/action.yml b/.github/workflows/actions/update-reference-screenshots/action.yml
index 52ac254169..d33c5e55ce 100644
--- a/.github/workflows/actions/update-reference-screenshots/action.yml
+++ b/.github/workflows/actions/update-reference-screenshots/action.yml
@@ -7,10 +7,10 @@ on:
 runs:
   using: 'composite'
   steps:
-    - uses: actions/setup-node@v3
+    - uses: actions/setup-node@v4
       with:
         node-version: 18.x
-    - uses: actions/download-artifact@v3
+    - uses: actions/download-artifact@v4
       with:
         path: ./artifacts
     - name: Extract Archives
diff --git a/.github/workflows/actions/upload-archive/action.yml b/.github/workflows/actions/upload-archive/action.yml
index 45b272b261..966b80e3a0 100644
--- a/.github/workflows/actions/upload-archive/action.yml
+++ b/.github/workflows/actions/upload-archive/action.yml
@@ -13,7 +13,7 @@ runs:
     - name: Create Archive
       run: zip -q -r ${{ inputs.output }} ${{ inputs.paths }}
       shell: bash
-    - uses: actions/upload-artifact@v3
+    - uses: actions/upload-artifact@v4
       with:
         name: ${{ inputs.name }}
         path: ${{ inputs.output }}
diff --git a/.github/workflows/build.yml b/.github/workflows/build.yml
index 2cd2a4658d..34e45952c7 100644
--- a/.github/workflows/build.yml
+++ b/.github/workflows/build.yml
@@ -22,7 +22,7 @@ jobs:
   build-core:
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
       - uses: ./.github/workflows/actions/build-core
         with:
           ionicons-version: ${{ inputs.ionicons_npm_release_tag }}
@@ -31,21 +31,21 @@ jobs:
     needs: [build-core]
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
       - uses: ./.github/workflows/actions/test-core-clean-build
 
   test-core-lint:
     needs: [build-core]
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
       - uses: ./.github/workflows/actions/test-core-lint
 
   test-core-spec:
     needs: [build-core]
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
       - uses: ./.github/workflows/actions/test-core-spec
 
   test-core-screenshot:
@@ -62,7 +62,7 @@ jobs:
     needs: [build-core]
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
       - uses: ./.github/workflows/actions/test-core-screenshot
         with:
           shard: ${{ matrix.shard }}
@@ -90,14 +90,14 @@ jobs:
     needs: [build-core]
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v3
+    - uses: actions/checkout@v4
     - uses: ./.github/workflows/actions/build-vue
 
   build-vue-router:
     needs: [build-vue]
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v3
+    - uses: actions/checkout@v4
     - uses: ./.github/workflows/actions/build-vue-router
 
   test-vue-e2e:
@@ -108,7 +108,7 @@ jobs:
     needs: [build-vue, build-vue-router]
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v3
+    - uses: actions/checkout@v4
     - uses: ./.github/workflows/actions/test-vue-e2e
       with:
         app: ${{ matrix.apps }}
@@ -126,14 +126,14 @@ jobs:
     needs: [build-core]
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v3
+    - uses: actions/checkout@v4
     - uses: ./.github/workflows/actions/build-angular
 
   build-angular-server:
     needs: [build-core]
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v3
+    - uses: actions/checkout@v4
     - uses: ./.github/workflows/actions/build-angular-server
 
   test-angular-e2e:
@@ -144,7 +144,7 @@ jobs:
     needs: [build-angular, build-angular-server]
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v3
+    - uses: actions/checkout@v4
     - uses: ./.github/workflows/actions/test-angular-e2e
       with:
         app: ${{ matrix.apps }}
@@ -162,14 +162,14 @@ jobs:
     needs: [build-core]
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v3
+    - uses: actions/checkout@v4
     - uses: ./.github/workflows/actions/build-react
 
   build-react-router:
     needs: [build-react]
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v3
+    - uses: actions/checkout@v4
     - uses: ./.github/workflows/actions/build-react-router
 
   test-react-router-e2e:
@@ -180,7 +180,7 @@ jobs:
     needs: [build-react, build-react-router]
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v3
+    - uses: actions/checkout@v4
     - uses: ./.github/workflows/actions/test-react-router-e2e
       with:
         app: ${{ matrix.apps }}
@@ -202,7 +202,7 @@ jobs:
     needs: [build-react, build-react-router]
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v3
+    - uses: actions/checkout@v4
     - uses: ./.github/workflows/actions/test-react-e2e
       with:
         app: ${{ matrix.apps }}
diff --git a/.github/workflows/codeql-analysis.yml b/.github/workflows/codeql-analysis.yml
index adfc452953..fbb39d4d5d 100644
--- a/.github/workflows/codeql-analysis.yml
+++ b/.github/workflows/codeql-analysis.yml
@@ -14,8 +14,8 @@ jobs:
     permissions:
       security-events: write
     steps:
-      - uses: actions/checkout@v3
-      - uses: github/codeql-action/init@v2
+      - uses: actions/checkout@v4
+      - uses: github/codeql-action/init@v3
         with:
           languages: javascript
-      - uses: github/codeql-action/analyze@v2
+      - uses: github/codeql-action/analyze@v3
diff --git a/.github/workflows/dev-build.yml b/.github/workflows/dev-build.yml
index 9cb15912ad..e6f1b9cb67 100644
--- a/.github/workflows/dev-build.yml
+++ b/.github/workflows/dev-build.yml
@@ -9,7 +9,7 @@ jobs:
     outputs:
       dev-hash: ${{ steps.create-dev-hash.outputs.DEV_HASH }}
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
       - uses: pnpm/action-setup@v2
         with:
           version: 8
diff --git a/.github/workflows/nightly.yml b/.github/workflows/nightly.yml
index b91e2d224c..3e4a43d96c 100644
--- a/.github/workflows/nightly.yml
+++ b/.github/workflows/nightly.yml
@@ -12,7 +12,7 @@ jobs:
     outputs:
       nightly-hash: ${{ steps.create-nightly-hash.outputs.NIGHTLY_HASH }}
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
       - uses: pnpm/action-setup@v2
         with:
           version: 8
diff --git a/.github/workflows/release-ionic.yml b/.github/workflows/release-ionic.yml
index 7cc31bac41..445437955a 100644
--- a/.github/workflows/release-ionic.yml
+++ b/.github/workflows/release-ionic.yml
@@ -22,7 +22,7 @@ jobs:
   release-core:
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v3
+    - uses: actions/checkout@v4
     - uses: ./.github/workflows/actions/publish-npm
       with:
         scope: '@ionic/core'
@@ -48,7 +48,7 @@ jobs:
     needs: [release-core]
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v3
+    - uses: actions/checkout@v4
     - name: Restore @ionic/docs built cache
       uses: ./.github/workflows/actions/download-archive
       with:
@@ -68,7 +68,7 @@ jobs:
     needs: [release-core]
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v3
+    - uses: actions/checkout@v4
     - name: Restore @ionic/core built cache
       uses: ./.github/workflows/actions/download-archive
       with:
@@ -95,7 +95,7 @@ jobs:
     needs: [release-core]
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v3
+    - uses: actions/checkout@v4
     - name: Restore @ionic/core built cache
       uses: ./.github/workflows/actions/download-archive
       with:
@@ -121,7 +121,7 @@ jobs:
     needs: [release-core]
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v3
+    - uses: actions/checkout@v4
     - name: Restore @ionic/core built cache
       uses: ./.github/workflows/actions/download-archive
       with:
@@ -147,7 +147,7 @@ jobs:
     needs: [release-core]
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v3
+    - uses: actions/checkout@v4
     - name: Restore @ionic/core built cache
       uses: ./.github/workflows/actions/download-archive
       with:
@@ -167,7 +167,7 @@ jobs:
     needs: [release-react]
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v3
+    - uses: actions/checkout@v4
     - name: Restore @ionic/core built cache
       uses: ./.github/workflows/actions/download-archive
       with:
@@ -193,7 +193,7 @@ jobs:
     needs: [release-vue]
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v3
+    - uses: actions/checkout@v4
     - name: Restore @ionic/core built cache
       uses: ./.github/workflows/actions/download-archive
       with:
diff --git a/.github/workflows/release.yml b/.github/workflows/release.yml
index ed0a08e841..e12662c9c2 100644
--- a/.github/workflows/release.yml
+++ b/.github/workflows/release.yml
@@ -50,7 +50,7 @@ jobs:
     needs: [release-ionic]
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v3
+    - uses: actions/checkout@v4
       with:
         token: ${{ secrets.IONITRON_TOKEN }}
         fetch-depth: 0
@@ -81,7 +81,7 @@ jobs:
     needs: [finalize-release]
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
         # Pull the latest version of the reference
         # branch instead of the revision that triggered
         # the workflow otherwise we won't get the commit
diff --git a/.github/workflows/stencil-nightly.yml b/.github/workflows/stencil-nightly.yml
index c5db4e1bb3..56d3a56a71 100644
--- a/.github/workflows/stencil-nightly.yml
+++ b/.github/workflows/stencil-nightly.yml
@@ -26,7 +26,7 @@ jobs:
   build-core-with-stencil-nightly:
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
       - uses: ./.github/workflows/actions/build-core-stencil-prerelease
         with:
           stencil-version: ${{ inputs.npm_release_tag || 'nightly' }}
@@ -35,21 +35,21 @@ jobs:
     needs: [build-core-with-stencil-nightly]
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
       - uses: ./.github/workflows/actions/test-core-clean-build
 
   test-core-lint:
     needs: [build-core-with-stencil-nightly]
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
       - uses: ./.github/workflows/actions/test-core-lint
 
   test-core-spec:
     needs: [build-core-with-stencil-nightly]
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
       - uses: ./.github/workflows/actions/test-core-spec
         with:
           stencil-version: ${{ inputs.npm_release_tag || 'nightly' }}
@@ -72,7 +72,7 @@ jobs:
     needs: [build-core-with-stencil-nightly]
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
       - uses: ./.github/workflows/actions/test-core-screenshot
         with:
           shard: ${{ matrix.shard }}
@@ -100,14 +100,14 @@ jobs:
     needs: [build-core-with-stencil-nightly]
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v3
+    - uses: actions/checkout@v4
     - uses: ./.github/workflows/actions/build-vue
 
   build-vue-router:
     needs: [build-vue]
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v3
+    - uses: actions/checkout@v4
     - uses: ./.github/workflows/actions/build-vue-router
 
   test-vue-e2e:
@@ -118,7 +118,7 @@ jobs:
     needs: [build-vue, build-vue-router]
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v3
+    - uses: actions/checkout@v4
     - uses: ./.github/workflows/actions/test-vue-e2e
       with:
         app: ${{ matrix.apps }}
@@ -136,25 +136,25 @@ jobs:
     needs: [build-core-with-stencil-nightly]
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v3
+    - uses: actions/checkout@v4
     - uses: ./.github/workflows/actions/build-angular
 
   build-angular-server:
     needs: [build-core-with-stencil-nightly]
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v3
+    - uses: actions/checkout@v4
     - uses: ./.github/workflows/actions/build-angular-server
 
   test-angular-e2e:
     strategy:
       fail-fast: false
       matrix:
-        apps: [ng12, ng13, ng14, ng15]
+        apps: [ng16, ng17]
     needs: [build-angular, build-angular-server]
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v3
+    - uses: actions/checkout@v4
     - uses: ./.github/workflows/actions/test-angular-e2e
       with:
         app: ${{ matrix.apps }}
@@ -172,14 +172,14 @@ jobs:
     needs: [build-core-with-stencil-nightly]
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v3
+    - uses: actions/checkout@v4
     - uses: ./.github/workflows/actions/build-react
 
   build-react-router:
     needs: [build-react]
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v3
+    - uses: actions/checkout@v4
     - uses: ./.github/workflows/actions/build-react-router
 
   test-react-router-e2e:
@@ -190,7 +190,7 @@ jobs:
     needs: [build-react, build-react-router]
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v3
+    - uses: actions/checkout@v4
     - uses: ./.github/workflows/actions/test-react-router-e2e
       with:
         app: ${{ matrix.apps }}
@@ -212,7 +212,7 @@ jobs:
     needs: [build-react, build-react-router]
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v3
+    - uses: actions/checkout@v4
     - uses: ./.github/workflows/actions/test-react-e2e
       with:
         app: ${{ matrix.apps }}
diff --git a/.github/workflows/update-screenshots.yml b/.github/workflows/update-screenshots.yml
index b78a13c42a..bce7f324f2 100644
--- a/.github/workflows/update-screenshots.yml
+++ b/.github/workflows/update-screenshots.yml
@@ -12,7 +12,7 @@ jobs:
   build-core:
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
       - uses: ./.github/workflows/actions/build-core
 
   test-core-screenshot:
@@ -33,7 +33,7 @@ jobs:
     needs: [build-core]
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
       - uses: ./.github/workflows/actions/test-core-screenshot
         with:
           shard: ${{ matrix.shard }}
@@ -45,7 +45,7 @@ jobs:
     runs-on: ubuntu-latest
     needs: [test-core-screenshot]
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
         # Normally, we could just push with the
         # default GITHUB_TOKEN, but that will
         # not cause the build workflow
diff --git a/CHANGELOG.md b/CHANGELOG.md
index bab77c44f5..8c01808b55 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -3,6 +3,81 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [7.7.4](https://github.com/ionic-team/ionic-framework/compare/v7.7.3...v7.7.4) (2024-03-06)
+
+
+### Bug Fixes
+
+* **modal:** ariaLabel and role are inherited when set via htmlAttributes ([#29099](https://github.com/ionic-team/ionic-framework/issues/29099)) ([de13633](https://github.com/ionic-team/ionic-framework/commit/de13633a182d963876434db773aa346833f956fd))
+
+
+
+
+
+## [7.7.3](https://github.com/ionic-team/ionic-framework/compare/v7.7.2...v7.7.3) (2024-02-21)
+
+
+### Bug Fixes
+
+* **label:** do not grow when in end slot ([#29036](https://github.com/ionic-team/ionic-framework/issues/29036)) ([1fc4b76](https://github.com/ionic-team/ionic-framework/commit/1fc4b76f5940b38fd89e19561d6b4738dfb8ae5d)), closes [#29033](https://github.com/ionic-team/ionic-framework/issues/29033)
+* **overlays:** focus is returned to last focus element when focusing toast ([#28950](https://github.com/ionic-team/ionic-framework/issues/28950)) ([2ed0ada](https://github.com/ionic-team/ionic-framework/commit/2ed0ada9237b3f4dbf5959746ce2d1744936eebe)), closes [#28261](https://github.com/ionic-team/ionic-framework/issues/28261)
+
+
+
+
+
+## [7.7.2](https://github.com/ionic-team/ionic-framework/compare/v7.7.1...v7.7.2) (2024-02-14)
+
+
+### Bug Fixes
+
+* **overlays:** do not return focus if application has already moved focus manually ([#28850](https://github.com/ionic-team/ionic-framework/issues/28850)) ([a016670](https://github.com/ionic-team/ionic-framework/commit/a016670a8a46e101d23235b17bc8a2081fb992eb)), closes [#28849](https://github.com/ionic-team/ionic-framework/issues/28849)
+* **overlays:** ensure that only topmost overlay is announced by screen readers ([#28997](https://github.com/ionic-team/ionic-framework/issues/28997)) ([ba4ba61](https://github.com/ionic-team/ionic-framework/commit/ba4ba6161c1a6c67f7804b07f49c64ac9ad2b14c)), closes [#23472](https://github.com/ionic-team/ionic-framework/issues/23472)
+* **popover:** render arrow above backdrop ([#28986](https://github.com/ionic-team/ionic-framework/issues/28986)) ([0a8964d](https://github.com/ionic-team/ionic-framework/commit/0a8964d30c76218fe62f7f4aed4f81df7bb80cd0)), closes [#28985](https://github.com/ionic-team/ionic-framework/issues/28985)
+
+
+
+
+
+## [7.7.1](https://github.com/ionic-team/ionic-framework/compare/v7.7.0...v7.7.1) (2024-02-07)
+
+
+### Bug Fixes
+
+* **action-sheet:** iOS dismiss animation respects safe area ([#28915](https://github.com/ionic-team/ionic-framework/issues/28915)) ([7449fb4](https://github.com/ionic-team/ionic-framework/commit/7449fb4fed4048f5d01ba068dc6f8e2d7727e95d)), closes [#28541](https://github.com/ionic-team/ionic-framework/issues/28541)
+* **overlays:** tear down animations after dismiss ([#28907](https://github.com/ionic-team/ionic-framework/issues/28907)) ([950fa40](https://github.com/ionic-team/ionic-framework/commit/950fa40c5597c81d5cbaeb9276b09adfea5e79fb)), closes [#28352](https://github.com/ionic-team/ionic-framework/issues/28352)
+* **react:** route with redirect will mount page ([#28961](https://github.com/ionic-team/ionic-framework/issues/28961)) ([5777ce2](https://github.com/ionic-team/ionic-framework/commit/5777ce258119d2715b1326cdc103bd4ad7612bd1)), closes [#28838](https://github.com/ionic-team/ionic-framework/issues/28838)
+* **select:** popover can be scrolled ([#28965](https://github.com/ionic-team/ionic-framework/issues/28965)) ([35ab6b4](https://github.com/ionic-team/ionic-framework/commit/35ab6b4816bd627239de8d8b25ce0c86db8c74b4)), closes [#28963](https://github.com/ionic-team/ionic-framework/issues/28963)
+
+
+
+
+
+# [7.7.0](https://github.com/ionic-team/ionic-framework/compare/v7.6.7...v7.7.0) (2024-01-31)
+
+
+### Features
+
+* add experimental hardware back button support in browsers ([#28705](https://github.com/ionic-team/ionic-framework/issues/28705)) ([658d1ca](https://github.com/ionic-team/ionic-framework/commit/658d1caccd530350843b85c0e24544ec27dd9eb4)), closes [#28703](https://github.com/ionic-team/ionic-framework/issues/28703)
+
+
+
+
+
+## [7.6.7](https://github.com/ionic-team/ionic-framework/compare/v7.6.6...v7.6.7) (2024-01-31)
+
+
+### Bug Fixes
+
+* **accordion:** prevent opening of readonly accordion using keyboard ([#28865](https://github.com/ionic-team/ionic-framework/issues/28865)) ([e10f49c](https://github.com/ionic-team/ionic-framework/commit/e10f49c43daa11fe7deb5a9b9bfd34897542b6b1)), closes [#28344](https://github.com/ionic-team/ionic-framework/issues/28344)
+* **action-sheet, alert, toast:** button roles autocomplete with available options ([#27940](https://github.com/ionic-team/ionic-framework/issues/27940)) ([f6fc22b](https://github.com/ionic-team/ionic-framework/commit/f6fc22bba60388701b80a9421510e3d843d39e9e)), closes [#27965](https://github.com/ionic-team/ionic-framework/issues/27965)
+* **item:** ensure button focus state on property change ([#28892](https://github.com/ionic-team/ionic-framework/issues/28892)) ([bf7922c](https://github.com/ionic-team/ionic-framework/commit/bf7922c8b37b32dbf90650cb74a2e77bedf0c118)), closes [#28525](https://github.com/ionic-team/ionic-framework/issues/28525)
+* **item:** only default slot content wraps ([#28773](https://github.com/ionic-team/ionic-framework/issues/28773)) ([9448783](https://github.com/ionic-team/ionic-framework/commit/9448783bb19b187f867054c86d215e3dc97952c1)), closes [#28769](https://github.com/ionic-team/ionic-framework/issues/28769)
+
+
+
+
+
 ## [7.6.6](https://github.com/ionic-team/ionic-framework/compare/v7.6.5...v7.6.6) (2024-01-24)
 
 
diff --git a/core/CHANGELOG.md b/core/CHANGELOG.md
index de77edeea8..e72d106d9d 100644
--- a/core/CHANGELOG.md
+++ b/core/CHANGELOG.md
@@ -3,6 +3,80 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [7.7.4](https://github.com/ionic-team/ionic-framework/compare/v7.7.3...v7.7.4) (2024-03-06)
+
+
+### Bug Fixes
+
+* **modal:** ariaLabel and role are inherited when set via htmlAttributes ([#29099](https://github.com/ionic-team/ionic-framework/issues/29099)) ([de13633](https://github.com/ionic-team/ionic-framework/commit/de13633a182d963876434db773aa346833f956fd))
+
+
+
+
+
+## [7.7.3](https://github.com/ionic-team/ionic-framework/compare/v7.7.2...v7.7.3) (2024-02-21)
+
+
+### Bug Fixes
+
+* **label:** do not grow when in end slot ([#29036](https://github.com/ionic-team/ionic-framework/issues/29036)) ([1fc4b76](https://github.com/ionic-team/ionic-framework/commit/1fc4b76f5940b38fd89e19561d6b4738dfb8ae5d)), closes [#29033](https://github.com/ionic-team/ionic-framework/issues/29033)
+* **overlays:** focus is returned to last focus element when focusing toast ([#28950](https://github.com/ionic-team/ionic-framework/issues/28950)) ([2ed0ada](https://github.com/ionic-team/ionic-framework/commit/2ed0ada9237b3f4dbf5959746ce2d1744936eebe)), closes [#28261](https://github.com/ionic-team/ionic-framework/issues/28261)
+
+
+
+
+
+## [7.7.2](https://github.com/ionic-team/ionic-framework/compare/v7.7.1...v7.7.2) (2024-02-14)
+
+
+### Bug Fixes
+
+* **overlays:** do not return focus if application has already moved focus manually ([#28850](https://github.com/ionic-team/ionic-framework/issues/28850)) ([a016670](https://github.com/ionic-team/ionic-framework/commit/a016670a8a46e101d23235b17bc8a2081fb992eb)), closes [#28849](https://github.com/ionic-team/ionic-framework/issues/28849)
+* **overlays:** ensure that only topmost overlay is announced by screen readers ([#28997](https://github.com/ionic-team/ionic-framework/issues/28997)) ([ba4ba61](https://github.com/ionic-team/ionic-framework/commit/ba4ba6161c1a6c67f7804b07f49c64ac9ad2b14c)), closes [#23472](https://github.com/ionic-team/ionic-framework/issues/23472)
+* **popover:** render arrow above backdrop ([#28986](https://github.com/ionic-team/ionic-framework/issues/28986)) ([0a8964d](https://github.com/ionic-team/ionic-framework/commit/0a8964d30c76218fe62f7f4aed4f81df7bb80cd0)), closes [#28985](https://github.com/ionic-team/ionic-framework/issues/28985)
+
+
+
+
+
+## [7.7.1](https://github.com/ionic-team/ionic-framework/compare/v7.7.0...v7.7.1) (2024-02-07)
+
+
+### Bug Fixes
+
+* **action-sheet:** iOS dismiss animation respects safe area ([#28915](https://github.com/ionic-team/ionic-framework/issues/28915)) ([7449fb4](https://github.com/ionic-team/ionic-framework/commit/7449fb4fed4048f5d01ba068dc6f8e2d7727e95d)), closes [#28541](https://github.com/ionic-team/ionic-framework/issues/28541)
+* **overlays:** tear down animations after dismiss ([#28907](https://github.com/ionic-team/ionic-framework/issues/28907)) ([950fa40](https://github.com/ionic-team/ionic-framework/commit/950fa40c5597c81d5cbaeb9276b09adfea5e79fb)), closes [#28352](https://github.com/ionic-team/ionic-framework/issues/28352)
+* **select:** popover can be scrolled ([#28965](https://github.com/ionic-team/ionic-framework/issues/28965)) ([35ab6b4](https://github.com/ionic-team/ionic-framework/commit/35ab6b4816bd627239de8d8b25ce0c86db8c74b4)), closes [#28963](https://github.com/ionic-team/ionic-framework/issues/28963)
+
+
+
+
+
+# [7.7.0](https://github.com/ionic-team/ionic-framework/compare/v7.6.7...v7.7.0) (2024-01-31)
+
+
+### Features
+
+* add experimental hardware back button support in browsers ([#28705](https://github.com/ionic-team/ionic-framework/issues/28705)) ([658d1ca](https://github.com/ionic-team/ionic-framework/commit/658d1caccd530350843b85c0e24544ec27dd9eb4)), closes [#28703](https://github.com/ionic-team/ionic-framework/issues/28703)
+
+
+
+
+
+## [7.6.7](https://github.com/ionic-team/ionic-framework/compare/v7.6.6...v7.6.7) (2024-01-31)
+
+
+### Bug Fixes
+
+* **accordion:** prevent opening of readonly accordion using keyboard ([#28865](https://github.com/ionic-team/ionic-framework/issues/28865)) ([e10f49c](https://github.com/ionic-team/ionic-framework/commit/e10f49c43daa11fe7deb5a9b9bfd34897542b6b1)), closes [#28344](https://github.com/ionic-team/ionic-framework/issues/28344)
+* **action-sheet, alert, toast:** button roles autocomplete with available options ([#27940](https://github.com/ionic-team/ionic-framework/issues/27940)) ([f6fc22b](https://github.com/ionic-team/ionic-framework/commit/f6fc22bba60388701b80a9421510e3d843d39e9e)), closes [#27965](https://github.com/ionic-team/ionic-framework/issues/27965)
+* **item:** ensure button focus state on property change ([#28892](https://github.com/ionic-team/ionic-framework/issues/28892)) ([bf7922c](https://github.com/ionic-team/ionic-framework/commit/bf7922c8b37b32dbf90650cb74a2e77bedf0c118)), closes [#28525](https://github.com/ionic-team/ionic-framework/issues/28525)
+* **item:** only default slot content wraps ([#28773](https://github.com/ionic-team/ionic-framework/issues/28773)) ([9448783](https://github.com/ionic-team/ionic-framework/commit/9448783bb19b187f867054c86d215e3dc97952c1)), closes [#28769](https://github.com/ionic-team/ionic-framework/issues/28769)
+
+
+
+
+
 ## [7.6.6](https://github.com/ionic-team/ionic-framework/compare/v7.6.5...v7.6.6) (2024-01-24)
 
 
diff --git a/core/package.json b/core/package.json
index 666905a308..159341ebaa 100644
--- a/core/package.json
+++ b/core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@ionic/core",
-  "version": "7.6.6",
+  "version": "7.7.4",
   "description": "Base components for Ionic",
   "keywords": [
     "ionic",
@@ -31,25 +31,25 @@
     "loader/"
   ],
   "dependencies": {
-    "@stencil/core": "^4.10.0",
+    "@stencil/core": "^4.12.2",
     "ionicons": "^7.2.2",
     "tslib": "^2.1.0"
   },
   "devDependencies": {
-    "@axe-core/playwright": "^4.8.4",
-    "@capacitor/core": "^5.6.0",
-    "@capacitor/haptics": "^5.0.6",
-    "@capacitor/keyboard": "^5.0.7",
-    "@capacitor/status-bar": "^5.0.6",
+    "@axe-core/playwright": "^4.8.5",
+    "@capacitor/core": "^5.7.0",
+    "@capacitor/haptics": "^5.0.7",
+    "@capacitor/keyboard": "^5.0.8",
+    "@capacitor/status-bar": "^5.0.7",
     "@ionic/eslint-config": "^0.3.0",
     "@ionic/prettier-config": "^2.0.0",
     "@jest/core": "^27.5.1",
     "@playwright/test": "^1.39.0",
     "@rollup/plugin-node-resolve": "^8.4.0",
     "@rollup/plugin-virtual": "^2.0.3",
-    "@stencil/angular-output-target": "^0.8.3",
+    "@stencil/angular-output-target": "^0.8.4",
     "@stencil/react-output-target": "^0.5.3",
-    "@stencil/sass": "^3.0.8",
+    "@stencil/sass": "^3.0.9",
     "@stencil/vue-output-target": "^0.8.7",
     "@types/jest": "^27.5.2",
     "@types/node": "^14.6.0",
@@ -66,7 +66,6 @@
     "jest": "^27.5.1",
     "jest-cli": "^27.5.1",
     "prettier": "^2.6.1",
-    "puppeteer": "21.1.1",
     "rollup": "^2.26.4",
     "sass": "^1.33.0",
     "serve": "^14.0.1",
diff --git a/core/src/components.d.ts b/core/src/components.d.ts
index bcea90eeb2..a706eb8971 100644
--- a/core/src/components.d.ts
+++ b/core/src/components.d.ts
@@ -160,7 +160,7 @@ export namespace Components {
         /**
           * Dismiss the action sheet overlay after it has been presented.
           * @param data Any data to emit in the dismiss events.
-          * @param role The role of the element that is dismissing the action sheet. This can be useful in a button handler for determining which button was clicked to dismiss the action sheet. Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.
+          * @param role The role of the element that is dismissing the action sheet. This can be useful in a button handler for determining which button was clicked to dismiss the action sheet. Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.  This is a no-op if the overlay has not been presented yet. If you want to remove an overlay from the DOM that was never presented, use the [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
          */
         "dismiss": (data?: any, role?: string) => Promise<boolean>;
         /**
@@ -239,7 +239,7 @@ export namespace Components {
         /**
           * Dismiss the alert overlay after it has been presented.
           * @param data Any data to emit in the dismiss events.
-          * @param role The role of the element that is dismissing the alert. This can be useful in a button handler for determining which button was clicked to dismiss the alert. Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.
+          * @param role The role of the element that is dismissing the alert. This can be useful in a button handler for determining which button was clicked to dismiss the alert. Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.  This is a no-op if the overlay has not been presented yet. If you want to remove an overlay from the DOM that was never presented, use the [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
          */
         "dismiss": (data?: any, role?: string) => Promise<boolean>;
         /**
@@ -1527,7 +1527,7 @@ export namespace Components {
         /**
           * Dismiss the loading overlay after it has been presented.
           * @param data Any data to emit in the dismiss events.
-          * @param role The role of the element that is dismissing the loading. This can be useful in a button handler for determining which button was clicked to dismiss the loading. Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.
+          * @param role The role of the element that is dismissing the loading. This can be useful in a button handler for determining which button was clicked to dismiss the loading. Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.  This is a no-op if the overlay has not been presented yet. If you want to remove an overlay from the DOM that was never presented, use the [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
          */
         "dismiss": (data?: any, role?: string) => Promise<boolean>;
         /**
@@ -1720,7 +1720,7 @@ export namespace Components {
         /**
           * Dismiss the modal overlay after it has been presented.
           * @param data Any data to emit in the dismiss events.
-          * @param role The role of the element that is dismissing the modal. For example, 'cancel' or 'backdrop'.
+          * @param role The role of the element that is dismissing the modal. For example, 'cancel' or 'backdrop'.  This is a no-op if the overlay has not been presented yet. If you want to remove an overlay from the DOM that was never presented, use the [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
          */
         "dismiss": (data?: any, role?: string) => Promise<boolean>;
         /**
@@ -1973,7 +1973,7 @@ export namespace Components {
         /**
           * Dismiss the picker overlay after it has been presented.
           * @param data Any data to emit in the dismiss events.
-          * @param role The role of the element that is dismissing the picker. This can be useful in a button handler for determining which button was clicked to dismiss the picker. Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.
+          * @param role The role of the element that is dismissing the picker. This can be useful in a button handler for determining which button was clicked to dismiss the picker. Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.  This is a no-op if the overlay has not been presented yet. If you want to remove an overlay from the DOM that was never presented, use the [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
          */
         "dismiss": (data?: any, role?: string) => Promise<boolean>;
         /**
@@ -2110,7 +2110,7 @@ export namespace Components {
           * Dismiss the popover overlay after it has been presented.
           * @param data Any data to emit in the dismiss events.
           * @param role The role of the element that is dismissing the popover. For example, 'cancel' or 'backdrop'.
-          * @param dismissParentPopover If `true`, dismissing this popover will also dismiss a parent popover if this popover is nested. Defaults to `true`.
+          * @param dismissParentPopover If `true`, dismissing this popover will also dismiss a parent popover if this popover is nested. Defaults to `true`.  This is a no-op if the overlay has not been presented yet. If you want to remove an overlay from the DOM that was never presented, use the [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
          */
         "dismiss": (data?: any, role?: string, dismissParentPopover?: boolean) => Promise<boolean>;
         /**
@@ -3111,7 +3111,7 @@ export namespace Components {
         /**
           * Dismiss the toast overlay after it has been presented.
           * @param data Any data to emit in the dismiss events.
-          * @param role The role of the element that is dismissing the toast. This can be useful in a button handler for determining which button was clicked to dismiss the toast. Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.
+          * @param role The role of the element that is dismissing the toast. This can be useful in a button handler for determining which button was clicked to dismiss the toast. Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.  This is a no-op if the overlay has not been presented yet. If you want to remove an overlay from the DOM that was never presented, use the [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
          */
         "dismiss": (data?: any, role?: string) => Promise<boolean>;
         /**
diff --git a/core/src/components/accordion/test/a11y/index.html b/core/src/components/accordion/test/a11y/index.html
index 0c660ef8dd..e8bd7a67e0 100644
--- a/core/src/components/accordion/test/a11y/index.html
+++ b/core/src/components/accordion/test/a11y/index.html
@@ -23,28 +23,22 @@
 
             <ion-list slot="content">
               <ion-item>
-                <ion-label>Name</ion-label>
-                <ion-input type="text"></ion-input>
+                <ion-input label="Name" type="text"></ion-input>
               </ion-item>
               <ion-item>
-                <ion-label>Email</ion-label>
-                <ion-input type="email"></ion-input>
+                <ion-input label="Email" type="email"></ion-input>
               </ion-item>
               <ion-item>
-                <ion-label>Phone</ion-label>
-                <ion-input type="tel"></ion-input>
+                <ion-input label="Phone" type="tel"></ion-input>
               </ion-item>
               <ion-item>
-                <ion-label>Extension</ion-label>
-                <ion-input type="text"></ion-input>
+                <ion-input label="Extension" type="text"></ion-input>
               </ion-item>
               <ion-item>
-                <ion-label>Country</ion-label>
-                <ion-input type="text"></ion-input>
+                <ion-input label="Country" type="text"></ion-input>
               </ion-item>
               <ion-item>
-                <ion-label>City/Province</ion-label>
-                <ion-input type="text"></ion-input>
+                <ion-input label="City/Province" type="text"></ion-input>
               </ion-item>
             </ion-list>
           </ion-accordion>
@@ -56,24 +50,19 @@
 
             <ion-list slot="content">
               <ion-item>
-                <ion-label>Address 1</ion-label>
-                <ion-input type="text"></ion-input>
+                <ion-input label="Address 1" type="text"></ion-input>
               </ion-item>
               <ion-item>
-                <ion-label>Address 2</ion-label>
-                <ion-input type="email"></ion-input>
+                <ion-input label="Address 2" type="email"></ion-input>
               </ion-item>
               <ion-item>
-                <ion-label>City</ion-label>
-                <ion-input type="tel"></ion-input>
+                <ion-input label="City" type="tel"></ion-input>
               </ion-item>
               <ion-item>
-                <ion-label>State</ion-label>
-                <ion-input type="text"></ion-input>
+                <ion-input label="State" type="text"></ion-input>
               </ion-item>
               <ion-item>
-                <ion-label>Zip Code</ion-label>
-                <ion-input type="text"></ion-input>
+                <ion-input label="Zip Code" type="text"></ion-input>
               </ion-item>
             </ion-list>
           </ion-accordion>
@@ -85,24 +74,19 @@
 
             <ion-list slot="content">
               <ion-item>
-                <ion-label>Address 1</ion-label>
-                <ion-input id="address1" type="text"></ion-input>
+                <ion-input label="Address 1" id="address1" type="text"></ion-input>
               </ion-item>
               <ion-item>
-                <ion-label>Address 2</ion-label>
-                <ion-input type="email"></ion-input>
+                <ion-input label="Address 2" type="email"></ion-input>
               </ion-item>
               <ion-item>
-                <ion-label>City</ion-label>
-                <ion-input type="tel"></ion-input>
+                <ion-input label="City" type="tel"></ion-input>
               </ion-item>
               <ion-item>
-                <ion-label>State</ion-label>
-                <ion-input type="text"></ion-input>
+                <ion-input lable="State" type="text"></ion-input>
               </ion-item>
               <ion-item>
-                <ion-label>Zip Code</ion-label>
-                <ion-input type="text"></ion-input>
+                <ion-input label="Zip Code" type="text"></ion-input>
               </ion-item>
             </ion-list>
           </ion-accordion>
diff --git a/core/src/components/action-sheet/action-sheet-interface.ts b/core/src/components/action-sheet/action-sheet-interface.ts
index 465c50e050..1021895d0e 100644
--- a/core/src/components/action-sheet/action-sheet-interface.ts
+++ b/core/src/components/action-sheet/action-sheet-interface.ts
@@ -1,4 +1,4 @@
-import type { AnimationBuilder, Mode } from '../../interface';
+import type { AnimationBuilder, LiteralUnion, Mode } from '../../interface';
 
 export interface ActionSheetOptions {
   header?: string;
@@ -19,7 +19,7 @@ export interface ActionSheetOptions {
 
 export interface ActionSheetButton<T = any> {
   text?: string;
-  role?: 'cancel' | 'destructive' | 'selected' | string;
+  role?: LiteralUnion<'cancel' | 'destructive' | 'selected', string>;
   icon?: string;
   cssClass?: string | string[];
   id?: string;
diff --git a/core/src/components/action-sheet/action-sheet.ios.scss b/core/src/components/action-sheet/action-sheet.ios.scss
index 594b735386..7fd36b1251 100644
--- a/core/src/components/action-sheet/action-sheet.ios.scss
+++ b/core/src/components/action-sheet/action-sheet.ios.scss
@@ -26,7 +26,24 @@
 // ---------------------------------------------------
 
 .action-sheet-wrapper {
-  @include margin(var(--ion-safe-area-top, 0), auto, var(--ion-safe-area-bottom, 0), auto);
+  @include margin(var(--ion-safe-area-top, 0), auto, null, auto);
+  /**
+   * Bottom safe area is applied as padding so that it impacts the bounding box.
+   * When the action sheet is shown/hidden, this element is transformed by translating
+   * 100% of its height. This translation needs to include the bottom safe area
+   * otherwise part of the action sheet will still be visible at the end of
+   * the show transition.
+   *
+   * If this code is changed, reviewers should verify that the action
+   * sheet still translates out of the viewport completely when the bottom
+   * safe area is a positive value.
+   */
+  @include padding(null, null, var(--ion-safe-area-bottom, 0), null);
+
+  // Using content-box to increase the height of the action sheet
+  // wrapper by the bottom padding (safe area) to animate the
+  // action sheet completely off the screen when safe area is set.
+  box-sizing: content-box;
 }
 
 // iOS Action Sheet Container
diff --git a/core/src/components/action-sheet/action-sheet.tsx b/core/src/components/action-sheet/action-sheet.tsx
index 984e24cdaa..223f9cb665 100644
--- a/core/src/components/action-sheet/action-sheet.tsx
+++ b/core/src/components/action-sheet/action-sheet.tsx
@@ -216,6 +216,10 @@ export class ActionSheet implements ComponentInterface, OverlayInterface {
    * This can be useful in a button handler for determining which button was
    * clicked to dismiss the action sheet.
    * Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.
+   *
+   * This is a no-op if the overlay has not been presented yet. If you want
+   * to remove an overlay from the DOM that was never presented, use the
+   * [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
    */
   @Method()
   async dismiss(data?: any, role?: string): Promise<boolean> {
diff --git a/core/src/components/alert/alert-interface.ts b/core/src/components/alert/alert-interface.ts
index 3f9d6cda8d..326d74484d 100644
--- a/core/src/components/alert/alert-interface.ts
+++ b/core/src/components/alert/alert-interface.ts
@@ -1,4 +1,4 @@
-import type { AnimationBuilder, Mode, TextFieldTypes } from '../../interface';
+import type { AnimationBuilder, LiteralUnion, Mode, TextFieldTypes } from '../../interface';
 import type { IonicSafeString } from '../../utils/sanitization';
 
 export interface AlertOptions {
@@ -45,7 +45,7 @@ type AlertButtonOverlayHandler = boolean | void | { [key: string]: any };
 
 export interface AlertButton {
   text: string;
-  role?: 'cancel' | 'destructive' | string;
+  role?: LiteralUnion<'cancel' | 'destructive', string>;
   cssClass?: string | string[];
   id?: string;
   htmlAttributes?: { [key: string]: any };
diff --git a/core/src/components/alert/alert.tsx b/core/src/components/alert/alert.tsx
index 90a1c281bb..3d5a64200c 100644
--- a/core/src/components/alert/alert.tsx
+++ b/core/src/components/alert/alert.tsx
@@ -411,6 +411,10 @@ export class Alert implements ComponentInterface, OverlayInterface {
    * This can be useful in a button handler for determining which button was
    * clicked to dismiss the alert.
    * Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.
+   *
+   * This is a no-op if the overlay has not been presented yet. If you want
+   * to remove an overlay from the DOM that was never presented, use the
+   * [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
    */
   @Method()
   async dismiss(data?: any, role?: string): Promise<boolean> {
diff --git 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
index 53d253c005..4541abc3d6 100644
Binary files a/core/src/components/alert/test/a11y/alert.e2e.ts-snapshots/alert-text-fields-scale-ios-ltr-Mobile-Chrome-linux.png and b/core/src/components/alert/test/a11y/alert.e2e.ts-snapshots/alert-text-fields-scale-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/app/app.tsx b/core/src/components/app/app.tsx
index b0fc4731b3..44a67d2a15 100644
--- a/core/src/components/app/app.tsx
+++ b/core/src/components/app/app.tsx
@@ -1,6 +1,8 @@
 import type { ComponentInterface } from '@stencil/core';
 import { Build, Component, Element, Host, Method, h } from '@stencil/core';
 import type { FocusVisibleUtility } from '@utils/focus-visible';
+import { shoudUseCloseWatcher } from '@utils/hardware-back-button';
+import { printIonWarning } from '@utils/logging';
 import { isPlatform } from '@utils/platform';
 
 import { config } from '../../global/config';
@@ -34,9 +36,20 @@ export class App implements ComponentInterface {
           import('../../utils/input-shims/input-shims').then((module) => module.startInputShims(config, platform));
         }
         const hardwareBackButtonModule = await import('../../utils/hardware-back-button');
-        if (config.getBoolean('hardwareBackButton', isHybrid)) {
+        const supportsHardwareBackButtonEvents = isHybrid || shoudUseCloseWatcher();
+        if (config.getBoolean('hardwareBackButton', supportsHardwareBackButtonEvents)) {
           hardwareBackButtonModule.startHardwareBackButton();
         } else {
+          /**
+           * If an app sets hardwareBackButton: false and experimentalCloseWatcher: true
+           * then the close watcher will not be used.
+           */
+          if (shoudUseCloseWatcher()) {
+            printIonWarning(
+              'experimentalCloseWatcher was set to `true`, but hardwareBackButton was set to `false`. Both config options must be `true` for the Close Watcher API to be used.'
+            );
+          }
+
           hardwareBackButtonModule.blockHardwareBackButton();
         }
         if (typeof (window as any) !== 'undefined') {
diff --git a/core/src/components/checkbox/checkbox.tsx b/core/src/components/checkbox/checkbox.tsx
index ab65f51a83..b05110a245 100644
--- a/core/src/components/checkbox/checkbox.tsx
+++ b/core/src/components/checkbox/checkbox.tsx
@@ -251,6 +251,7 @@ export class Checkbox implements ComponentInterface {
 
     return (
       <Host
+        aria-checked={indeterminate ? 'mixed' : `${checked}`}
         class={createColorClasses(color, {
           [mode]: true,
           'in-item': hostContext('ion-item', el),
diff --git a/core/src/components/checkbox/test/checkbox.spec.ts b/core/src/components/checkbox/test/checkbox.spec.ts
index 5cc256ecd0..e27f0e2a50 100644
--- a/core/src/components/checkbox/test/checkbox.spec.ts
+++ b/core/src/components/checkbox/test/checkbox.spec.ts
@@ -39,3 +39,18 @@ describe('ion-checkbox: disabled', () => {
     expect(checkbox.checked).toBe(false);
   });
 });
+
+describe('ion-checkbox: indeterminate', () => {
+  it('should have a mixed value for aria-checked', async () => {
+    const page = await newSpecPage({
+      components: [Checkbox],
+      html: `
+        <ion-checkbox indeterminate="true">Checkbox</ion-checkbox>
+      `,
+    });
+
+    const checkbox = page.body.querySelector('ion-checkbox')!;
+
+    expect(checkbox.getAttribute('aria-checked')).toBe('mixed');
+  });
+});
diff --git a/core/src/components/datetime-button/test/buttons/index.html b/core/src/components/datetime-button/test/buttons/index.html
index 2b6f1f7bcc..ca484632b9 100644
--- a/core/src/components/datetime-button/test/buttons/index.html
+++ b/core/src/components/datetime-button/test/buttons/index.html
@@ -18,7 +18,7 @@
       </ion-header>
       <ion-content>
         <ion-item>
-          <ion-input value="March 15, 2022 at 12:43 AM"></ion-input>
+          <ion-input aria-label="input" value="March 15, 2022 at 12:43 AM"></ion-input>
           <ion-datetime-button slot="end" id="default-button" datetime="default-datetime">
             <ion-icon color="primary" id="custom-date-button" slot="date-target" name="calendar"></ion-icon>
             <ion-icon color="primary" id="custom-time-button" slot="time-target" name="time"></ion-icon>
diff --git a/core/src/components/datetime-button/test/overlays/datetime-button.e2e.ts-snapshots/datetime-overlay-popover-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/datetime-button/test/overlays/datetime-button.e2e.ts-snapshots/datetime-overlay-popover-ios-ltr-Mobile-Chrome-linux.png
index 02797776be..2a74c8bd7b 100644
Binary files a/core/src/components/datetime-button/test/overlays/datetime-button.e2e.ts-snapshots/datetime-overlay-popover-ios-ltr-Mobile-Chrome-linux.png and b/core/src/components/datetime-button/test/overlays/datetime-button.e2e.ts-snapshots/datetime-overlay-popover-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime-button/test/overlays/datetime-button.e2e.ts-snapshots/datetime-overlay-popover-ios-ltr-Mobile-Safari-linux.png b/core/src/components/datetime-button/test/overlays/datetime-button.e2e.ts-snapshots/datetime-overlay-popover-ios-ltr-Mobile-Safari-linux.png
index c4d1d296ab..2f1ab1a7b1 100644
Binary files a/core/src/components/datetime-button/test/overlays/datetime-button.e2e.ts-snapshots/datetime-overlay-popover-ios-ltr-Mobile-Safari-linux.png and b/core/src/components/datetime-button/test/overlays/datetime-button.e2e.ts-snapshots/datetime-overlay-popover-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/datetime/test/basic/datetime.e2e.ts b/core/src/components/datetime/test/basic/datetime.e2e.ts
index 48b0b0ceec..7d012868cc 100644
--- a/core/src/components/datetime/test/basic/datetime.e2e.ts
+++ b/core/src/components/datetime/test/basic/datetime.e2e.ts
@@ -323,7 +323,12 @@ configs({ modes: ['md'], directions: ['ltr'] }).forEach(({ title, config }) => {
  */
 configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) => {
   test.describe(title('datetime: visibility'), () => {
-    test('should reset month/year interface when hiding datetime', async ({ page }) => {
+    // TODO FW-6015 re-enable on webkit when bug is fixed
+    test('should reset month/year interface when hiding datetime', async ({ page, skip }) => {
+      skip.browser(
+        'webkit',
+        'This is buggy in a headless Linux environment: https://bugs.webkit.org/show_bug.cgi?id=270358'
+      );
       await page.setContent(
         `
         <ion-datetime></ion-datetime>
diff --git a/core/src/components/datetime/test/basic/index.html b/core/src/components/datetime/test/basic/index.html
index 153c85688a..2023b4a119 100644
--- a/core/src/components/datetime/test/basic/index.html
+++ b/core/src/components/datetime/test/basic/index.html
@@ -214,8 +214,7 @@
           <ion-popover class="options-popover" trigger="popover-trigger">
             <ion-list lines="none">
               <ion-item>
-                <ion-label>Dark Mode</ion-label>
-                <ion-checkbox slot="end"></ion-checkbox>
+                <ion-checkbox>Dark Mode</ion-checkbox>
               </ion-item>
               <ion-item detail="true" href="?ionic:mode=ios">
                 <ion-label>iOS Mode</ion-label>
@@ -225,23 +224,19 @@
               </ion-item>
 
               <ion-item>
-                <ion-label>Show Default Title</ion-label>
-                <ion-toggle id="titleToggle"></ion-toggle>
+                <ion-toggle id="titleToggle">Show Default Title</ion-toggle>
               </ion-item>
 
               <ion-item>
-                <ion-label>Show Default Buttons</ion-label>
-                <ion-toggle id="buttonsToggle"></ion-toggle>
+                <ion-toggle id="buttonsToggle">Show Default Buttons</ion-toggle>
               </ion-item>
 
               <ion-item>
-                <ion-label>Locale</ion-label>
-                <ion-input placeholder="default" id="locale"></ion-input>
+                <ion-input label="Locale" placeholder="default" id="locale"></ion-input>
               </ion-item>
 
               <ion-item>
-                <ion-label>Color</ion-label>
-                <ion-select id="color" value="primary">
+                <ion-select label="Color" id="color" value="primary">
                   <ion-select-option value="primary">Primary</ion-select-option>
                   <ion-select-option value="secondary">Secondary</ion-select-option>
                   <ion-select-option value="tertiary">Tertiary</ion-select-option>
diff --git a/core/src/components/datetime/test/position/datetime.e2e.ts-snapshots/datetime-position-popover-md-ltr-Mobile-Chrome-linux.png b/core/src/components/datetime/test/position/datetime.e2e.ts-snapshots/datetime-position-popover-md-ltr-Mobile-Chrome-linux.png
index 5110e8b679..82dbe39213 100644
Binary files a/core/src/components/datetime/test/position/datetime.e2e.ts-snapshots/datetime-position-popover-md-ltr-Mobile-Chrome-linux.png and b/core/src/components/datetime/test/position/datetime.e2e.ts-snapshots/datetime-position-popover-md-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/datetime/test/position/datetime.e2e.ts-snapshots/datetime-position-popover-md-rtl-Mobile-Chrome-linux.png b/core/src/components/datetime/test/position/datetime.e2e.ts-snapshots/datetime-position-popover-md-rtl-Mobile-Chrome-linux.png
index 62e1d096d1..95b4362b34 100644
Binary files a/core/src/components/datetime/test/position/datetime.e2e.ts-snapshots/datetime-position-popover-md-rtl-Mobile-Chrome-linux.png and b/core/src/components/datetime/test/position/datetime.e2e.ts-snapshots/datetime-position-popover-md-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/item/item.tsx b/core/src/components/item/item.tsx
index c6c18d4e98..daec41d83d 100644
--- a/core/src/components/item/item.tsx
+++ b/core/src/components/item/item.tsx
@@ -1,5 +1,5 @@
 import type { ComponentInterface } from '@stencil/core';
-import { Build, Component, Element, Host, Listen, Prop, State, Watch, forceUpdate, h } from '@stencil/core';
+import { Component, Element, Host, Listen, Prop, State, Watch, forceUpdate, h } from '@stencil/core';
 import type { AnchorInterface, ButtonInterface } from '@utils/element-interface';
 import type { Attributes } from '@utils/helpers';
 import { inheritAttributes, raf } from '@utils/helpers';
@@ -358,15 +358,6 @@ export class Item implements ComponentInterface, AnchorInterface, ButtonInterfac
   }
 
   private getFirstInteractive() {
-    if (Build.isTesting) {
-      /**
-       * Pseudo selectors can't be tested in unit tests.
-       * It will cause an error when running the tests.
-       *
-       * TODO: FW-5205 - Remove the build conditional when this is fixed in Stencil
-       */
-      return undefined;
-    }
     const controls = this.el.querySelectorAll<HTMLElement>(
       'ion-toggle:not([disabled]), ion-checkbox:not([disabled]), ion-radio:not([disabled]), ion-select:not([disabled])'
     );
diff --git a/core/src/components/item/test/a11y/index.html b/core/src/components/item/test/a11y/index.html
index 9aad84631c..18fb4d703d 100644
--- a/core/src/components/item/test/a11y/index.html
+++ b/core/src/components/item/test/a11y/index.html
@@ -16,23 +16,19 @@
       <h1>Item</h1>
 
       <ion-item>
-        <ion-label>Item with Input</ion-label>
-        <ion-input placeholder="Placeholder"></ion-input>
+        <ion-input label="Item with Input" placeholder="Placeholder"></ion-input>
       </ion-item>
 
       <ion-item disabled>
-        <ion-label>Item disabled with Input</ion-label>
-        <ion-input placeholder="Placeholder"></ion-input>
+        <ion-input label="Item disabled with Input" placeholder="Placeholder"></ion-input>
       </ion-item>
 
       <ion-item>
-        <ion-label>Item with Input disabled</ion-label>
-        <ion-input placeholder="Placeholder" disabled></ion-input>
+        <ion-input label="Item with Input disabled" placeholder="Placeholder" disabled></ion-input>
       </ion-item>
 
       <ion-item>
-        <ion-label position="floating">Item with Select</ion-label>
-        <ion-select>
+        <ion-select label="Item with Select" label-placement="floating">
           <ion-select-option value="">No Game Console</ion-select-option>
           <ion-select-option value="nes">NES</ion-select-option>
           <ion-select-option value="n64" selected>Nintendo64</ion-select-option>
@@ -44,8 +40,7 @@
       </ion-item>
 
       <ion-item disabled>
-        <ion-label position="floating">Item disabled with Select</ion-label>
-        <ion-select>
+        <ion-select label="Item disabled with Select" label-placement="floating">
           <ion-select-option value="">No Game Console</ion-select-option>
           <ion-select-option value="nes">NES</ion-select-option>
           <ion-select-option value="n64" selected>Nintendo64</ion-select-option>
@@ -57,8 +52,7 @@
       </ion-item>
 
       <ion-item>
-        <ion-label position="floating">Item with Select disabled</ion-label>
-        <ion-select disabled>
+        <ion-select label="Item with Select disabled" label-placement="floating" disabled>
           <ion-select-option value="">No Game Console</ion-select-option>
           <ion-select-option value="nes">NES</ion-select-option>
           <ion-select-option value="n64" selected>Nintendo64</ion-select-option>
@@ -70,33 +64,27 @@
       </ion-item>
 
       <ion-item>
-        <ion-label>Item with Toggle</ion-label>
-        <ion-toggle slot="end"></ion-toggle>
+        <ion-toggle>Item with Toggle</ion-toggle>
       </ion-item>
 
       <ion-item disabled>
-        <ion-label>Item disabled with Toggle</ion-label>
-        <ion-toggle slot="end"></ion-toggle>
+        <ion-toggle>Item disabled with Toggle</ion-toggle>
       </ion-item>
 
       <ion-item>
-        <ion-label>Item with Toggle disabled</ion-label>
-        <ion-toggle slot="end" disabled></ion-toggle>
+        <ion-toggle disabled>Item with Toggle disabled</ion-toggle>
       </ion-item>
 
       <ion-item>
-        <ion-label>Item with Radio</ion-label>
-        <ion-radio slot="start" value="biff"></ion-radio>
+        <ion-radio value="biff">Item with Radio</ion-radio>
       </ion-item>
 
       <ion-item disabled>
-        <ion-label>Item disabled with Radio</ion-label>
-        <ion-radio slot="start" value="biff"></ion-radio>
+        <ion-radio value="biff">Item disabled with Radio</ion-radio>
       </ion-item>
 
       <ion-item>
-        <ion-label>Item with Radio disabled</ion-label>
-        <ion-radio slot="start" value="biff" disabled></ion-radio>
+        <ion-radio value="biff" disabled>Item with Radio disabled</ion-radio>
       </ion-item>
     </main>
   </body>
diff --git a/core/src/components/item/test/basic/index.html b/core/src/components/item/test/basic/index.html
index 7cf4190884..f9d6c77bb7 100644
--- a/core/src/components/item/test/basic/index.html
+++ b/core/src/components/item/test/basic/index.html
@@ -98,8 +98,9 @@
         </ion-item>
 
         <ion-item class="overflow-visible">
-          <ion-label position="fixed">PIN:</ion-label>
           <ion-input
+            label="PIN:"
+            label-placement="fixed"
             type="number"
             pattern="[0-9]*"
             inputmode="numeric"
diff --git a/core/src/components/item/test/basic/item.e2e.ts-snapshots/item-diff-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/item/test/basic/item.e2e.ts-snapshots/item-diff-ios-ltr-Mobile-Chrome-linux.png
index 2bb77a958d..e18f521d98 100644
Binary files a/core/src/components/item/test/basic/item.e2e.ts-snapshots/item-diff-ios-ltr-Mobile-Chrome-linux.png and b/core/src/components/item/test/basic/item.e2e.ts-snapshots/item-diff-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/item/test/basic/item.e2e.ts-snapshots/item-diff-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/item/test/basic/item.e2e.ts-snapshots/item-diff-ios-ltr-Mobile-Firefox-linux.png
index 776ba9931a..8b98359d13 100644
Binary files a/core/src/components/item/test/basic/item.e2e.ts-snapshots/item-diff-ios-ltr-Mobile-Firefox-linux.png and b/core/src/components/item/test/basic/item.e2e.ts-snapshots/item-diff-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/item/test/basic/item.e2e.ts-snapshots/item-diff-ios-ltr-Mobile-Safari-linux.png b/core/src/components/item/test/basic/item.e2e.ts-snapshots/item-diff-ios-ltr-Mobile-Safari-linux.png
index 4d3dcfbc92..26278598cd 100644
Binary files a/core/src/components/item/test/basic/item.e2e.ts-snapshots/item-diff-ios-ltr-Mobile-Safari-linux.png and b/core/src/components/item/test/basic/item.e2e.ts-snapshots/item-diff-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/item/test/basic/item.e2e.ts-snapshots/item-diff-ios-rtl-Mobile-Chrome-linux.png b/core/src/components/item/test/basic/item.e2e.ts-snapshots/item-diff-ios-rtl-Mobile-Chrome-linux.png
index add60e8bc4..1bf9af4e2b 100644
Binary files a/core/src/components/item/test/basic/item.e2e.ts-snapshots/item-diff-ios-rtl-Mobile-Chrome-linux.png and b/core/src/components/item/test/basic/item.e2e.ts-snapshots/item-diff-ios-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/item/test/basic/item.e2e.ts-snapshots/item-diff-ios-rtl-Mobile-Firefox-linux.png b/core/src/components/item/test/basic/item.e2e.ts-snapshots/item-diff-ios-rtl-Mobile-Firefox-linux.png
index 54659326fd..6ebbba8602 100644
Binary files a/core/src/components/item/test/basic/item.e2e.ts-snapshots/item-diff-ios-rtl-Mobile-Firefox-linux.png and b/core/src/components/item/test/basic/item.e2e.ts-snapshots/item-diff-ios-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/item/test/basic/item.e2e.ts-snapshots/item-diff-ios-rtl-Mobile-Safari-linux.png b/core/src/components/item/test/basic/item.e2e.ts-snapshots/item-diff-ios-rtl-Mobile-Safari-linux.png
index 15d421905f..67ab13d397 100644
Binary files a/core/src/components/item/test/basic/item.e2e.ts-snapshots/item-diff-ios-rtl-Mobile-Safari-linux.png and b/core/src/components/item/test/basic/item.e2e.ts-snapshots/item-diff-ios-rtl-Mobile-Safari-linux.png differ
diff --git a/core/src/components/item/test/basic/item.e2e.ts-snapshots/item-diff-md-ltr-Mobile-Chrome-linux.png b/core/src/components/item/test/basic/item.e2e.ts-snapshots/item-diff-md-ltr-Mobile-Chrome-linux.png
index f56e0edd01..caa7c6c7a6 100644
Binary files a/core/src/components/item/test/basic/item.e2e.ts-snapshots/item-diff-md-ltr-Mobile-Chrome-linux.png and b/core/src/components/item/test/basic/item.e2e.ts-snapshots/item-diff-md-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/item/test/basic/item.e2e.ts-snapshots/item-diff-md-ltr-Mobile-Firefox-linux.png b/core/src/components/item/test/basic/item.e2e.ts-snapshots/item-diff-md-ltr-Mobile-Firefox-linux.png
index b735a62705..6f11eb1360 100644
Binary files a/core/src/components/item/test/basic/item.e2e.ts-snapshots/item-diff-md-ltr-Mobile-Firefox-linux.png and b/core/src/components/item/test/basic/item.e2e.ts-snapshots/item-diff-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/item/test/basic/item.e2e.ts-snapshots/item-diff-md-ltr-Mobile-Safari-linux.png b/core/src/components/item/test/basic/item.e2e.ts-snapshots/item-diff-md-ltr-Mobile-Safari-linux.png
index 6b7d301bdc..6af90ebc4c 100644
Binary files a/core/src/components/item/test/basic/item.e2e.ts-snapshots/item-diff-md-ltr-Mobile-Safari-linux.png and b/core/src/components/item/test/basic/item.e2e.ts-snapshots/item-diff-md-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/item/test/basic/item.e2e.ts-snapshots/item-diff-md-rtl-Mobile-Chrome-linux.png b/core/src/components/item/test/basic/item.e2e.ts-snapshots/item-diff-md-rtl-Mobile-Chrome-linux.png
index 13667c902e..fe8bae5172 100644
Binary files a/core/src/components/item/test/basic/item.e2e.ts-snapshots/item-diff-md-rtl-Mobile-Chrome-linux.png and b/core/src/components/item/test/basic/item.e2e.ts-snapshots/item-diff-md-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/item/test/basic/item.e2e.ts-snapshots/item-diff-md-rtl-Mobile-Firefox-linux.png b/core/src/components/item/test/basic/item.e2e.ts-snapshots/item-diff-md-rtl-Mobile-Firefox-linux.png
index 562db67a1e..e36096b2ca 100644
Binary files a/core/src/components/item/test/basic/item.e2e.ts-snapshots/item-diff-md-rtl-Mobile-Firefox-linux.png and b/core/src/components/item/test/basic/item.e2e.ts-snapshots/item-diff-md-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/item/test/basic/item.e2e.ts-snapshots/item-diff-md-rtl-Mobile-Safari-linux.png b/core/src/components/item/test/basic/item.e2e.ts-snapshots/item-diff-md-rtl-Mobile-Safari-linux.png
index fb9b335b40..e74e7de747 100644
Binary files a/core/src/components/item/test/basic/item.e2e.ts-snapshots/item-diff-md-rtl-Mobile-Safari-linux.png and b/core/src/components/item/test/basic/item.e2e.ts-snapshots/item-diff-md-rtl-Mobile-Safari-linux.png differ
diff --git a/core/src/components/item/test/bottom/index.html b/core/src/components/item/test/bottom/index.html
index d9266eb847..f89740008b 100644
--- a/core/src/components/item/test/bottom/index.html
+++ b/core/src/components/item/test/bottom/index.html
@@ -31,32 +31,27 @@
       <ion-content class="ion-padding-vertical">
         <ion-list class="basic">
           <ion-item>
-            <ion-label>No Helper/Error</ion-label>
-            <ion-input name="input" id="text"></ion-input>
+            <ion-input label="No Helper/Error" name="input" id="text"></ion-input>
           </ion-item>
 
           <ion-item>
-            <ion-label>Helper and Error</ion-label>
-            <ion-input></ion-input>
+            <ion-input label="Helper and Error"></ion-input>
             <ion-note slot="helper">Helper Text</ion-note>
             <ion-note slot="error">Error Text</ion-note>
           </ion-item>
 
           <ion-item>
-            <ion-label>Helper Only</ion-label>
-            <ion-input></ion-input>
+            <ion-input label="Helper Only"></ion-input>
             <ion-note slot="helper">Helper Text</ion-note>
           </ion-item>
 
           <ion-item>
-            <ion-label>Error Only</ion-label>
-            <ion-input></ion-input>
+            <ion-input label="Error Only"></ion-input>
             <ion-note slot="error">Error Text</ion-note>
           </ion-item>
 
           <ion-item class="custom">
-            <ion-label>Both w/ Custom CSS</ion-label>
-            <ion-input></ion-input>
+            <ion-input label="Both w/ Custom CSS"></ion-input>
             <ion-note slot="helper">Helper Text</ion-note>
             <ion-note slot="error">Error Text</ion-note>
           </ion-item>
@@ -66,16 +61,14 @@
           <ion-row>
             <ion-col>
               <ion-item fill="solid">
-                <ion-label>Helper and Error (Fill Solid)</ion-label>
-                <ion-input></ion-input>
+                <ion-input label="Helper and Error (Fill Solid)"></ion-input>
                 <ion-note slot="helper">Helper Text</ion-note>
                 <ion-note slot="error">Error Text</ion-note>
               </ion-item>
             </ion-col>
             <ion-col>
               <ion-item fill="outline">
-                <ion-label>Helper and Error (Fill Outline)</ion-label>
-                <ion-input></ion-input>
+                <ion-input label="Helper and Error (Fill Outline)"></ion-input>
                 <ion-note slot="helper">Helper Text</ion-note>
                 <ion-note slot="error">Error Text</ion-note>
               </ion-item>
@@ -84,8 +77,7 @@
           <ion-row>
             <ion-col>
               <ion-item>
-                <ion-label>Toggle Error</ion-label>
-                <ion-toggle slot="start" id="error-toggle" color="danger"></ion-toggle>
+                <ion-toggle id="error-toggle" color="danger">Toggle Error</ion-toggle>
               </ion-item>
             </ion-col>
           </ion-row>
diff --git a/core/src/components/item/test/counter/item.e2e.ts-snapshots/item-counter-diff-md-ltr-Mobile-Firefox-linux.png b/core/src/components/item/test/counter/item.e2e.ts-snapshots/item-counter-diff-md-ltr-Mobile-Firefox-linux.png
index 6d1b1acb87..b7f3579a70 100644
Binary files a/core/src/components/item/test/counter/item.e2e.ts-snapshots/item-counter-diff-md-ltr-Mobile-Firefox-linux.png and b/core/src/components/item/test/counter/item.e2e.ts-snapshots/item-counter-diff-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/item/test/counter/item.e2e.ts-snapshots/item-counter-diff-md-rtl-Mobile-Firefox-linux.png b/core/src/components/item/test/counter/item.e2e.ts-snapshots/item-counter-diff-md-rtl-Mobile-Firefox-linux.png
index a290ec8933..1945384053 100644
Binary files a/core/src/components/item/test/counter/item.e2e.ts-snapshots/item-counter-diff-md-rtl-Mobile-Firefox-linux.png and b/core/src/components/item/test/counter/item.e2e.ts-snapshots/item-counter-diff-md-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/item/test/inputs/index.html b/core/src/components/item/test/inputs/index.html
index 5ebe75aea7..ac621ee8b5 100644
--- a/core/src/components/item/test/inputs/index.html
+++ b/core/src/components/item/test/inputs/index.html
@@ -39,18 +39,6 @@
               <ion-item id="btnUndefinedValue" button="true" onclick="setUndefinedValue()">
                 <ion-label>Set "undefined" values</ion-label>
               </ion-item>
-              <ion-item id="btnLabelsDefault" button="true" onclick="setLabelDefault()">
-                <ion-label>Labels: Default</ion-label>
-              </ion-item>
-              <ion-item id="btnLabelsFloating" button="true" onclick="setLabelFloating()">
-                <ion-label>Labels: Floating</ion-label>
-              </ion-item>
-              <ion-item id="btnLabelsStacked" button="true" onclick="setLabelStacked()">
-                <ion-label>Labels: Stacked</ion-label>
-              </ion-item>
-              <ion-item id="btnLabelsFixed" button="true" onclick="setLabelFixed()">
-                <ion-label>Labels: Fixed</ion-label>
-              </ion-item>
             </ion-list>
           </ion-popover>
         </ion-toolbar>
@@ -60,28 +48,23 @@
         <form onsubmit="return onSubmit(event)">
           <ion-list>
             <ion-item>
-              <ion-label>Input</ion-label>
-              <ion-input name="input" id="input" placeholder="Input"></ion-input>
+              <ion-input label="Input" name="input" id="input" placeholder="Input"></ion-input>
             </ion-item>
 
             <ion-item>
-              <ion-label>Textarea</ion-label>
-              <ion-textarea name="textarea" id="textarea" placeholder="Textarea"></ion-textarea>
+              <ion-textarea label="Textarea" name="textarea" id="textarea" placeholder="Textarea"></ion-textarea>
             </ion-item>
 
             <ion-item>
-              <ion-label>Toggle</ion-label>
-              <ion-toggle name="toggle" id="toggle" slot="end"></ion-toggle>
+              <ion-toggle name="toggle" id="toggle">Toggle</ion-toggle>
             </ion-item>
 
             <ion-item>
-              <ion-label>Checkbox</ion-label>
-              <ion-checkbox name="checkbox" id="checkbox" slot="end"></ion-checkbox>
+              <ion-checkbox name="checkbox" id="checkbox">Checkbox</ion-checkbox>
             </ion-item>
 
             <ion-item>
-              <ion-label>Select</ion-label>
-              <ion-select name="select" id="select" placeholder="Select">
+              <ion-select label="Select" name="select" id="select" placeholder="Select">
                 <ion-select-option value="1">1</ion-select-option>
                 <ion-select-option value="2">2</ion-select-option>
                 <ion-select-option value="3">3</ion-select-option>
@@ -93,8 +76,7 @@
             </ion-item>
 
             <ion-item>
-              <ion-label>Range</ion-label>
-              <ion-range name="range" id="range" value="10"></ion-range>
+              <ion-range label="Range" name="range" id="range" value="10"></ion-range>
             </ion-item>
           </ion-list>
 
@@ -147,28 +129,6 @@
         toggle.checked = checkbox.checked = false;
       }
 
-      function setLabelDefault() {
-        setLabelPosition(undefined);
-      }
-
-      function setLabelFixed() {
-        setLabelPosition('fixed');
-      }
-
-      function setLabelFloating() {
-        setLabelPosition('floating');
-      }
-
-      function setLabelStacked() {
-        setLabelPosition('stacked');
-      }
-
-      function setLabelPosition(position) {
-        Array.from(document.querySelectorAll('form ion-list ion-label')).forEach(
-          (label) => (label.position = position)
-        );
-      }
-
       function getFormControls() {
         return formControlIds.reduce((acc, id) => {
           acc[id] = document.querySelector(`#${id}`);
diff --git a/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-disabled-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-disabled-ios-ltr-Mobile-Chrome-linux.png
index 16fde476d9..5e648162f2 100644
Binary files a/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-disabled-ios-ltr-Mobile-Chrome-linux.png and b/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-disabled-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-disabled-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-disabled-ios-ltr-Mobile-Firefox-linux.png
index f379936b30..0e5120ef3a 100644
Binary files a/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-disabled-ios-ltr-Mobile-Firefox-linux.png and b/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-disabled-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-disabled-ios-ltr-Mobile-Safari-linux.png b/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-disabled-ios-ltr-Mobile-Safari-linux.png
index e536ff2645..b2eb163808 100644
Binary files a/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-disabled-ios-ltr-Mobile-Safari-linux.png and b/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-disabled-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-disabled-md-ltr-Mobile-Chrome-linux.png b/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-disabled-md-ltr-Mobile-Chrome-linux.png
index c9d778fa32..6f30797958 100644
Binary files a/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-disabled-md-ltr-Mobile-Chrome-linux.png and b/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-disabled-md-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-disabled-md-ltr-Mobile-Firefox-linux.png b/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-disabled-md-ltr-Mobile-Firefox-linux.png
index 44175208bd..8387345917 100644
Binary files a/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-disabled-md-ltr-Mobile-Firefox-linux.png and b/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-disabled-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-disabled-md-ltr-Mobile-Safari-linux.png b/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-disabled-md-ltr-Mobile-Safari-linux.png
index 574268ee6b..a19e84eca2 100644
Binary files a/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-disabled-md-ltr-Mobile-Safari-linux.png and b/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-disabled-md-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-ios-ltr-Mobile-Chrome-linux.png
index 2c7ff81cf5..81ca424c02 100644
Binary files a/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-ios-ltr-Mobile-Chrome-linux.png and b/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-ios-ltr-Mobile-Firefox-linux.png
index 880e336696..c207a965ea 100644
Binary files a/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-ios-ltr-Mobile-Firefox-linux.png and b/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-ios-ltr-Mobile-Safari-linux.png b/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-ios-ltr-Mobile-Safari-linux.png
index f0761cbf21..395057523d 100644
Binary files a/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-ios-ltr-Mobile-Safari-linux.png and b/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-ios-rtl-Mobile-Chrome-linux.png b/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-ios-rtl-Mobile-Chrome-linux.png
index 580f45a23b..2556440e69 100644
Binary files a/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-ios-rtl-Mobile-Chrome-linux.png and b/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-ios-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-ios-rtl-Mobile-Firefox-linux.png b/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-ios-rtl-Mobile-Firefox-linux.png
index 473ed40edd..255d73002b 100644
Binary files a/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-ios-rtl-Mobile-Firefox-linux.png and b/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-ios-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-ios-rtl-Mobile-Safari-linux.png b/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-ios-rtl-Mobile-Safari-linux.png
index 2f1a7f6454..4c8b6eee54 100644
Binary files a/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-ios-rtl-Mobile-Safari-linux.png and b/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-ios-rtl-Mobile-Safari-linux.png differ
diff --git a/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-md-ltr-Mobile-Chrome-linux.png b/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-md-ltr-Mobile-Chrome-linux.png
index a7d5fd0025..1dd3849bdf 100644
Binary files a/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-md-ltr-Mobile-Chrome-linux.png and b/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-md-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-md-ltr-Mobile-Firefox-linux.png b/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-md-ltr-Mobile-Firefox-linux.png
index 96d4a99df3..cfa42148a7 100644
Binary files a/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-md-ltr-Mobile-Firefox-linux.png and b/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-md-ltr-Mobile-Safari-linux.png b/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-md-ltr-Mobile-Safari-linux.png
index 7142199241..4984cd298e 100644
Binary files a/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-md-ltr-Mobile-Safari-linux.png and b/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-md-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-md-rtl-Mobile-Chrome-linux.png b/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-md-rtl-Mobile-Chrome-linux.png
index 5035d0f130..164c214e50 100644
Binary files a/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-md-rtl-Mobile-Chrome-linux.png and b/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-md-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-md-rtl-Mobile-Firefox-linux.png b/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-md-rtl-Mobile-Firefox-linux.png
index a48d9a8197..dccd74ec01 100644
Binary files a/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-md-rtl-Mobile-Firefox-linux.png and b/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-md-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-md-rtl-Mobile-Safari-linux.png b/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-md-rtl-Mobile-Safari-linux.png
index 0859a1f250..d50fce3976 100644
Binary files a/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-md-rtl-Mobile-Safari-linux.png and b/core/src/components/item/test/inputs/item.e2e.ts-snapshots/item-inputs-md-rtl-Mobile-Safari-linux.png differ
diff --git a/core/src/components/item/test/slotted-inputs/item.e2e.ts-snapshots/item-slotted-inputs-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/item/test/slotted-inputs/item.e2e.ts-snapshots/item-slotted-inputs-ios-ltr-Mobile-Chrome-linux.png
index 9afb2ddc75..45d1ea38db 100644
Binary files a/core/src/components/item/test/slotted-inputs/item.e2e.ts-snapshots/item-slotted-inputs-ios-ltr-Mobile-Chrome-linux.png and b/core/src/components/item/test/slotted-inputs/item.e2e.ts-snapshots/item-slotted-inputs-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/item/test/slotted-inputs/item.e2e.ts-snapshots/item-slotted-inputs-ios-rtl-Mobile-Chrome-linux.png b/core/src/components/item/test/slotted-inputs/item.e2e.ts-snapshots/item-slotted-inputs-ios-rtl-Mobile-Chrome-linux.png
index e63f4f98e4..cc037dbfa9 100644
Binary files a/core/src/components/item/test/slotted-inputs/item.e2e.ts-snapshots/item-slotted-inputs-ios-rtl-Mobile-Chrome-linux.png and b/core/src/components/item/test/slotted-inputs/item.e2e.ts-snapshots/item-slotted-inputs-ios-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/item/test/slotted-inputs/item.e2e.ts-snapshots/item-slotted-inputs-md-ltr-Mobile-Chrome-linux.png b/core/src/components/item/test/slotted-inputs/item.e2e.ts-snapshots/item-slotted-inputs-md-ltr-Mobile-Chrome-linux.png
index 3c34d8be78..d8e27a2d23 100644
Binary files a/core/src/components/item/test/slotted-inputs/item.e2e.ts-snapshots/item-slotted-inputs-md-ltr-Mobile-Chrome-linux.png and b/core/src/components/item/test/slotted-inputs/item.e2e.ts-snapshots/item-slotted-inputs-md-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/item/test/slotted-inputs/item.e2e.ts-snapshots/item-slotted-inputs-md-rtl-Mobile-Chrome-linux.png b/core/src/components/item/test/slotted-inputs/item.e2e.ts-snapshots/item-slotted-inputs-md-rtl-Mobile-Chrome-linux.png
index 8a7f9c7e57..f30d869eb1 100644
Binary files a/core/src/components/item/test/slotted-inputs/item.e2e.ts-snapshots/item-slotted-inputs-md-rtl-Mobile-Chrome-linux.png and b/core/src/components/item/test/slotted-inputs/item.e2e.ts-snapshots/item-slotted-inputs-md-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/label/label.scss b/core/src/components/label/label.scss
index ff3e372bf5..fc197ef171 100644
--- a/core/src/components/label/label.scss
+++ b/core/src/components/label/label.scss
@@ -29,14 +29,6 @@
   overflow: hidden;
 }
 
-// TODO(FW-5289): move to :host-context(.item)
-// Shouldn't need :not(.item-input) as this was
-// only needed because of the specificity with
-// :not(.item-legacy)
-:host-context(.item:not(.item-input):not(.item-legacy)) {
-  flex-grow: 1;
-}
-
 :host(.ion-color) {
   color: current-color(base);
 }
diff --git a/core/src/components/label/test/basic/index.html b/core/src/components/label/test/basic/index.html
index 96fba62ee2..ed1a9cca2f 100644
--- a/core/src/components/label/test/basic/index.html
+++ b/core/src/components/label/test/basic/index.html
@@ -41,58 +41,45 @@
         <ion-list>
           <ion-item>
             <ion-label>Default</ion-label>
-            <ion-input></ion-input>
           </ion-item>
           <ion-item>
             <ion-label color="tertiary">Tertiary</ion-label>
-            <ion-input></ion-input>
           </ion-item>
           <ion-item>
             <ion-label class="custom">Custom</ion-label>
-            <ion-input></ion-input>
           </ion-item>
           <ion-item>
             <ion-label class="ion-text-wrap">Wrap label this label just goes on and on and on</ion-label>
-            <ion-input></ion-input>
           </ion-item>
           <ion-item>
             <ion-label position="fixed">Fixed</ion-label>
-            <ion-input></ion-input>
           </ion-item>
           <ion-item>
             <ion-label position="floating">Floating</ion-label>
-            <ion-input></ion-input>
           </ion-item>
           <ion-item class="floating-color">
             <ion-label position="floating" color="success">Floating: Success</ion-label>
-            <ion-input></ion-input>
           </ion-item>
           <ion-item>
             <ion-label position="stacked">Stacked</ion-label>
-            <ion-input></ion-input>
           </ion-item>
           <ion-item class="stacked-color">
             <ion-label position="stacked" color="danger">Stacked: Danger</ion-label>
-            <ion-input></ion-input>
           </ion-item>
         </ion-list>
 
         <ion-list>
           <ion-item color="tertiary">
             <ion-label position="floating">(Item: Tertiary) Floating</ion-label>
-            <ion-input></ion-input>
           </ion-item>
           <ion-item color="primary">
             <ion-label position="stacked">(Item: Primary) Stacked</ion-label>
-            <ion-input></ion-input>
           </ion-item>
           <ion-item class="floating-color" color="tertiary">
             <ion-label position="floating" color="success">(Item: Tertiary) Floating: Success</ion-label>
-            <ion-input></ion-input>
           </ion-item>
           <ion-item class="stacked-color" color="primary">
             <ion-label position="stacked" color="danger">(Item: Primary) Stacked: Danger</ion-label>
-            <ion-input></ion-input>
           </ion-item>
         </ion-list>
       </ion-content>
diff --git a/core/src/components/label/test/basic/label.e2e.ts b/core/src/components/label/test/basic/label.e2e.ts
index ca94e838c2..1deda11054 100644
--- a/core/src/components/label/test/basic/label.e2e.ts
+++ b/core/src/components/label/test/basic/label.e2e.ts
@@ -34,7 +34,7 @@ configs().forEach(({ title, screenshot, config }) => {
         `
         <ion-item>
           <ion-label position="stacked">My Label</ion-label>
-          <ion-input></ion-input>
+          <ion-input aria-label="My Label"></ion-input>
         </ion-item>
       `,
         config
@@ -49,7 +49,7 @@ configs().forEach(({ title, screenshot, config }) => {
         `
         <ion-item>
           <ion-label position="floating">My Label</ion-label>
-          <ion-input></ion-input>
+          <ion-input aria-label="My Label"></ion-input>
         </ion-item>
       `,
         config
diff --git a/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-floating-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-floating-ios-ltr-Mobile-Chrome-linux.png
index edb9248e27..6a9650d046 100644
Binary files a/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-floating-ios-ltr-Mobile-Chrome-linux.png and b/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-floating-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-floating-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-floating-ios-ltr-Mobile-Firefox-linux.png
index 5acaeaa207..045042d578 100644
Binary files a/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-floating-ios-ltr-Mobile-Firefox-linux.png and b/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-floating-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-floating-ios-ltr-Mobile-Safari-linux.png b/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-floating-ios-ltr-Mobile-Safari-linux.png
index cadad3801b..6b7c624c4f 100644
Binary files a/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-floating-ios-ltr-Mobile-Safari-linux.png and b/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-floating-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-floating-ios-rtl-Mobile-Chrome-linux.png b/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-floating-ios-rtl-Mobile-Chrome-linux.png
index cb646a9425..a0685d23f3 100644
Binary files a/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-floating-ios-rtl-Mobile-Chrome-linux.png and b/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-floating-ios-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-floating-ios-rtl-Mobile-Firefox-linux.png b/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-floating-ios-rtl-Mobile-Firefox-linux.png
index 6b487599b3..93fbaba368 100644
Binary files a/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-floating-ios-rtl-Mobile-Firefox-linux.png and b/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-floating-ios-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-floating-ios-rtl-Mobile-Safari-linux.png b/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-floating-ios-rtl-Mobile-Safari-linux.png
index 0d2a55d37b..9ec079e602 100644
Binary files a/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-floating-ios-rtl-Mobile-Safari-linux.png and b/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-floating-ios-rtl-Mobile-Safari-linux.png differ
diff --git a/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-floating-md-ltr-Mobile-Chrome-linux.png b/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-floating-md-ltr-Mobile-Chrome-linux.png
index 43f5ec6a9d..3ef7959c87 100644
Binary files a/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-floating-md-ltr-Mobile-Chrome-linux.png and b/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-floating-md-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-floating-md-ltr-Mobile-Firefox-linux.png b/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-floating-md-ltr-Mobile-Firefox-linux.png
index d9f5cd86f5..d7c0b7364c 100644
Binary files a/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-floating-md-ltr-Mobile-Firefox-linux.png and b/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-floating-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-floating-md-ltr-Mobile-Safari-linux.png b/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-floating-md-ltr-Mobile-Safari-linux.png
index 13a83f03ab..a98ea9c069 100644
Binary files a/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-floating-md-ltr-Mobile-Safari-linux.png and b/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-floating-md-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-floating-md-rtl-Mobile-Chrome-linux.png b/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-floating-md-rtl-Mobile-Chrome-linux.png
index cc31a39683..cbdd36e066 100644
Binary files a/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-floating-md-rtl-Mobile-Chrome-linux.png and b/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-floating-md-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-floating-md-rtl-Mobile-Firefox-linux.png b/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-floating-md-rtl-Mobile-Firefox-linux.png
index dd1a12c946..efffe566ad 100644
Binary files a/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-floating-md-rtl-Mobile-Firefox-linux.png and b/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-floating-md-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-floating-md-rtl-Mobile-Safari-linux.png b/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-floating-md-rtl-Mobile-Safari-linux.png
index 04e0503386..bdc5dcbc8e 100644
Binary files a/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-floating-md-rtl-Mobile-Safari-linux.png and b/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-floating-md-rtl-Mobile-Safari-linux.png differ
diff --git a/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-stacked-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-stacked-ios-ltr-Mobile-Chrome-linux.png
index c85e47860a..749245a24a 100644
Binary files a/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-stacked-ios-ltr-Mobile-Chrome-linux.png and b/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-stacked-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-stacked-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-stacked-ios-ltr-Mobile-Firefox-linux.png
index f5bec426b1..1c407de0a6 100644
Binary files a/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-stacked-ios-ltr-Mobile-Firefox-linux.png and b/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-stacked-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-stacked-ios-ltr-Mobile-Safari-linux.png b/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-stacked-ios-ltr-Mobile-Safari-linux.png
index db396488df..27f590db1c 100644
Binary files a/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-stacked-ios-ltr-Mobile-Safari-linux.png and b/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-stacked-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-stacked-ios-rtl-Mobile-Chrome-linux.png b/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-stacked-ios-rtl-Mobile-Chrome-linux.png
index cd189d2e9e..3fc6a3b935 100644
Binary files a/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-stacked-ios-rtl-Mobile-Chrome-linux.png and b/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-stacked-ios-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-stacked-ios-rtl-Mobile-Firefox-linux.png b/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-stacked-ios-rtl-Mobile-Firefox-linux.png
index dbe831dca4..220043b818 100644
Binary files a/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-stacked-ios-rtl-Mobile-Firefox-linux.png and b/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-stacked-ios-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-stacked-ios-rtl-Mobile-Safari-linux.png b/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-stacked-ios-rtl-Mobile-Safari-linux.png
index d279b6a4a2..9deda169e2 100644
Binary files a/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-stacked-ios-rtl-Mobile-Safari-linux.png and b/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-stacked-ios-rtl-Mobile-Safari-linux.png differ
diff --git a/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-stacked-md-ltr-Mobile-Chrome-linux.png b/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-stacked-md-ltr-Mobile-Chrome-linux.png
index 367a766a13..fd1496a11f 100644
Binary files a/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-stacked-md-ltr-Mobile-Chrome-linux.png and b/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-stacked-md-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-stacked-md-ltr-Mobile-Firefox-linux.png b/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-stacked-md-ltr-Mobile-Firefox-linux.png
index ec3a667863..8d847d79d8 100644
Binary files a/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-stacked-md-ltr-Mobile-Firefox-linux.png and b/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-stacked-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-stacked-md-ltr-Mobile-Safari-linux.png b/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-stacked-md-ltr-Mobile-Safari-linux.png
index 81c44f7edc..f473cdbe52 100644
Binary files a/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-stacked-md-ltr-Mobile-Safari-linux.png and b/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-stacked-md-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-stacked-md-rtl-Mobile-Chrome-linux.png b/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-stacked-md-rtl-Mobile-Chrome-linux.png
index 9213ffad0b..885612a082 100644
Binary files a/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-stacked-md-rtl-Mobile-Chrome-linux.png and b/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-stacked-md-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-stacked-md-rtl-Mobile-Firefox-linux.png b/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-stacked-md-rtl-Mobile-Firefox-linux.png
index 659828a08b..24c74da1c2 100644
Binary files a/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-stacked-md-rtl-Mobile-Firefox-linux.png and b/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-stacked-md-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-stacked-md-rtl-Mobile-Safari-linux.png b/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-stacked-md-rtl-Mobile-Safari-linux.png
index 2ecff7a635..51aaf2c28e 100644
Binary files a/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-stacked-md-rtl-Mobile-Safari-linux.png and b/core/src/components/label/test/basic/label.e2e.ts-snapshots/label-stacked-md-rtl-Mobile-Safari-linux.png differ
diff --git a/core/src/components/label/test/item/item.e2e.ts b/core/src/components/label/test/item/item.e2e.ts
new file mode 100644
index 0000000000..aa14200707
--- /dev/null
+++ b/core/src/components/label/test/item/item.e2e.ts
@@ -0,0 +1,27 @@
+import { expect } from '@playwright/test';
+import { configs, test } from '@utils/test/playwright';
+
+configs({ directions: ['ltr'] }).forEach(({ title, screenshot, config }) => {
+  test.describe(title('label: in item'), () => {
+    test('should render correctly in an item', async ({ page }) => {
+      test.info().annotations.push({
+        type: 'issue',
+        description: 'https://github.com/ionic-team/ionic-framework/issues/29033',
+      });
+      await page.setContent(
+        `
+        <ion-item>
+          <ion-label slot="start">Start</ion-label>
+          <ion-label>Default</ion-label>
+          <ion-label slot="end">End</ion-label>
+        </ion-item>
+        `,
+        config
+      );
+
+      const item = page.locator('ion-item');
+
+      await expect(item).toHaveScreenshot(screenshot(`label-item`));
+    });
+  });
+});
diff --git a/core/src/components/label/test/item/item.e2e.ts-snapshots/label-item-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/label/test/item/item.e2e.ts-snapshots/label-item-ios-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..22bb5edec9
Binary files /dev/null and b/core/src/components/label/test/item/item.e2e.ts-snapshots/label-item-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/label/test/item/item.e2e.ts-snapshots/label-item-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/label/test/item/item.e2e.ts-snapshots/label-item-ios-ltr-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000..4ab92da5c1
Binary files /dev/null and b/core/src/components/label/test/item/item.e2e.ts-snapshots/label-item-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/label/test/item/item.e2e.ts-snapshots/label-item-ios-ltr-Mobile-Safari-linux.png b/core/src/components/label/test/item/item.e2e.ts-snapshots/label-item-ios-ltr-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..ee38a59023
Binary files /dev/null and b/core/src/components/label/test/item/item.e2e.ts-snapshots/label-item-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/label/test/item/item.e2e.ts-snapshots/label-item-md-ltr-Mobile-Chrome-linux.png b/core/src/components/label/test/item/item.e2e.ts-snapshots/label-item-md-ltr-Mobile-Chrome-linux.png
new file mode 100644
index 0000000000..cf3c72e7a5
Binary files /dev/null and b/core/src/components/label/test/item/item.e2e.ts-snapshots/label-item-md-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/label/test/item/item.e2e.ts-snapshots/label-item-md-ltr-Mobile-Firefox-linux.png b/core/src/components/label/test/item/item.e2e.ts-snapshots/label-item-md-ltr-Mobile-Firefox-linux.png
new file mode 100644
index 0000000000..02c4601310
Binary files /dev/null and b/core/src/components/label/test/item/item.e2e.ts-snapshots/label-item-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/label/test/item/item.e2e.ts-snapshots/label-item-md-ltr-Mobile-Safari-linux.png b/core/src/components/label/test/item/item.e2e.ts-snapshots/label-item-md-ltr-Mobile-Safari-linux.png
new file mode 100644
index 0000000000..571d817f73
Binary files /dev/null and b/core/src/components/label/test/item/item.e2e.ts-snapshots/label-item-md-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/loading/loading.tsx b/core/src/components/loading/loading.tsx
index 05e40669d9..ceb2ae62a3 100644
--- a/core/src/components/loading/loading.tsx
+++ b/core/src/components/loading/loading.tsx
@@ -268,6 +268,10 @@ export class Loading implements ComponentInterface, OverlayInterface {
    * This can be useful in a button handler for determining which button was
    * clicked to dismiss the loading.
    * Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.
+   *
+   * This is a no-op if the overlay has not been presented yet. If you want
+   * to remove an overlay from the DOM that was never presented, use the
+   * [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
    */
   @Method()
   async dismiss(data?: any, role?: string): Promise<boolean> {
diff --git a/core/src/components/loading/test/basic/loading.e2e.ts-snapshots/loading-long-content-diff-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/loading/test/basic/loading.e2e.ts-snapshots/loading-long-content-diff-ios-ltr-Mobile-Chrome-linux.png
index 25c7622d6c..f25138163a 100644
Binary files a/core/src/components/loading/test/basic/loading.e2e.ts-snapshots/loading-long-content-diff-ios-ltr-Mobile-Chrome-linux.png and b/core/src/components/loading/test/basic/loading.e2e.ts-snapshots/loading-long-content-diff-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/loading/test/basic/loading.e2e.ts-snapshots/loading-long-content-diff-md-ltr-Mobile-Chrome-linux.png b/core/src/components/loading/test/basic/loading.e2e.ts-snapshots/loading-long-content-diff-md-ltr-Mobile-Chrome-linux.png
index 92269920fa..1d20d61b9d 100644
Binary files a/core/src/components/loading/test/basic/loading.e2e.ts-snapshots/loading-long-content-diff-md-ltr-Mobile-Chrome-linux.png and b/core/src/components/loading/test/basic/loading.e2e.ts-snapshots/loading-long-content-diff-md-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/menu/menu.tsx b/core/src/components/menu/menu.tsx
index 9fbb4a3bff..437c536345 100644
--- a/core/src/components/menu/menu.tsx
+++ b/core/src/components/menu/menu.tsx
@@ -2,6 +2,7 @@ import type { ComponentInterface, EventEmitter } from '@stencil/core';
 import { Build, Component, Element, Event, Host, Listen, Method, Prop, State, Watch, h } from '@stencil/core';
 import { getTimeGivenProgression } from '@utils/animation/cubic-bezier';
 import { GESTURE_CONTROLLER } from '@utils/gesture';
+import { shoudUseCloseWatcher } from '@utils/hardware-back-button';
 import type { Attributes } from '@utils/helpers';
 import { inheritAriaAttributes, assert, clamp, isEndSide as isEnd } from '@utils/helpers';
 import { menuController } from '@utils/menu-controller';
@@ -321,7 +322,6 @@ export class Menu implements ComponentInterface, MenuI {
     }
   }
 
-  @Listen('keydown')
   onKeydown(ev: KeyboardEvent) {
     if (ev.key === 'Escape') {
       this.close();
@@ -781,8 +781,14 @@ export class Menu implements ComponentInterface, MenuI {
     const { type, disabled, isPaneVisible, inheritedAttributes, side } = this;
     const mode = getIonMode(this);
 
+    /**
+     * If the Close Watcher is enabled then
+     * the ionBackButton listener in the menu controller
+     * will handle closing the menu when Escape is pressed.
+     */
     return (
       <Host
+        onKeyDown={shoudUseCloseWatcher() ? null : this.onKeydown}
         role="navigation"
         aria-label={inheritedAttributes['aria-label'] || 'menu'}
         class={{
diff --git a/core/src/components/modal/modal.tsx b/core/src/components/modal/modal.tsx
index bae8648d76..2d84e42c96 100644
--- a/core/src/components/modal/modal.tsx
+++ b/core/src/components/modal/modal.tsx
@@ -10,7 +10,6 @@ import { Style as StatusBarStyle, StatusBar } from '@utils/native/status-bar';
 import {
   GESTURE,
   BACKDROP,
-  activeAnimations,
   dismiss,
   eventMethod,
   prepareOverlay,
@@ -346,10 +345,47 @@ export class Modal implements ComponentInterface, OverlayInterface {
   }
 
   componentWillLoad() {
-    const { breakpoints, initialBreakpoint, el } = this;
+    const { breakpoints, initialBreakpoint, el, htmlAttributes } = this;
     const isSheetModal = (this.isSheetModal = breakpoints !== undefined && initialBreakpoint !== undefined);
 
-    this.inheritedAttributes = inheritAttributes(el, ['aria-label', 'role']);
+    const attributesToInherit = ['aria-label', 'role'];
+    this.inheritedAttributes = inheritAttributes(el, attributesToInherit);
+
+    /**
+     * When using a controller modal you can set attributes
+     * using the htmlAttributes property. Since the above attributes
+     * need to be inherited inside of the modal, we need to look
+     * and see if these attributes are being set via htmlAttributes.
+     *
+     * We could alternatively move this to componentDidLoad to simplify the work
+     * here, but we'd then need to make inheritedAttributes a State variable,
+     * thus causing another render to always happen after the first render.
+     */
+    if (htmlAttributes !== undefined) {
+      attributesToInherit.forEach((attribute) => {
+        const attributeValue = htmlAttributes[attribute];
+        if (attributeValue) {
+          /**
+           * If an attribute we need to inherit was
+           * set using htmlAttributes then add it to
+           * inheritedAttributes and remove it from htmlAttributes.
+           * This ensures the attribute is inherited and not
+           * set on the host.
+           *
+           * In this case, if an inherited attribute is set
+           * on the host element and using htmlAttributes then
+           * htmlAttributes wins, but that's not a pattern that we recommend.
+           * The only time you'd need htmlAttributes is when using modalController.
+           */
+          this.inheritedAttributes = {
+            ...this.inheritedAttributes,
+            [attribute]: htmlAttributes[attribute],
+          };
+
+          delete htmlAttributes[attribute];
+        }
+      });
+    }
 
     if (isSheetModal) {
       this.currentBreakpoint = this.initialBreakpoint;
@@ -663,6 +699,10 @@ export class Modal implements ComponentInterface, OverlayInterface {
    *
    * @param data Any data to emit in the dismiss events.
    * @param role The role of the element that is dismissing the modal. For example, 'cancel' or 'backdrop'.
+   *
+   * This is a no-op if the overlay has not been presented yet. If you want
+   * to remove an overlay from the DOM that was never presented, use the
+   * [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
    */
   @Method()
   async dismiss(data?: any, role?: string): Promise<boolean> {
@@ -705,8 +745,6 @@ export class Modal implements ComponentInterface, OverlayInterface {
       this.keyboardOpenCallback = undefined;
     }
 
-    const enteringAnimation = activeAnimations.get(this) || [];
-
     const dismissed = await dismiss<ModalDismissOptions>(
       this,
       data,
@@ -733,8 +771,6 @@ export class Modal implements ComponentInterface, OverlayInterface {
       if (this.gesture) {
         this.gesture.destroy();
       }
-
-      enteringAnimation.forEach((ani) => ani.destroy());
     }
     this.currentBreakpoint = undefined;
     this.animation = undefined;
diff --git a/core/src/components/modal/test/a11y/modal.spec.ts b/core/src/components/modal/test/a11y/modal.spec.ts
deleted file mode 100644
index a80c33e0b8..0000000000
--- a/core/src/components/modal/test/a11y/modal.spec.ts
+++ /dev/null
@@ -1,23 +0,0 @@
-import { newSpecPage } from '@stencil/core/testing';
-
-import { Modal } from '../../modal';
-
-describe('modal: a11y', () => {
-  it('should allow for custom role', async () => {
-    /**
-     * Note: This example should not be used in production.
-     * This only serves to check that `role` can be customized.
-     */
-    const page = await newSpecPage({
-      components: [Modal],
-      html: `
-        <ion-modal role="alertdialog"></ion-modal>
-      `,
-    });
-
-    const modal = page.body.querySelector('ion-modal')!;
-    const modalWrapper = modal.shadowRoot!.querySelector('.modal-wrapper')!;
-
-    await expect(modalWrapper.getAttribute('role')).toBe('alertdialog');
-  });
-});
diff --git a/core/src/components/modal/test/animations/modal.e2e.ts b/core/src/components/modal/test/animations/modal.e2e.ts
new file mode 100644
index 0000000000..8d541003ff
--- /dev/null
+++ b/core/src/components/modal/test/animations/modal.e2e.ts
@@ -0,0 +1,45 @@
+import { expect } from '@playwright/test';
+import { configs, test } from '@utils/test/playwright';
+
+configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ config, title }) => {
+  test.describe(title('modal: animations'), () => {
+    test.beforeEach(async ({ page }) => {
+      await page.setContent(
+        `
+        <ion-modal is-open="true" trigger="open-modal"></ion-modal>
+      `,
+        config
+      );
+    });
+    test('card modal should clean up animations on dismiss', async ({ page }, testInfo) => {
+      testInfo.annotations.push({
+        type: 'issue',
+        description: 'https://github.com/ionic-team/ionic-framework/issues/28352',
+      });
+
+      const ionModalDidDismiss = await page.spyOnEvent('ionModalDidDismiss');
+
+      const modal = page.locator('ion-modal');
+
+      const initialAnimations = await modal.evaluate((el: HTMLIonModalElement) => {
+        return el.shadowRoot!.getAnimations();
+      });
+
+      // While the modal is open, it should have animations
+      expect(initialAnimations.length).toBeGreaterThan(0);
+
+      await modal.evaluate((el: HTMLIonModalElement) => {
+        el.dismiss();
+      });
+
+      await ionModalDidDismiss.next();
+
+      const currentAnimations = await modal.evaluate((el: HTMLIonModalElement) => {
+        return el.shadowRoot!.getAnimations();
+      });
+
+      // Once the modal has finished closing, there should be no animations
+      expect(currentAnimations.length).toBe(0);
+    });
+  });
+});
diff --git a/core/src/components/modal/test/modal-attributes.spec.tsx b/core/src/components/modal/test/modal-attributes.spec.tsx
new file mode 100644
index 0000000000..76d9b0aafd
--- /dev/null
+++ b/core/src/components/modal/test/modal-attributes.spec.tsx
@@ -0,0 +1,39 @@
+import { h } from '@stencil/core';
+import { newSpecPage } from '@stencil/core/testing';
+
+import { Modal } from '../modal';
+
+it('should inherit attributes', async () => {
+  /**
+   * Note: This example should not be used in production.
+   * This only serves to check that `role` can be customized.
+   */
+  const page = await newSpecPage({
+    components: [Modal],
+    template: () => <ion-modal overlayIndex={1} aria-label="my label" role="presentation"></ion-modal>,
+  });
+
+  const modal = page.body.querySelector('ion-modal')!;
+  const contentWrapper = modal.shadowRoot!.querySelector('[part="content"]')!;
+
+  expect(contentWrapper.getAttribute('aria-label')).toBe('my label');
+  expect(contentWrapper.getAttribute('role')).toBe('presentation');
+});
+
+it('should inherit attributes when set via htmlAttributes', async () => {
+  const page = await newSpecPage({
+    components: [Modal],
+    template: () => (
+      <ion-modal overlayIndex={1} htmlAttributes={{ 'aria-label': 'my label', role: 'presentation' }}></ion-modal>
+    ),
+  });
+
+  const modal = page.body.querySelector('ion-modal')!;
+  const contentWrapper = modal.shadowRoot!.querySelector('[part="content"]')!;
+
+  expect(contentWrapper.getAttribute('aria-label')).toBe('my label');
+  expect(contentWrapper.getAttribute('role')).toBe('presentation');
+
+  expect(modal.hasAttribute('aria-label')).toBe(false);
+  expect(modal.hasAttribute('role')).toBe(false);
+});
diff --git a/core/src/components/modal/test/sheet/index.html b/core/src/components/modal/test/sheet/index.html
index 8fed5eac09..2a7eeb022e 100644
--- a/core/src/components/modal/test/sheet/index.html
+++ b/core/src/components/modal/test/sheet/index.html
@@ -85,10 +85,7 @@
         </ion-header>
 
         <ion-content class="ion-padding">
-          <ion-item>
-            <ion-label>Input outside modal</ion-label>
-            <ion-input id="root-input" legacy="true"></ion-input>
-          </ion-item>
+          <input id="root-input" />
 
           <ion-button id="sheet-modal" onclick="presentModal()">Present Sheet Modal</ion-button>
           <ion-button
diff --git a/core/src/components/modal/test/sheet/modal.e2e.ts b/core/src/components/modal/test/sheet/modal.e2e.ts
index 2caf86fad0..6e84cb7c62 100644
--- a/core/src/components/modal/test/sheet/modal.e2e.ts
+++ b/core/src/components/modal/test/sheet/modal.e2e.ts
@@ -52,7 +52,7 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
 
       await ionModalDidPresent.next();
 
-      const input = page.locator('#root-input input').first();
+      const input = page.locator('#root-input').first();
       await input.click();
       await expect(input).toBeFocused();
     });
diff --git a/core/src/components/modal/test/sheet/modal.e2e.ts-snapshots/modal-sheet-present-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/modal/test/sheet/modal.e2e.ts-snapshots/modal-sheet-present-ios-ltr-Mobile-Chrome-linux.png
index d87c4c3893..699dd3af83 100644
Binary files a/core/src/components/modal/test/sheet/modal.e2e.ts-snapshots/modal-sheet-present-ios-ltr-Mobile-Chrome-linux.png and b/core/src/components/modal/test/sheet/modal.e2e.ts-snapshots/modal-sheet-present-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/modal/test/sheet/modal.e2e.ts-snapshots/modal-sheet-present-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/modal/test/sheet/modal.e2e.ts-snapshots/modal-sheet-present-ios-ltr-Mobile-Firefox-linux.png
index 22afed2dab..02ddc5ffef 100644
Binary files a/core/src/components/modal/test/sheet/modal.e2e.ts-snapshots/modal-sheet-present-ios-ltr-Mobile-Firefox-linux.png and b/core/src/components/modal/test/sheet/modal.e2e.ts-snapshots/modal-sheet-present-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/modal/test/sheet/modal.e2e.ts-snapshots/modal-sheet-present-ios-ltr-Mobile-Safari-linux.png b/core/src/components/modal/test/sheet/modal.e2e.ts-snapshots/modal-sheet-present-ios-ltr-Mobile-Safari-linux.png
index 7d77a2c9d0..8549847278 100644
Binary files a/core/src/components/modal/test/sheet/modal.e2e.ts-snapshots/modal-sheet-present-ios-ltr-Mobile-Safari-linux.png and b/core/src/components/modal/test/sheet/modal.e2e.ts-snapshots/modal-sheet-present-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/modal/test/sheet/modal.e2e.ts-snapshots/modal-sheet-present-md-ltr-Mobile-Chrome-linux.png b/core/src/components/modal/test/sheet/modal.e2e.ts-snapshots/modal-sheet-present-md-ltr-Mobile-Chrome-linux.png
index cafd8ae3f2..a8ef5a35df 100644
Binary files a/core/src/components/modal/test/sheet/modal.e2e.ts-snapshots/modal-sheet-present-md-ltr-Mobile-Chrome-linux.png and b/core/src/components/modal/test/sheet/modal.e2e.ts-snapshots/modal-sheet-present-md-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/modal/test/sheet/modal.e2e.ts-snapshots/modal-sheet-present-md-ltr-Mobile-Firefox-linux.png b/core/src/components/modal/test/sheet/modal.e2e.ts-snapshots/modal-sheet-present-md-ltr-Mobile-Firefox-linux.png
index 5b7ab097e3..c26490f27b 100644
Binary files a/core/src/components/modal/test/sheet/modal.e2e.ts-snapshots/modal-sheet-present-md-ltr-Mobile-Firefox-linux.png and b/core/src/components/modal/test/sheet/modal.e2e.ts-snapshots/modal-sheet-present-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/modal/test/sheet/modal.e2e.ts-snapshots/modal-sheet-present-md-ltr-Mobile-Safari-linux.png b/core/src/components/modal/test/sheet/modal.e2e.ts-snapshots/modal-sheet-present-md-ltr-Mobile-Safari-linux.png
index ab1a390d42..4ac2611582 100644
Binary files a/core/src/components/modal/test/sheet/modal.e2e.ts-snapshots/modal-sheet-present-md-ltr-Mobile-Safari-linux.png and b/core/src/components/modal/test/sheet/modal.e2e.ts-snapshots/modal-sheet-present-md-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/modal/test/spec/index.html b/core/src/components/modal/test/spec/index.html
index d97fdd1de4..3060c5e012 100644
--- a/core/src/components/modal/test/spec/index.html
+++ b/core/src/components/modal/test/spec/index.html
@@ -60,8 +60,7 @@
 
         <ion-content>
           <ion-item>
-            <ion-label>Use Custom Animation</ion-label>
-            <ion-toggle></ion-toggle>
+            <ion-toggle>Use Custom Animation</ion-toggle>
           </ion-item>
 
           <ion-list id="list"></ion-list>
diff --git a/core/src/components/picker/picker.tsx b/core/src/components/picker/picker.tsx
index 4232288919..88e25e3efa 100644
--- a/core/src/components/picker/picker.tsx
+++ b/core/src/components/picker/picker.tsx
@@ -248,6 +248,10 @@ export class Picker implements ComponentInterface, OverlayInterface {
    * This can be useful in a button handler for determining which button was
    * clicked to dismiss the picker.
    * Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.
+   *
+   * This is a no-op if the overlay has not been presented yet. If you want
+   * to remove an overlay from the DOM that was never presented, use the
+   * [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
    */
   @Method()
   async dismiss(data?: any, role?: string): Promise<boolean> {
diff --git a/core/src/components/popover/popover.ios.scss b/core/src/components/popover/popover.ios.scss
index 26ee84ed2c..d8feb57b55 100644
--- a/core/src/components/popover/popover.ios.scss
+++ b/core/src/components/popover/popover.ios.scss
@@ -35,6 +35,13 @@
   height: 10px;
 
   overflow: hidden;
+  /*
+   * Required for the arrow to render above the backdrop.
+   * Otherwise, the arrow will appear slightly transparent.
+   * The value is set to 11 since it's the minimum value that
+   * will allow the arrow to render above the backdrop.
+   */
+  z-index: 11;
 }
 
 .popover-arrow::after {
diff --git a/core/src/components/popover/popover.tsx b/core/src/components/popover/popover.tsx
index 21dce20a5d..46f922b834 100644
--- a/core/src/components/popover/popover.tsx
+++ b/core/src/components/popover/popover.tsx
@@ -525,6 +525,10 @@ export class Popover implements ComponentInterface, PopoverInterface {
    * @param role The role of the element that is dismissing the popover. For example, 'cancel' or 'backdrop'.
    * @param dismissParentPopover If `true`, dismissing this popover will also dismiss
    * a parent popover if this popover is nested. Defaults to `true`.
+   *
+   * This is a no-op if the overlay has not been presented yet. If you want
+   * to remove an overlay from the DOM that was never presented, use the
+   * [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
    */
   @Method()
   async dismiss(data?: any, role?: string, dismissParentPopover = true): Promise<boolean> {
diff --git a/core/src/components/popover/test/arrow/popover.e2e.ts-snapshots/popover-arrow-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/popover/test/arrow/popover.e2e.ts-snapshots/popover-arrow-ios-ltr-Mobile-Chrome-linux.png
index 5ca29ca25f..5377051113 100644
Binary files a/core/src/components/popover/test/arrow/popover.e2e.ts-snapshots/popover-arrow-ios-ltr-Mobile-Chrome-linux.png and b/core/src/components/popover/test/arrow/popover.e2e.ts-snapshots/popover-arrow-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/popover/test/arrow/popover.e2e.ts-snapshots/popover-arrow-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/popover/test/arrow/popover.e2e.ts-snapshots/popover-arrow-ios-ltr-Mobile-Firefox-linux.png
index 953469ca14..9bee598326 100644
Binary files a/core/src/components/popover/test/arrow/popover.e2e.ts-snapshots/popover-arrow-ios-ltr-Mobile-Firefox-linux.png and b/core/src/components/popover/test/arrow/popover.e2e.ts-snapshots/popover-arrow-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/popover/test/arrow/popover.e2e.ts-snapshots/popover-arrow-ios-rtl-Mobile-Chrome-linux.png b/core/src/components/popover/test/arrow/popover.e2e.ts-snapshots/popover-arrow-ios-rtl-Mobile-Chrome-linux.png
index 7a27dfe102..6c4eccdfbf 100644
Binary files a/core/src/components/popover/test/arrow/popover.e2e.ts-snapshots/popover-arrow-ios-rtl-Mobile-Chrome-linux.png and b/core/src/components/popover/test/arrow/popover.e2e.ts-snapshots/popover-arrow-ios-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/popover/test/arrow/popover.e2e.ts-snapshots/popover-arrow-ios-rtl-Mobile-Firefox-linux.png b/core/src/components/popover/test/arrow/popover.e2e.ts-snapshots/popover-arrow-ios-rtl-Mobile-Firefox-linux.png
index acedb197bf..af4bbe3892 100644
Binary files a/core/src/components/popover/test/arrow/popover.e2e.ts-snapshots/popover-arrow-ios-rtl-Mobile-Firefox-linux.png and b/core/src/components/popover/test/arrow/popover.e2e.ts-snapshots/popover-arrow-ios-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/popover/test/async/popover.e2e.ts-snapshots/popover-async-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/popover/test/async/popover.e2e.ts-snapshots/popover-async-ios-ltr-Mobile-Firefox-linux.png
index bddd7a5c93..563d2e8805 100644
Binary files a/core/src/components/popover/test/async/popover.e2e.ts-snapshots/popover-async-ios-ltr-Mobile-Firefox-linux.png and b/core/src/components/popover/test/async/popover.e2e.ts-snapshots/popover-async-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/popover/test/basic/index.html b/core/src/components/popover/test/basic/index.html
index 9ef6ba840c..058aa69e08 100644
--- a/core/src/components/popover/test/basic/index.html
+++ b/core/src/components/popover/test/basic/index.html
@@ -212,7 +212,7 @@
           connectedCallback() {
             this.innerHTML = `
           <ion-content>
-            <ion-textarea rows="4" style="max-height: 44px; overflow-y: auto;" value="the cursor in this <ion-textarea>\nmust be able to be moved\nwith the arrow keys and\nhome and end keys"></ion-textarea>
+            <ion-textarea aria-label="textarea" rows="4" style="max-height: 44px; overflow-y: auto;" value="the cursor in this <ion-textarea>\nmust be able to be moved\nwith the arrow keys and\nhome and end keys"></ion-textarea>
             <textarea rows="4" style="display:block;width: 100%;border: 0;padding: 8px; max-height: 44px; overflow-y: auto">the cursor in this <textarea>\nmust be able to be moved\nwith the arrow keys and\nhome and end keys</textarea>
           </ion-content>
         `;
diff --git a/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-basic-popover-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-basic-popover-ios-ltr-Mobile-Chrome-linux.png
index e02693b33a..1d82ea369b 100644
Binary files a/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-basic-popover-ios-ltr-Mobile-Chrome-linux.png and b/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-basic-popover-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-basic-popover-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-basic-popover-ios-ltr-Mobile-Firefox-linux.png
index 19a7c5733c..7e5b6fae97 100644
Binary files a/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-basic-popover-ios-ltr-Mobile-Firefox-linux.png and b/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-basic-popover-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-basic-popover-ios-ltr-Mobile-Safari-linux.png b/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-basic-popover-ios-ltr-Mobile-Safari-linux.png
index 73f8165a81..1d35a884d8 100644
Binary files a/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-basic-popover-ios-ltr-Mobile-Safari-linux.png and b/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-basic-popover-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-basic-popover-ios-rtl-Mobile-Chrome-linux.png b/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-basic-popover-ios-rtl-Mobile-Chrome-linux.png
index 3be7073d4f..09f9aeb9d6 100644
Binary files a/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-basic-popover-ios-rtl-Mobile-Chrome-linux.png and b/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-basic-popover-ios-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-basic-popover-ios-rtl-Mobile-Firefox-linux.png b/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-basic-popover-ios-rtl-Mobile-Firefox-linux.png
index 45a347afe7..4425e9bffe 100644
Binary files a/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-basic-popover-ios-rtl-Mobile-Firefox-linux.png and b/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-basic-popover-ios-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-custom-class-popover-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-custom-class-popover-ios-ltr-Mobile-Chrome-linux.png
index b8880de413..95970666f2 100644
Binary files a/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-custom-class-popover-ios-ltr-Mobile-Chrome-linux.png and b/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-custom-class-popover-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-custom-class-popover-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-custom-class-popover-ios-ltr-Mobile-Firefox-linux.png
index cd8f1360b2..450c80bac4 100644
Binary files a/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-custom-class-popover-ios-ltr-Mobile-Firefox-linux.png and b/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-custom-class-popover-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-custom-class-popover-ios-ltr-Mobile-Safari-linux.png b/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-custom-class-popover-ios-ltr-Mobile-Safari-linux.png
index 25961e27c2..3812d082c4 100644
Binary files a/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-custom-class-popover-ios-ltr-Mobile-Safari-linux.png and b/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-custom-class-popover-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-header-popover-md-ltr-Mobile-Chrome-linux.png b/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-header-popover-md-ltr-Mobile-Chrome-linux.png
index 993d4792cb..a7a603568c 100644
Binary files a/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-header-popover-md-ltr-Mobile-Chrome-linux.png and b/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-header-popover-md-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-long-list-popover-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-long-list-popover-ios-ltr-Mobile-Chrome-linux.png
index 779d948c8a..6e84cdb4b6 100644
Binary files a/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-long-list-popover-ios-ltr-Mobile-Chrome-linux.png and b/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-long-list-popover-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-long-list-popover-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-long-list-popover-ios-ltr-Mobile-Firefox-linux.png
index d1ddc8fe70..a2c06c01c7 100644
Binary files a/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-long-list-popover-ios-ltr-Mobile-Firefox-linux.png and b/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-long-list-popover-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-translucent-popover-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-translucent-popover-ios-ltr-Mobile-Chrome-linux.png
index befbd7a1d3..9d1f32ecf9 100644
Binary files a/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-translucent-popover-ios-ltr-Mobile-Chrome-linux.png and b/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-translucent-popover-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-translucent-popover-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-translucent-popover-ios-ltr-Mobile-Firefox-linux.png
index 896ab6f946..cd82a78674 100644
Binary files a/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-translucent-popover-ios-ltr-Mobile-Firefox-linux.png and b/core/src/components/popover/test/basic/popover.e2e.ts-snapshots/popover-basic-translucent-popover-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/popover/test/nested/popover.e2e.ts-snapshots/popover-nested-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/popover/test/nested/popover.e2e.ts-snapshots/popover-nested-ios-ltr-Mobile-Chrome-linux.png
index f1469a6446..b2550e4a02 100644
Binary files a/core/src/components/popover/test/nested/popover.e2e.ts-snapshots/popover-nested-ios-ltr-Mobile-Chrome-linux.png and b/core/src/components/popover/test/nested/popover.e2e.ts-snapshots/popover-nested-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/popover/test/nested/popover.e2e.ts-snapshots/popover-nested-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/popover/test/nested/popover.e2e.ts-snapshots/popover-nested-ios-ltr-Mobile-Firefox-linux.png
index 2be22edbd7..b9a57a3409 100644
Binary files a/core/src/components/popover/test/nested/popover.e2e.ts-snapshots/popover-nested-ios-ltr-Mobile-Firefox-linux.png and b/core/src/components/popover/test/nested/popover.e2e.ts-snapshots/popover-nested-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/popover/test/nested/popover.e2e.ts-snapshots/popover-nested-ios-rtl-Mobile-Chrome-linux.png b/core/src/components/popover/test/nested/popover.e2e.ts-snapshots/popover-nested-ios-rtl-Mobile-Chrome-linux.png
index 69521ff6fb..6960c2ac37 100644
Binary files a/core/src/components/popover/test/nested/popover.e2e.ts-snapshots/popover-nested-ios-rtl-Mobile-Chrome-linux.png and b/core/src/components/popover/test/nested/popover.e2e.ts-snapshots/popover-nested-ios-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/popover/test/nested/popover.e2e.ts-snapshots/popover-nested-ios-rtl-Mobile-Firefox-linux.png b/core/src/components/popover/test/nested/popover.e2e.ts-snapshots/popover-nested-ios-rtl-Mobile-Firefox-linux.png
index 5911fa5e1c..9efebaeae3 100644
Binary files a/core/src/components/popover/test/nested/popover.e2e.ts-snapshots/popover-nested-ios-rtl-Mobile-Firefox-linux.png and b/core/src/components/popover/test/nested/popover.e2e.ts-snapshots/popover-nested-ios-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/popover/test/nested/popover.e2e.ts-snapshots/popover-nested-multiple-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/popover/test/nested/popover.e2e.ts-snapshots/popover-nested-multiple-ios-ltr-Mobile-Chrome-linux.png
index aa1b70cde4..bbe987d32d 100644
Binary files a/core/src/components/popover/test/nested/popover.e2e.ts-snapshots/popover-nested-multiple-ios-ltr-Mobile-Chrome-linux.png and b/core/src/components/popover/test/nested/popover.e2e.ts-snapshots/popover-nested-multiple-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/popover/test/nested/popover.e2e.ts-snapshots/popover-nested-multiple-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/popover/test/nested/popover.e2e.ts-snapshots/popover-nested-multiple-ios-ltr-Mobile-Firefox-linux.png
index 2714cc16d6..06a6219c0b 100644
Binary files a/core/src/components/popover/test/nested/popover.e2e.ts-snapshots/popover-nested-multiple-ios-ltr-Mobile-Firefox-linux.png and b/core/src/components/popover/test/nested/popover.e2e.ts-snapshots/popover-nested-multiple-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/popover/test/nested/popover.e2e.ts-snapshots/popover-nested-multiple-ios-rtl-Mobile-Chrome-linux.png b/core/src/components/popover/test/nested/popover.e2e.ts-snapshots/popover-nested-multiple-ios-rtl-Mobile-Chrome-linux.png
index aa51dfa936..6c32cb4909 100644
Binary files a/core/src/components/popover/test/nested/popover.e2e.ts-snapshots/popover-nested-multiple-ios-rtl-Mobile-Chrome-linux.png and b/core/src/components/popover/test/nested/popover.e2e.ts-snapshots/popover-nested-multiple-ios-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/popover/test/nested/popover.e2e.ts-snapshots/popover-nested-multiple-ios-rtl-Mobile-Firefox-linux.png b/core/src/components/popover/test/nested/popover.e2e.ts-snapshots/popover-nested-multiple-ios-rtl-Mobile-Firefox-linux.png
index 937d38ec8c..61eaf3ac95 100644
Binary files a/core/src/components/popover/test/nested/popover.e2e.ts-snapshots/popover-nested-multiple-ios-rtl-Mobile-Firefox-linux.png and b/core/src/components/popover/test/nested/popover.e2e.ts-snapshots/popover-nested-multiple-ios-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/popover/test/position/popover.e2e.ts-snapshots/popover-position-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/popover/test/position/popover.e2e.ts-snapshots/popover-position-ios-ltr-Mobile-Chrome-linux.png
index b30af3ee2a..7cb8c13450 100644
Binary files a/core/src/components/popover/test/position/popover.e2e.ts-snapshots/popover-position-ios-ltr-Mobile-Chrome-linux.png and b/core/src/components/popover/test/position/popover.e2e.ts-snapshots/popover-position-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/popover/test/position/popover.e2e.ts-snapshots/popover-position-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/popover/test/position/popover.e2e.ts-snapshots/popover-position-ios-ltr-Mobile-Firefox-linux.png
index e218aada4c..025a5f5cb8 100644
Binary files a/core/src/components/popover/test/position/popover.e2e.ts-snapshots/popover-position-ios-ltr-Mobile-Firefox-linux.png and b/core/src/components/popover/test/position/popover.e2e.ts-snapshots/popover-position-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/popover/test/position/popover.e2e.ts-snapshots/popover-position-ios-rtl-Mobile-Chrome-linux.png b/core/src/components/popover/test/position/popover.e2e.ts-snapshots/popover-position-ios-rtl-Mobile-Chrome-linux.png
index 107924c85e..0639fee1cf 100644
Binary files a/core/src/components/popover/test/position/popover.e2e.ts-snapshots/popover-position-ios-rtl-Mobile-Chrome-linux.png and b/core/src/components/popover/test/position/popover.e2e.ts-snapshots/popover-position-ios-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/popover/test/position/popover.e2e.ts-snapshots/popover-position-ios-rtl-Mobile-Firefox-linux.png b/core/src/components/popover/test/position/popover.e2e.ts-snapshots/popover-position-ios-rtl-Mobile-Firefox-linux.png
index 8abcb19e5e..4da1c13b63 100644
Binary files a/core/src/components/popover/test/position/popover.e2e.ts-snapshots/popover-position-ios-rtl-Mobile-Firefox-linux.png and b/core/src/components/popover/test/position/popover.e2e.ts-snapshots/popover-position-ios-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/popover/test/reference/popover.e2e.ts-snapshots/popover-reference-event-trigger-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/popover/test/reference/popover.e2e.ts-snapshots/popover-reference-event-trigger-ios-ltr-Mobile-Chrome-linux.png
index f47d232954..5d69ece967 100644
Binary files a/core/src/components/popover/test/reference/popover.e2e.ts-snapshots/popover-reference-event-trigger-ios-ltr-Mobile-Chrome-linux.png and b/core/src/components/popover/test/reference/popover.e2e.ts-snapshots/popover-reference-event-trigger-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/popover/test/reference/popover.e2e.ts-snapshots/popover-reference-event-trigger-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/popover/test/reference/popover.e2e.ts-snapshots/popover-reference-event-trigger-ios-ltr-Mobile-Firefox-linux.png
index 1ab6780ca4..00886cc4a3 100644
Binary files a/core/src/components/popover/test/reference/popover.e2e.ts-snapshots/popover-reference-event-trigger-ios-ltr-Mobile-Firefox-linux.png and b/core/src/components/popover/test/reference/popover.e2e.ts-snapshots/popover-reference-event-trigger-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/popover/test/reference/popover.e2e.ts-snapshots/popover-reference-event-trigger-ios-rtl-Mobile-Chrome-linux.png b/core/src/components/popover/test/reference/popover.e2e.ts-snapshots/popover-reference-event-trigger-ios-rtl-Mobile-Chrome-linux.png
index 6b7b80f3d5..661cec9ed8 100644
Binary files a/core/src/components/popover/test/reference/popover.e2e.ts-snapshots/popover-reference-event-trigger-ios-rtl-Mobile-Chrome-linux.png and b/core/src/components/popover/test/reference/popover.e2e.ts-snapshots/popover-reference-event-trigger-ios-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/popover/test/reference/popover.e2e.ts-snapshots/popover-reference-event-trigger-ios-rtl-Mobile-Firefox-linux.png b/core/src/components/popover/test/reference/popover.e2e.ts-snapshots/popover-reference-event-trigger-ios-rtl-Mobile-Firefox-linux.png
index 4d949b444f..292ec6aa6d 100644
Binary files a/core/src/components/popover/test/reference/popover.e2e.ts-snapshots/popover-reference-event-trigger-ios-rtl-Mobile-Firefox-linux.png and b/core/src/components/popover/test/reference/popover.e2e.ts-snapshots/popover-reference-event-trigger-ios-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/popover/test/reference/popover.e2e.ts-snapshots/popover-reference-trigger-trigger-ios-rtl-Mobile-Chrome-linux.png b/core/src/components/popover/test/reference/popover.e2e.ts-snapshots/popover-reference-trigger-trigger-ios-rtl-Mobile-Chrome-linux.png
index ede9d9ae1a..96ce00fc51 100644
Binary files a/core/src/components/popover/test/reference/popover.e2e.ts-snapshots/popover-reference-trigger-trigger-ios-rtl-Mobile-Chrome-linux.png and b/core/src/components/popover/test/reference/popover.e2e.ts-snapshots/popover-reference-trigger-trigger-ios-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/popover/test/reference/popover.e2e.ts-snapshots/popover-reference-trigger-trigger-ios-rtl-Mobile-Firefox-linux.png b/core/src/components/popover/test/reference/popover.e2e.ts-snapshots/popover-reference-trigger-trigger-ios-rtl-Mobile-Firefox-linux.png
index a5f09fdbfa..c5985b60dd 100644
Binary files a/core/src/components/popover/test/reference/popover.e2e.ts-snapshots/popover-reference-trigger-trigger-ios-rtl-Mobile-Firefox-linux.png and b/core/src/components/popover/test/reference/popover.e2e.ts-snapshots/popover-reference-trigger-trigger-ios-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/popover/test/size/popover.e2e.ts-snapshots/popover-size-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/popover/test/size/popover.e2e.ts-snapshots/popover-size-ios-ltr-Mobile-Chrome-linux.png
index 32cff5766d..70fb41443b 100644
Binary files a/core/src/components/popover/test/size/popover.e2e.ts-snapshots/popover-size-ios-ltr-Mobile-Chrome-linux.png and b/core/src/components/popover/test/size/popover.e2e.ts-snapshots/popover-size-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/popover/test/size/popover.e2e.ts-snapshots/popover-size-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/popover/test/size/popover.e2e.ts-snapshots/popover-size-ios-ltr-Mobile-Firefox-linux.png
index 55b5471ea2..31a5883ac9 100644
Binary files a/core/src/components/popover/test/size/popover.e2e.ts-snapshots/popover-size-ios-ltr-Mobile-Firefox-linux.png and b/core/src/components/popover/test/size/popover.e2e.ts-snapshots/popover-size-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/progress-bar/test/buffer/index.html b/core/src/components/progress-bar/test/buffer/index.html
index 9bd1019055..fd1cdfc195 100644
--- a/core/src/components/progress-bar/test/buffer/index.html
+++ b/core/src/components/progress-bar/test/buffer/index.html
@@ -60,7 +60,7 @@
           <ion-progress-bar class="progressBarBuffer" value="0.20" buffer="0.4" reversed="true"></ion-progress-bar>
 
           <ion-item>
-            <ion-range legacy="true" pin="true" value="0" id="progressValueBuffer">
+            <ion-range aria-label="Buffer" pin="true" value="0" id="progressValueBuffer">
               <ion-label slot="start">0</ion-label>
               <ion-label slot="end">100</ion-label>
             </ion-range>
diff --git a/core/src/components/progress-bar/test/determinate/index.html b/core/src/components/progress-bar/test/determinate/index.html
index 2ffda64dc3..7b1d9c6b40 100644
--- a/core/src/components/progress-bar/test/determinate/index.html
+++ b/core/src/components/progress-bar/test/determinate/index.html
@@ -69,7 +69,7 @@
           <ion-progress-bar id="progressBar"></ion-progress-bar>
 
           <ion-item>
-            <ion-range legacy="true" pin="true" value="0" id="progressValue">
+            <ion-range aria-label="Buffer" pin="true" value="0" id="progressValue">
               <ion-label slot="start">0</ion-label>
               <ion-label slot="end">100</ion-label>
             </ion-range>
diff --git a/core/src/components/radio-group/test/radio-group-events.e2e.ts b/core/src/components/radio-group/test/radio-group-events.e2e.ts
index 12fb324369..09deb2e7db 100644
--- a/core/src/components/radio-group/test/radio-group-events.e2e.ts
+++ b/core/src/components/radio-group/test/radio-group-events.e2e.ts
@@ -7,9 +7,9 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
       await page.setContent(
         `
       <ion-radio-group value="1">
-        <ion-radio value="1"></ion-radio>
-        <ion-radio value="2"></ion-radio>
-        <ion-radio value="3"></ion-radio>
+        <ion-radio value="1" aria-label="1"></ion-radio>
+        <ion-radio value="2" aria-label="2"></ion-radio>
+        <ion-radio value="3" aria-label="3"></ion-radio>
       </ion-radio-group>
     `,
         config
@@ -29,9 +29,9 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
       await page.setContent(
         `
       <ion-radio-group>
-        <ion-radio value="1"></ion-radio>
-        <ion-radio value="2"></ion-radio>
-        <ion-radio value="3"></ion-radio>
+        <ion-radio value="1" aria-label="1"></ion-radio>
+        <ion-radio value="2" aria-label="2"></ion-radio>
+        <ion-radio value="3" aria-label="3"></ion-radio>
       </ion-radio-group>
     `,
         config
@@ -51,9 +51,9 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
       await page.setContent(
         `
       <ion-radio-group value="1">
-        <ion-radio value="1"></ion-radio>
-        <ion-radio value="2"></ion-radio>
-        <ion-radio value="3"></ion-radio>
+        <ion-radio value="1" aria-label="1"></ion-radio>
+        <ion-radio value="2" aria-label="2"></ion-radio>
+        <ion-radio value="3" aria-label="3"></ion-radio>
       </ion-radio-group>
     `,
         config
@@ -72,9 +72,9 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
       await page.setContent(
         `
         <ion-radio-group value="1">
-          <ion-radio value="1"></ion-radio>
-          <ion-radio value="2"></ion-radio>
-          <ion-radio value="3"></ion-radio>
+          <ion-radio value="1" aria-label="1"></ion-radio>
+          <ion-radio value="2" aria-label="2"></ion-radio>
+          <ion-radio value="3" aria-label="3"></ion-radio>
         </ion-radio-group>
       `,
         config
@@ -94,9 +94,9 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
         await page.setContent(
           `
         <ion-radio-group allow-empty-selection="true" value="1">
-          <ion-radio value="1"></ion-radio>
-          <ion-radio value="2"></ion-radio>
-          <ion-radio value="3"></ion-radio>
+          <ion-radio value="1" aria-label="1"></ion-radio>
+          <ion-radio value="2" aria-label="2"></ion-radio>
+          <ion-radio value="3" aria-label="3"></ion-radio>
         </ion-radio-group>
       `,
           config
diff --git a/core/src/components/range/range.tsx b/core/src/components/range/range.tsx
index 1df4ed9c3f..d8904a2f54 100644
--- a/core/src/components/range/range.tsx
+++ b/core/src/components/range/range.tsx
@@ -299,8 +299,14 @@ export class Range implements ComponentInterface {
         el: rangeSlider,
         gestureName: 'range',
         gesturePriority: 100,
-        threshold: 0,
-        onStart: (ev) => this.onStart(ev),
+        /**
+         * Provide a threshold since the drag movement
+         * might be a user scrolling the view.
+         * If this is true, then the range
+         * should not move.
+         */
+        threshold: 10,
+        onStart: () => this.onStart(),
         onMove: (ev) => this.onMove(ev),
         onEnd: (ev) => this.onEnd(ev),
       });
@@ -418,42 +424,101 @@ export class Range implements ComponentInterface {
     this.ionChange.emit({ value: this.value });
   }
 
-  private onStart(detail: GestureDetail) {
-    const { contentEl } = this;
-    if (contentEl) {
-      this.initialContentScrollY = disableContentScrollY(contentEl);
-    }
-
-    const rect = (this.rect = this.rangeSlider!.getBoundingClientRect() as any);
-    const currentX = detail.currentX;
-
-    // figure out which knob they started closer to
-    let ratio = clamp(0, (currentX - rect.left) / rect.width, 1);
-    if (isRTL(this.el)) {
-      ratio = 1 - ratio;
-    }
-
-    this.pressedKnob = !this.dualKnobs || Math.abs(this.ratioA - ratio) < Math.abs(this.ratioB - ratio) ? 'A' : 'B';
-
-    this.setFocus(this.pressedKnob);
-
-    // update the active knob's position
-    this.update(currentX);
-
+  /**
+   * The value should be updated on touch end or
+   * when the component is being dragged.
+   * This follows the native behavior of mobile devices.
+   *
+   * For example: When the user lifts their finger from the
+   * screen after tapping the bar or dragging the bar or knob.
+   */
+  private onStart() {
     this.ionKnobMoveStart.emit({ value: this.ensureValueInBounds(this.value) });
   }
 
+  /**
+   * The value should be updated while dragging the
+   * bar or knob.
+   *
+   * While the user is dragging, the view
+   * should not scroll. This is to prevent the user from
+   * feeling disoriented while dragging.
+   *
+   * The user can scroll on the view if the knob or
+   * bar is not being dragged.
+   *
+   * @param detail The details of the gesture event.
+   */
   private onMove(detail: GestureDetail) {
-    this.update(detail.currentX);
+    const { contentEl, pressedKnob } = this;
+    const currentX = detail.currentX;
+
+    /**
+     * Since the user is dragging on the bar or knob, the view should not scroll.
+     *
+     * This only needs to be done once.
+     */
+    if (contentEl && this.initialContentScrollY === undefined) {
+      this.initialContentScrollY = disableContentScrollY(contentEl);
+    }
+
+    /**
+     * The `pressedKnob` can be undefined if the user just
+     * started dragging the knob.
+     *
+     * This is necessary to determine which knob the user is dragging,
+     * especially when it's a dual knob.
+     * Plus, it determines when to apply certain styles.
+     *
+     * This only needs to be done once since the knob won't change
+     * while the user is dragging.
+     */
+    if (pressedKnob === undefined) {
+      this.setPressedKnob(currentX);
+    }
+
+    this.update(currentX);
   }
 
-  private onEnd(detail: GestureDetail) {
+  /**
+   * The value should be updated on touch end:
+   * - When the user lifts their finger from the screen after
+   * tapping the bar.
+   *
+   * @param detail The details of the gesture or mouse event.
+   */
+  private onEnd(detail: GestureDetail | MouseEvent) {
     const { contentEl, initialContentScrollY } = this;
-    if (contentEl) {
+    const currentX = (detail as GestureDetail).currentX || (detail as MouseEvent).clientX;
+
+    /**
+     * The `pressedKnob` can be undefined if the user never
+     * dragged the knob. They just tapped on the bar.
+     *
+     * This is necessary to determine which knob the user is changing,
+     * especially when it's a dual knob.
+     * Plus, it determines when to apply certain styles.
+     */
+    if (this.pressedKnob === undefined) {
+      this.setPressedKnob(currentX);
+    }
+
+    /**
+     * The user is no longer dragging the bar or
+     * knob (if they were dragging it).
+     *
+     * The user can now scroll on the view in the next gesture event.
+     */
+    if (contentEl && initialContentScrollY !== undefined) {
       resetContentScrollY(contentEl, initialContentScrollY);
     }
 
-    this.update(detail.currentX);
+    // update the active knob's position
+    this.update(currentX);
+    /**
+     * Reset the pressed knob to undefined since the user
+     * may start dragging a different knob in the next gesture event.
+     */
     this.pressedKnob = undefined;
 
     this.emitValueChange();
@@ -485,6 +550,19 @@ export class Range implements ComponentInterface {
     this.updateValue();
   }
 
+  private setPressedKnob(currentX: number) {
+    const rect = (this.rect = this.rangeSlider!.getBoundingClientRect() as any);
+
+    // figure out which knob they started closer to
+    let ratio = clamp(0, (currentX - rect.left) / rect.width, 1);
+    if (isRTL(this.el)) {
+      ratio = 1 - ratio;
+    }
+    this.pressedKnob = !this.dualKnobs || Math.abs(this.ratioA - ratio) < Math.abs(this.ratioB - ratio) ? 'A' : 'B';
+
+    this.setFocus(this.pressedKnob);
+  }
+
   private get valA() {
     return ratioToValue(this.ratioA, this.min, this.max, this.step);
   }
@@ -799,7 +877,39 @@ Developers can dismiss this warning by removing their usage of the "legacy" prop
     }
 
     return (
-      <div class="range-slider" ref={(rangeEl) => (this.rangeSlider = rangeEl)}>
+      <div
+        class="range-slider"
+        ref={(rangeEl) => (this.rangeSlider = rangeEl)}
+        /**
+         * Since the gesture has a threshold, the value
+         * won't change until the user has dragged past
+         * the threshold. This is to prevent the range
+         * from moving when the user is scrolling.
+         *
+         * This results in the value not being updated
+         * and the event emitters not being triggered
+         * if the user taps on the range. This is why
+         * we need to listen for the "pointerUp" event.
+         */
+        onPointerUp={(ev: PointerEvent) => {
+          /**
+           * If the user drags the knob on the web
+           * version (does not occur on mobile),
+           * the "pointerUp" event will be triggered
+           * along with the gesture's events.
+           * This leads to duplicate events.
+           *
+           * By checking if the pressedKnob is undefined,
+           * we can determine if the "pointerUp" event was
+           * triggered by a tap or a drag. If it was
+           * dragged, the pressedKnob will be defined.
+           */
+          if (this.pressedKnob === undefined) {
+            this.onStart();
+            this.onEnd(ev);
+          }
+        }}
+      >
         {ticks.map((tick) => (
           <div
             style={tickStyle(tick)}
diff --git a/core/src/components/range/test/label/range.e2e.ts b/core/src/components/range/test/label/range.e2e.ts
index 409f4a3258..c8925d35a8 100644
--- a/core/src/components/range/test/label/range.e2e.ts
+++ b/core/src/components/range/test/label/range.e2e.ts
@@ -7,7 +7,7 @@ configs().forEach(({ title, screenshot, config }) => {
       test('should render a range with no visible label', async ({ page }) => {
         await page.setContent(
           `
-          <ion-range legacy="true"></ion-range>
+          <ion-range style="padding-inline-start: 20px;" aria-label="Range"></ion-range>
         `,
           config
         );
@@ -80,7 +80,7 @@ configs().forEach(({ title, screenshot, config }) => {
       test('should render a range with no visible label', async ({ page }) => {
         await page.setContent(
           `
-          <ion-range legacy="true">
+          <ion-range aria-label="Range">
             <ion-icon name="volume-off" slot="start"></ion-icon>
             <ion-icon name="volume-high" slot="end"></ion-icon>
           </ion-range>
diff --git a/core/src/components/range/test/label/range.e2e.ts-snapshots/range-items-no-label-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/range/test/label/range.e2e.ts-snapshots/range-items-no-label-ios-ltr-Mobile-Chrome-linux.png
index a8bd6b11c2..d8a13f78bd 100644
Binary files a/core/src/components/range/test/label/range.e2e.ts-snapshots/range-items-no-label-ios-ltr-Mobile-Chrome-linux.png and b/core/src/components/range/test/label/range.e2e.ts-snapshots/range-items-no-label-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/range/test/label/range.e2e.ts-snapshots/range-items-no-label-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/range/test/label/range.e2e.ts-snapshots/range-items-no-label-ios-ltr-Mobile-Firefox-linux.png
index 20b52f6e9a..5d35bc3850 100644
Binary files a/core/src/components/range/test/label/range.e2e.ts-snapshots/range-items-no-label-ios-ltr-Mobile-Firefox-linux.png and b/core/src/components/range/test/label/range.e2e.ts-snapshots/range-items-no-label-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/range/test/label/range.e2e.ts-snapshots/range-items-no-label-ios-ltr-Mobile-Safari-linux.png b/core/src/components/range/test/label/range.e2e.ts-snapshots/range-items-no-label-ios-ltr-Mobile-Safari-linux.png
index bddfe5df4d..684e742363 100644
Binary files a/core/src/components/range/test/label/range.e2e.ts-snapshots/range-items-no-label-ios-ltr-Mobile-Safari-linux.png and b/core/src/components/range/test/label/range.e2e.ts-snapshots/range-items-no-label-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/range/test/label/range.e2e.ts-snapshots/range-items-no-label-ios-rtl-Mobile-Chrome-linux.png b/core/src/components/range/test/label/range.e2e.ts-snapshots/range-items-no-label-ios-rtl-Mobile-Chrome-linux.png
index 06db2a4e7f..af420833d1 100644
Binary files a/core/src/components/range/test/label/range.e2e.ts-snapshots/range-items-no-label-ios-rtl-Mobile-Chrome-linux.png and b/core/src/components/range/test/label/range.e2e.ts-snapshots/range-items-no-label-ios-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/range/test/label/range.e2e.ts-snapshots/range-items-no-label-ios-rtl-Mobile-Firefox-linux.png b/core/src/components/range/test/label/range.e2e.ts-snapshots/range-items-no-label-ios-rtl-Mobile-Firefox-linux.png
index dc8c9481d0..f6f965e45f 100644
Binary files a/core/src/components/range/test/label/range.e2e.ts-snapshots/range-items-no-label-ios-rtl-Mobile-Firefox-linux.png and b/core/src/components/range/test/label/range.e2e.ts-snapshots/range-items-no-label-ios-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/range/test/label/range.e2e.ts-snapshots/range-items-no-label-ios-rtl-Mobile-Safari-linux.png b/core/src/components/range/test/label/range.e2e.ts-snapshots/range-items-no-label-ios-rtl-Mobile-Safari-linux.png
index dea69f8e08..7bdc04cbb5 100644
Binary files a/core/src/components/range/test/label/range.e2e.ts-snapshots/range-items-no-label-ios-rtl-Mobile-Safari-linux.png and b/core/src/components/range/test/label/range.e2e.ts-snapshots/range-items-no-label-ios-rtl-Mobile-Safari-linux.png differ
diff --git a/core/src/components/range/test/label/range.e2e.ts-snapshots/range-items-no-label-md-ltr-Mobile-Chrome-linux.png b/core/src/components/range/test/label/range.e2e.ts-snapshots/range-items-no-label-md-ltr-Mobile-Chrome-linux.png
index 85d942ab49..4b6e868032 100644
Binary files a/core/src/components/range/test/label/range.e2e.ts-snapshots/range-items-no-label-md-ltr-Mobile-Chrome-linux.png and b/core/src/components/range/test/label/range.e2e.ts-snapshots/range-items-no-label-md-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/range/test/label/range.e2e.ts-snapshots/range-items-no-label-md-ltr-Mobile-Firefox-linux.png b/core/src/components/range/test/label/range.e2e.ts-snapshots/range-items-no-label-md-ltr-Mobile-Firefox-linux.png
index 7b7895e58a..ee190b8144 100644
Binary files a/core/src/components/range/test/label/range.e2e.ts-snapshots/range-items-no-label-md-ltr-Mobile-Firefox-linux.png and b/core/src/components/range/test/label/range.e2e.ts-snapshots/range-items-no-label-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/range/test/label/range.e2e.ts-snapshots/range-items-no-label-md-ltr-Mobile-Safari-linux.png b/core/src/components/range/test/label/range.e2e.ts-snapshots/range-items-no-label-md-ltr-Mobile-Safari-linux.png
index a90b592471..cbf9560c2f 100644
Binary files a/core/src/components/range/test/label/range.e2e.ts-snapshots/range-items-no-label-md-ltr-Mobile-Safari-linux.png and b/core/src/components/range/test/label/range.e2e.ts-snapshots/range-items-no-label-md-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/range/test/label/range.e2e.ts-snapshots/range-items-no-label-md-rtl-Mobile-Chrome-linux.png b/core/src/components/range/test/label/range.e2e.ts-snapshots/range-items-no-label-md-rtl-Mobile-Chrome-linux.png
index f0bd79fc40..76e06285b3 100644
Binary files a/core/src/components/range/test/label/range.e2e.ts-snapshots/range-items-no-label-md-rtl-Mobile-Chrome-linux.png and b/core/src/components/range/test/label/range.e2e.ts-snapshots/range-items-no-label-md-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/range/test/label/range.e2e.ts-snapshots/range-items-no-label-md-rtl-Mobile-Firefox-linux.png b/core/src/components/range/test/label/range.e2e.ts-snapshots/range-items-no-label-md-rtl-Mobile-Firefox-linux.png
index cc3be5f047..96af4347df 100644
Binary files a/core/src/components/range/test/label/range.e2e.ts-snapshots/range-items-no-label-md-rtl-Mobile-Firefox-linux.png and b/core/src/components/range/test/label/range.e2e.ts-snapshots/range-items-no-label-md-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/range/test/label/range.e2e.ts-snapshots/range-items-no-label-md-rtl-Mobile-Safari-linux.png b/core/src/components/range/test/label/range.e2e.ts-snapshots/range-items-no-label-md-rtl-Mobile-Safari-linux.png
index 5c72694bf0..ff22d0e6fa 100644
Binary files a/core/src/components/range/test/label/range.e2e.ts-snapshots/range-items-no-label-md-rtl-Mobile-Safari-linux.png and b/core/src/components/range/test/label/range.e2e.ts-snapshots/range-items-no-label-md-rtl-Mobile-Safari-linux.png differ
diff --git a/core/src/components/range/test/label/range.e2e.ts-snapshots/range-no-items-no-label-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/range/test/label/range.e2e.ts-snapshots/range-no-items-no-label-ios-ltr-Mobile-Chrome-linux.png
index a5cb69a9bd..08b3147a59 100644
Binary files a/core/src/components/range/test/label/range.e2e.ts-snapshots/range-no-items-no-label-ios-ltr-Mobile-Chrome-linux.png and b/core/src/components/range/test/label/range.e2e.ts-snapshots/range-no-items-no-label-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/range/test/label/range.e2e.ts-snapshots/range-no-items-no-label-ios-ltr-Mobile-Firefox-linux.png b/core/src/components/range/test/label/range.e2e.ts-snapshots/range-no-items-no-label-ios-ltr-Mobile-Firefox-linux.png
index 57d20c5029..441056c219 100644
Binary files a/core/src/components/range/test/label/range.e2e.ts-snapshots/range-no-items-no-label-ios-ltr-Mobile-Firefox-linux.png and b/core/src/components/range/test/label/range.e2e.ts-snapshots/range-no-items-no-label-ios-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/range/test/label/range.e2e.ts-snapshots/range-no-items-no-label-ios-ltr-Mobile-Safari-linux.png b/core/src/components/range/test/label/range.e2e.ts-snapshots/range-no-items-no-label-ios-ltr-Mobile-Safari-linux.png
index c19eb0ce6a..7a9bb8cdcc 100644
Binary files a/core/src/components/range/test/label/range.e2e.ts-snapshots/range-no-items-no-label-ios-ltr-Mobile-Safari-linux.png and b/core/src/components/range/test/label/range.e2e.ts-snapshots/range-no-items-no-label-ios-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/range/test/label/range.e2e.ts-snapshots/range-no-items-no-label-ios-rtl-Mobile-Chrome-linux.png b/core/src/components/range/test/label/range.e2e.ts-snapshots/range-no-items-no-label-ios-rtl-Mobile-Chrome-linux.png
index 16c3d3cd67..396aeafc86 100644
Binary files a/core/src/components/range/test/label/range.e2e.ts-snapshots/range-no-items-no-label-ios-rtl-Mobile-Chrome-linux.png and b/core/src/components/range/test/label/range.e2e.ts-snapshots/range-no-items-no-label-ios-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/range/test/label/range.e2e.ts-snapshots/range-no-items-no-label-ios-rtl-Mobile-Firefox-linux.png b/core/src/components/range/test/label/range.e2e.ts-snapshots/range-no-items-no-label-ios-rtl-Mobile-Firefox-linux.png
index e2362a244b..29bcaab392 100644
Binary files a/core/src/components/range/test/label/range.e2e.ts-snapshots/range-no-items-no-label-ios-rtl-Mobile-Firefox-linux.png and b/core/src/components/range/test/label/range.e2e.ts-snapshots/range-no-items-no-label-ios-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/range/test/label/range.e2e.ts-snapshots/range-no-items-no-label-ios-rtl-Mobile-Safari-linux.png b/core/src/components/range/test/label/range.e2e.ts-snapshots/range-no-items-no-label-ios-rtl-Mobile-Safari-linux.png
index a79e103954..2dc0e0b290 100644
Binary files a/core/src/components/range/test/label/range.e2e.ts-snapshots/range-no-items-no-label-ios-rtl-Mobile-Safari-linux.png and b/core/src/components/range/test/label/range.e2e.ts-snapshots/range-no-items-no-label-ios-rtl-Mobile-Safari-linux.png differ
diff --git a/core/src/components/range/test/label/range.e2e.ts-snapshots/range-no-items-no-label-md-ltr-Mobile-Chrome-linux.png b/core/src/components/range/test/label/range.e2e.ts-snapshots/range-no-items-no-label-md-ltr-Mobile-Chrome-linux.png
index 424bba0f1b..19109e87c7 100644
Binary files a/core/src/components/range/test/label/range.e2e.ts-snapshots/range-no-items-no-label-md-ltr-Mobile-Chrome-linux.png and b/core/src/components/range/test/label/range.e2e.ts-snapshots/range-no-items-no-label-md-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/range/test/label/range.e2e.ts-snapshots/range-no-items-no-label-md-ltr-Mobile-Firefox-linux.png b/core/src/components/range/test/label/range.e2e.ts-snapshots/range-no-items-no-label-md-ltr-Mobile-Firefox-linux.png
index 146f76f148..d1478b33a2 100644
Binary files a/core/src/components/range/test/label/range.e2e.ts-snapshots/range-no-items-no-label-md-ltr-Mobile-Firefox-linux.png and b/core/src/components/range/test/label/range.e2e.ts-snapshots/range-no-items-no-label-md-ltr-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/range/test/label/range.e2e.ts-snapshots/range-no-items-no-label-md-ltr-Mobile-Safari-linux.png b/core/src/components/range/test/label/range.e2e.ts-snapshots/range-no-items-no-label-md-ltr-Mobile-Safari-linux.png
index 1e489e8489..e522577c7e 100644
Binary files a/core/src/components/range/test/label/range.e2e.ts-snapshots/range-no-items-no-label-md-ltr-Mobile-Safari-linux.png and b/core/src/components/range/test/label/range.e2e.ts-snapshots/range-no-items-no-label-md-ltr-Mobile-Safari-linux.png differ
diff --git a/core/src/components/range/test/label/range.e2e.ts-snapshots/range-no-items-no-label-md-rtl-Mobile-Chrome-linux.png b/core/src/components/range/test/label/range.e2e.ts-snapshots/range-no-items-no-label-md-rtl-Mobile-Chrome-linux.png
index 911c53b550..41640c2bea 100644
Binary files a/core/src/components/range/test/label/range.e2e.ts-snapshots/range-no-items-no-label-md-rtl-Mobile-Chrome-linux.png and b/core/src/components/range/test/label/range.e2e.ts-snapshots/range-no-items-no-label-md-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/range/test/label/range.e2e.ts-snapshots/range-no-items-no-label-md-rtl-Mobile-Firefox-linux.png b/core/src/components/range/test/label/range.e2e.ts-snapshots/range-no-items-no-label-md-rtl-Mobile-Firefox-linux.png
index 57b7484ee4..8a26e9af16 100644
Binary files a/core/src/components/range/test/label/range.e2e.ts-snapshots/range-no-items-no-label-md-rtl-Mobile-Firefox-linux.png and b/core/src/components/range/test/label/range.e2e.ts-snapshots/range-no-items-no-label-md-rtl-Mobile-Firefox-linux.png differ
diff --git a/core/src/components/range/test/label/range.e2e.ts-snapshots/range-no-items-no-label-md-rtl-Mobile-Safari-linux.png b/core/src/components/range/test/label/range.e2e.ts-snapshots/range-no-items-no-label-md-rtl-Mobile-Safari-linux.png
index 9371b3a85c..c03f792fea 100644
Binary files a/core/src/components/range/test/label/range.e2e.ts-snapshots/range-no-items-no-label-md-rtl-Mobile-Safari-linux.png and b/core/src/components/range/test/label/range.e2e.ts-snapshots/range-no-items-no-label-md-rtl-Mobile-Safari-linux.png differ
diff --git a/core/src/components/range/test/range-events.e2e.ts b/core/src/components/range/test/range-events.e2e.ts
index 3eeba5437b..610270f4fb 100644
--- a/core/src/components/range/test/range-events.e2e.ts
+++ b/core/src/components/range/test/range-events.e2e.ts
@@ -20,7 +20,7 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
         await page.setContent(
           `
           <div style="padding: 0 20px">
-            <ion-range value="20"></ion-range>
+            <ion-range aria-label="Range" value="20"></ion-range>
           </div>
         `,
           config
@@ -52,7 +52,7 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
       });
 
       test('should emit start/end events, keyboard', async ({ page }) => {
-        await page.setContent(`<ion-range value="20"></ion-range>`, config);
+        await page.setContent(`<ion-range aria-label="Range" value="20"></ion-range>`, config);
 
         const rangeStart = await page.spyOnEvent('ionKnobMoveStart');
         const rangeEnd = await page.spyOnEvent('ionKnobMoveEnd');
@@ -67,6 +67,39 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
         expect(rangeEnd).toHaveReceivedEventDetail({ value: 21 });
       });
 
+      test('should emit end event on tap', async ({ page }, testInfo) => {
+        testInfo.annotations.push({
+          type: 'issue',
+          description: 'https://github.com/ionic-team/ionic-framework/issues/28487',
+        });
+
+        await page.setContent(`<ion-range aria-label="Range" value="20"></ion-range>`, config);
+
+        const range = page.locator('ion-range');
+        const rangeEndSpy = await page.spyOnEvent('ionKnobMoveEnd');
+        const rangeBoundingBox = await range.boundingBox();
+        /**
+         * Coordinates for the click event.
+         * These need to be near the end of the range
+         * (or anything that isn't the current value).
+         *
+         * The number 50 is arbitrary, but it should be
+         * less than the width of the range.
+         */
+        const x = rangeBoundingBox!.width - 50;
+        // The y coordinate is the middle of the range.
+        const y = rangeBoundingBox!.height / 2;
+
+        // Click near the end of the range.
+        await range.click({
+          position: { x, y },
+        });
+
+        await rangeEndSpy.next();
+
+        expect(rangeEndSpy.length).toBe(1);
+      });
+
       // TODO FW-2873
       test.skip('should not scroll when the knob is swiped', async ({ page, skip }) => {
         skip.browser('webkit', 'mouse.wheel is not available in WebKit');
diff --git a/core/src/components/reorder-group/test/basic/index.html b/core/src/components/reorder-group/test/basic/index.html
index bf44ef490a..55e034c82a 100644
--- a/core/src/components/reorder-group/test/basic/index.html
+++ b/core/src/components/reorder-group/test/basic/index.html
@@ -99,15 +99,13 @@
 
             <ion-reorder>
               <ion-item>
-                <ion-label> Item 11 (the whole item can be dragged) </ion-label>
-                <ion-toggle></ion-toggle>
+                <ion-toggle>Item 11 (the whole item can be dragged)</ion-toggle>
               </ion-item>
             </ion-reorder>
 
             <ion-reorder>
               <ion-item>
-                <ion-label> Item 12 (the whole item can be dragged) </ion-label>
-                <ion-checkbox></ion-checkbox>
+                <ion-checkbox>Item 12 (the whole item can be dragged)</ion-checkbox>
               </ion-item>
             </ion-reorder>
           </ion-reorder-group>
diff --git a/core/src/components/reorder-group/test/nested/index.html b/core/src/components/reorder-group/test/nested/index.html
index bbbe081813..0f425dc881 100644
--- a/core/src/components/reorder-group/test/nested/index.html
+++ b/core/src/components/reorder-group/test/nested/index.html
@@ -12,6 +12,12 @@
     <script src="../../../../../scripts/testing/scripts.js"></script>
     <script nomodule src="../../../../../dist/ionic/ionic.js"></script>
     <script type="module" src="../../../../../dist/ionic/ionic.esm.js"></script>
+
+    <style>
+      app-reorder {
+        display: block;
+      }
+    </style>
   </head>
 
   <body>
diff --git a/core/src/components/router/test/guards/index.html b/core/src/components/router/test/guards/index.html
index 0ea2d5ea90..9e9d0a2933 100644
--- a/core/src/components/router/test/guards/index.html
+++ b/core/src/components/router/test/guards/index.html
@@ -113,18 +113,15 @@
         </ion-list-header>
 
         <ion-item>
-          <ion-label>Allow Navigation</ion-label>
-          <ion-radio value="allow"></ion-radio>
+          <ion-radio value="allow">Allow Navigation</ion-radio>
         </ion-item>
 
         <ion-item>
-          <ion-label>Block Navigation</ion-label>
-          <ion-radio value="block"></ion-radio>
+          <ion-radio value="block">Block Navigation</ion-radio>
         </ion-item>
 
         <ion-item>
-          <ion-label>Redirect</ion-label>
-          <ion-radio value="redirect"></ion-radio>
+          <ion-radio value="redirect">Redirect</ion-radio>
         </ion-item>
       </ion-radio-group>
 
@@ -136,18 +133,15 @@
         </ion-list-header>
 
         <ion-item>
-          <ion-label>Allow Navigation</ion-label>
-          <ion-radio value="allow"></ion-radio>
+          <ion-radio value="allow">Allow Navigation</ion-radio>
         </ion-item>
 
         <ion-item>
-          <ion-label>Block Navigation</ion-label>
-          <ion-radio value="block"></ion-radio>
+          <ion-radio value="block">Block Navigation</ion-radio>
         </ion-item>
 
         <ion-item>
-          <ion-label>Redirect</ion-label>
-          <ion-radio value="redirect"></ion-radio>
+          <ion-radio value="redirect">Redirect</ion-radio>
         </ion-item>
       </ion-radio-group>
     </div>
diff --git a/core/src/components/select-popover/select-popover.scss b/core/src/components/select-popover/select-popover.scss
index 3fba7de13c..c22aa27321 100644
--- a/core/src/components/select-popover/select-popover.scss
+++ b/core/src/components/select-popover/select-popover.scss
@@ -8,3 +8,14 @@ ion-list-header,
 ion-label {
   @include margin(0);
 }
+
+
+/**
+ * The main content inside of a popover has overflow: hidden
+ * so that a descendant ion-content can be scrolled.
+ * However, select-popover does not use ion-content so we need
+ * to explicitly make this container scrollable.
+ */
+:host {
+  overflow-y: auto;
+}
diff --git a/core/src/components/select/select.tsx b/core/src/components/select/select.tsx
index 9fe26349bb..e15ae27e65 100644
--- a/core/src/components/select/select.tsx
+++ b/core/src/components/select/select.tsx
@@ -2,7 +2,7 @@ import type { ComponentInterface, EventEmitter } from '@stencil/core';
 import { Component, Element, Event, Host, Method, Prop, State, Watch, h, forceUpdate } from '@stencil/core';
 import type { LegacyFormController, NotchController } from '@utils/forms';
 import { compareOptions, createLegacyFormController, createNotchController, isOptionSelected } from '@utils/forms';
-import { findItemLabel, focusElement, getAriaLabel, renderHiddenInput, inheritAttributes } from '@utils/helpers';
+import { findItemLabel, focusVisibleElement, getAriaLabel, renderHiddenInput, inheritAttributes } from '@utils/helpers';
 import type { Attributes } from '@utils/helpers';
 import { printIonWarning } from '@utils/logging';
 import { actionSheetController, alertController, popoverController } from '@utils/overlays';
@@ -329,7 +329,7 @@ export class Select implements ComponentInterface {
         );
 
         if (selectedItem) {
-          focusElement(selectedItem);
+          focusVisibleElement(selectedItem);
 
           /**
            * Browsers such as Firefox do not
@@ -355,7 +355,7 @@ export class Select implements ComponentInterface {
           'ion-radio:not(.radio-disabled), ion-checkbox:not(.checkbox-disabled)'
         );
         if (firstEnabledOption) {
-          focusElement(firstEnabledOption.closest('ion-item')!);
+          focusVisibleElement(firstEnabledOption.closest('ion-item')!);
 
           /**
            * Focus the option for the same reason as we do above.
diff --git a/core/src/components/select/test/disabled/select.e2e.ts b/core/src/components/select/test/disabled/select.e2e.ts
index 831d471d70..9bc9389a3a 100644
--- a/core/src/components/select/test/disabled/select.e2e.ts
+++ b/core/src/components/select/test/disabled/select.e2e.ts
@@ -14,7 +14,7 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
 
       await page.setContent(
         `
-        <ion-select interface="popover">
+        <ion-select aria-label="Select" interface="popover">
           <ion-select-option value="a" disabled="true">A</ion-select-option>
           <ion-select-option value="b">B</ion-select-option>
         </ion-select>
diff --git a/core/src/components/split-pane/split-pane.tsx b/core/src/components/split-pane/split-pane.tsx
index bd251864b5..c78d115ab4 100644
--- a/core/src/components/split-pane/split-pane.tsx
+++ b/core/src/components/split-pane/split-pane.tsx
@@ -112,17 +112,16 @@ export class SplitPane implements ComponentInterface {
       return;
     }
 
-    if ((window as any).matchMedia) {
-      // Listen on media query
-      const callback = (q: MediaQueryList) => {
-        this.visible = q.matches;
-      };
+    // Listen on media query
+    const callback = (q: MediaQueryList) => {
+      this.visible = q.matches;
+    };
 
-      const mediaList = window.matchMedia(mediaQuery);
-      mediaList.addListener(callback as any);
-      this.rmL = () => mediaList.removeListener(callback as any);
-      this.visible = mediaList.matches;
-    }
+    const mediaList = window.matchMedia(mediaQuery);
+    // TODO FW-5869
+    mediaList.addListener(callback as any);
+    this.rmL = () => mediaList.removeListener(callback as any);
+    this.visible = mediaList.matches;
   }
 
   private isPane(element: HTMLElement): boolean {
diff --git a/core/src/components/tab-button/test/layout/tab-button.e2e.ts-snapshots/tab-button-no-icon-ios-ltr-Mobile-Chrome-linux.png b/core/src/components/tab-button/test/layout/tab-button.e2e.ts-snapshots/tab-button-no-icon-ios-ltr-Mobile-Chrome-linux.png
index d46ba379a5..1bb22f0712 100644
Binary files a/core/src/components/tab-button/test/layout/tab-button.e2e.ts-snapshots/tab-button-no-icon-ios-ltr-Mobile-Chrome-linux.png and b/core/src/components/tab-button/test/layout/tab-button.e2e.ts-snapshots/tab-button-no-icon-ios-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/tab-button/test/layout/tab-button.e2e.ts-snapshots/tab-button-no-icon-ios-rtl-Mobile-Chrome-linux.png b/core/src/components/tab-button/test/layout/tab-button.e2e.ts-snapshots/tab-button-no-icon-ios-rtl-Mobile-Chrome-linux.png
index 7e01f5b824..bdfceeaa5b 100644
Binary files a/core/src/components/tab-button/test/layout/tab-button.e2e.ts-snapshots/tab-button-no-icon-ios-rtl-Mobile-Chrome-linux.png and b/core/src/components/tab-button/test/layout/tab-button.e2e.ts-snapshots/tab-button-no-icon-ios-rtl-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/textarea/test/cols/textarea.e2e.ts-snapshots/textarea-cols-md-ltr-Mobile-Chrome-linux.png b/core/src/components/textarea/test/cols/textarea.e2e.ts-snapshots/textarea-cols-md-ltr-Mobile-Chrome-linux.png
index 4ba8dfd503..bfdb0c0b45 100644
Binary files a/core/src/components/textarea/test/cols/textarea.e2e.ts-snapshots/textarea-cols-md-ltr-Mobile-Chrome-linux.png and b/core/src/components/textarea/test/cols/textarea.e2e.ts-snapshots/textarea-cols-md-ltr-Mobile-Chrome-linux.png differ
diff --git a/core/src/components/textarea/test/textarea-events.e2e.ts b/core/src/components/textarea/test/textarea-events.e2e.ts
index d463061023..6b30f7a386 100644
--- a/core/src/components/textarea/test/textarea-events.e2e.ts
+++ b/core/src/components/textarea/test/textarea-events.e2e.ts
@@ -8,7 +8,7 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
   test.describe(title('textarea: events: ionChange'), () => {
     test.describe('when the textarea is blurred', () => {
       test('should emit if the value has changed', async ({ page }) => {
-        await page.setContent(`<ion-textarea></ion-textarea>`, config);
+        await page.setContent(`<ion-textarea aria-label="textarea"></ion-textarea>`, config);
 
         const nativeTextarea = page.locator('ion-textarea textarea');
         const ionChangeSpy = await page.spyOnEvent('ionChange');
@@ -24,7 +24,10 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
       });
 
       test('should emit if the textarea is cleared with an initial value', async ({ page }) => {
-        await page.setContent(`<ion-textarea clear-on-edit="true" value="123"></ion-textarea>`, config);
+        await page.setContent(
+          `<ion-textarea aria-label="textarea" clear-on-edit="true" value="123"></ion-textarea>`,
+          config
+        );
 
         const textarea = page.locator('ion-textarea');
         const nativeTextarea = textarea.locator('textarea');
@@ -41,7 +44,7 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
       });
 
       test('should not emit if the value is set programmatically', async ({ page }) => {
-        await page.setContent(`<ion-textarea></ion-textarea>`, config);
+        await page.setContent(`<ion-textarea aria-label="textarea"></ion-textarea>`, config);
 
         const textarea = page.locator('ion-textarea');
         const ionChangeSpy = await page.spyOnEvent('ionChange');
@@ -67,7 +70,7 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
   });
   test.describe(title('textarea: events: ionInput'), () => {
     test('should emit when the user types', async ({ page }) => {
-      await page.setContent(`<ion-textarea value="some value"></ion-textarea>`, config);
+      await page.setContent(`<ion-textarea aria-label="textarea" value="some value"></ion-textarea>`, config);
 
       const ionInputSpy = await page.spyOnEvent('ionInput');
 
diff --git a/core/src/components/toast/test/toast.spec.tsx b/core/src/components/toast/test/toast.spec.tsx
index a0f812df1f..961b248116 100644
--- a/core/src/components/toast/test/toast.spec.tsx
+++ b/core/src/components/toast/test/toast.spec.tsx
@@ -93,6 +93,19 @@ describe('toast: a11y smoke test', () => {
 });
 
 describe('toast: duration config', () => {
+  afterEach(() => {
+    /**
+     * Important: Reset the config
+     * after each test as it is not
+     * automatically reset.
+     * Otherwise, toasts in other tests
+     * will take on any toastDuration value
+     * set and timeouts will potentially run
+     * after tests are finished.
+     */
+    config.reset({});
+  });
+
   it('should have duration set to 0', async () => {
     const page = await newSpecPage({
       components: [Toast],
diff --git a/core/src/components/toast/toast-interface.ts b/core/src/components/toast/toast-interface.ts
index d5ddff69e4..af320f59ba 100644
--- a/core/src/components/toast/toast-interface.ts
+++ b/core/src/components/toast/toast-interface.ts
@@ -1,4 +1,4 @@
-import type { AnimationBuilder, Color, Mode } from '../../interface';
+import type { AnimationBuilder, Color, LiteralUnion, Mode } from '../../interface';
 import type { IonicSafeString } from '../../utils/sanitization';
 
 export interface ToastOptions {
@@ -33,8 +33,7 @@ export interface ToastButton {
   text?: string;
   icon?: string;
   side?: 'start' | 'end';
-  role?: 'cancel' | string;
-
+  role?: LiteralUnion<'cancel', string>;
   /**
    * @deprecated Use the toast button's CSS Shadow Parts instead.
    */
diff --git a/core/src/components/toast/toast.tsx b/core/src/components/toast/toast.tsx
index fe960d3e32..a0938be7d6 100644
--- a/core/src/components/toast/toast.tsx
+++ b/core/src/components/toast/toast.tsx
@@ -401,6 +401,10 @@ export class Toast implements ComponentInterface, OverlayInterface {
    * This can be useful in a button handler for determining which button was
    * clicked to dismiss the toast.
    * Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.
+   *
+   * This is a no-op if the overlay has not been presented yet. If you want
+   * to remove an overlay from the DOM that was never presented, use the
+   * [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
    */
   @Method()
   async dismiss(data?: any, role?: string): Promise<boolean> {
diff --git a/core/src/components/toggle/test/enable-on-off-labels/index.html b/core/src/components/toggle/test/enable-on-off-labels/index.html
index 4e18d63498..28483e3203 100644
--- a/core/src/components/toggle/test/enable-on-off-labels/index.html
+++ b/core/src/components/toggle/test/enable-on-off-labels/index.html
@@ -177,8 +177,7 @@
           <ion-popover class="options-popover" trigger="popover-trigger">
             <ion-list lines="none">
               <ion-item id="dark-mode">
-                <ion-label>Dark Mode</ion-label>
-                <ion-checkbox slot="end"></ion-checkbox>
+                <ion-checkbox>Dark Mode</ion-checkbox>
               </ion-item>
             </ion-list>
           </ion-popover>
diff --git a/core/src/interface.d.ts b/core/src/interface.d.ts
index 3ac6705855..83ae6e2b6b 100644
--- a/core/src/interface.d.ts
+++ b/core/src/interface.d.ts
@@ -131,7 +131,7 @@ export type PredefinedColors =
   | 'medium'
   | 'dark';
 
-type LiteralUnion<T extends U, U = string> = T | (U & Record<never, never>);
+export type LiteralUnion<T extends U, U = string> = T | (U & Record<never, never>);
 
 export type Color = LiteralUnion<PredefinedColors, string>;
 export type Mode = 'ios' | 'md';
diff --git a/core/src/themes/test/css-variables/index.html b/core/src/themes/test/css-variables/index.html
index 97ce01d8ef..5b037535b4 100644
--- a/core/src/themes/test/css-variables/index.html
+++ b/core/src/themes/test/css-variables/index.html
@@ -250,19 +250,16 @@
 
                 <ion-card>
                   <ion-card-content>
-                    <ion-item fill="solid">
+                    <ion-input fill="solid" label="Standard" label-placement="floating" value="Has Initial Value">
                       <ion-icon slot="start" name="calendar-clear-outline"></ion-icon>
-                      <ion-label position="floating">Standard</ion-label>
-                      <ion-input value="Has Initial Value"></ion-input>
                       <ion-note slot="error">Error Text</ion-note>
-                    </ion-item>
+                    </ion-input>
 
-                    <ion-item fill="outline">
-                      <ion-label position="floating">Standard</ion-label>
+                    <br />
+
+                    <ion-input fill="outline" helper-text="Helper text" label="Standard" label-placement="floating">
                       <ion-icon slot="end" name="trash"></ion-icon>
-                      <ion-input></ion-input>
-                      <ion-note slot="error">Helper Text</ion-note>
-                    </ion-item>
+                    </ion-input>
                   </ion-card-content>
                 </ion-card>
               </section>
@@ -354,18 +351,15 @@
                       <ion-label>Fruits</ion-label>
                     </ion-item-divider>
                     <ion-item>
-                      <ion-label>Apple</ion-label>
-                      <ion-radio slot="start" value="apple"></ion-radio>
+                      <ion-radio value="apple">Apple</ion-radio>
                     </ion-item>
 
                     <ion-item>
-                      <ion-label>Grape, checked, disabled</ion-label>
-                      <ion-radio slot="start" id="grapeChecked" value="grape" disabled></ion-radio>
+                      <ion-radio id="grapeChecked" value="grape" disabled>Grape, checked, disabled</ion-radio>
                     </ion-item>
 
                     <ion-item>
-                      <ion-label>Cherry</ion-label>
-                      <ion-radio slot="start" color="danger" value="cherry"></ion-radio>
+                      <ion-radio color="danger" value="cherry">Cherry</ion-radio>
                     </ion-item>
                   </ion-radio-group>
                 </ion-list>
@@ -376,37 +370,34 @@
                       <ion-label>Veggies</ion-label>
                     </ion-item-divider>
                     <ion-item>
-                      <ion-label>Celery</ion-label>
-                      <ion-radio color="tertiary" slot="start" value="celery"></ion-radio>
+                      <ion-radio color="tertiary" value="celery">Celery</ion-radio>
                     </ion-item>
 
                     <ion-item>
-                      <ion-label>Lettuce, checked, disabled</ion-label>
-                      <ion-radio color="tertiary" slot="start" value="lettuce" disabled></ion-radio>
+                      <ion-radio color="tertiary" value="lettuce" disabled>Lettuce, checked, disabled</ion-radio>
                     </ion-item>
 
                     <ion-item>
-                      <ion-label>Onion</ion-label>
-                      <ion-radio color="tertiary" slot="start" value="onion"></ion-radio>
+                      <ion-radio color="tertiary" value="onion">Onion</ion-radio>
                     </ion-item>
                   </ion-radio-group>
                 </ion-list>
 
                 <ion-list>
                   <ion-item>
-                    <ion-range value="20"></ion-range>
+                    <ion-range aria-label="Range" value="20"></ion-range>
                   </ion-item>
 
                   <ion-item>
-                    <ion-range color="success" value="20"></ion-range>
+                    <ion-range aria-label="Range" color="success" value="20"></ion-range>
                   </ion-item>
 
                   <ion-item>
-                    <ion-range color="warning" value="20"></ion-range>
+                    <ion-range aria-label="Range" color="warning" value="20"></ion-range>
                   </ion-item>
 
                   <ion-item>
-                    <ion-range color="danger" value="20"></ion-range>
+                    <ion-range aria-label="Range" color="danger" value="20"></ion-range>
                   </ion-item>
                 </ion-list>
               </section>
@@ -414,65 +405,51 @@
               <section>
                 <ion-list>
                   <ion-item>
-                    <ion-label>Default</ion-label>
-                    <ion-checkbox slot="end" checked></ion-checkbox>
+                    <ion-checkbox checked>Default</ion-checkbox>
                   </ion-item>
                   <ion-item>
-                    <ion-label>Primary</ion-label>
-                    <ion-checkbox slot="end" color="primary" checked></ion-checkbox>
+                    <ion-checkbox color="primary" checked>Primary</ion-checkbox>
                   </ion-item>
                   <ion-item>
-                    <ion-label>Secondary</ion-label>
-                    <ion-checkbox slot="end" color="secondary" checked></ion-checkbox>
+                    <ion-checkbox color="secondary" checked>Secondary</ion-checkbox>
                   </ion-item>
                   <ion-item>
-                    <ion-label>Warning</ion-label>
-                    <ion-checkbox slot="end" color="warning" checked></ion-checkbox>
+                    <ion-checkbox color="warning" checked>Warning</ion-checkbox>
                   </ion-item>
                   <ion-item>
-                    <ion-label>Danger</ion-label>
-                    <ion-checkbox slot="end" color="danger" checked></ion-checkbox>
+                    <ion-checkbox color="danger" checked>Danger</ion-checkbox>
                   </ion-item>
                   <ion-item>
-                    <ion-label>Light</ion-label>
-                    <ion-checkbox slot="end" color="light" checked></ion-checkbox>
+                    <ion-checkbox color="light" checked>Light</ion-checkbox>
                   </ion-item>
                   <ion-item>
-                    <ion-label>Dark</ion-label>
-                    <ion-checkbox slot="end" color="dark" checked></ion-checkbox>
+                    <ion-checkbox color="dark" checked>Dark</ion-checkbox>
                   </ion-item>
                   <ion-item>
-                    <ion-label>Unchecked by Default</ion-label>
-                    <ion-checkbox slot="end"></ion-checkbox>
+                    <ion-checkbox>Unchecked by Default</ion-checkbox>
                   </ion-item>
                   <ion-item>
-                    <ion-label>Disabled</ion-label>
-                    <ion-checkbox slot="end" disabled></ion-checkbox>
+                    <ion-checkbox disabled>Disabled</ion-checkbox>
                   </ion-item>
 
                   <ion-item>
-                    <ion-toggle slot="start"></ion-toggle>
-                    <ion-label>Blueberry</ion-label>
+                    <ion-toggle>Blueberry</ion-toggle>
                   </ion-item>
 
                   <ion-item>
-                    <ion-toggle color="success" slot="start" checked></ion-toggle>
-                    <ion-label>Lettuce</ion-label>
+                    <ion-toggle color="success" checked>Lettuce</ion-toggle>
                   </ion-item>
 
                   <ion-item>
-                    <ion-toggle color="danger" slot="start" checked></ion-toggle>
-                    <ion-label>Apple</ion-label>
+                    <ion-toggle color="danger" checked>Apple</ion-toggle>
                   </ion-item>
 
                   <ion-item>
-                    <ion-toggle color="tertiary" slot="start" checked></ion-toggle>
-                    <ion-label>Radish</ion-label>
+                    <ion-toggle color="tertiary" checked>Radish</ion-toggle>
                   </ion-item>
 
                   <ion-item>
-                    <ion-toggle color="dark" slot="start" checked></ion-toggle>
-                    <ion-label>Blackberry</ion-label>
+                    <ion-toggle color="dark" checked>Blackberry</ion-toggle>
                   </ion-item>
                 </ion-list>
               </section>
@@ -485,8 +462,7 @@
             <ion-toolbar>
               <ion-title>Colors</ion-title>
               <div slot="end" class="right-container">
-                <ion-label>Select a Theme:</ion-label>
-                <ion-select interface="popover" class="theme-picker">
+                <ion-select label="Select a Theme:" interface="popover" class="theme-picker">
                   <ion-select-option value="default" selected>Default</ion-select-option>
                   <ion-select-option value="oceanic">Oceanic</ion-select-option>
                   <ion-select-option value="vibrant">Vibrant</ion-select-option>
@@ -914,8 +890,7 @@
             <ion-toolbar>
               <ion-title>Overlays</ion-title>
               <div slot="end" class="right-container">
-                <ion-label>Select a Theme:</ion-label>
-                <ion-select interface="popover" class="theme-picker">
+                <ion-select label="Select a Theme:" interface="popover" class="theme-picker">
                   <ion-select-option value="default" selected>Default</ion-select-option>
                   <ion-select-option value="oceanic">Oceanic</ion-select-option>
                   <ion-select-option value="vibrant">Vibrant</ion-select-option>
@@ -951,8 +926,7 @@
                   <ion-datetime></ion-datetime>
                 </ion-item>
                 <ion-item>
-                  <ion-label>Select</ion-label>
-                  <ion-select>
+                  <ion-select label="Select">
                     <ion-select-option>1</ion-select-option>
                     <ion-select-option>2</ion-select-option>
                     <ion-select-option>3</ion-select-option>
diff --git a/core/src/utils/browser/index.ts b/core/src/utils/browser/index.ts
index fb400d142c..694abc7f51 100644
--- a/core/src/utils/browser/index.ts
+++ b/core/src/utils/browser/index.ts
@@ -72,7 +72,32 @@ type IonicEvents = {
   ): void;
 };
 
-type IonicWindow = Window & IonicEvents;
+export interface CloseWatcher extends EventTarget {
+  new (options?: CloseWatcherOptions): any;
+  requestClose(): void;
+  close(): void;
+  destroy(): void;
+
+  oncancel: (event: Event) => void | null;
+  onclose: (event: Event) => void | null;
+}
+
+interface CloseWatcherOptions {
+  signal: AbortSignal;
+}
+
+/**
+ * Experimental browser features that
+ * are selectively used inside of Ionic
+ * Since they are experimental they typically
+ * do not have types yet, so we can add custom ones
+ * here until types are available.
+ */
+type ExperimentalWindowFeatures = {
+  CloseWatcher?: CloseWatcher;
+};
+
+type IonicWindow = Window & IonicEvents & ExperimentalWindowFeatures;
 type IonicDocument = Document & IonicEvents;
 
 export const win: IonicWindow | undefined = typeof window !== 'undefined' ? window : undefined;
diff --git a/core/src/utils/config.ts b/core/src/utils/config.ts
index 4cf3cc08d0..bc1dc785c2 100644
--- a/core/src/utils/config.ts
+++ b/core/src/utils/config.ts
@@ -204,6 +204,14 @@ export interface IonicConfig {
    */
   platform?: PlatformConfig;
 
+  /**
+   * @experimental
+   * If `true`, the [CloseWatcher API](https://github.com/WICG/close-watcher) will be used to handle
+   * all Escape key and hardware back button presses to dismiss menus and overlays and to navigate.
+   * Note that the `hardwareBackButton` config option must also be `true`.
+   */
+  experimentalCloseWatcher?: boolean;
+
   // PRIVATE configs
   keyboardHeight?: number;
   inputShims?: boolean;
diff --git a/core/src/utils/hardware-back-button.ts b/core/src/utils/hardware-back-button.ts
index 91a0bc540f..1005497faa 100644
--- a/core/src/utils/hardware-back-button.ts
+++ b/core/src/utils/hardware-back-button.ts
@@ -1,3 +1,8 @@
+import { win } from '@utils/browser';
+import type { CloseWatcher } from '@utils/browser';
+
+import { config } from '../global/config';
+
 // TODO(FW-2832): type
 type Handler = (processNextHandler: () => void) => Promise<any> | void | null;
 
@@ -13,6 +18,21 @@ interface HandlerRegister {
   id: number;
 }
 
+/**
+ * CloseWatcher is a newer API that lets
+ * use detect the hardware back button event
+ * in a web browser: https://caniuse.com/?search=closewatcher
+ * However, not every browser supports it yet.
+ *
+ * This needs to be a function so that we can
+ * check the config once it has been set.
+ * Otherwise, this code would be evaluated the
+ * moment this file is evaluated which could be
+ * before the config is set.
+ */
+export const shoudUseCloseWatcher = () =>
+  config.get('experimentalCloseWatcher', false) && win !== undefined && 'CloseWatcher' in win;
+
 /**
  * When hardwareBackButton: false in config,
  * we need to make sure we also block the default
@@ -29,9 +49,9 @@ export const blockHardwareBackButton = () => {
 
 export const startHardwareBackButton = () => {
   const doc = document;
-
   let busy = false;
-  doc.addEventListener('backbutton', () => {
+
+  const backButtonCallback = () => {
     if (busy) {
       return;
     }
@@ -81,7 +101,38 @@ export const startHardwareBackButton = () => {
     };
 
     processHandlers();
-  });
+  };
+
+  /**
+   * If the CloseWatcher is defined then
+   * we don't want to also listen for the native
+   * backbutton event otherwise we may get duplicate
+   * events firing.
+   */
+  if (shoudUseCloseWatcher()) {
+    let watcher: CloseWatcher | undefined;
+
+    const configureWatcher = () => {
+      watcher?.destroy();
+      watcher = new win!.CloseWatcher!();
+
+      /**
+       * Once a close request happens
+       * the watcher gets destroyed.
+       * As a result, we need to re-configure
+       * the watcher so we can respond to other
+       * close requests.
+       */
+      watcher!.onclose = () => {
+        backButtonCallback();
+        configureWatcher();
+      };
+    };
+
+    configureWatcher();
+  } else {
+    doc.addEventListener('backbutton', backButtonCallback);
+  }
 };
 
 export const OVERLAY_BACK_BUTTON_PRIORITY = 100;
diff --git a/core/src/utils/helpers.ts b/core/src/utils/helpers.ts
index 1d92c55a58..81ffb4efa9 100644
--- a/core/src/utils/helpers.ts
+++ b/core/src/utils/helpers.ts
@@ -22,7 +22,7 @@ export const transitionEndAsync = (el: HTMLElement | null, expectedDuration = 0)
  */
 const transitionEnd = (el: HTMLElement | null, expectedDuration = 0, callback: (ev?: TransitionEvent) => void) => {
   let unRegTrans: (() => void) | undefined;
-  let animationTimeout: any;
+  let animationTimeout: number | undefined;
   const opts: AddEventListenerOptions = { passive: true };
   const ANIMATION_FALLBACK_TIMEOUT = 500;
 
@@ -45,7 +45,7 @@ const transitionEnd = (el: HTMLElement | null, expectedDuration = 0, callback: (
     animationTimeout = setTimeout(onTransitionEnd, expectedDuration + ANIMATION_FALLBACK_TIMEOUT);
 
     unRegTrans = () => {
-      if (animationTimeout) {
+      if (animationTimeout !== undefined) {
         clearTimeout(animationTimeout);
         animationTimeout = undefined;
       }
@@ -262,7 +262,7 @@ export const findItemLabel = (componentEl: HTMLElement): HTMLIonLabelElement | n
   return null;
 };
 
-export const focusElement = (el: HTMLElement) => {
+export const focusVisibleElement = (el: HTMLElement) => {
   el.focus();
 
   /**
diff --git a/core/src/utils/input-shims/hacks/test/index.html b/core/src/utils/input-shims/hacks/test/index.html
index 1864094236..f4b138965a 100644
--- a/core/src/utils/input-shims/hacks/test/index.html
+++ b/core/src/utils/input-shims/hacks/test/index.html
@@ -48,37 +48,31 @@
 
       <ion-content class="ion-padding">
         <ion-item>
-          <ion-label>Input Above Keyboard</ion-label>
-          <ion-input id="input-above-keyboard"></ion-input>
+          <ion-input label="Input Above Keyboard" id="input-above-keyboard"></ion-input>
         </ion-item>
 
         <ion-item>
-          <ion-label>Textarea Above Keyboard</ion-label>
-          <ion-textarea id="textarea-above-keyboard"></ion-textarea>
+          <ion-textarea label="Textarea Above Keyboard" id="textarea-above-keyboard"></ion-textarea>
         </ion-item>
 
         <div class="spacer" style="height: 400px"></div>
 
         <ion-item id="item-below-keyboard">
-          <ion-label>Input Below Keyboard</ion-label>
-          <ion-input id="input-below-keyboard"></ion-input>
+          <ion-input label="Input Below Keyboard" id="input-below-keyboard"></ion-input>
         </ion-item>
 
         <ion-item>
-          <ion-label>Textarea Below Keyboard</ion-label>
-          <ion-textarea id="textarea-below-keyboard"></ion-textarea>
+          <ion-textarea label="Textarea Below Keyboard" id="textarea-below-keyboard"></ion-textarea>
         </ion-item>
 
         <div class="spacer" style="height: 400px"></div>
 
         <ion-item>
-          <ion-label>Input Outside Viewport</ion-label>
-          <ion-input id="input-outside-viewport"></ion-input>
+          <ion-input label="Input Outside Viewport" id="input-outside-viewport"></ion-input>
         </ion-item>
 
         <ion-item>
-          <ion-label>Textarea Outside Viewport</ion-label>
-          <ion-textarea id="textarea-outside-viewport"></ion-textarea>
+          <ion-textarea label="Textarea Outside Viewport" id="textarea-outside-viewport"></ion-textarea>
         </ion-item>
       </ion-content>
 
diff --git a/core/src/utils/keyboard/test/index.html b/core/src/utils/keyboard/test/index.html
index 76656c9cd4..cd61868ed8 100644
--- a/core/src/utils/keyboard/test/index.html
+++ b/core/src/utils/keyboard/test/index.html
@@ -43,8 +43,8 @@
 
       <ion-footer>
         <ion-toolbar>
-          <ion-input type="text" placeholder="Enter some text..."></ion-input>
-          <ion-input type="text" placeholder="Enter some text..."></ion-input>
+          <ion-input aria-label="input" type="text" placeholder="Enter some text..."></ion-input>
+          <ion-input aria-label="input" type="text" placeholder="Enter some text..."></ion-input>
         </ion-toolbar>
       </ion-footer>
     </ion-app>
diff --git a/core/src/utils/overlays.ts b/core/src/utils/overlays.ts
index bd56ac3684..11ec2f5669 100644
--- a/core/src/utils/overlays.ts
+++ b/core/src/utils/overlays.ts
@@ -1,5 +1,6 @@
 import { doc } from '@utils/browser';
 import type { BackButtonEvent } from '@utils/hardware-back-button';
+import { shoudUseCloseWatcher } from '@utils/hardware-back-button';
 
 import { config } from '../global/config';
 import { getIonMode } from '../global/ionic-global';
@@ -21,7 +22,13 @@ import type {
 
 import { CoreDelegate } from './framework-delegate';
 import { OVERLAY_BACK_BUTTON_PRIORITY } from './hardware-back-button';
-import { addEventListener, componentOnReady, focusElement, getElementRoot, removeEventListener } from './helpers';
+import {
+  addEventListener,
+  componentOnReady,
+  focusVisibleElement,
+  getElementRoot,
+  removeEventListener,
+} from './helpers';
 import { printIonWarning } from './logging';
 
 let lastOverlayIndex = 0;
@@ -130,38 +137,55 @@ export const createOverlay = <T extends HTMLIonOverlayElement>(
  */
 const focusableQueryString =
   '[tabindex]:not([tabindex^="-"]):not([hidden]):not([disabled]), input:not([type=hidden]):not([tabindex^="-"]):not([hidden]):not([disabled]), textarea:not([tabindex^="-"]):not([hidden]):not([disabled]), button:not([tabindex^="-"]):not([hidden]):not([disabled]), select:not([tabindex^="-"]):not([hidden]):not([disabled]), .ion-focusable:not([tabindex^="-"]):not([hidden]):not([disabled]), .ion-focusable[disabled="false"]:not([tabindex^="-"]):not([hidden])';
-
-export const focusFirstDescendant = (ref: Element, overlay: HTMLIonOverlayElement) => {
-  let firstInput = ref.querySelector(focusableQueryString) as HTMLElement | null;
-
-  const shadowRoot = firstInput?.shadowRoot;
-  if (shadowRoot) {
-    // If there are no inner focusable elements, just focus the host element.
-    firstInput = shadowRoot.querySelector(focusableQueryString) || firstInput;
-  }
-
-  if (firstInput) {
-    focusElement(firstInput);
-  } else {
-    // Focus overlay instead of letting focus escape
-    overlay.focus();
-  }
-};
-
 const isOverlayHidden = (overlay: Element) => overlay.classList.contains('overlay-hidden');
 
+/**
+ * Focuses the first descendant in an overlay
+ * that can receive focus. If none exists,
+ * the entire overlay will be focused.
+ */
+export const focusFirstDescendant = (ref: Element, overlay: HTMLIonOverlayElement) => {
+  const firstInput = ref.querySelector(focusableQueryString) as HTMLElement | null;
+
+  focusElementInOverlay(firstInput, overlay);
+};
+
+/**
+ * Focuses the last descendant in an overlay
+ * that can receive focus. If none exists,
+ * the entire overlay will be focused.
+ */
 const focusLastDescendant = (ref: Element, overlay: HTMLIonOverlayElement) => {
   const inputs = Array.from(ref.querySelectorAll(focusableQueryString)) as HTMLElement[];
-  let lastInput = inputs.length > 0 ? inputs[inputs.length - 1] : null;
+  const lastInput = inputs.length > 0 ? inputs[inputs.length - 1] : null;
 
-  const shadowRoot = lastInput?.shadowRoot;
+  focusElementInOverlay(lastInput, overlay);
+};
+
+/**
+ * Focuses a particular element in an overlay. If the element
+ * doesn't have anything focusable associated with it then
+ * the overlay itself will be focused.
+ * This should be used instead of the focus() method
+ * on most elements because the focusable element
+ * may not be the host element.
+ *
+ * For example, if an ion-button should be focused
+ * then we should actually focus the native <button>
+ * element inside of ion-button's shadow root, not
+ * the host element itself.
+ */
+const focusElementInOverlay = (hostToFocus: HTMLElement | null | undefined, overlay: HTMLIonOverlayElement) => {
+  let elementToFocus = hostToFocus;
+
+  const shadowRoot = hostToFocus?.shadowRoot;
   if (shadowRoot) {
     // If there are no inner focusable elements, just focus the host element.
-    lastInput = shadowRoot.querySelector(focusableQueryString) || lastInput;
+    elementToFocus = shadowRoot.querySelector<HTMLElement>(focusableQueryString) || hostToFocus;
   }
 
-  if (lastInput) {
-    lastInput.focus();
+  if (elementToFocus) {
+    focusVisibleElement(elementToFocus);
   } else {
     // Focus overlay instead of letting focus escape
     overlay.focus();
@@ -218,6 +242,20 @@ const trapKeyboardFocus = (ev: Event, doc: Document) => {
      */
     if (lastOverlay === target) {
       lastOverlay.lastFocus = undefined;
+      /**
+       * Toasts can be presented from an overlay.
+       * However, focus should still be returned to
+       * the overlay when clicking a toast. Normally,
+       * focus would be returned to the last focusable
+       * descendant in the overlay which may not always be
+       * the button that the toast was presented from. In this case,
+       * the focus may be returned to an unexpected element.
+       * To account for this, we make sure to return focus to the
+       * last focused element in the overlay if focus is
+       * moved to the toast.
+       */
+    } else if (target.tagName === 'ION-TOAST') {
+      focusElementInOverlay(lastOverlay.lastFocus, lastOverlay);
 
       /**
        * Otherwise, we must be focusing an element
@@ -294,6 +332,20 @@ const trapKeyboardFocus = (ev: Event, doc: Document) => {
      */
     if (lastOverlay.contains(target)) {
       lastOverlay.lastFocus = target;
+      /**
+       * Toasts can be presented from an overlay.
+       * However, focus should still be returned to
+       * the overlay when clicking a toast. Normally,
+       * focus would be returned to the last focusable
+       * descendant in the overlay which may not always be
+       * the button that the toast was presented from. In this case,
+       * the focus may be returned to an unexpected element.
+       * To account for this, we make sure to return focus to the
+       * last focused element in the overlay if focus is
+       * moved to the toast.
+       */
+    } else if (target.tagName === 'ION-TOAST') {
+      focusElementInOverlay(lastOverlay.lastFocus, lastOverlay);
     } else {
       /**
        * Otherwise, we are about to have focus
@@ -353,20 +405,39 @@ const connectListeners = (doc: Document) => {
       const lastOverlay = getPresentedOverlay(doc);
       if (lastOverlay?.backdropDismiss) {
         (ev as BackButtonEvent).detail.register(OVERLAY_BACK_BUTTON_PRIORITY, () => {
-          return lastOverlay.dismiss(undefined, BACKDROP);
+          /**
+           * Do not return this promise otherwise
+           * the hardware back button utility will
+           * be blocked until the overlay dismisses.
+           * This is important for a modal with canDismiss.
+           * If the application presents a confirmation alert
+           * in the "canDismiss" callback, then it will be impossible
+           * to use the hardware back button to dismiss the alert
+           * dialog because the hardware back button utility
+           * is blocked on waiting for the modal to dismiss.
+           */
+          lastOverlay.dismiss(undefined, BACKDROP);
         });
       }
     });
 
-    // handle ESC to close overlay
-    doc.addEventListener('keydown', (ev) => {
-      if (ev.key === 'Escape') {
-        const lastOverlay = getPresentedOverlay(doc);
-        if (lastOverlay?.backdropDismiss) {
-          lastOverlay.dismiss(undefined, BACKDROP);
+    /**
+     * Handle ESC to close overlay.
+     * CloseWatcher also handles pressing the Esc
+     * key, so if a browser supports CloseWatcher then
+     * this behavior will be handled via the ionBackButton
+     * event.
+     */
+    if (!shoudUseCloseWatcher()) {
+      doc.addEventListener('keydown', (ev) => {
+        if (ev.key === 'Escape') {
+          const lastOverlay = getPresentedOverlay(doc);
+          if (lastOverlay?.backdropDismiss) {
+            lastOverlay.dismiss(undefined, BACKDROP);
+          }
         }
-      }
-    });
+      });
+    }
   }
 };
 
@@ -471,6 +542,16 @@ export const present = async <OverlayPresentOptions>(
 
   setRootAriaHidden(true);
 
+  /**
+   * Hide all other overlays from screen readers so only this one
+   * can be read. Note that presenting an overlay always makes
+   * it the topmost one.
+   */
+  if (doc !== undefined) {
+    const presentedOverlays = getPresentedOverlays(doc);
+    presentedOverlays.forEach((o) => o.setAttribute('aria-hidden', 'true'));
+  }
+
   overlay.presented = true;
   overlay.willPresent.emit();
   overlay.willPresentShorthand?.emit();
@@ -496,7 +577,7 @@ export const present = async <OverlayPresentOptions>(
    * from returning focus as a result.
    */
   if (overlay.el.tagName !== 'ION-TOAST') {
-    focusPreviousElementOnDismiss(overlay.el);
+    restoreElementFocus(overlay.el);
   }
 
   /**
@@ -508,6 +589,15 @@ export const present = async <OverlayPresentOptions>(
   if (overlay.keyboardClose && (document.activeElement === null || !overlay.el.contains(document.activeElement))) {
     overlay.el.focus();
   }
+
+  /**
+   * If this overlay was previously dismissed without being
+   * the topmost one (such as by manually calling dismiss()),
+   * it would still have aria-hidden on being presented again.
+   * Removing it here ensures the overlay is visible to screen
+   * readers.
+   */
+  overlay.el.removeAttribute('aria-hidden');
 };
 
 /**
@@ -520,7 +610,7 @@ export const present = async <OverlayPresentOptions>(
  * to where they were before they
  * opened the overlay.
  */
-const focusPreviousElementOnDismiss = async (overlayEl: any) => {
+const restoreElementFocus = async (overlayEl: any) => {
   let previousElement = document.activeElement as HTMLElement | null;
   if (!previousElement) {
     return;
@@ -533,7 +623,34 @@ const focusPreviousElementOnDismiss = async (overlayEl: any) => {
   }
 
   await overlayEl.onDidDismiss();
-  previousElement.focus();
+
+  /**
+   * After onDidDismiss, the overlay loses focus
+   * because it is removed from the document
+   *
+   * > An element will also lose focus [...]
+   * > if the element is removed from the document)
+   *
+   * https://developer.mozilla.org/en-US/docs/Web/API/Element/blur_event
+   *
+   * Additionally, `document.activeElement` returns:
+   *
+   * > The Element which currently has focus,
+   * > `<body>` or null if there is
+   * > no focused element.
+   *
+   * https://developer.mozilla.org/en-US/docs/Web/API/Document/activeElement#value
+   *
+   * However, if the user has already focused
+   * an element sometime between onWillDismiss
+   * and onDidDismiss (for example, focusing a
+   * text box after tapping a button in an
+   * action sheet) then don't restore focus to
+   * previous element
+   */
+  if (document.activeElement === null || document.activeElement === document.body) {
+    previousElement.focus();
+  }
 };
 
 export const dismiss = async <OverlayDismissOptions>(
@@ -577,6 +694,12 @@ export const dismiss = async <OverlayDismissOptions>(
     overlay.didDismiss.emit({ data, role });
     overlay.didDismissShorthand?.emit({ data, role });
 
+    // Get a reference to all animations currently assigned to this overlay
+    // Then tear them down to return the overlay to its initial visual state
+    const animations = activeAnimations.get(overlay) || [];
+
+    animations.forEach((ani) => ani.destroy());
+
     activeAnimations.delete(overlay);
 
     /**
@@ -599,6 +722,15 @@ export const dismiss = async <OverlayDismissOptions>(
   }
 
   overlay.el.remove();
+
+  /**
+   * If there are other overlays presented, unhide the new
+   * topmost one from screen readers.
+   */
+  if (doc !== undefined) {
+    getPresentedOverlay(doc)?.removeAttribute('aria-hidden');
+  }
+
   return true;
 };
 
diff --git a/core/src/utils/test/hardware-back-button.spec.ts b/core/src/utils/test/hardware-back-button.spec.ts
index a4e5bbb7c4..87f27d407c 100644
--- a/core/src/utils/test/hardware-back-button.spec.ts
+++ b/core/src/utils/test/hardware-back-button.spec.ts
@@ -1,5 +1,7 @@
 import type { BackButtonEvent } from '../../../src/interface';
 import { startHardwareBackButton } from '../hardware-back-button';
+import { config } from '../../global/config';
+import { win } from '@utils/browser';
 
 describe('Hardware Back Button', () => {
   beforeEach(() => startHardwareBackButton());
@@ -54,6 +56,56 @@ describe('Hardware Back Button', () => {
   });
 });
 
+describe('Experimental Close Watcher', () => {
+  test('should not use the Close Watcher API when available', () => {
+    const mockAPI = mockCloseWatcher();
+
+    config.reset({ experimentalCloseWatcher: false });
+
+    startHardwareBackButton();
+
+    expect(mockAPI.mock.calls).toHaveLength(0);
+  });
+  test('should use the Close Watcher API when available', () => {
+    const mockAPI = mockCloseWatcher();
+
+    config.reset({ experimentalCloseWatcher: true });
+
+    startHardwareBackButton();
+
+    expect(mockAPI.mock.calls).toHaveLength(1);
+  });
+  test('Close Watcher should dispatch ionBackButton events', () => {
+    const mockAPI = mockCloseWatcher();
+
+    config.reset({ experimentalCloseWatcher: true });
+
+    startHardwareBackButton();
+
+    const cbSpy = jest.fn();
+    document.addEventListener('ionBackButton', cbSpy);
+
+    // Call onclose on Ionic's instance of CloseWatcher
+    mockAPI.getMockImplementation()!().onclose();
+
+    expect(cbSpy).toHaveBeenCalled();
+  });
+});
+
+const mockCloseWatcher = () => {
+  const mockCloseWatcher = jest.fn();
+  mockCloseWatcher.mockReturnValue({
+    requestClose: () => null,
+    close: () => null,
+    destroy: () => null,
+    oncancel: () => null,
+    onclose: () => null,
+  });
+  (win as any).CloseWatcher = mockCloseWatcher;
+
+  return mockCloseWatcher;
+};
+
 const dispatchBackButtonEvent = () => {
   const ev = new Event('backbutton');
   document.dispatchEvent(ev);
diff --git a/core/src/utils/test/overlays/index.html b/core/src/utils/test/overlays/index.html
index 00885bd555..60e0a69318 100644
--- a/core/src/utils/test/overlays/index.html
+++ b/core/src/utils/test/overlays/index.html
@@ -34,8 +34,7 @@
 
         <ion-content class="ion-padding">
           <ion-item>
-            <ion-label>Text Input</ion-label>
-            <ion-input id="root-input"></ion-input>
+            <ion-input label="Text Input" id="root-input"></ion-input>
           </ion-item>
 
           <ion-button id="create" onclick="createModal()">Create a Modal</ion-button>
@@ -63,11 +62,10 @@
             </ion-toolbar>
           </ion-header>
           <ion-content class="ion-padding">
-            Modal Content
+            Modal ${id}
 
             <ion-item>
-              <ion-label>Text Input</ion-label>
-              <ion-input class="modal-input modal-input-${id}"></ion-input>
+              <ion-input label="Text Input" class="modal-input modal-input-${id}"></ion-input>
             </ion-item>
 
             <ion-button id="modal-create">Create a Modal</ion-button>
diff --git a/core/src/utils/test/overlays/overlays.e2e.ts b/core/src/utils/test/overlays/overlays.e2e.ts
index 3d112413b4..ebe7d25a27 100644
--- a/core/src/utils/test/overlays/overlays.e2e.ts
+++ b/core/src/utils/test/overlays/overlays.e2e.ts
@@ -254,5 +254,172 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ title, config }) =>
 
       await expect(modalInputOne).toBeFocused();
     });
+
+    test('focusing toast from a shadow overlay should return focus to the last focused element', async ({ page }) => {
+      test.info().annotations.push({
+        type: 'issue',
+        description: 'https://github.com/ionic-team/ionic-framework/issues/28261',
+      });
+
+      /**
+       * Triggers for an overlay are typically buttons. However in this case,
+       * buttons are not considered keyboard focusable by WebKit. Inputs are,
+       * so we use an input here so we can still test on WebKit.
+       */
+      await page.setContent(
+        `
+        <ion-modal>
+          <ion-content>
+            <input id="show-toast">Button A</input>
+            <button>Button B</button>
+            <ion-toast trigger="show-toast"></ion-toast>
+          </ion-content>
+        </ion-modal>
+
+        <script>
+          const toast = document.querySelector('ion-toast');
+          toast.buttons = ['Ok'];
+        </script>
+      `,
+        config
+      );
+
+      const modal = page.locator('ion-modal');
+      const showToastTrigger = page.locator('#show-toast');
+
+      const toast = page.locator('ion-toast');
+      const toastButton = toast.locator('button');
+
+      const ionToastDidPresent = await page.spyOnEvent('ionToastDidPresent');
+
+      // Show overlay
+      await modal.evaluate((el: HTMLIonModalElement) => el.present());
+
+      // Click trigger to open toast
+      await showToastTrigger.click();
+
+      // Wait for toast to be presented
+      await ionToastDidPresent.next();
+
+      // Verify trigger in overlay is focused
+      await expect(showToastTrigger).toBeFocused();
+
+      // Click a button in the toast and therefore attempt to move focus
+      await toastButton.click();
+
+      // Verify trigger in overlay is still focused
+      await expect(showToastTrigger).toBeFocused();
+    });
+
+    test('focusing toast from a scoped overlay should return focus to the last focused element', async ({
+      page,
+      skip,
+    }) => {
+      test.info().annotations.push({
+        type: 'issue',
+        description: 'https://github.com/ionic-team/ionic-framework/issues/28261',
+      });
+      skip.browser('webkit', 'WebKit does not consider buttons to be focusable');
+
+      await page.setContent(
+        `
+        <ion-action-sheet></ion-action-sheet>
+        <ion-toast></ion-toast>
+
+        <script>
+          const actionSheet = document.querySelector('ion-action-sheet');
+          actionSheet.buttons = [
+            'Other Button',
+            {
+              text: 'Button',
+              id: 'show-toast',
+              handler: () => {
+                document.querySelector('ion-toast').present();
+                return false;
+              }
+            }
+          ];
+
+          const toast = document.querySelector('ion-toast');
+          toast.buttons = ['Ok'];
+       </script>
+       `,
+        config
+      );
+
+      const actionSheet = page.locator('ion-action-sheet');
+      const showToastButton = page.locator('#show-toast');
+
+      const toast = page.locator('ion-toast');
+      const toastButton = toast.locator('button');
+
+      const ionToastDidPresent = await page.spyOnEvent('ionToastDidPresent');
+
+      // Show overlay
+      await actionSheet.evaluate((el: HTMLIonActionSheetElement) => el.present());
+
+      // Click button to open toast
+      await showToastButton.click();
+
+      // Wait for toast to be presented
+      await ionToastDidPresent.next();
+
+      // Verify button in overlay is focused
+      await expect(showToastButton).toBeFocused();
+
+      // Click a button in the toast and therefore attempt to move focus
+      await toastButton.click();
+
+      await page.pause();
+
+      // Verify button in overlay is still focused
+      await expect(showToastButton).toBeFocused();
+    });
+    test('should not return focus to another element if focus already manually returned', async ({
+      page,
+      skip,
+    }, testInfo) => {
+      skip.browser(
+        'webkit',
+        'WebKit does not consider buttons to be focusable, so this test always passes since the input is the only focusable element.'
+      );
+      testInfo.annotations.push({
+        type: 'issue',
+        description: 'https://github.com/ionic-team/ionic-framework/issues/28849',
+      });
+      await page.setContent(
+        `
+        <button id="open-action-sheet">open</button>
+        <ion-action-sheet trigger="open-action-sheet"></ion-action-sheet>
+        <input id="test-input" />
+
+        <script>
+          const actionSheet = document.querySelector('ion-action-sheet');
+
+          actionSheet.addEventListener('ionActionSheetWillDismiss', () => {
+            requestAnimationFrame(() => {
+              document.querySelector('#test-input').focus();
+            });
+          });
+        </script>
+      `,
+        config
+      );
+
+      const ionActionSheetDidPresent = await page.spyOnEvent('ionActionSheetDidPresent');
+      const actionSheet = page.locator('ion-action-sheet');
+      const input = page.locator('#test-input');
+      const trigger = page.locator('#open-action-sheet');
+
+      // present action sheet
+      await trigger.click();
+      await ionActionSheetDidPresent.next();
+
+      // dismiss action sheet
+      await actionSheet.evaluate((el: HTMLIonActionSheetElement) => el.dismiss());
+
+      // verify focus is in correct location
+      await expect(input).toBeFocused();
+    });
   });
 });
diff --git a/core/src/utils/test/overlays/overlays.spec.ts b/core/src/utils/test/overlays/overlays.spec.ts
index d5b1442e3b..7b67a22183 100644
--- a/core/src/utils/test/overlays/overlays.spec.ts
+++ b/core/src/utils/test/overlays/overlays.spec.ts
@@ -129,3 +129,68 @@ describe('setRootAriaHidden()', () => {
     expect(routerOutlet.hasAttribute('aria-hidden')).toEqual(false);
   });
 });
+
+describe('aria-hidden on individual overlays', () => {
+  it('should hide non-topmost overlays from screen readers', async () => {
+    const page = await newSpecPage({
+      components: [Modal],
+      html: `
+        <ion-modal id="one"></ion-modal>
+        <ion-modal id="two"></ion-modal>
+      `,
+    });
+
+    const modalOne = page.body.querySelector<HTMLIonModalElement>('ion-modal#one')!;
+    const modalTwo = page.body.querySelector<HTMLIonModalElement>('ion-modal#two')!;
+
+    await modalOne.present();
+    await modalTwo.present();
+
+    expect(modalOne.hasAttribute('aria-hidden')).toEqual(true);
+    expect(modalTwo.hasAttribute('aria-hidden')).toEqual(false);
+  });
+
+  it('should unhide new topmost overlay from screen readers when topmost is dismissed', async () => {
+    const page = await newSpecPage({
+      components: [Modal],
+      html: `
+        <ion-modal id="one"></ion-modal>
+        <ion-modal id="two"></ion-modal>
+      `,
+    });
+
+    const modalOne = page.body.querySelector<HTMLIonModalElement>('ion-modal#one')!;
+    const modalTwo = page.body.querySelector<HTMLIonModalElement>('ion-modal#two')!;
+
+    await modalOne.present();
+    await modalTwo.present();
+
+    // dismiss modalTwo so that modalOne becomes the new topmost overlay
+    await modalTwo.dismiss();
+
+    expect(modalOne.hasAttribute('aria-hidden')).toEqual(false);
+  });
+
+  it('should not keep overlays hidden from screen readers if presented after being dismissed while non-topmost', async () => {
+    const page = await newSpecPage({
+      components: [Modal],
+      html: `
+        <ion-modal id="one"></ion-modal>
+        <ion-modal id="two"></ion-modal>
+      `,
+    });
+
+    const modalOne = page.body.querySelector<HTMLIonModalElement>('ion-modal#one')!;
+    const modalTwo = page.body.querySelector<HTMLIonModalElement>('ion-modal#two')!;
+
+    await modalOne.present();
+    await modalTwo.present();
+
+    // modalOne is not the topmost overlay at this point and is hidden from screen readers
+    await modalOne.dismiss();
+
+    // modalOne will become the topmost overlay; ensure it isn't still hidden from screen readers
+    await modalOne.present();
+    expect(modalOne.hasAttribute('aria-hidden')).toEqual(false);
+  });
+});
diff --git a/core/tsconfig.json b/core/tsconfig.json
index 1dabfc83b5..2874f056cc 100644
--- a/core/tsconfig.json
+++ b/core/tsconfig.json
@@ -15,7 +15,8 @@
       "dom.iterable",
       "es2017",
       "es2020",
-      "es2021"
+      "es2021",
+      "esnext"
     ],
     "module": "esnext",
     "moduleResolution": "node",
diff --git a/docs/CHANGELOG.md b/docs/CHANGELOG.md
index 78c0ed27d9..fbe0280e55 100644
--- a/docs/CHANGELOG.md
+++ b/docs/CHANGELOG.md
@@ -3,6 +3,54 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [7.7.4](https://github.com/ionic-team/ionic-framework/compare/v7.7.3...v7.7.4) (2024-03-06)
+
+**Note:** Version bump only for package @ionic/docs
+
+
+
+
+
+## [7.7.3](https://github.com/ionic-team/ionic-framework/compare/v7.7.2...v7.7.3) (2024-02-21)
+
+**Note:** Version bump only for package @ionic/docs
+
+
+
+
+
+## [7.7.2](https://github.com/ionic-team/ionic-framework/compare/v7.7.1...v7.7.2) (2024-02-14)
+
+**Note:** Version bump only for package @ionic/docs
+
+
+
+
+
+## [7.7.1](https://github.com/ionic-team/ionic-framework/compare/v7.7.0...v7.7.1) (2024-02-07)
+
+**Note:** Version bump only for package @ionic/docs
+
+
+
+
+
+# [7.7.0](https://github.com/ionic-team/ionic-framework/compare/v7.6.7...v7.7.0) (2024-01-31)
+
+**Note:** Version bump only for package @ionic/docs
+
+
+
+
+
+## [7.6.7](https://github.com/ionic-team/ionic-framework/compare/v7.6.6...v7.6.7) (2024-01-31)
+
+**Note:** Version bump only for package @ionic/docs
+
+
+
+
+
 ## [7.6.6](https://github.com/ionic-team/ionic-framework/compare/v7.6.5...v7.6.6) (2024-01-24)
 
 **Note:** Version bump only for package @ionic/docs
diff --git a/docs/package-lock.json b/docs/package-lock.json
index f34e364d37..18da5dac04 100644
--- a/docs/package-lock.json
+++ b/docs/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "@ionic/docs",
-  "version": "7.6.6",
+  "version": "7.7.4",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
     "": {
       "name": "@ionic/docs",
-      "version": "7.6.6",
+      "version": "7.7.4",
       "license": "MIT"
     }
   }
diff --git a/docs/package.json b/docs/package.json
index 09a3e97859..dec2878417 100644
--- a/docs/package.json
+++ b/docs/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@ionic/docs",
-  "version": "7.6.6",
+  "version": "7.7.4",
   "description": "Pre-packaged API documentation for the Ionic docs.",
   "main": "core.json",
   "types": "core.d.ts",
diff --git a/lerna.json b/lerna.json
index e48dc5be31..11c4eeea41 100644
--- a/lerna.json
+++ b/lerna.json
@@ -4,5 +4,5 @@
     "docs",
     "packages/*"
   ],
-  "version": "7.6.6"
+  "version": "7.7.4"
 }
diff --git a/packages/angular-server/CHANGELOG.md b/packages/angular-server/CHANGELOG.md
index d9a9ce1129..03c3eadb16 100644
--- a/packages/angular-server/CHANGELOG.md
+++ b/packages/angular-server/CHANGELOG.md
@@ -3,6 +3,54 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [7.7.4](https://github.com/ionic-team/ionic-framework/compare/v7.7.3...v7.7.4) (2024-03-06)
+
+**Note:** Version bump only for package @ionic/angular-server
+
+
+
+
+
+## [7.7.3](https://github.com/ionic-team/ionic-framework/compare/v7.7.2...v7.7.3) (2024-02-21)
+
+**Note:** Version bump only for package @ionic/angular-server
+
+
+
+
+
+## [7.7.2](https://github.com/ionic-team/ionic-framework/compare/v7.7.1...v7.7.2) (2024-02-14)
+
+**Note:** Version bump only for package @ionic/angular-server
+
+
+
+
+
+## [7.7.1](https://github.com/ionic-team/ionic-framework/compare/v7.7.0...v7.7.1) (2024-02-07)
+
+**Note:** Version bump only for package @ionic/angular-server
+
+
+
+
+
+# [7.7.0](https://github.com/ionic-team/ionic-framework/compare/v7.6.7...v7.7.0) (2024-01-31)
+
+**Note:** Version bump only for package @ionic/angular-server
+
+
+
+
+
+## [7.6.7](https://github.com/ionic-team/ionic-framework/compare/v7.6.6...v7.6.7) (2024-01-31)
+
+**Note:** Version bump only for package @ionic/angular-server
+
+
+
+
+
 ## [7.6.6](https://github.com/ionic-team/ionic-framework/compare/v7.6.5...v7.6.6) (2024-01-24)
 
 **Note:** Version bump only for package @ionic/angular-server
diff --git a/packages/angular-server/package.json b/packages/angular-server/package.json
index 2f1aec8337..5bcb71306f 100644
--- a/packages/angular-server/package.json
+++ b/packages/angular-server/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@ionic/angular-server",
-  "version": "7.6.6",
+  "version": "7.7.4",
   "description": "Angular SSR Module for Ionic",
   "keywords": [
     "ionic",
@@ -62,6 +62,6 @@
   },
   "prettier": "@ionic/prettier-config",
   "dependencies": {
-    "@ionic/core": "^7.6.6"
+    "@ionic/core": "^7.7.4"
   }
 }
diff --git a/packages/angular/CHANGELOG.md b/packages/angular/CHANGELOG.md
index d4b946fead..ea06bc4d42 100644
--- a/packages/angular/CHANGELOG.md
+++ b/packages/angular/CHANGELOG.md
@@ -3,6 +3,54 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [7.7.4](https://github.com/ionic-team/ionic-framework/compare/v7.7.3...v7.7.4) (2024-03-06)
+
+**Note:** Version bump only for package @ionic/angular
+
+
+
+
+
+## [7.7.3](https://github.com/ionic-team/ionic-framework/compare/v7.7.2...v7.7.3) (2024-02-21)
+
+**Note:** Version bump only for package @ionic/angular
+
+
+
+
+
+## [7.7.2](https://github.com/ionic-team/ionic-framework/compare/v7.7.1...v7.7.2) (2024-02-14)
+
+**Note:** Version bump only for package @ionic/angular
+
+
+
+
+
+## [7.7.1](https://github.com/ionic-team/ionic-framework/compare/v7.7.0...v7.7.1) (2024-02-07)
+
+**Note:** Version bump only for package @ionic/angular
+
+
+
+
+
+# [7.7.0](https://github.com/ionic-team/ionic-framework/compare/v7.6.7...v7.7.0) (2024-01-31)
+
+**Note:** Version bump only for package @ionic/angular
+
+
+
+
+
+## [7.6.7](https://github.com/ionic-team/ionic-framework/compare/v7.6.6...v7.6.7) (2024-01-31)
+
+**Note:** Version bump only for package @ionic/angular
+
+
+
+
+
 ## [7.6.6](https://github.com/ionic-team/ionic-framework/compare/v7.6.5...v7.6.6) (2024-01-24)
 
 **Note:** Version bump only for package @ionic/angular
diff --git a/packages/angular/package.json b/packages/angular/package.json
index 8ae28efea2..ac799e454d 100644
--- a/packages/angular/package.json
+++ b/packages/angular/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@ionic/angular",
-  "version": "7.6.6",
+  "version": "7.7.4",
   "description": "Angular specific wrappers for @ionic/core",
   "keywords": [
     "ionic",
@@ -46,7 +46,7 @@
     }
   },
   "dependencies": {
-    "@ionic/core": "^7.6.6",
+    "@ionic/core": "^7.7.4",
     "ionicons": "^7.0.0",
     "jsonc-parser": "^3.0.0",
     "tslib": "^2.3.0"
diff --git a/packages/angular/test/README.md b/packages/angular/test/README.md
index 978777765a..ab7a1bb9b0 100644
--- a/packages/angular/test/README.md
+++ b/packages/angular/test/README.md
@@ -110,4 +110,6 @@ Note: You may encounter some other peer dependency issues not covered by the Ang
 7. Open `./github/workflows/build.yml` and find the `test-angular-e2e` job.
 8. Find the `apps` field under `matrix`.
 9. Add "ng14" to the `apps` field.
-10. Commit these changes and push.
+10. Open `./github/workflows/stencil-nightly.yml` and find the `test-angular-e2e` job.
+11. Repeat steps 8 and 9.
+12. Commit these changes and push.
diff --git a/packages/angular/test/base/src/app/lazy/form/form.component.html b/packages/angular/test/base/src/app/lazy/form/form.component.html
index f5891cb19f..27b12e39b5 100644
--- a/packages/angular/test/base/src/app/lazy/form/form.component.html
+++ b/packages/angular/test/base/src/app/lazy/form/form.component.html
@@ -49,14 +49,12 @@
       </ion-item>
 
       <ion-item>
-        <ion-label>Min</ion-label>
-        <ion-input formControlName="inputMin" type="number"></ion-input>
+        <ion-input label="Min" formControlName="inputMin" type="number"></ion-input>
         <pre>errors: {{ profileForm.controls['inputMin'].errors | json }}</pre>
       </ion-item>
 
       <ion-item>
-        <ion-label>Max</ion-label>
-        <ion-input formControlName="inputMax" type="number"></ion-input>
+        <ion-input label="Max" formControlName="inputMax" type="number"></ion-input>
         <pre>errors: {{ profileForm.controls['inputMax'].errors | json }}</pre>
       </ion-item>
     </ion-list>
diff --git a/packages/angular/test/base/src/app/lazy/modal-example/modal-example.component.html b/packages/angular/test/base/src/app/lazy/modal-example/modal-example.component.html
index 4f2bd52a24..1420dd5b80 100644
--- a/packages/angular/test/base/src/app/lazy/modal-example/modal-example.component.html
+++ b/packages/angular/test/base/src/app/lazy/modal-example/modal-example.component.html
@@ -25,8 +25,8 @@
 
   <form [formGroup]="form">
     <ion-item id="inputWithFloatingLabel">
-      <ion-label color="primary" position="floating">Floating Label</ion-label>
-      <ion-select multiple="false" formControlName="select">
+      <ion-select label-placement="floating" multiple="false" formControlName="select">
+        <ion-label slot="label" color="Primary">Floating Label</ion-label>
         <ion-select-option [value]="0">Option 0</ion-select-option>
         <ion-select-option [value]="1">Option 1</ion-select-option>
       </ion-select>
diff --git a/packages/angular/test/base/src/app/lazy/textarea/textarea.component.html b/packages/angular/test/base/src/app/lazy/textarea/textarea.component.html
index 732e018dcb..0316b3d54b 100644
--- a/packages/angular/test/base/src/app/lazy/textarea/textarea.component.html
+++ b/packages/angular/test/base/src/app/lazy/textarea/textarea.component.html
@@ -2,8 +2,7 @@
   <form [formGroup]="form">
     <ion-list>
       <ion-item>
-        <ion-label>Textarea</ion-label>
-        <ion-textarea formControlName="textarea"></ion-textarea>
+        <ion-textarea label="Textarea" formControlName="textarea"></ion-textarea>
       </ion-item>
     </ion-list>
   </form>
diff --git a/packages/angular/test/base/src/app/standalone/value-accessors/checkbox/checkbox.component.html b/packages/angular/test/base/src/app/standalone/value-accessors/checkbox/checkbox.component.html
index 2921e06b91..c121dab37a 100644
--- a/packages/angular/test/base/src/app/standalone/value-accessors/checkbox/checkbox.component.html
+++ b/packages/angular/test/base/src/app/standalone/value-accessors/checkbox/checkbox.component.html
@@ -6,6 +6,6 @@
   </p>
 
   <app-value-accessor-test [formGroup]="form">
-    <ion-checkbox formControlName="checkbox"></ion-checkbox>
+    <ion-checkbox formControlName="checkbox">Checkbox</ion-checkbox>
   </app-value-accessor-test>
 </div>
diff --git a/packages/angular/test/base/src/app/standalone/value-accessors/range/range.component.html b/packages/angular/test/base/src/app/standalone/value-accessors/range/range.component.html
index 9a496fbcd3..97edf36a1e 100644
--- a/packages/angular/test/base/src/app/standalone/value-accessors/range/range.component.html
+++ b/packages/angular/test/base/src/app/standalone/value-accessors/range/range.component.html
@@ -4,6 +4,6 @@
     This test checks the form integrations with ion-range to make sure values are correctly assigned to the form group.
   </p>
   <app-value-accessor-test [formGroup]="form">
-    <ion-range formControlName="range"></ion-range>
+    <ion-range label="Range" formControlName="range"></ion-range>
   </app-value-accessor-test>
 </div>
diff --git a/packages/angular/test/base/src/app/standalone/value-accessors/toggle/toggle.component.html b/packages/angular/test/base/src/app/standalone/value-accessors/toggle/toggle.component.html
index 08888059f9..53e60bcf1e 100644
--- a/packages/angular/test/base/src/app/standalone/value-accessors/toggle/toggle.component.html
+++ b/packages/angular/test/base/src/app/standalone/value-accessors/toggle/toggle.component.html
@@ -5,6 +5,6 @@
   </p>
 
   <app-value-accessor-test [formGroup]="form">
-    <ion-toggle formControlName="toggle"></ion-toggle>
+    <ion-toggle formControlName="toggle">Toggle</ion-toggle>
   </app-value-accessor-test>
 </div>
diff --git a/packages/angular/test/build.sh b/packages/angular/test/build.sh
index 7507b94db0..64f2ea6b69 100755
--- a/packages/angular/test/build.sh
+++ b/packages/angular/test/build.sh
@@ -22,6 +22,12 @@ FULL_BASE_DIR="${BASE_DIR}/."
 # The full path to the built application.
 BUILD_APP_DIR="${BUILD_DIR}/${APP_DIR}/"
 
+# Make sure the full app directory exists.
+if [ ! -d $FULL_APP_DIR ]; then
+  echo "Could not find test app: ${FULL_APP_DIR}"
+  exit 1
+fi
+
 # Make the build directory if it does not already exist.
 mkdir -p $BUILD_DIR
 
diff --git a/packages/react-router/CHANGELOG.md b/packages/react-router/CHANGELOG.md
index ca0274ab93..071805c2ec 100644
--- a/packages/react-router/CHANGELOG.md
+++ b/packages/react-router/CHANGELOG.md
@@ -3,6 +3,54 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [7.7.4](https://github.com/ionic-team/ionic-framework/compare/v7.7.3...v7.7.4) (2024-03-06)
+
+**Note:** Version bump only for package @ionic/react-router
+
+
+
+
+
+## [7.7.3](https://github.com/ionic-team/ionic-framework/compare/v7.7.2...v7.7.3) (2024-02-21)
+
+**Note:** Version bump only for package @ionic/react-router
+
+
+
+
+
+## [7.7.2](https://github.com/ionic-team/ionic-framework/compare/v7.7.1...v7.7.2) (2024-02-14)
+
+**Note:** Version bump only for package @ionic/react-router
+
+
+
+
+
+## [7.7.1](https://github.com/ionic-team/ionic-framework/compare/v7.7.0...v7.7.1) (2024-02-07)
+
+**Note:** Version bump only for package @ionic/react-router
+
+
+
+
+
+# [7.7.0](https://github.com/ionic-team/ionic-framework/compare/v7.6.7...v7.7.0) (2024-01-31)
+
+**Note:** Version bump only for package @ionic/react-router
+
+
+
+
+
+## [7.6.7](https://github.com/ionic-team/ionic-framework/compare/v7.6.6...v7.6.7) (2024-01-31)
+
+**Note:** Version bump only for package @ionic/react-router
+
+
+
+
+
 ## [7.6.6](https://github.com/ionic-team/ionic-framework/compare/v7.6.5...v7.6.6) (2024-01-24)
 
 **Note:** Version bump only for package @ionic/react-router
diff --git a/packages/react-router/package.json b/packages/react-router/package.json
index 5057457a5b..e37a4372f3 100644
--- a/packages/react-router/package.json
+++ b/packages/react-router/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@ionic/react-router",
-  "version": "7.6.6",
+  "version": "7.7.4",
   "description": "React Router wrapper for @ionic/react",
   "keywords": [
     "ionic",
@@ -35,7 +35,7 @@
     "dist/"
   ],
   "dependencies": {
-    "@ionic/react": "^7.6.6",
+    "@ionic/react": "^7.7.4",
     "history": "^4.9.0",
     "tslib": "*"
   },
diff --git a/packages/react/CHANGELOG.md b/packages/react/CHANGELOG.md
index 2f7dbe9c7b..d120fed4e5 100644
--- a/packages/react/CHANGELOG.md
+++ b/packages/react/CHANGELOG.md
@@ -3,6 +3,57 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [7.7.4](https://github.com/ionic-team/ionic-framework/compare/v7.7.3...v7.7.4) (2024-03-06)
+
+**Note:** Version bump only for package @ionic/react
+
+
+
+
+
+## [7.7.3](https://github.com/ionic-team/ionic-framework/compare/v7.7.2...v7.7.3) (2024-02-21)
+
+**Note:** Version bump only for package @ionic/react
+
+
+
+
+
+## [7.7.2](https://github.com/ionic-team/ionic-framework/compare/v7.7.1...v7.7.2) (2024-02-14)
+
+**Note:** Version bump only for package @ionic/react
+
+
+
+
+
+## [7.7.1](https://github.com/ionic-team/ionic-framework/compare/v7.7.0...v7.7.1) (2024-02-07)
+
+
+### Bug Fixes
+
+* **react:** route with redirect will mount page ([#28961](https://github.com/ionic-team/ionic-framework/issues/28961)) ([5777ce2](https://github.com/ionic-team/ionic-framework/commit/5777ce258119d2715b1326cdc103bd4ad7612bd1)), closes [#28838](https://github.com/ionic-team/ionic-framework/issues/28838)
+
+
+
+
+
+# [7.7.0](https://github.com/ionic-team/ionic-framework/compare/v7.6.7...v7.7.0) (2024-01-31)
+
+**Note:** Version bump only for package @ionic/react
+
+
+
+
+
+## [7.6.7](https://github.com/ionic-team/ionic-framework/compare/v7.6.6...v7.6.7) (2024-01-31)
+
+**Note:** Version bump only for package @ionic/react
+
+
+
+
+
 ## [7.6.6](https://github.com/ionic-team/ionic-framework/compare/v7.6.5...v7.6.6) (2024-01-24)
 
 **Note:** Version bump only for package @ionic/react
diff --git a/packages/react/package.json b/packages/react/package.json
index 33eb58e03a..fe94e64b2b 100644
--- a/packages/react/package.json
+++ b/packages/react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@ionic/react",
-  "version": "7.6.6",
+  "version": "7.7.4",
   "description": "React specific wrapper for @ionic/core",
   "keywords": [
     "ionic",
@@ -38,7 +38,7 @@
     "css/"
   ],
   "dependencies": {
-    "@ionic/core": "^7.6.6",
+    "@ionic/core": "^7.7.4",
     "ionicons": "^7.0.0",
     "tslib": "*"
   },
diff --git a/packages/react/src/routing/PageManager.tsx b/packages/react/src/routing/PageManager.tsx
index 1ba3f94b98..19a184a636 100644
--- a/packages/react/src/routing/PageManager.tsx
+++ b/packages/react/src/routing/PageManager.tsx
@@ -54,7 +54,13 @@ export class PageManager extends React.PureComponent<PageManagerProps> {
       this.ionPageElementRef.current.removeEventListener('ionViewWillEnter', this.ionViewWillEnterHandler);
       this.ionPageElementRef.current.removeEventListener('ionViewDidEnter', this.ionViewDidEnterHandler);
       this.ionPageElementRef.current.removeEventListener('ionViewWillLeave', this.ionViewWillLeaveHandler);
-      this.ionPageElementRef.current.removeEventListener('ionViewDidLeave', this.ionViewDidLeaveHandler);
+      /**
+       * We deliberately do not remove the `ionViewDidLeave` listener.
+       * The registered callback is used to unmount and remove the page.
+       * Removing the event listener prevents the callback from being called.
+       * The browser will automatically remove the event listener when the
+       * page element is removed from the DOM and garbage collected.
+       */
     }
   }
 
diff --git a/packages/react/test/build.sh b/packages/react/test/build.sh
index 16078c34e2..6b67f50341 100755
--- a/packages/react/test/build.sh
+++ b/packages/react/test/build.sh
@@ -22,6 +22,12 @@ FULL_BASE_DIR="${BASE_DIR}/."
 # The full path to the built application.
 BUILD_APP_DIR="${BUILD_DIR}/${APP_DIR}/"
 
+# Make sure the full app directory exists.
+if [ ! -d $FULL_APP_DIR ]; then
+  echo "Could not find test app: ${FULL_APP_DIR}"
+  exit 1
+fi
+
 # Make the build directory if it does not already exist.
 mkdir -p $BUILD_DIR
 
diff --git a/packages/vue-router/CHANGELOG.md b/packages/vue-router/CHANGELOG.md
index 07e43400fb..1d030fd08a 100644
--- a/packages/vue-router/CHANGELOG.md
+++ b/packages/vue-router/CHANGELOG.md
@@ -3,6 +3,54 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [7.7.4](https://github.com/ionic-team/ionic-framework/compare/v7.7.3...v7.7.4) (2024-03-06)
+
+**Note:** Version bump only for package @ionic/vue-router
+
+
+
+
+
+## [7.7.3](https://github.com/ionic-team/ionic-framework/compare/v7.7.2...v7.7.3) (2024-02-21)
+
+**Note:** Version bump only for package @ionic/vue-router
+
+
+
+
+
+## [7.7.2](https://github.com/ionic-team/ionic-framework/compare/v7.7.1...v7.7.2) (2024-02-14)
+
+**Note:** Version bump only for package @ionic/vue-router
+
+
+
+
+
+## [7.7.1](https://github.com/ionic-team/ionic-framework/compare/v7.7.0...v7.7.1) (2024-02-07)
+
+**Note:** Version bump only for package @ionic/vue-router
+
+
+
+
+
+# [7.7.0](https://github.com/ionic-team/ionic-framework/compare/v7.6.7...v7.7.0) (2024-01-31)
+
+**Note:** Version bump only for package @ionic/vue-router
+
+
+
+
+
+## [7.6.7](https://github.com/ionic-team/ionic-framework/compare/v7.6.6...v7.6.7) (2024-01-31)
+
+**Note:** Version bump only for package @ionic/vue-router
+
+
+
+
+
 ## [7.6.6](https://github.com/ionic-team/ionic-framework/compare/v7.6.5...v7.6.6) (2024-01-24)
 
 **Note:** Version bump only for package @ionic/vue-router
diff --git a/packages/vue-router/package.json b/packages/vue-router/package.json
index 33a85443cd..1dea3d8287 100644
--- a/packages/vue-router/package.json
+++ b/packages/vue-router/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@ionic/vue-router",
-  "version": "7.6.6",
+  "version": "7.7.4",
   "description": "Vue Router integration for @ionic/vue",
   "scripts": {
     "test.spec": "jest",
@@ -43,7 +43,7 @@
   },
   "homepage": "https://github.com/ionic-team/ionic#readme",
   "dependencies": {
-    "@ionic/vue": "^7.6.6"
+    "@ionic/vue": "^7.7.4"
   },
   "devDependencies": {
     "@ionic/eslint-config": "^0.3.0",
diff --git a/packages/vue/CHANGELOG.md b/packages/vue/CHANGELOG.md
index 85949b91f1..7fffea71ae 100644
--- a/packages/vue/CHANGELOG.md
+++ b/packages/vue/CHANGELOG.md
@@ -3,6 +3,54 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [7.7.4](https://github.com/ionic-team/ionic-framework/compare/v7.7.3...v7.7.4) (2024-03-06)
+
+**Note:** Version bump only for package @ionic/vue
+
+
+
+
+
+## [7.7.3](https://github.com/ionic-team/ionic-framework/compare/v7.7.2...v7.7.3) (2024-02-21)
+
+**Note:** Version bump only for package @ionic/vue
+
+
+
+
+
+## [7.7.2](https://github.com/ionic-team/ionic-framework/compare/v7.7.1...v7.7.2) (2024-02-14)
+
+**Note:** Version bump only for package @ionic/vue
+
+
+
+
+
+## [7.7.1](https://github.com/ionic-team/ionic-framework/compare/v7.7.0...v7.7.1) (2024-02-07)
+
+**Note:** Version bump only for package @ionic/vue
+
+
+
+
+
+# [7.7.0](https://github.com/ionic-team/ionic-framework/compare/v7.6.7...v7.7.0) (2024-01-31)
+
+**Note:** Version bump only for package @ionic/vue
+
+
+
+
+
+## [7.6.7](https://github.com/ionic-team/ionic-framework/compare/v7.6.6...v7.6.7) (2024-01-31)
+
+**Note:** Version bump only for package @ionic/vue
+
+
+
+
+
 ## [7.6.6](https://github.com/ionic-team/ionic-framework/compare/v7.6.5...v7.6.6) (2024-01-24)
 
 
diff --git a/packages/vue/package.json b/packages/vue/package.json
index c0cda2bc63..ba27d35e4f 100644
--- a/packages/vue/package.json
+++ b/packages/vue/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@ionic/vue",
-  "version": "7.6.6",
+  "version": "7.7.4",
   "description": "Vue specific wrapper for @ionic/core",
   "scripts": {
     "eslint": "eslint src",
@@ -65,7 +65,7 @@
     "vue-router": "^4.0.16"
   },
   "dependencies": {
-    "@ionic/core": "^7.6.6",
+    "@ionic/core": "^7.7.4",
     "ionicons": "^7.0.0"
   },
   "vetur": {
diff --git a/packages/vue/test/base/src/components/ModalContent.vue b/packages/vue/test/base/src/components/ModalContent.vue
index 48586c826b..6b425e7cd7 100644
--- a/packages/vue/test/base/src/components/ModalContent.vue
+++ b/packages/vue/test/base/src/components/ModalContent.vue
@@ -10,7 +10,7 @@
     </ion-header>
     <ion-content class="ion-padding">
       <ion-label id="title">{{ title }}</ion-label>
-      <ion-input></ion-input>
+      <ion-input :aria-label="title"></ion-input>
     </ion-content>
   </ion-page>
 </template>
diff --git a/packages/vue/test/base/src/views/Inputs.vue b/packages/vue/test/base/src/views/Inputs.vue
index 70ec41094e..2cf45a98d0 100644
--- a/packages/vue/test/base/src/views/Inputs.vue
+++ b/packages/vue/test/base/src/views/Inputs.vue
@@ -30,28 +30,23 @@
       </ion-header>
 
       <ion-item>
-        <ion-label>Checkbox</ion-label>
-        <ion-checkbox slot="start" v-model="checkbox"></ion-checkbox>
+        <ion-checkbox v-model="checkbox">Checkbox</ion-checkbox>
       </ion-item>
 
       <ion-item>
-        <ion-label>Toggle</ion-label>
-        <ion-toggle slot="end" v-model="toggle"></ion-toggle>
+        <ion-toggle v-model="toggle">Toggle</ion-toggle>
       </ion-item>
 
       <ion-item>
-        <ion-label>Input</ion-label>
-        <ion-input slot="end" v-model="input"></ion-input>
+        <ion-input v-model="input" label="Input"></ion-input>
       </ion-item>
 
       <ion-item>
-        <ion-label>Range</ion-label>
-        <ion-range :dual-knobs="true" :min="0" :max="100" slot="end" v-model="range"></ion-range>
+        <ion-range label="Range" :dual-knobs="true" :min="0" :max="100" slot="end" v-model="range"></ion-range>
       </ion-item>
 
       <ion-item>
-        <ion-label>Textarea</ion-label>
-        <ion-textarea slot="end" v-model="textarea"></ion-textarea>
+        <ion-textarea label="Textarea" v-model="textarea"></ion-textarea>
       </ion-item>
 
       <ion-item>
@@ -61,22 +56,18 @@
 
       <ion-radio-group v-model="radio">
         <ion-item>
-          <ion-label>Red</ion-label>
-          <ion-radio value="red"></ion-radio>
+          <ion-radio value="red">Red</ion-radio>
         </ion-item>
         <ion-item>
-          <ion-label>Green</ion-label>
-          <ion-radio value="green"></ion-radio>
+          <ion-radio value="green">Green</ion-radio>
         </ion-item>
         <ion-item>
-          <ion-label>Blue</ion-label>
-          <ion-radio value="blue"></ion-radio>
+          <ion-radio value="blue">Blue</ion-radio>
         </ion-item>
       </ion-radio-group>
 
       <ion-item>
-        <ion-label>Select</ion-label>
-        <ion-select v-model="select">
+        <ion-select v-model="select" label="Select">
           <ion-select-option value="apples">Apples</ion-select-option>
           <ion-select-option value="bananas">Bananas</ion-select-option>
         </ion-select>
diff --git a/packages/vue/test/base/src/views/Overlays.vue b/packages/vue/test/base/src/views/Overlays.vue
index ccf794d362..799a44672b 100644
--- a/packages/vue/test/base/src/views/Overlays.vue
+++ b/packages/vue/test/base/src/views/Overlays.vue
@@ -18,28 +18,22 @@
         </ion-list-header>
 
         <ion-item>
-          <ion-label>Alert</ion-label>
-          <ion-radio value="alert" id="ion-alert"></ion-radio>
+          <ion-radio value="alert" id="ion-alert">Alert</ion-radio>
         </ion-item>
         <ion-item>
-          <ion-label>Action Sheet</ion-label>
-          <ion-radio value="action-sheet" id="ion-action-sheet"></ion-radio>
+          <ion-radio value="action-sheet" id="ion-action-sheet">Action Sheet</ion-radio>
         </ion-item>
         <ion-item>
-          <ion-label>Loading</ion-label>
-          <ion-radio value="loading" id="ion-loading"></ion-radio>
+          <ion-radio value="loading" id="ion-loading">Loading</ion-radio>
         </ion-item>
         <ion-item>
-          <ion-label>Modal</ion-label>
-          <ion-radio value="modal" id="ion-modal"></ion-radio>
+          <ion-radio value="modal" id="ion-modal">Modal</ion-radio>
         </ion-item>
         <ion-item>
-          <ion-label>Popover</ion-label>
-          <ion-radio value="popover" id="ion-popover"></ion-radio>
+          <ion-radio value="popover" id="ion-popover">Popover</ion-radio>
         </ion-item>
         <ion-item>
-          <ion-label>Toast</ion-label>
-          <ion-radio value="toast" id="ion-toast"></ion-radio>
+          <ion-radio value="toast" id="ion-toast">Toast</ion-radio>
         </ion-item>
       </ion-radio-group>
 
@@ -51,12 +45,10 @@
         </ion-list-header>
 
         <ion-item>
-          <ion-label>Controller</ion-label>
-          <ion-radio value="controller" id="controller"></ion-radio>
+          <ion-radio value="controller" id="controller">Controller</ion-radio>
         </ion-item>
         <ion-item>
-          <ion-label>Component</ion-label>
-          <ion-radio value="component" id="component"></ion-radio>
+          <ion-radio value="component" id="component">Component</ion-radio>
         </ion-item>
       </ion-radio-group>
 
diff --git a/packages/vue/test/base/src/views/Select.vue b/packages/vue/test/base/src/views/Select.vue
index 0f48fcc612..bb4d9b31f3 100644
--- a/packages/vue/test/base/src/views/Select.vue
+++ b/packages/vue/test/base/src/views/Select.vue
@@ -7,8 +7,8 @@
     </ion-header>
     <ion-content>
       <ion-item>
-        <ion-label>Select Popover</ion-label>
         <ion-select
+          label="Select Popover"
           id="select-popover"
           interface="popover"
           placeholder="Select fruit"
@@ -30,7 +30,6 @@ import {
   IonTitle,
   IonContent,
   IonItem,
-  IonLabel,
   IonSelect,
   IonSelectOption,
 } from "@ionic/vue";
@@ -44,7 +43,6 @@ export default defineComponent({
     IonTitle,
     IonContent,
     IonItem,
-    IonLabel,
     IonSelect,
     IonSelectOption,
   },
diff --git a/packages/vue/test/build.sh b/packages/vue/test/build.sh
index 16078c34e2..6b67f50341 100755
--- a/packages/vue/test/build.sh
+++ b/packages/vue/test/build.sh
@@ -22,6 +22,12 @@ FULL_BASE_DIR="${BASE_DIR}/."
 # The full path to the built application.
 BUILD_APP_DIR="${BUILD_DIR}/${APP_DIR}/"
 
+# Make sure the full app directory exists.
+if [ ! -d $FULL_APP_DIR ]; then
+  echo "Could not find test app: ${FULL_APP_DIR}"
+  exit 1
+fi
+
 # Make the build directory if it does not already exist.
 mkdir -p $BUILD_DIR
 
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 6c66e83fe8..b9f9f9adf6 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -18,8 +18,8 @@ importers:
   core:
     dependencies:
       '@stencil/core':
-        specifier: ^4.10.0
-        version: 4.11.0
+        specifier: ^4.12.2
+        version: 4.12.5
       ionicons:
         specifier: ^7.2.2
         version: 7.2.2
@@ -28,20 +28,20 @@ importers:
         version: 2.4.0
     devDependencies:
       '@axe-core/playwright':
-        specifier: ^4.8.4
-        version: 4.8.4(playwright-core@1.39.0)
+        specifier: ^4.8.5
+        version: 4.8.5(playwright-core@1.39.0)
       '@capacitor/core':
-        specifier: ^5.6.0
-        version: 5.6.0
+        specifier: ^5.7.0
+        version: 5.7.2
       '@capacitor/haptics':
-        specifier: ^5.0.6
-        version: 5.0.6(@capacitor/core@5.6.0)
-      '@capacitor/keyboard':
         specifier: ^5.0.7
-        version: 5.0.7(@capacitor/core@5.6.0)
+        version: 5.0.7(@capacitor/core@5.7.2)
+      '@capacitor/keyboard':
+        specifier: ^5.0.8
+        version: 5.0.8(@capacitor/core@5.7.2)
       '@capacitor/status-bar':
-        specifier: ^5.0.6
-        version: 5.0.6(@capacitor/core@5.6.0)
+        specifier: ^5.0.7
+        version: 5.0.7(@capacitor/core@5.7.2)
       '@ionic/eslint-config':
         specifier: ^0.3.0
         version: 0.3.0(eslint@7.32.0)(typescript@4.7.4)
@@ -61,17 +61,17 @@ importers:
         specifier: ^2.0.3
         version: 2.0.3(rollup@2.26.4)
       '@stencil/angular-output-target':
-        specifier: ^0.8.3
-        version: 0.8.3(@stencil/core@4.11.0)
+        specifier: ^0.8.4
+        version: 0.8.4(@stencil/core@4.12.5)
       '@stencil/react-output-target':
         specifier: ^0.5.3
-        version: 0.5.3(@stencil/core@4.11.0)
+        version: 0.5.3(@stencil/core@4.12.5)
       '@stencil/sass':
-        specifier: ^3.0.8
-        version: 3.0.8(@stencil/core@4.11.0)
+        specifier: ^3.0.9
+        version: 3.0.10(@stencil/core@4.12.5)
       '@stencil/vue-output-target':
         specifier: ^0.8.7
-        version: 0.8.7(@stencil/core@4.11.0)
+        version: 0.8.7(@stencil/core@4.12.5)
       '@types/jest':
         specifier: ^27.5.2
         version: 27.5.2
@@ -117,9 +117,6 @@ importers:
       prettier:
         specifier: ^2.6.1
         version: 2.6.1
-      puppeteer:
-        specifier: 21.1.1
-        version: 21.1.1
       rollup:
         specifier: ^2.26.4
         version: 2.26.4
@@ -141,7 +138,7 @@ importers:
   packages/angular:
     dependencies:
       '@ionic/core':
-        specifier: ^7.6.6
+        specifier: ^7.7.4
         version: link:../../core
       ionicons:
         specifier: ^7.0.0
@@ -247,7 +244,7 @@ importers:
   packages/angular-server:
     dependencies:
       '@ionic/core':
-        specifier: ^7.6.6
+        specifier: ^7.7.4
         version: link:../../core
       zone.js:
         specifier: '>=0.11.0'
@@ -312,7 +309,7 @@ importers:
   packages/react:
     dependencies:
       '@ionic/core':
-        specifier: ^7.6.6
+        specifier: ^7.7.4
         version: link:../../core
       ionicons:
         specifier: ^7.0.0
@@ -397,7 +394,7 @@ importers:
   packages/react-router:
     dependencies:
       '@ionic/react':
-        specifier: ^7.6.6
+        specifier: ^7.7.4
         version: link:../react
       history:
         specifier: ^4.9.0
@@ -470,7 +467,7 @@ importers:
   packages/vue:
     dependencies:
       '@ionic/core':
-        specifier: ^7.6.6
+        specifier: ^7.7.4
         version: link:../../core
       ionicons:
         specifier: ^7.0.0
@@ -525,7 +522,7 @@ importers:
   packages/vue-router:
     dependencies:
       '@ionic/vue':
-        specifier: ^7.6.6
+        specifier: ^7.7.4
         version: link:../vue
     devDependencies:
       '@ionic/eslint-config':
@@ -1007,12 +1004,12 @@ packages:
       tslib: 2.4.0
     dev: true
 
-  /@axe-core/playwright@4.8.4(playwright-core@1.39.0):
-    resolution: {integrity: sha512-xpwd+T0BODt19hnXW0eX9xf+H/Ns1rdWwZNmuCV9UoTqjZ9mGm1F80pvh/A1r317ooltq8nwqcoVO9jbHWKSdA==}
+  /@axe-core/playwright@4.8.5(playwright-core@1.39.0):
+    resolution: {integrity: sha512-GFdXXAEn9uk0Vyzgl2eEP+VwvgGzas0YSnacoJ/0U237G83zWZ1PhbP/RDymm0cqevoA+xRjMo+ONzh9Q711nw==}
     peerDependencies:
       playwright-core: '>= 1.0.0'
     dependencies:
-      axe-core: 4.8.3
+      axe-core: 4.8.4
       playwright-core: 1.39.0
     dev: true
 
@@ -1513,34 +1510,34 @@ packages:
     resolution: {integrity: sha512-0hYQ8SB4Db5zvZB4axdMHGwEaQjkZzFjQiN9LVYvIFB2nSUHW9tYpxWriPrWDASIxiaXax83REcLxuSdnGPZtw==}
     dev: true
 
-  /@capacitor/core@5.6.0:
-    resolution: {integrity: sha512-xJhCOUGPHw0QYDA3YH+CmL6qiV9DH4Ij3yPxSenymjrtLuXI197u9ddCZwGEwgVIkh9kGZBBKzsNkn89SZ2gdQ==}
+  /@capacitor/core@5.7.2:
+    resolution: {integrity: sha512-/OUtfINmk7ke32VtKIHRAy8NlunbeK+aCqCHOS+fvtr7nUsOJXPkYgbgqZp/CWXET/gSK1xxMecaVBzpE98UKA==}
     dependencies:
       tslib: 2.6.2
     dev: true
 
-  /@capacitor/haptics@5.0.6(@capacitor/core@5.6.0):
-    resolution: {integrity: sha512-UrMcR7p2X10ql4VLlowUuH/VckTeu0lj+RQpekxox14uxDmu5AGIFDK/iDTi8W6QZkxTJRZK6sbCjgwYgNJ7Pw==}
+  /@capacitor/haptics@5.0.7(@capacitor/core@5.7.2):
+    resolution: {integrity: sha512-/j+7Qa4BxQA5aOU43cwXuiudfSXfoHFsAVfcehH5DkSjxLykZKWHEuE4uFJXqdkSIbAHjS37D0Sde6ENP6G/MA==}
     peerDependencies:
       '@capacitor/core': ^5.0.0
     dependencies:
-      '@capacitor/core': 5.6.0
+      '@capacitor/core': 5.7.2
     dev: true
 
-  /@capacitor/keyboard@5.0.7(@capacitor/core@5.6.0):
-    resolution: {integrity: sha512-+6lW8z2nXTM2NOG7D7pOasCfIGicz26+EeDRXIj5AtJibbjwtE1Q5GIY+qGHgzpmwOF0qmcrGJBz4zagDwUapg==}
+  /@capacitor/keyboard@5.0.8(@capacitor/core@5.7.2):
+    resolution: {integrity: sha512-XYyBzGlzjgLPqyPVdu5McGLYV6+G2efVR4I3l5cF1B27M6U/oFqv9CQU74WNG08nee28bfccboNpv6eWCLYn1A==}
     peerDependencies:
       '@capacitor/core': ^5.0.0
     dependencies:
-      '@capacitor/core': 5.6.0
+      '@capacitor/core': 5.7.2
     dev: true
 
-  /@capacitor/status-bar@5.0.6(@capacitor/core@5.6.0):
-    resolution: {integrity: sha512-7od8CxsBnot1XMK3IeOkproFL4hgoKoWAc3pwUvmDOkQsXoxwQm4SR9mLwQavv1XfxtHbFV9Ukd7FwMxOPSViw==}
+  /@capacitor/status-bar@5.0.7(@capacitor/core@5.7.2):
+    resolution: {integrity: sha512-KblB3gV2LDMEjx3fQoNBAzxb+Tr+2mv68SfFLLDCMiMUD3Eile2TAWRWd1yxy496pDFTOs2BJtup8++iuuuJ/w==}
     peerDependencies:
       '@capacitor/core': ^5.0.0
     dependencies:
-      '@capacitor/core': 5.6.0
+      '@capacitor/core': 5.7.2
     dev: true
 
   /@cnakazawa/watch@1.0.4:
@@ -3668,22 +3665,6 @@ packages:
       playwright: 1.39.0
     dev: true
 
-  /@puppeteer/browsers@1.7.0:
-    resolution: {integrity: sha512-sl7zI0IkbQGak/+IE3VEEZab5SSOlI5F6558WvzWGC1n3+C722rfewC1ZIkcF9dsoGSsxhsONoseVlNQG4wWvQ==}
-    engines: {node: '>=16.3.0'}
-    hasBin: true
-    dependencies:
-      debug: 4.3.4
-      extract-zip: 2.0.1
-      progress: 2.0.3
-      proxy-agent: 6.3.0
-      tar-fs: 3.0.4
-      unbzip2-stream: 1.4.3
-      yargs: 17.7.1
-    transitivePeerDependencies:
-      - supports-color
-    dev: true
-
   /@rollup/plugin-json@4.1.0(rollup@2.79.1):
     resolution: {integrity: sha512-yfLbTdNS6amI/2OpmbiBoW12vngr5NW2jCJVZSBEz+H5KfUJZ2M7sDjk0U6GOOdCWFVScShte29o9NezJ53TPw==}
     peerDependencies:
@@ -3995,12 +3976,12 @@ packages:
       '@sinonjs/commons': 1.8.6
     dev: true
 
-  /@stencil/angular-output-target@0.8.3(@stencil/core@4.11.0):
-    resolution: {integrity: sha512-I/QO1sEx09WWUaNlA30EBhlXYftOSfSBTwYBwC65qlpHDIlD5WU3EAtKhU5IphfwhxnD63kvOoU1YvTUXFHNng==}
+  /@stencil/angular-output-target@0.8.4(@stencil/core@4.12.5):
+    resolution: {integrity: sha512-QvmHTueXXs5vB9W2L12uEzFmAuR8sqATJV2b+SCFmYsjJSaymiSqR3dKo2wnr0tZiTgU1t16BWaUKiSh3wPXpw==}
     peerDependencies:
       '@stencil/core': '>=2.0.0 || >=3 || >= 4.0.0-beta.0 || >= 4.0.0'
     dependencies:
-      '@stencil/core': 4.11.0
+      '@stencil/core': 4.12.5
     dev: true
 
   /@stencil/core@2.22.3:
@@ -4009,34 +3990,34 @@ packages:
     hasBin: true
     dev: false
 
-  /@stencil/core@4.11.0:
-    resolution: {integrity: sha512-zsKhgIkTGo+s7IthitxR/MKiMS3Ck1yIypOdXr0aE6ofboKqe9NdffTcxZ0vel0wD2bZYOb6WfPMzuhRKk6+FA==}
+  /@stencil/core@4.12.5:
+    resolution: {integrity: sha512-vSyFjY7XSEx0ufa9SebOd437CvnneaTXlCpuGDhjUDxAjGBlu6ie5qHyubobVGBth//aErc6wZPHc6W75Vp3iQ==}
     engines: {node: '>=16.0.0', npm: '>=7.10.0'}
     hasBin: true
 
-  /@stencil/react-output-target@0.5.3(@stencil/core@4.11.0):
+  /@stencil/react-output-target@0.5.3(@stencil/core@4.12.5):
     resolution: {integrity: sha512-68jwRp35CjAcwhTJ9yFD/3n+jrHOqvEH2jreVuPVvZK+4tkhPlYlwz0d1E1RlF3jyifUSfdkWUGgXIEy8Fo3yw==}
     peerDependencies:
       '@stencil/core': '>=2.0.0 || >=3 || >= 4.0.0-beta.0 || >= 4.0.0'
     dependencies:
-      '@stencil/core': 4.11.0
+      '@stencil/core': 4.12.5
     dev: true
 
-  /@stencil/sass@3.0.8(@stencil/core@4.11.0):
-    resolution: {integrity: sha512-QJUG4Dr/b3wSizViwQXorrk1PJzxOsKkq5hSqtUHc3NNG3iomC4DQFYGeu15yNfoCDBtt4qkyHSCynsekQ8F6A==}
+  /@stencil/sass@3.0.10(@stencil/core@4.12.5):
+    resolution: {integrity: sha512-G4JdKDhEXEBS4+Riy5WVxPRXfHdfEwPopmPne8fm9ilQpaTRyl3BMpbxt63ijHtQjH0KtH8jxmRiTYamP4BfIA==}
     engines: {node: '>=12.0.0', npm: '>=6.0.0'}
     peerDependencies:
       '@stencil/core': '>=2.0.0 || >=3.0.0-beta.0 || >= 4.0.0-beta.0 || >= 4.0.0'
     dependencies:
-      '@stencil/core': 4.11.0
+      '@stencil/core': 4.12.5
     dev: true
 
-  /@stencil/vue-output-target@0.8.7(@stencil/core@4.11.0):
+  /@stencil/vue-output-target@0.8.7(@stencil/core@4.12.5):
     resolution: {integrity: sha512-hgOzbKKgLdCFrhLpmaw/qQrPSXl6hZ09K+j3p/iWh3esq6sxnwuW1PJKLniwkT4Z/JlDIk6stGPGQYi+WE5I2Q==}
     peerDependencies:
       '@stencil/core': '>=2.0.0 || >=3 || >= 4.0.0-beta.0 || >= 4.0.0'
     dependencies:
-      '@stencil/core': 4.11.0
+      '@stencil/core': 4.12.5
     dev: true
 
   /@stylelint/postcss-css-in-js@0.37.3(postcss-syntax@0.36.2)(postcss@7.0.39):
@@ -4171,10 +4152,6 @@ packages:
     engines: {node: '>= 10'}
     dev: true
 
-  /@tootallnate/quickjs-emscripten@0.23.0:
-    resolution: {integrity: sha512-C5Mc6rdnsaJDjO3UpGW/CQTHtCKaYlScZTly4JIu97Jxo/odCiH0ITnDXSJPTOrEKk/ycSZ0AOgTmkDtkOsvIA==}
-    dev: true
-
   /@tufjs/canonical-json@2.0.0:
     resolution: {integrity: sha512-yVtV8zsdo8qFHe+/3kw81dSLyF7D576A5cCFCi4X7B39tWT7SekaEFUnvnWJHz+9qO7qJTah1JbrDjWKqFtdWA==}
     engines: {node: ^16.14.0 || >=18.0.0}
@@ -4348,14 +4325,6 @@ packages:
     resolution: {integrity: sha512-mikldZQitV94akrc4sCcSjtJfsTKt4p+e/s0AGscVA6XArQ9kFclP+ZiYUMnq987rc6QlYxXv/EivqlfSLxpKA==}
     dev: true
 
-  /@types/node@18.19.3:
-    resolution: {integrity: sha512-k5fggr14DwAytoA/t8rPrIz++lXK7/DqckthCmoZOKNsEbJkId4Z//BqgApXBUGrGddrigYa1oqheo/7YmW4rg==}
-    requiresBuild: true
-    dependencies:
-      undici-types: 5.26.5
-    dev: true
-    optional: true
-
   /@types/normalize-package-data@2.4.1:
     resolution: {integrity: sha512-Gj7cI7z+98M282Tqmp2K5EIsoouUEzbBJhQQzDE3jSIRk6r9gsz0oUokqIUR4u1R3dMHo0pDHM7sNOHyhulypw==}
     dev: true
@@ -4460,14 +4429,6 @@ packages:
       '@types/yargs-parser': 21.0.2
     dev: true
 
-  /@types/yauzl@2.10.3:
-    resolution: {integrity: sha512-oJoftv0LSuaDZE3Le4DbKX+KS9G36NzOeSap90UIK0yMA/NhKJhqlSGtNDORNRaIbQfzjXDrQa0ytJ6mNRGz/Q==}
-    requiresBuild: true
-    dependencies:
-      '@types/node': 18.19.3
-    dev: true
-    optional: true
-
   /@typescript-eslint/eslint-plugin@4.33.0(@typescript-eslint/parser@4.33.0)(eslint@7.32.0)(typescript@4.7.2):
     resolution: {integrity: sha512-aINiAxGVdOl1eJyVjaWn/YcVAq4Gi/Yo35qHGCnqbWVz61g39D0h23veY/MA0rFFGfxK7TySg2uwDeNv+JgVpg==}
     engines: {node: ^10.12.0 || >=12.0.0}
@@ -5953,13 +5914,6 @@ packages:
     engines: {node: '>=0.10.0'}
     dev: true
 
-  /ast-types@0.13.4:
-    resolution: {integrity: sha512-x1FCFnFifvYDDzTaLII71vG5uvDwgtmDTEVWAxrgeiR8VjMONcCXJx7E+USjDtHlwFmt9MysbqgF9b9Vjr6w+w==}
-    engines: {node: '>=4'}
-    dependencies:
-      tslib: 2.6.2
-    dev: true
-
   /astral-regex@2.0.0:
     resolution: {integrity: sha512-Z7tMw1ytTXt5jqMcOP+OQteU1VuNK9Y02uuJtKQ1Sv69jXQKKg5cibLwGJow8yzZP+eAc18EmLGPal0bp36rvQ==}
     engines: {node: '>=8'}
@@ -6019,8 +5973,8 @@ packages:
     engines: {node: '>= 0.4'}
     dev: true
 
-  /axe-core@4.8.3:
-    resolution: {integrity: sha512-d5ZQHPSPkF9Tw+yfyDcRoUOc4g/8UloJJe5J8m4L5+c7AtDdjDLRxew/knnI4CxvtdxEUVgWz4x3OIQUIFiMfw==}
+  /axe-core@4.8.4:
+    resolution: {integrity: sha512-CZLSKisu/bhJ2awW4kJndluz2HLZYIHh5Uy1+ZwDRkJi69811xgIXXfdU9HSLX0Th+ILrHj8qfL/5wzamsFtQg==}
     engines: {node: '>=4'}
     dev: true
 
@@ -6029,10 +5983,6 @@ packages:
     engines: {node: '>=6.0'}
     dev: true
 
-  /b4a@1.6.4:
-    resolution: {integrity: sha512-fpWrvyVHEKyeEvbKZTVOeZF3VSKKWtJxFIxX/jaVPf+cLbGUSitjb49pHLqPV2BUNNZ0LcoeEGfE/YCpyDYHIw==}
-    dev: true
-
   /babel-jest@26.6.3(@babel/core@7.23.6):
     resolution: {integrity: sha512-pl4Q+GAVOHwvjrck6jKjvmGhnO3jHX/xuB9d27f+EJZ/6k+6nMuPjorrYp7s++bKKdANwzElBWnLWaObvTnaZA==}
     engines: {node: '>= 10.14.2'}
@@ -6214,11 +6164,6 @@ packages:
       pascalcase: 0.1.1
     dev: true
 
-  /basic-ftp@5.0.4:
-    resolution: {integrity: sha512-8PzkB0arJFV4jJWSGOYR+OEic6aeKMu/osRhBULN6RY0ykby6LKhbmuQ5ublvaas5BOwboah5D87nrHyuh8PPA==}
-    engines: {node: '>=10.0.0'}
-    dev: true
-
   /before-after-hook@2.2.2:
     resolution: {integrity: sha512-3pZEU3NT5BFUo/AD5ERPWOgQOCZITni6iavr5AUw5AUwQjMlI0kzu5btnyD39AF0gUEsDPwJT+oY1ORBJijPjQ==}
     dev: true
@@ -6353,10 +6298,6 @@ packages:
       node-int64: 0.4.0
     dev: true
 
-  /buffer-crc32@0.2.13:
-    resolution: {integrity: sha512-VO9Ht/+p3SN7SKWqcrgEzjGbRSJYTx+Q1pTQC0wrWqHx0vpJraQ6GtHx8tvcg1rlK1byhU5gccxgOgj7B0TDkQ==}
-    dev: true
-
   /buffer-from@1.1.2:
     resolution: {integrity: sha512-E+XQCRwSbaaiChtv6k6Dwgc+bx+Bs6vuKJHHl5kox/BaKbhiXzqQOwK4cO22yElGp2OCmjwVhT3HmxgyPGnJfQ==}
     dev: true
@@ -6672,15 +6613,6 @@ packages:
     engines: {node: '>=10'}
     dev: true
 
-  /chromium-bidi@0.4.22(devtools-protocol@0.0.1159816):
-    resolution: {integrity: sha512-wR7Y9Ioez+cNXT4ZP7VNM1HRTljpNnMSLw4/RnwhhZUP4yCU7kIQND00YiktuHekch68jklGPK1q9Jkb29+fQg==}
-    peerDependencies:
-      devtools-protocol: '*'
-    dependencies:
-      devtools-protocol: 0.0.1159816
-      mitt: 3.0.1
-    dev: true
-
   /ci-info@2.0.0:
     resolution: {integrity: sha512-5tK7EtrZ0N+OLFMthtqOj4fI2Jeb88C4CAZPu25LDVUgXJ0A3Js4PMGqrn0JU1W0Mh1/Z8wZzYPxqUrXeBboCQ==}
     dev: true
@@ -7149,24 +7081,6 @@ packages:
       yaml: 1.10.2
     dev: true
 
-  /cosmiconfig@8.2.0:
-    resolution: {integrity: sha512-3rTMnFJA1tCOPwRxtgF4wd7Ab2qvDbL8jX+3smjIbS4HlZBagTlpERbdN7iAbWlrfxE3M8c27kTwTawQ7st+OQ==}
-    engines: {node: '>=14'}
-    dependencies:
-      import-fresh: 3.3.0
-      js-yaml: 4.1.0
-      parse-json: 5.2.0
-      path-type: 4.0.0
-    dev: true
-
-  /cross-fetch@4.0.0:
-    resolution: {integrity: sha512-e4a5N8lVvuLgAWgnCrLr2PP0YyDOTHa9H/Rj54dirp61qXnNq46m82bRhNqIA5VccJtWBvPTFRV3TtvHUKPB1g==}
-    dependencies:
-      node-fetch: 2.7.0
-    transitivePeerDependencies:
-      - encoding
-    dev: true
-
   /cross-spawn@6.0.5:
     resolution: {integrity: sha512-eTVLrBSt7fjbDygz805pMnstIs2VTBNkRm0qxZd+M7A5XDdxVRWO5MxGBXZhjY4cqLYLdtrGqRf8mBPmzwSpWQ==}
     engines: {node: '>=4.8'}
@@ -7282,11 +7196,6 @@ packages:
     engines: {node: '>=8'}
     dev: true
 
-  /data-uri-to-buffer@6.0.1:
-    resolution: {integrity: sha512-MZd3VlchQkp8rdend6vrx7MmVDJzSNTBvghvKjirLkD+WTChA3KUf0jkE68Q4UyctNqI11zZO9/x2Yx+ub5Cvg==}
-    engines: {node: '>= 14'}
-    dev: true
-
   /data-urls@2.0.0:
     resolution: {integrity: sha512-X5eWTSXO/BJmpdIKCRuKUgSCgAN0OwliVK3yPKbwIWU1Tdw5BRajxlzMidvh+gwko9AfQ9zIj52pzF91Q3YAvQ==}
     engines: {node: '>=10'}
@@ -7470,15 +7379,6 @@ packages:
       isobject: 3.0.1
     dev: true
 
-  /degenerator@5.0.1:
-    resolution: {integrity: sha512-TllpMR/t0M5sqCXfj85i4XaAzxmS5tVA16dqvdkMwGmzI+dXLXnw3J+3Vdv7VKw+ThlTMboK6i9rnZ6Nntj5CQ==}
-    engines: {node: '>= 14'}
-    dependencies:
-      ast-types: 0.13.4
-      escodegen: 2.1.0
-      esprima: 4.0.1
-    dev: true
-
   /del@4.1.1:
     resolution: {integrity: sha512-QwGuEUouP2kVwQenAsOof5Fv8K9t3D8Ca8NxcXKrIpEHjTXK5J2nXLdP+ALI1cgv8wj7KuwBhTwBkOZSJKM5XQ==}
     engines: {node: '>=6'}
@@ -7530,10 +7430,6 @@ packages:
     engines: {node: '>=8'}
     dev: true
 
-  /devtools-protocol@0.0.1159816:
-    resolution: {integrity: sha512-2cZlHxC5IlgkIWe2pSDmCrDiTzbSJWywjbDDnupOImEBcG31CQgBLV8wWE+5t+C4rimcjHsbzy7CBzf9oFjboA==}
-    dev: true
-
   /dezalgo@1.0.4:
     resolution: {integrity: sha512-rXSP0bf+5n0Qonsb+SVVfNfIsimO4HEtmnIpPHY8Q1UCzKlQrDMfdobr8nJOOsRgWCyMRqeSBQzmWUMq7zvVig==}
     dependencies:
@@ -8755,28 +8651,10 @@ packages:
       - supports-color
     dev: true
 
-  /extract-zip@2.0.1:
-    resolution: {integrity: sha512-GDhU9ntwuKyGXdZBUgTIe+vXnWj0fppUEtMDL0+idd5Sta8TGpHssn/eusA9mrPr9qNDym6SxAYZjNvCn/9RBg==}
-    engines: {node: '>= 10.17.0'}
-    hasBin: true
-    dependencies:
-      debug: 4.3.4
-      get-stream: 5.2.0
-      yauzl: 2.10.0
-    optionalDependencies:
-      '@types/yauzl': 2.10.3
-    transitivePeerDependencies:
-      - supports-color
-    dev: true
-
   /fast-deep-equal@3.1.3:
     resolution: {integrity: sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==}
     dev: true
 
-  /fast-fifo@1.3.2:
-    resolution: {integrity: sha512-/d9sfos4yxzpwkDkuN7k2SqFKtYNmCTzgfEpz82x34IM9/zc8KGxQoXg1liNC/izpRM/MBdt44Nmx41ZWqk+FQ==}
-    dev: true
-
   /fast-glob@3.2.12:
     resolution: {integrity: sha512-DVj4CQIYYow0BlaelwK1pHl5n5cRSJfM60UA0zK891sVInoPri2Ekj7+e1CT3/3qxXenpI+nBBmQAcJPJgaj4w==}
     engines: {node: '>=8.6.0'}
@@ -8830,12 +8708,6 @@ packages:
       bser: 2.1.1
     dev: true
 
-  /fd-slicer@1.1.0:
-    resolution: {integrity: sha512-cE1qsB/VwyQozZ+q1dGxR8LBYNZeofhEdUNGSMbQD3Gw2lAzX9Zb3uIU6Ebc/Fmyjo9AWWfnn0AUCHqtevs/8g==}
-    dependencies:
-      pend: 1.2.0
-    dev: true
-
   /figures@1.7.0:
     resolution: {integrity: sha512-UxKlfCRuCBxSXU4C6t9scbDyWZ4VlaFFdojKtzJuSkuOBQ5CNFum+zZXFwHjo+CxBC1t6zlYPgHIgFjL8ggoEQ==}
     engines: {node: '>=0.10.0'}
@@ -9002,15 +8874,6 @@ packages:
       universalify: 0.1.2
     dev: true
 
-  /fs-extra@8.1.0:
-    resolution: {integrity: sha512-yhlQgA6mnOJUKOsRUFsgJdQCvkKhcz8tlZG5HBQfReYZy46OwLcY+Zia0mtdHsOo9y/hP+CxMN0TU9QxoOtG4g==}
-    engines: {node: '>=6 <7 || >=8'}
-    dependencies:
-      graceful-fs: 4.2.10
-      jsonfile: 4.0.0
-      universalify: 0.1.2
-    dev: true
-
   /fs-extra@9.1.0:
     resolution: {integrity: sha512-hcg3ZmepS30/7BSFqRvoo3DOMQu7IjqxO5nCDt+zM9XWjb33Wg7ziNT+Qvqbuc3+gWpzO02JubVyk2G4Zvo1OQ==}
     engines: {node: '>=10'}
@@ -9173,18 +9036,6 @@ packages:
       get-intrinsic: 1.2.2
     dev: true
 
-  /get-uri@6.0.2:
-    resolution: {integrity: sha512-5KLucCJobh8vBY1K07EFV4+cPZH3mrV9YeAruUseCQKHB58SGjjT2l9/eA9LD082IiuMjSlFJEcdJ27TXvbZNw==}
-    engines: {node: '>= 14'}
-    dependencies:
-      basic-ftp: 5.0.4
-      data-uri-to-buffer: 6.0.1
-      debug: 4.3.4
-      fs-extra: 8.1.0
-    transitivePeerDependencies:
-      - supports-color
-    dev: true
-
   /get-value@2.0.6:
     resolution: {integrity: sha512-Ln0UQDlxH1BapMu3GPtf7CuYNwRZf2gwCuPqbyG6pB8WfmFpzqcy4xtAaAMUhnNqjMKTiCPZG2oMT3YSx8U2NA==}
     engines: {node: '>=0.10.0'}
@@ -9992,13 +9843,9 @@ packages:
   /ionicons@7.2.2:
     resolution: {integrity: sha512-I3iYIfc9Q9FRifWyFSwTAvbEABWlWY32i0sAVDDPGYnaIZVugkLCZFbEcrphW6ixVPg8tt1oLwalo/JJwbEqnA==}
     dependencies:
-      '@stencil/core': 4.11.0
+      '@stencil/core': 4.12.5
     dev: false
 
-  /ip@1.1.8:
-    resolution: {integrity: sha512-PuExPYUiu6qMBQb4l06ecm6T6ujzhmh+MeJcW9wa89PoAz5pvd4zPgN5WJV104mb6S2T1AwNIAaB70JNrLQWhg==}
-    dev: true
-
   /ip@2.0.0:
     resolution: {integrity: sha512-WKa+XuLG1A1R0UWhl2+1XQSi+fZWMsYKffMZTTYsiZaUD8k2yDAj5atimTUD2TZkyCkNEeYE5NhFZmupOGtjYQ==}
     dev: true
@@ -12864,10 +12711,6 @@ packages:
       yallist: 4.0.0
     dev: true
 
-  /mitt@3.0.1:
-    resolution: {integrity: sha512-vKivATfr97l2/QBCYAkXYDbrIWPM2IIKEl7YPhjCvKlG3kE2gm+uBo6nEXK3M5/Ffh/FLpKExzOQ3JJoJGFKBw==}
-    dev: true
-
   /mixin-deep@1.3.2:
     resolution: {integrity: sha512-WRoDn//mXBiJ1H40rqa3vH0toePwSsGb45iInWlTySa+Uu4k3tYUSxa2v1KqAiLtvlrSzaExqS1gtk96A9zvEA==}
     engines: {node: '>=0.10.0'}
@@ -12876,10 +12719,6 @@ packages:
       is-extendable: 1.0.1
     dev: true
 
-  /mkdirp-classic@0.5.3:
-    resolution: {integrity: sha512-gKLcREMhtuZRwRAfqP3RFW+TK4JqApVBtOIftVgjuABpAtpxhPGaDcfvbhNvD0B8iD1oUr/txX35NjcaY6Ns/A==}
-    dev: true
-
   /mkdirp-infer-owner@2.0.0:
     resolution: {integrity: sha512-sdqtiFt3lkOaYvTXSRIUjkIdPTcxgv5+fgqYE/5qgwdw12cOrAuzzgzvVExIkH/ul1oeHN3bCLOWSG3XOqbKKw==}
     engines: {node: '>=10'}
@@ -12992,11 +12831,6 @@ packages:
     resolution: {integrity: sha512-Yd3UES5mWCSqR+qNT93S3UoYUkqAZ9lLg8a7g9rimsWmYGK8cVToA4/sF3RrshdyV3sAGMXVUmpMYOw+dLpOuw==}
     dev: true
 
-  /netmask@2.0.2:
-    resolution: {integrity: sha512-dBpDMdxv9Irdq66304OLfEmQ9tbNRFnFTuZiLo+bD+r332bBmMJ8GBLXklIXXgxd3+v9+KUnZaUR5PJMa75Gsg==}
-    engines: {node: '>= 0.4.0'}
-    dev: true
-
   /new-github-release-url@1.0.0:
     resolution: {integrity: sha512-dle7yf655IMjyFUqn6Nxkb18r4AOAkzRcgcZv6WZ0IqrOH4QCEZ8Sm6I7XX21zvHdBeeMeTkhR9qT2Z0EJDx6A==}
     engines: {node: '>=10'}
@@ -13119,18 +12953,6 @@ packages:
       whatwg-url: 5.0.0
     dev: true
 
-  /node-fetch@2.7.0:
-    resolution: {integrity: sha512-c4FRfUm/dbcWZ7U+1Wq0AwCyFL+3nt2bEw05wfxSz+DWpWsitgmSgYmy2dQdWyKC1694ELPqMs/YzUSNozLt8A==}
-    engines: {node: 4.x || >=6.0.0}
-    peerDependencies:
-      encoding: ^0.1.0
-    peerDependenciesMeta:
-      encoding:
-        optional: true
-    dependencies:
-      whatwg-url: 5.0.0
-    dev: true
-
   /node-gyp-build@4.5.0:
     resolution: {integrity: sha512-2iGbaQBV+ITgCz76ZEjmhUKAKVf7xfY1sRl4UiKQspfZMH2h06SyhNsnSVy50cwkFQDGLyif6m/6uFXHkOZ6rg==}
     hasBin: true
@@ -13884,31 +13706,6 @@ packages:
       p-reduce: 2.1.0
     dev: true
 
-  /pac-proxy-agent@7.0.1:
-    resolution: {integrity: sha512-ASV8yU4LLKBAjqIPMbrgtaKIvxQri/yh2OpI+S6hVa9JRkUI3Y3NPFbfngDtY7oFtSMD3w31Xns89mDa3Feo5A==}
-    engines: {node: '>= 14'}
-    dependencies:
-      '@tootallnate/quickjs-emscripten': 0.23.0
-      agent-base: 7.1.0
-      debug: 4.3.4
-      get-uri: 6.0.2
-      http-proxy-agent: 7.0.0
-      https-proxy-agent: 7.0.2
-      pac-resolver: 7.0.0
-      socks-proxy-agent: 8.0.2
-    transitivePeerDependencies:
-      - supports-color
-    dev: true
-
-  /pac-resolver@7.0.0:
-    resolution: {integrity: sha512-Fd9lT9vJbHYRACT8OhCbZBbxr6KRSawSovFpy8nDGshaK99S/EBhVIHp9+crhxrsZOuvLpgL1n23iyPg6Rl2hg==}
-    engines: {node: '>= 14'}
-    dependencies:
-      degenerator: 5.0.1
-      ip: 1.1.8
-      netmask: 2.0.2
-    dev: true
-
   /package-json@6.5.0:
     resolution: {integrity: sha512-k3bdm2n25tkyxcjSKzB5x8kfVxlMdgsbPr0GkZcwHsLpba6cBjqCt1KlcChKEvxHIcTB1FVMuwoijZ26xex5MQ==}
     engines: {node: '>=8'}
@@ -14133,10 +13930,6 @@ packages:
     engines: {node: '>=8'}
     dev: true
 
-  /pend@1.2.0:
-    resolution: {integrity: sha512-F3asv42UuXchdzt+xXqfW1OGlVBe+mxa2mqI0pg5yAHZPvFmY3Y6drSf/GQ1A86WgWEN9Kzh/WrgKa6iGcHXLg==}
-    dev: true
-
   /picocolors@0.2.1:
     resolution: {integrity: sha512-cMlDqaLEqfSaW8Z7N5Jw+lyIW869EzT73/F5lhtY9cLGoVxSXznfgfXMO0Z5K0o0Q2TkTXq+0KFsdnSe3jDViA==}
     dev: true
@@ -14805,26 +14598,6 @@ packages:
     resolution: {integrity: sha512-/XJ368cyBJ7fzLMwLKv1e4vLxOju2MNAIokcr7meSaNcVbWz/CPcW22cP04mwxOErdA5mwjA8Q6w/cdAQxVn7Q==}
     dev: true
 
-  /proxy-agent@6.3.0:
-    resolution: {integrity: sha512-0LdR757eTj/JfuU7TL2YCuAZnxWXu3tkJbg4Oq3geW/qFNT/32T0sp2HnZ9O0lMR4q3vwAt0+xCA8SR0WAD0og==}
-    engines: {node: '>= 14'}
-    dependencies:
-      agent-base: 7.1.0
-      debug: 4.3.4
-      http-proxy-agent: 7.0.0
-      https-proxy-agent: 7.0.2
-      lru-cache: 7.18.3
-      pac-proxy-agent: 7.0.1
-      proxy-from-env: 1.1.0
-      socks-proxy-agent: 8.0.2
-    transitivePeerDependencies:
-      - supports-color
-    dev: true
-
-  /proxy-from-env@1.1.0:
-    resolution: {integrity: sha512-D+zkORCbA9f1tdWRK0RaCR3GPv50cMxcrz4X8k5LTSUD1Dkw47mKJEZQNunItRTkWwgtaUSo1RVFRIG9ZXiFYg==}
-    dev: true
-
   /prr@1.0.1:
     resolution: {integrity: sha512-yPw4Sng1gWghHQWj0B3ZggWUm4qVbPwPFcRG8KyxiU7J2OHFSoEHKS+EZ3fv5l1t9CyCiop6l/ZYeWbrgoQejw==}
     requiresBuild: true
@@ -14858,39 +14631,6 @@ packages:
       escape-goat: 2.1.1
     dev: true
 
-  /puppeteer-core@21.1.1:
-    resolution: {integrity: sha512-Tlcajcf44zwfa9Sbwv3T8BtaNMJ69wtpHIxwl2NOBTyTK3D1wppQovXTjfw0TDOm3a16eCfQ+5BMi3vRQ4kuAQ==}
-    engines: {node: '>=16.3.0'}
-    dependencies:
-      '@puppeteer/browsers': 1.7.0
-      chromium-bidi: 0.4.22(devtools-protocol@0.0.1159816)
-      cross-fetch: 4.0.0
-      debug: 4.3.4
-      devtools-protocol: 0.0.1159816
-      ws: 8.13.0
-    transitivePeerDependencies:
-      - bufferutil
-      - encoding
-      - supports-color
-      - utf-8-validate
-    dev: true
-
-  /puppeteer@21.1.1:
-    resolution: {integrity: sha512-2TLntjGA4qLrI9/8N0UK/5OoZJ2Ue7QgphN2SD+RsaHiha12AEiVyMGsB+i6LY1IoPAtEgYIjblQ7lw3kWDNRw==}
-    engines: {node: '>=16.3.0'}
-    deprecated: < 21.3.7 is no longer supported
-    requiresBuild: true
-    dependencies:
-      '@puppeteer/browsers': 1.7.0
-      cosmiconfig: 8.2.0
-      puppeteer-core: 21.1.1
-    transitivePeerDependencies:
-      - bufferutil
-      - encoding
-      - supports-color
-      - utf-8-validate
-    dev: true
-
   /q@1.5.1:
     resolution: {integrity: sha512-kV/CThkXo6xyFEZUugw/+pIOywXcDbFYgSct5cT3gqlbkBE1SJdwy6UQoZvodiWF/ckQLZyDE/Bu1M6gVu5lVw==}
     engines: {node: '>=0.6.0', teleport: '>=0.2.0'}
@@ -14904,10 +14644,6 @@ packages:
     resolution: {integrity: sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A==}
     dev: true
 
-  /queue-tick@1.0.1:
-    resolution: {integrity: sha512-kJt5qhMxoszgU/62PLP1CJytzd2NKetjSRnyuj31fDd3Rlcz3fzlFdFLD1SItunPwyqEOkca6GbV612BWfaBag==}
-    dev: true
-
   /quick-lru@4.0.1:
     resolution: {integrity: sha512-ARhCpm70fzdcvNQfPoy49IaanKkTlRWF2JMzqhcJbhSFRZv7nPTvZJdcY7301IPmvW+/p0RgIWnQDLJxifsQ7g==}
     engines: {node: '>=8'}
@@ -15997,13 +15733,6 @@ packages:
       object-copy: 0.1.0
     dev: true
 
-  /streamx@2.15.6:
-    resolution: {integrity: sha512-q+vQL4AAz+FdfT137VF69Cc/APqUbxy+MDOImRrMvchJpigHj9GksgDU2LYbO9rx7RX6osWgxJB2WxhYv4SZAw==}
-    dependencies:
-      fast-fifo: 1.3.2
-      queue-tick: 1.0.1
-    dev: true
-
   /string-length@4.0.2:
     resolution: {integrity: sha512-+l6rNN5fYHNhZZy41RXsYptCjA2Igmq4EG7kZAYFQI1E1VTXarr6ZPXBg6eq7Y6eK4FEhY6AJlyuFIb/v/S0VQ==}
     engines: {node: '>=10'}
@@ -16327,14 +16056,6 @@ packages:
       strip-ansi: 6.0.1
     dev: true
 
-  /tar-fs@3.0.4:
-    resolution: {integrity: sha512-5AFQU8b9qLfZCX9zp2duONhPmZv0hGYiBPJsyUdqMjzq/mqVpy/rEUSeHk1+YitmxugaptgBh5oDGU3VsAJq4w==}
-    dependencies:
-      mkdirp-classic: 0.5.3
-      pump: 3.0.0
-      tar-stream: 3.1.6
-    dev: true
-
   /tar-stream@2.2.0:
     resolution: {integrity: sha512-ujeqbceABgwMZxEJnk2HDY2DlnUZ+9oEcb1KzTVfYHio0UE6dG71n60d8D2I4qNvleWrrXpmjpt7vZeF1LnMZQ==}
     engines: {node: '>=6'}
@@ -16346,14 +16067,6 @@ packages:
       readable-stream: 3.6.0
     dev: true
 
-  /tar-stream@3.1.6:
-    resolution: {integrity: sha512-B/UyjYwPpMBv+PaFSWAmtYjwdrlEaZQEhMIBFNC5oEG8lpiW8XjcSdmEaClj28ArfKScKHs2nshz3k2le6crsg==}
-    dependencies:
-      b4a: 1.6.4
-      fast-fifo: 1.3.2
-      streamx: 2.15.6
-    dev: true
-
   /tar@6.1.11:
     resolution: {integrity: sha512-an/KZQzQUkZCkuoAA64hM92X0Urb6VpRhAFllDzz44U2mcD5scmT3zBc4VgVpkugF580+DQn8eAFSyoQt0tznA==}
     engines: {node: '>= 10'}
@@ -16825,19 +16538,6 @@ packages:
       which-boxed-primitive: 1.0.2
     dev: true
 
-  /unbzip2-stream@1.4.3:
-    resolution: {integrity: sha512-mlExGW4w71ebDJviH16lQLtZS32VKqsSfk80GCfUlwT/4/hNRFsoscrF/c++9xinkMzECL1uL9DDwXqFWkruPg==}
-    dependencies:
-      buffer: 5.7.1
-      through: 2.3.8
-    dev: true
-
-  /undici-types@5.26.5:
-    resolution: {integrity: sha512-JlCMO+ehdEIKqlFxk6IfVoAUVmgz7cU7zD/h9XZ0qzeosSHmUJVOzSQvvYSYWXkFXC+IfLKSIffhv0sVZup6pA==}
-    requiresBuild: true
-    dev: true
-    optional: true
-
   /unified@9.2.2:
     resolution: {integrity: sha512-Sg7j110mtefBD+qunSLO1lqOEKdrwBFBrR6Qd8f4uwkhWNlbkaqwHse6e7QvD3AP/MNoJdEDLaf8OxYyoWgorQ==}
     dependencies:
@@ -17435,19 +17135,6 @@ packages:
         optional: true
     dev: true
 
-  /ws@8.13.0:
-    resolution: {integrity: sha512-x9vcZYTrFPC7aSIbj7sRCYo7L/Xb8Iy+pW0ng0wt2vCJv7M9HOMy0UoN3rr+IFC7hb7vXoqS+P9ktyLLLhO+LA==}
-    engines: {node: '>=10.0.0'}
-    peerDependencies:
-      bufferutil: ^4.0.1
-      utf-8-validate: '>=5.0.2'
-    peerDependenciesMeta:
-      bufferutil:
-        optional: true
-      utf-8-validate:
-        optional: true
-    dev: true
-
   /ws@8.14.2:
     resolution: {integrity: sha512-wEBG1ftX4jcglPxgFCMJmZ2PLtSbJ2Peg6TmpJFTbe9GZYOQCDPdMYu/Tm0/bGZkw8paZnJY45J4K2PZrLYq8g==}
     engines: {node: '>=10.0.0'}
@@ -17583,19 +17270,6 @@ packages:
       yargs-parser: 21.0.1
     dev: true
 
-  /yargs@17.7.1:
-    resolution: {integrity: sha512-cwiTb08Xuv5fqF4AovYacTFNxk62th7LKJ6BL9IGUpTJrWoU7/7WdQGTP2SjKf1dUNBGzDd28p/Yfs/GI6JrLw==}
-    engines: {node: '>=12'}
-    dependencies:
-      cliui: 8.0.1
-      escalade: 3.1.1
-      get-caller-file: 2.0.5
-      require-directory: 2.1.1
-      string-width: 4.2.3
-      y18n: 5.0.8
-      yargs-parser: 21.1.1
-    dev: true
-
   /yargs@17.7.2:
     resolution: {integrity: sha512-7dSzzRQ++CKnNI/krKnYRV7JKKPUXMEh61soaHKg9mrWEhzFWhFnxPxGl+69cD1Ou63C13NUPCnmIcrvqCuM6w==}
     engines: {node: '>=12'}
@@ -17609,13 +17283,6 @@ packages:
       yargs-parser: 21.1.1
     dev: true
 
-  /yauzl@2.10.0:
-    resolution: {integrity: sha512-p4a9I6X6nu6IhoGmBqAcbJy1mlC4j27vEPZX9F4L4/vZT3Lyq1VkFHw/V/PUcB9Buo+DG3iHkT0x3Qya58zc3g==}
-    dependencies:
-      buffer-crc32: 0.2.13
-      fd-slicer: 1.1.0
-    dev: true
-
   /yocto-queue@0.1.0:
     resolution: {integrity: sha512-rVksvsnNCdJ/ohGc6xgPwyN8eheCxsiLM8mxuE/t/mOVqJewPuO1miLpTHQiRgTKCLexL4MeAFVagts7HmNZ2Q==}
     engines: {node: '>=10'}
diff --git a/renovate.json5 b/renovate.json5
new file mode 100644
index 0000000000..bfb2bcf930
--- /dev/null
+++ b/renovate.json5
@@ -0,0 +1,94 @@
+{
+  $schema: "https://docs.renovatebot.com/renovate-schema.json",
+  extends: ["config:base", ":semanticCommitTypeAll(chore)"],
+  packageRules: [
+    {
+      // Group these two as they may rely on one another during major version bumps
+      matchPackageNames: ["actions/download-artifact", "actions/upload-artifact"],
+      groupName: "Download + Upload Artifacts"
+    },
+    {
+      matchPackagePatterns: ["@stencil/core", "@stencil/angular-output-target", "@stencil/react-output-target", "@stencil/sass", "@stencil/vue-output-target"],
+      groupName: "stencil",
+      matchFileNames: [
+        "core/package.json"
+      ]
+    },
+    {
+      matchPackagePatterns: ["@capacitor/core", "@capacitor/keyboard", "@capacitor/haptics", "@capacitor/status-bar"],
+      groupName: "capacitor",
+      matchFileNames: [
+        "core/package.json"
+      ]
+    },
+    {
+      matchDatasources: ["npm"],
+      matchPackagePatterns: ["@playwright/test", "@axe-core/playwright"],
+      groupName: "playwright",
+      matchFileNames: [
+        "core/package.json"
+      ]
+    },
+    {
+      matchPackagePatterns: ["ionicons"],
+      groupName: "ionicons",
+      matchFileNames: [
+        "core/package.json"
+      ]
+    },
+    /**
+     * While we update dependencies in certain directories, we currently
+     * do not want to update every single dependency. Some of the dependencies are
+     * very out of date, and the team needs to schedule work to account for
+     * breaking changes in some of these updates. To potentially avoid a large number of
+     * failing PRs the team has chosen to selectively enable dependencies to be updated
+     * as we have capacity to account for breaking changes.
+     */
+    {
+      matchPackagePatterns: ["tslib", "@ionic/", "@rollup/", "@types/", "@typescript-eslint/", "clean-css-cli", "domino", "eslint", "eslint-config-prettier", "execa", "fs-extra", "jest", "jest-cli", "prettier", "puppeteer", "rollup", "sass", "serve", "stylelint", "stylelint-order"],
+      groupName: "core-disabled",
+      matchFileNames: [
+        "core/package.json"
+      ],
+      enabled: false
+    },
+    /**
+     * Local Ionic dependencies are managed by the
+     * workspace to ensure the correct local version is used.
+     */
+    {
+      matchPackagePatterns: ["@ionic/", "ionicons"],
+      groupName: "ignore-local-ionic-deps",
+      matchFileNames: [
+        "**/package.json"
+      ],
+      enabled: false
+    },
+    {
+      matchPackagePatterns: ["lerna", "semver"],
+      groupName: "root-disabled",
+      matchFileNames: [
+        "package.json"
+      ],
+      enabled: false
+    }
+  ],
+  dependencyDashboard: false,
+  minimumReleaseAge: "3 days",
+  rebaseWhen: "never",
+  schedule: ["every weekday before 11am"],
+  semanticCommits: "enabled",
+  ignorePaths: [
+    // Ionic Packages
+    "packages/angular",
+    "packages/angular-server",
+    "packages/react",
+    "packages/react-router",
+    "packages/vue",
+    "packages/vue-router",
+    "docs",
+    // Local Development Scripts
+    "core/custom-rules",
+    "core/scripts"
+  ]
+}