diff --git a/.github/workflows/update-screenshots.yml b/.github/workflows/update-screenshots.yml
new file mode 100644
index 0000000000..0161dafc65
--- /dev/null
+++ b/.github/workflows/update-screenshots.yml
@@ -0,0 +1,11 @@
+name: 'Update Screenshot References'
+
+on:
+  workflow_dispatch:
+
+jobs:
+  stub:
+    steps:
+      - name: Stub
+        run: echo 'This is a stub'
+        shell: bash
diff --git a/CHANGELOG.md b/CHANGELOG.md
index 1f46ab0d26..0ef7ae8429 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -3,6 +3,22 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [6.0.10](https://github.com/ionic-team/ionic-framework/compare/v6.0.9...v6.0.10) (2022-03-02)
+
+
+### Bug Fixes
+
+* **datetime:** confirm method now uses selected date ([#24827](https://github.com/ionic-team/ionic-framework/issues/24827)) ([c35b898](https://github.com/ionic-team/ionic-framework/commit/c35b898f1dc0fb706446b6971982df48fd72fe6d)), closes [#24823](https://github.com/ionic-team/ionic-framework/issues/24823)
+* **datetime:** persist minutes column on hour change ([#24829](https://github.com/ionic-team/ionic-framework/issues/24829)) ([aacb58a](https://github.com/ionic-team/ionic-framework/commit/aacb58a3224e3cc51c731d0c9aa52f52c9276692)), closes [#24821](https://github.com/ionic-team/ionic-framework/issues/24821)
+* **item-sliding:** close() will maintain disabled state ([#24847](https://github.com/ionic-team/ionic-framework/issues/24847)) ([ea4a9bb](https://github.com/ionic-team/ionic-framework/commit/ea4a9bb69465f8e97746b36638f0b3a26e45da18)), closes [#24747](https://github.com/ionic-team/ionic-framework/issues/24747)
+* **modal:** .ion-page element is now correctly added ([#24811](https://github.com/ionic-team/ionic-framework/issues/24811)) ([3d0f999](https://github.com/ionic-team/ionic-framework/commit/3d0f99904fe192fcb5f529780858a0f25f076af7)), closes [#24809](https://github.com/ionic-team/ionic-framework/issues/24809)
+* **modal:** re-enable swipe gestures when modal is dismissed ([#24846](https://github.com/ionic-team/ionic-framework/issues/24846)) ([836c01c](https://github.com/ionic-team/ionic-framework/commit/836c01c73e42caab0101ac4988f0a9b27cf96a5b)), closes [#24817](https://github.com/ionic-team/ionic-framework/issues/24817)
+* **modal:** sheet modal now allows input focusing when backdrop disabled ([#24840](https://github.com/ionic-team/ionic-framework/issues/24840)) ([e4ec572](https://github.com/ionic-team/ionic-framework/commit/e4ec572043e22bd2626dbcfd204fc22a7335282c)), closes [#24581](https://github.com/ionic-team/ionic-framework/issues/24581)
+
+
+
+
+
 ## [6.0.9](https://github.com/ionic-team/ionic-framework/compare/v6.0.8...v6.0.9) (2022-02-23)
 
 
diff --git a/angular/CHANGELOG.md b/angular/CHANGELOG.md
index 2419139906..1b52fdf4f1 100644
--- a/angular/CHANGELOG.md
+++ b/angular/CHANGELOG.md
@@ -3,6 +3,17 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [6.0.10](https://github.com/ionic-team/ionic/compare/v6.0.9...v6.0.10) (2022-03-02)
+
+
+### Bug Fixes
+
+* **modal:** .ion-page element is now correctly added ([#24811](https://github.com/ionic-team/ionic/issues/24811)) ([3d0f999](https://github.com/ionic-team/ionic/commit/3d0f99904fe192fcb5f529780858a0f25f076af7)), closes [#24809](https://github.com/ionic-team/ionic/issues/24809)
+
+
+
+
+
 ## [6.0.9](https://github.com/ionic-team/ionic/compare/v6.0.8...v6.0.9) (2022-02-23)
 
 **Note:** Version bump only for package @ionic/angular
diff --git a/angular/package-lock.json b/angular/package-lock.json
index b4772a1b34..91a7d13b05 100644
--- a/angular/package-lock.json
+++ b/angular/package-lock.json
@@ -1,6 +1,6 @@
 {
   "name": "@ionic/angular",
-  "version": "6.0.9",
+  "version": "6.0.10",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
diff --git a/angular/package.json b/angular/package.json
index c10ab9e8d3..9622f78b4d 100644
--- a/angular/package.json
+++ b/angular/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@ionic/angular",
-  "version": "6.0.9",
+  "version": "6.0.10",
   "description": "Angular specific wrappers for @ionic/core",
   "keywords": [
     "ionic",
@@ -44,7 +44,7 @@
     "validate": "npm i && npm run lint && npm run test && npm run build"
   },
   "dependencies": {
-    "@ionic/core": "^6.0.9",
+    "@ionic/core": "^6.0.10",
     "jsonc-parser": "^3.0.0",
     "tslib": "^2.0.0"
   },
diff --git a/core/CHANGELOG.md b/core/CHANGELOG.md
index 21cb58ae8a..6df1527902 100644
--- a/core/CHANGELOG.md
+++ b/core/CHANGELOG.md
@@ -3,6 +3,21 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [6.0.10](https://github.com/ionic-team/ionic/compare/v6.0.9...v6.0.10) (2022-03-02)
+
+
+### Bug Fixes
+
+* **datetime:** confirm method now uses selected date ([#24827](https://github.com/ionic-team/ionic/issues/24827)) ([c35b898](https://github.com/ionic-team/ionic/commit/c35b898f1dc0fb706446b6971982df48fd72fe6d)), closes [#24823](https://github.com/ionic-team/ionic/issues/24823)
+* **datetime:** persist minutes column on hour change ([#24829](https://github.com/ionic-team/ionic/issues/24829)) ([aacb58a](https://github.com/ionic-team/ionic/commit/aacb58a3224e3cc51c731d0c9aa52f52c9276692)), closes [#24821](https://github.com/ionic-team/ionic/issues/24821)
+* **item-sliding:** close() will maintain disabled state ([#24847](https://github.com/ionic-team/ionic/issues/24847)) ([ea4a9bb](https://github.com/ionic-team/ionic/commit/ea4a9bb69465f8e97746b36638f0b3a26e45da18)), closes [#24747](https://github.com/ionic-team/ionic/issues/24747)
+* **modal:** re-enable swipe gestures when modal is dismissed ([#24846](https://github.com/ionic-team/ionic/issues/24846)) ([836c01c](https://github.com/ionic-team/ionic/commit/836c01c73e42caab0101ac4988f0a9b27cf96a5b)), closes [#24817](https://github.com/ionic-team/ionic/issues/24817)
+* **modal:** sheet modal now allows input focusing when backdrop disabled ([#24840](https://github.com/ionic-team/ionic/issues/24840)) ([e4ec572](https://github.com/ionic-team/ionic/commit/e4ec572043e22bd2626dbcfd204fc22a7335282c)), closes [#24581](https://github.com/ionic-team/ionic/issues/24581)
+
+
+
+
+
 ## [6.0.9](https://github.com/ionic-team/ionic/compare/v6.0.8...v6.0.9) (2022-02-23)
 
 
diff --git a/core/package-lock.json b/core/package-lock.json
index add0fa75dc..1d22447d8f 100644
--- a/core/package-lock.json
+++ b/core/package-lock.json
@@ -1,6 +1,6 @@
 {
   "name": "@ionic/core",
-  "version": "6.0.9",
+  "version": "6.0.10",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
diff --git a/core/package.json b/core/package.json
index 7e94cc385b..6d35676426 100644
--- a/core/package.json
+++ b/core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@ionic/core",
-  "version": "6.0.9",
+  "version": "6.0.10",
   "description": "Base components for Ionic",
   "keywords": [
     "ionic",
diff --git a/core/src/components/action-sheet/readme.md b/core/src/components/action-sheet/readme.md
index 104bf6824e..5118dee711 100644
--- a/core/src/components/action-sheet/readme.md
+++ b/core/src/components/action-sheet/readme.md
@@ -661,6 +661,10 @@ Type: `Promise<void>`
 
 ## Dependencies
 
+### Used by
+
+ - [ion-select](../select)
+
 ### Depends on
 
 - [ion-backdrop](../backdrop)
@@ -673,6 +677,7 @@ graph TD;
   ion-action-sheet --> ion-backdrop
   ion-action-sheet --> ion-icon
   ion-action-sheet --> ion-ripple-effect
+  ion-select --> ion-action-sheet
   style ion-action-sheet fill:#f9f,stroke:#333,stroke-width:4px
 ```
 
diff --git a/core/src/components/action-sheet/test/test.utils.ts b/core/src/components/action-sheet/test/test.utils.ts
index b0b9909d55..2079318ed3 100644
--- a/core/src/components/action-sheet/test/test.utils.ts
+++ b/core/src/components/action-sheet/test/test.utils.ts
@@ -1,6 +1,6 @@
 import { newE2EPage } from '@stencil/core/testing';
 
-import { generateE2EUrl } from '../../../utils/test/utils';
+import { generateE2EUrl } from '@utils/test';
 
 export const testActionSheet = async (
   type: string,
diff --git a/core/src/components/alert/readme.md b/core/src/components/alert/readme.md
index 5d525d2870..c99b964ae7 100644
--- a/core/src/components/alert/readme.md
+++ b/core/src/components/alert/readme.md
@@ -1863,6 +1863,10 @@ Type: `Promise<void>`
 
 ## Dependencies
 
+### Used by
+
+ - [ion-select](../select)
+
 ### Depends on
 
 - [ion-ripple-effect](../ripple-effect)
@@ -1873,6 +1877,7 @@ Type: `Promise<void>`
 graph TD;
   ion-alert --> ion-ripple-effect
   ion-alert --> ion-backdrop
+  ion-select --> ion-alert
   style ion-alert fill:#f9f,stroke:#333,stroke-width:4px
 ```
 
diff --git a/core/src/components/alert/test/test.utils.ts b/core/src/components/alert/test/test.utils.ts
index e7790d1ef7..a4d62a59d2 100644
--- a/core/src/components/alert/test/test.utils.ts
+++ b/core/src/components/alert/test/test.utils.ts
@@ -1,6 +1,6 @@
 import { newE2EPage } from '@stencil/core/testing';
 
-import { generateE2EUrl } from '../../../utils/test/utils';
+import { generateE2EUrl } from '@utils/test';
 
 export const testAlert = async (
   type: string,
diff --git a/core/src/components/button/readme.md b/core/src/components/button/readme.md
index c280c8838a..d39d7eab3c 100644
--- a/core/src/components/button/readme.md
+++ b/core/src/components/button/readme.md
@@ -13,7 +13,7 @@ This attribute lets you specify how wide the button should be. By default, butto
 
 ## Fill
 
-This attributes determines the background and border color of the button. By default, buttons have a solid background unless the button is inside of a toolbar, in which case it has a transparent background.
+This attribute determines the background and border color of the button. By default, buttons have a solid background unless the button is inside of a toolbar, in which case it has a transparent background.
 
 | Value          | Details                                                                      |
 |----------------|------------------------------------------------------------------------------|
diff --git a/core/src/components/content/content.scss b/core/src/components/content/content.scss
index 7dc20b0b4b..7798b1c629 100644
--- a/core/src/components/content/content.scss
+++ b/core/src/components/content/content.scss
@@ -164,7 +164,7 @@
    */
   top: 0;
   bottom: 0;
-  
+
   margin-top: calc(var(--offset-top) * -1);
   margin-bottom: calc(var(--offset-bottom) * -1);
 }
@@ -173,10 +173,6 @@
   display: none;
   position: absolute;
 
-  /* stylelint-disable property-disallowed-list */
-  left: -100%;
-  /* stylelint-enable property-disallowed-list */
-
   width: 100%;
   height: 100vh;
 
@@ -185,6 +181,18 @@
   pointer-events: none;
 }
 
+:host(.content-ltr) .transition-effect {
+  /* stylelint-disable property-disallowed-list */
+  left: -100%;
+  /* stylelint-enable property-disallowed-list */
+}
+
+:host(.content-rtl) .transition-effect {
+  /* stylelint-disable property-disallowed-list */
+  right: -100%;
+  /* stylelint-enable property-disallowed-list */
+}
+
 .transition-cover {
   position: absolute;
 
@@ -204,10 +212,6 @@
   display: block;
   position: absolute;
 
-  /* stylelint-disable property-disallowed-list */
-  right: 0;
-  /* stylelint-enable property-disallowed-list */
-
   width: 10px;
   height: 100%;
 
@@ -216,6 +220,20 @@
   background-size: 10px 16px;
 }
 
+:host(.content-ltr) .transition-shadow {
+  /* stylelint-disable property-disallowed-list */
+  right: 0;
+  /* stylelint-enable property-disallowed-list */
+}
+
+:host(.content-rtl) .transition-shadow {
+  /* stylelint-disable property-disallowed-list */
+  left: 0;
+  /* stylelint-enable property-disallowed-list */
+
+  transform: scaleX(-1);
+}
+
 
 // Content: Fixed
 // --------------------------------------------------
diff --git a/core/src/components/content/content.tsx b/core/src/components/content/content.tsx
index 4e17283076..9e09c8fd8f 100644
--- a/core/src/components/content/content.tsx
+++ b/core/src/components/content/content.tsx
@@ -4,6 +4,7 @@ import { getIonMode } from '../../global/ionic-global';
 import { Color, ScrollBaseDetail, ScrollDetail } from '../../interface';
 import { componentOnReady } from '../../utils/helpers';
 import { isPlatform } from '../../utils/platform';
+import { isRTL } from '../../utils/rtl';
 import { createColorClasses, hostContext } from '../../utils/theme';
 
 /**
@@ -311,7 +312,8 @@ export class Content implements ComponentInterface {
   }
 
   render() {
-    const { isMainContent, scrollX, scrollY } = this;
+    const { isMainContent, scrollX, scrollY, el } = this;
+    const rtl = isRTL(el) ? 'rtl' : 'ltr';
     const mode = getIonMode(this);
     const forceOverscroll = this.shouldForceOverscroll();
     const transitionShadow = mode === 'ios';
@@ -325,6 +327,7 @@ export class Content implements ComponentInterface {
           [mode]: true,
           'content-sizing': hostContext('ion-popover', this.el),
           'overscroll': forceOverscroll,
+          [`content-${rtl}`]: true
         })}
         style={{
           '--offset-top': `${this.cTop}px`,
@@ -339,7 +342,7 @@ export class Content implements ComponentInterface {
             'scroll-y': scrollY,
             'overscroll': (scrollX || scrollY) && forceOverscroll
           }}
-          ref={(el: HTMLElement) => this.scrollEl = el!}
+          ref={(scrollEl: HTMLElement) => this.scrollEl = scrollEl!}
           onScroll={(this.scrollEvents) ? (ev: UIEvent) => this.onScroll(ev) : undefined}
           part="scroll"
         >
diff --git a/core/src/components/fab/test/test.utils.ts b/core/src/components/fab/test/test.utils.ts
index f3aa9c5d6c..79e017800e 100644
--- a/core/src/components/fab/test/test.utils.ts
+++ b/core/src/components/fab/test/test.utils.ts
@@ -1,6 +1,6 @@
 import { newE2EPage } from '@stencil/core/testing';
 
-import { generateE2EUrl } from '../../../utils/test/utils';
+import { generateE2EUrl } from '@utils/test';
 
 export const testFab = async (
   type: string,
diff --git a/core/src/components/footer/test/translucent/e2e.ts b/core/src/components/footer/test/translucent/e2e.ts
index c70b74f68c..ee44d0fc2c 100644
--- a/core/src/components/footer/test/translucent/e2e.ts
+++ b/core/src/components/footer/test/translucent/e2e.ts
@@ -1,6 +1,6 @@
 import { newE2EPage } from '@stencil/core/testing';
 
-import { checkComponentModeClasses } from '../../../../utils/test/utils';
+import { checkComponentModeClasses } from '@utils/test';
 
 test('footer: translucent', async () => {
   const page = await newE2EPage({
diff --git a/core/src/components/header/test/translucent/e2e.ts b/core/src/components/header/test/translucent/e2e.ts
index 50bfd89931..3fe93c81a0 100644
--- a/core/src/components/header/test/translucent/e2e.ts
+++ b/core/src/components/header/test/translucent/e2e.ts
@@ -1,6 +1,6 @@
 import { newE2EPage } from '@stencil/core/testing';
 
-import { checkComponentModeClasses } from '../../../../utils/test/utils';
+import { checkComponentModeClasses } from '@utils/test';
 
 test('header: translucent', async () => {
   const page = await newE2EPage({
diff --git a/core/src/components/infinite-scroll/readme.md b/core/src/components/infinite-scroll/readme.md
index 9e6358f38b..6f7a35f30d 100644
--- a/core/src/components/infinite-scroll/readme.md
+++ b/core/src/components/infinite-scroll/readme.md
@@ -335,7 +335,8 @@ export class InfiniteScrollExample {
 </template>
 
 <script lang="ts">
-import { 
+import {
+  InfiniteScrollCustomEvent,
   IonButton,
   IonContent, 
   IonInfiniteScroll, 
@@ -363,7 +364,7 @@ export default defineComponent({
     const toggleInfiniteScroll = () => {
       isDisabled.value = !isDisabled.value;
     }
-    const items = ref([]);
+    const items = ref<number[]>([]);
     const pushData = () => {
       const max = items.value.length + 20;
       const min = max - 20;
@@ -372,7 +373,7 @@ export default defineComponent({
       }
     }
     
-    const loadData = (ev: CustomEvent) => {
+    const loadData = (ev: InfiniteScrollCustomEvent) => {
       setTimeout(() => {
         pushData();
         console.log('Loaded data');
diff --git a/core/src/components/infinite-scroll/usage/vue.md b/core/src/components/infinite-scroll/usage/vue.md
index cef56a9d68..7ebddd5ce4 100644
--- a/core/src/components/infinite-scroll/usage/vue.md
+++ b/core/src/components/infinite-scroll/usage/vue.md
@@ -28,7 +28,8 @@
 </template>
 
 <script lang="ts">
-import { 
+import {
+  InfiniteScrollCustomEvent,
   IonButton,
   IonContent, 
   IonInfiniteScroll, 
@@ -56,7 +57,7 @@ export default defineComponent({
     const toggleInfiniteScroll = () => {
       isDisabled.value = !isDisabled.value;
     }
-    const items = ref([]);
+    const items = ref<number[]>([]);
     const pushData = () => {
       const max = items.value.length + 20;
       const min = max - 20;
@@ -65,7 +66,7 @@ export default defineComponent({
       }
     }
     
-    const loadData = (ev: CustomEvent) => {
+    const loadData = (ev: InfiniteScrollCustomEvent) => {
       setTimeout(() => {
         pushData();
         console.log('Loaded data');
diff --git a/core/src/components/loading/readme.md b/core/src/components/loading/readme.md
index c788b02f11..f72094383d 100644
--- a/core/src/components/loading/readme.md
+++ b/core/src/components/loading/readme.md
@@ -289,8 +289,6 @@ export class LoadingExample {
   <ion-button @click="presentLoadingWithOptions">Show Loading</ion-button>
 </template>
 
-<script>
-
 <script>
 import { IonButton, loadingController } from '@ionic/vue';
 import { defineComponent } from 'vue';
diff --git a/core/src/components/loading/test/test.utils.ts b/core/src/components/loading/test/test.utils.ts
index 05867f018b..ea410b87dc 100644
--- a/core/src/components/loading/test/test.utils.ts
+++ b/core/src/components/loading/test/test.utils.ts
@@ -1,6 +1,6 @@
 import { newE2EPage } from '@stencil/core/testing';
 
-import { generateE2EUrl } from '../../../utils/test/utils';
+import { generateE2EUrl } from '@utils/test';
 
 export const testLoading = async (
   type: string,
diff --git a/core/src/components/loading/usage/vue.md b/core/src/components/loading/usage/vue.md
index fc82409f08..ff9782307d 100644
--- a/core/src/components/loading/usage/vue.md
+++ b/core/src/components/loading/usage/vue.md
@@ -5,8 +5,6 @@
   <ion-button @click="presentLoadingWithOptions">Show Loading</ion-button>
 </template>
 
-<script>
-
 <script>
 import { IonButton, loadingController } from '@ionic/vue';
 import { defineComponent } from 'vue';
diff --git a/core/src/components/menu/test/test.utils.ts b/core/src/components/menu/test/test.utils.ts
index 34d0c1a7be..f303e29684 100644
--- a/core/src/components/menu/test/test.utils.ts
+++ b/core/src/components/menu/test/test.utils.ts
@@ -1,7 +1,7 @@
 import { newE2EPage } from '@stencil/core/testing';
 
 import { menuController } from '../../../utils/menu-controller';
-import { generateE2EUrl } from '../../../utils/test/utils';
+import { generateE2EUrl } from '@utils/test';
 
 export const testMenu = async (
   type: string,
diff --git a/core/src/components/picker-column-internal/picker-column-internal.tsx b/core/src/components/picker-column-internal/picker-column-internal.tsx
index f870f6c0c0..1747fc1302 100644
--- a/core/src/components/picker-column-internal/picker-column-internal.tsx
+++ b/core/src/components/picker-column-internal/picker-column-internal.tsx
@@ -91,6 +91,7 @@ export class PickerColumnInternal implements ComponentInterface {
       const ev = entries[0];
 
       if (ev.isIntersecting) {
+        this.isColumnVisible = true;
         /**
          * Because this initial call to scrollActiveItemIntoView has to fire before
          * the scroll listener is set up, we need to manage the active class manually.
@@ -101,13 +102,13 @@ export class PickerColumnInternal implements ComponentInterface {
         this.activeItem?.classList.add(PICKER_COL_ACTIVE);
 
         this.initializeScrollListener();
-        this.isColumnVisible = true;
       } else {
+        this.isColumnVisible = false;
+
         if (this.destroyScrollListener) {
           this.destroyScrollListener();
           this.destroyScrollListener = undefined;
         }
-        this.isColumnVisible = false;
       }
     }
     new IntersectionObserver(visibleCallback, { threshold: 0.01 }).observe(this.el);
diff --git a/core/src/components/picker-column/test/test.utils.ts b/core/src/components/picker-column/test/test.utils.ts
index 894c9a0b93..05122cd376 100644
--- a/core/src/components/picker-column/test/test.utils.ts
+++ b/core/src/components/picker-column/test/test.utils.ts
@@ -1,6 +1,6 @@
 import { newE2EPage } from '@stencil/core/testing';
 
-import { dragElementBy, generateE2EUrl, listenForEvent, waitForFunctionTestContext } from '../../../utils/test/utils';
+import { dragElementBy, generateE2EUrl, listenForEvent, waitForFunctionTestContext } from '@utils/test';
 
 export const testPickerColumn = async (
   type: string,
diff --git a/core/src/components/popover/readme.md b/core/src/components/popover/readme.md
index 52f38e51e0..68f5df524e 100644
--- a/core/src/components/popover/readme.md
+++ b/core/src/components/popover/readme.md
@@ -1074,6 +1074,7 @@ Type: `Promise<void>`
 ### Used by
 
  - [ion-datetime](../datetime)
+ - [ion-select](../select)
 
 ### Depends on
 
@@ -1084,6 +1085,7 @@ Type: `Promise<void>`
 graph TD;
   ion-popover --> ion-backdrop
   ion-datetime --> ion-popover
+  ion-select --> ion-popover
   style ion-popover fill:#f9f,stroke:#333,stroke-width:4px
 ```
 
diff --git a/core/src/components/popover/test/test.utils.ts b/core/src/components/popover/test/test.utils.ts
index 44f17d96c1..32e6863a2a 100644
--- a/core/src/components/popover/test/test.utils.ts
+++ b/core/src/components/popover/test/test.utils.ts
@@ -1,6 +1,6 @@
 import { newE2EPage } from '@stencil/core/testing';
 
-import { generateE2EUrl } from '../../../utils/test/utils';
+import { generateE2EUrl } from '@utils/test';
 
 export const testPopover = async (
   type: string,
diff --git a/core/src/components/reorder-group/test/interactive/e2e.ts b/core/src/components/reorder-group/test/interactive/e2e.ts
index 0c2488fef3..66e3a593e0 100644
--- a/core/src/components/reorder-group/test/interactive/e2e.ts
+++ b/core/src/components/reorder-group/test/interactive/e2e.ts
@@ -1,7 +1,7 @@
 import * as pd from '@stencil/core/dist/testing/puppeteer/puppeteer-declarations';
 import { newE2EPage } from '@stencil/core/testing';
 
-import { getElementProperty, queryDeep } from '../../../../utils/test/utils';
+import { getElementProperty, queryDeep } from '@utils/test';
 import { moveReorderItem } from '../test.utils';
 
 test('reorder: interactive', async () => {
diff --git a/core/src/components/reorder-group/test/test.utils.ts b/core/src/components/reorder-group/test/test.utils.ts
index e437810465..d6a2a95d04 100644
--- a/core/src/components/reorder-group/test/test.utils.ts
+++ b/core/src/components/reorder-group/test/test.utils.ts
@@ -1,6 +1,6 @@
 import * as pd from '@stencil/core/testing';
 
-import { dragElementBy, queryDeep } from '../../../utils/test/utils';
+import { dragElementBy, queryDeep } from '@utils/test';
 
 /**
  * Moves a reorder item by simulating a drag event
diff --git a/core/src/components/select/readme.md b/core/src/components/select/readme.md
index 4aa7ebd3d1..770a987154 100644
--- a/core/src/components/select/readme.md
+++ b/core/src/components/select/readme.md
@@ -1434,11 +1434,17 @@ Type: `Promise<any>`
 ### Depends on
 
 - ion-select-popover
+- [ion-popover](../popover)
+- [ion-action-sheet](../action-sheet)
+- [ion-alert](../alert)
 
 ### Graph
 ```mermaid
 graph TD;
   ion-select --> ion-select-popover
+  ion-select --> ion-popover
+  ion-select --> ion-action-sheet
+  ion-select --> ion-alert
   ion-select-popover --> ion-item
   ion-select-popover --> ion-checkbox
   ion-select-popover --> ion-label
@@ -1449,6 +1455,12 @@ graph TD;
   ion-item --> ion-icon
   ion-item --> ion-ripple-effect
   ion-item --> ion-note
+  ion-popover --> ion-backdrop
+  ion-action-sheet --> ion-backdrop
+  ion-action-sheet --> ion-icon
+  ion-action-sheet --> ion-ripple-effect
+  ion-alert --> ion-ripple-effect
+  ion-alert --> ion-backdrop
   style ion-select fill:#f9f,stroke:#333,stroke-width:4px
 ```
 
diff --git a/core/src/components/toast/test/test.utils.ts b/core/src/components/toast/test/test.utils.ts
index e4835e7ac6..657d3dc162 100644
--- a/core/src/components/toast/test/test.utils.ts
+++ b/core/src/components/toast/test/test.utils.ts
@@ -1,6 +1,6 @@
 import { newE2EPage } from '@stencil/core/testing';
 
-import { generateE2EUrl } from '../../../utils/test/utils';
+import { generateE2EUrl } from '@utils/test';
 
 export const testToast = async (
   type: string,
diff --git a/core/src/components/virtual-scroll/readme.md b/core/src/components/virtual-scroll/readme.md
index b19d60d6b2..8ebd89b168 100644
--- a/core/src/components/virtual-scroll/readme.md
+++ b/core/src/components/virtual-scroll/readme.md
@@ -11,15 +11,15 @@ This guide will go over the recommended virtual scrolling packages for each fram
 
 ## Angular
 
-For virtual scrolling options in Ionic Angular, please see [Angular Virtual Scroll Guide](../../angular/virtual-scroll).
+For virtual scrolling options in Ionic Angular, please see [Angular Virtual Scroll Guide](../angular/virtual-scroll.md).
 
 ## React
 
-For virtual scrolling options in Ionic React, please see [React Virtual Scroll Guide](../../react/virtual-scroll).
+For virtual scrolling options in Ionic React, please see [React Virtual Scroll Guide](../react/virtual-scroll.md).
 
 ## Vue
 
-For virtual scrolling options in Ionic Vue, please see [Vue Virtual Scroll Guide](../../vue/virtual-scroll).
+For virtual scrolling options in Ionic Vue, please see [Vue Virtual Scroll Guide](../vue/virtual-scroll.md).
 
 ------
 
diff --git a/core/src/utils/gesture/swipe-back.ts b/core/src/utils/gesture/swipe-back.ts
index 6345ff4002..6ebd013381 100644
--- a/core/src/utils/gesture/swipe-back.ts
+++ b/core/src/utils/gesture/swipe-back.ts
@@ -1,4 +1,5 @@
 import { clamp } from '../helpers';
+import { isRTL } from '../rtl';
 
 import { Gesture, GestureDetail, createGesture } from './index';
 
@@ -10,26 +11,52 @@ export const createSwipeBackGesture = (
   onEndHandler: (shouldComplete: boolean, step: number, dur: number) => void,
 ): Gesture => {
   const win = el.ownerDocument!.defaultView!;
+  const rtl = isRTL(el);
+
+  /**
+   * Determine if a gesture is near the edge
+   * of the screen. If true, then the swipe
+   * to go back gesture should proceed.
+   */
+  const isAtEdge = (detail: GestureDetail) => {
+    const threshold = 50;
+    const { startX } = detail;
+
+    if (rtl) {
+      return startX >= win.innerWidth - threshold;
+    }
+
+    return startX <= threshold;
+  }
+
+  const getDeltaX = (detail: GestureDetail) => {
+    return rtl ? -detail.deltaX : detail.deltaX;
+  }
+
+  const getVelocityX = (detail: GestureDetail) => {
+    return rtl ? -detail.velocityX : detail.velocityX;
+  }
+
   const canStart = (detail: GestureDetail) => {
-    return detail.startX <= 50 && canStartHandler();
+    return isAtEdge(detail) && canStartHandler();
   };
 
   const onMove = (detail: GestureDetail) => {
     // set the transition animation's progress
-    const delta = detail.deltaX;
+    const delta = getDeltaX(detail);
     const stepValue = delta / win.innerWidth;
     onMoveHandler(stepValue);
   };
 
   const onEnd = (detail: GestureDetail) => {
     // the swipe back gesture has ended
-    const delta = detail.deltaX;
+    const delta = getDeltaX(detail);
     const width = win.innerWidth;
     const stepValue = delta / width;
-    const velocity = detail.velocityX;
+    const velocity = getVelocityX(detail);
     const z = width / 2.0;
     const shouldComplete =
-      velocity >= 0 && (velocity > 0.2 || detail.deltaX > z);
+      velocity >= 0 && (velocity > 0.2 || delta > z);
 
     const missing = shouldComplete ? 1 - stepValue : stepValue;
     const missingDistance = missing * width;
diff --git a/core/src/utils/gesture/test/e2e.ts b/core/src/utils/gesture/test/e2e.ts
new file mode 100644
index 0000000000..445c1ace37
--- /dev/null
+++ b/core/src/utils/gesture/test/e2e.ts
@@ -0,0 +1,36 @@
+import { newE2EPage } from '@stencil/core/testing';
+import { dragElementBy } from '@utils/test';
+
+test('swipe to go back should complete', async () => {
+  const page = await newE2EPage({ url: '/src/utils/gesture/test?ionic:mode=ios' });
+
+  const nav = await page.find('ion-nav');
+  const ionNavDidChange = await nav.spyOnEvent('ionNavDidChange');
+
+  await page.click('.next');
+  await ionNavDidChange.next();
+
+  const content = await page.$('.page-two-content');
+
+  const width = await page.evaluate(() => window.innerWidth);
+  await dragElementBy(content, page, width, 0, { x: 25, y: 100 });
+
+  await ionNavDidChange.next();
+});
+
+test('swipe to go back should complete in rtl', async () => {
+  const page = await newE2EPage({ url: '/src/utils/gesture/test?rtl=true&ionic:mode=ios' });
+
+  const nav = await page.find('ion-nav');
+  const ionNavDidChange = await nav.spyOnEvent('ionNavDidChange');
+
+  await page.click('.next');
+  await ionNavDidChange.next();
+
+  const width = await page.evaluate(() => window.innerWidth);
+
+  const content = await page.$('.page-two-content');
+  await dragElementBy(content, page, -width, 0, { x: width - 25, y: 100 });
+
+  await ionNavDidChange.next();
+});
diff --git a/core/src/utils/gesture/test/index.html b/core/src/utils/gesture/test/index.html
new file mode 100644
index 0000000000..a82ed31fbd
--- /dev/null
+++ b/core/src/utils/gesture/test/index.html
@@ -0,0 +1,64 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8">
+    <title>Swipe to go back</title>
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
+    <link href="../../../../../css/ionic.bundle.css" rel="stylesheet">
+    <link href="../../../../../scripts/testing/styles.css" rel="stylesheet">
+    <script src="../../../../../scripts/testing/scripts.js"></script>
+    <script type="module" src="../../../../../dist/ionic/ionic.esm.js"></script>
+    <script>
+      class PageOne extends HTMLElement {
+        connectedCallback() {
+          this.innerHTML = `
+            <ion-header>
+              <ion-toolbar>
+                <ion-title>Page One</ion-title>
+              </ion-toolbar>
+            </ion-header>
+            <ion-content class="ion-padding">
+              <h1>Page One</h1>
+              <ion-nav-link router-direction="forward" component="page-two">
+                <ion-button class="next">Go to Page Two</ion-button>
+              </ion-nav-link>
+            </ion-content>
+          `;
+        }
+      }
+      class PageTwo extends HTMLElement {
+        connectedCallback() {
+          this.innerHTML = `
+            <ion-header>
+              <ion-toolbar>
+                <ion-buttons slot="start">
+                  <ion-back-button></ion-back-button>
+                </ion-buttons>
+                <ion-title>Page Two</ion-title>
+              </ion-toolbar>
+            </ion-header>
+            <ion-content class="page-two-content ion-padding">
+              <h1>Page Two</h1>
+            </ion-content>
+          `;
+        }
+      }
+      customElements.define('page-one', PageOne);
+      customElements.define('page-two', PageTwo);
+    </script>
+  </head>
+
+  <body>
+    <ion-app>
+      <ion-nav root="page-one"></ion-nav>
+    </ion-app>
+
+    <script>
+      window.Ionic = {
+        config: {
+          mode: 'ios'
+        }
+      }
+    </script>
+  </body>
+</html>
diff --git a/core/src/utils/test/utils.ts b/core/src/utils/test/utils.ts
index 99f2c7dfe4..196535a745 100644
--- a/core/src/utils/test/utils.ts
+++ b/core/src/utils/test/utils.ts
@@ -77,26 +77,34 @@ export const listenForEvent = async (page: any, eventType: string, element: any,
  * @param page - The Puppeteer 'page' object
  * @param x: number - Amount to drag `element` by on the x-axis
  * @param y: number - Amount to drag `element` by on the y-axis
+ * @param startCoordinates (optional) - Coordinates of where to start the drag
+ * gesture. If not provided, the drag gesture will start in the middle of the
+ * element.
  */
-export const dragElementBy = async (element: any, page: any, x = 0, y = 0): Promise<void> => {
+export const dragElementBy = async (
+  element: any,
+  page: any,
+  x = 0,
+  y = 0,
+  startCoordinates?: { x: number, y: number }
+): Promise<void> => {
   try {
     const boundingBox = await element.boundingBox();
 
-    const startX = boundingBox.x + boundingBox.width / 2;
-    const startY = boundingBox.y + boundingBox.height / 2;
+    const startX = (startCoordinates?.x === undefined) ? boundingBox.x + boundingBox.width / 2 : startCoordinates.x;
+    const startY = (startCoordinates?.y === undefined) ? boundingBox.y + boundingBox.height / 2 : startCoordinates.y;
+
+    const midX = startX + (x / 2);
+    const midY = startY + (y / 2);
 
     const endX = startX + x;
     const endY = startY + y;
 
-    const midX = endX / 2;
-    const midY = endY / 2;
-
     await page.mouse.move(startX, startY);
     await page.mouse.down();
     await page.mouse.move(midX, midY);
     await page.mouse.move(endX, endY);
     await page.mouse.up();
-
   } catch (err) {
     throw err;
   }
diff --git a/docs/CHANGELOG.md b/docs/CHANGELOG.md
index 5b16951abe..36a3e3d08c 100644
--- a/docs/CHANGELOG.md
+++ b/docs/CHANGELOG.md
@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [6.0.10](https://github.com/ionic-team/ionic-docs/compare/v6.0.9...v6.0.10) (2022-03-02)
+
+**Note:** Version bump only for package @ionic/docs
+
+
+
+
+
 ## [6.0.9](https://github.com/ionic-team/ionic-docs/compare/v6.0.8...v6.0.9) (2022-02-23)
 
 **Note:** Version bump only for package @ionic/docs
diff --git a/docs/package.json b/docs/package.json
index f028970b54..00cd393107 100644
--- a/docs/package.json
+++ b/docs/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@ionic/docs",
-  "version": "6.0.9",
+  "version": "6.0.10",
   "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 937ef45a2e..342a96abcf 100644
--- a/lerna.json
+++ b/lerna.json
@@ -5,5 +5,5 @@
     "angular",
     "packages/*"
   ],
-  "version": "6.0.9"
+  "version": "6.0.10"
 }
diff --git a/packages/angular-server/CHANGELOG.md b/packages/angular-server/CHANGELOG.md
index 07f9ca77ec..43ae9303ba 100644
--- a/packages/angular-server/CHANGELOG.md
+++ b/packages/angular-server/CHANGELOG.md
@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [6.0.10](https://github.com/ionic-team/ionic/compare/v6.0.9...v6.0.10) (2022-03-02)
+
+**Note:** Version bump only for package @ionic/angular-server
+
+
+
+
+
 ## [6.0.9](https://github.com/ionic-team/ionic/compare/v6.0.8...v6.0.9) (2022-02-23)
 
 **Note:** Version bump only for package @ionic/angular-server
diff --git a/packages/angular-server/package-lock.json b/packages/angular-server/package-lock.json
index fbad2998cc..ec23b333f5 100644
--- a/packages/angular-server/package-lock.json
+++ b/packages/angular-server/package-lock.json
@@ -1,6 +1,6 @@
 {
   "name": "@ionic/angular-server",
-  "version": "6.0.9",
+  "version": "6.0.10",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
diff --git a/packages/angular-server/package.json b/packages/angular-server/package.json
index 4862a41e80..fc8481b936 100644
--- a/packages/angular-server/package.json
+++ b/packages/angular-server/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@ionic/angular-server",
-  "version": "6.0.9",
+  "version": "6.0.10",
   "description": "Angular SSR Module for Ionic",
   "keywords": [
     "ionic",
@@ -56,7 +56,7 @@
     "@angular/platform-browser": "^12.0.0",
     "@angular/platform-browser-dynamic": "^12.2.10",
     "@angular/platform-server": "^12.0.0",
-    "@ionic/core": "^6.0.9",
+    "@ionic/core": "^6.0.10",
     "@ionic/eslint-config": "^0.3.0",
     "@ionic/prettier-config": "^2.0.0",
     "@typescript-eslint/eslint-plugin": "^5.2.0",
diff --git a/packages/react-router/CHANGELOG.md b/packages/react-router/CHANGELOG.md
index fc2cf70f5d..41be102a54 100644
--- a/packages/react-router/CHANGELOG.md
+++ b/packages/react-router/CHANGELOG.md
@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [6.0.10](https://github.com/ionic-team/ionic/compare/v6.0.9...v6.0.10) (2022-03-02)
+
+**Note:** Version bump only for package @ionic/react-router
+
+
+
+
+
 ## [6.0.9](https://github.com/ionic-team/ionic/compare/v6.0.8...v6.0.9) (2022-02-23)
 
 **Note:** Version bump only for package @ionic/react-router
diff --git a/packages/react-router/package-lock.json b/packages/react-router/package-lock.json
index da283d31b6..df8945a5b2 100644
--- a/packages/react-router/package-lock.json
+++ b/packages/react-router/package-lock.json
@@ -1,6 +1,6 @@
 {
   "name": "@ionic/react-router",
-  "version": "6.0.9",
+  "version": "6.0.10",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
diff --git a/packages/react-router/package.json b/packages/react-router/package.json
index 45536f2bd1..ec7815bbea 100644
--- a/packages/react-router/package.json
+++ b/packages/react-router/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@ionic/react-router",
-  "version": "6.0.9",
+  "version": "6.0.10",
   "description": "React Router wrapper for @ionic/react",
   "keywords": [
     "ionic",
@@ -37,7 +37,7 @@
     "dist/"
   ],
   "dependencies": {
-    "@ionic/react": "^6.0.9",
+    "@ionic/react": "^6.0.10",
     "tslib": "*"
   },
   "peerDependencies": {
diff --git a/packages/react/CHANGELOG.md b/packages/react/CHANGELOG.md
index 0f899f47e6..54a8640a3b 100644
--- a/packages/react/CHANGELOG.md
+++ b/packages/react/CHANGELOG.md
@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [6.0.10](https://github.com/ionic-team/ionic/compare/v6.0.9...v6.0.10) (2022-03-02)
+
+**Note:** Version bump only for package @ionic/react
+
+
+
+
+
 ## [6.0.9](https://github.com/ionic-team/ionic/compare/v6.0.8...v6.0.9) (2022-02-23)
 
 **Note:** Version bump only for package @ionic/react
diff --git a/packages/react/package-lock.json b/packages/react/package-lock.json
index 7354a10e8e..5cd9721891 100644
--- a/packages/react/package-lock.json
+++ b/packages/react/package-lock.json
@@ -1,6 +1,6 @@
 {
   "name": "@ionic/react",
-  "version": "6.0.9",
+  "version": "6.0.10",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
diff --git a/packages/react/package.json b/packages/react/package.json
index 717ff8ddff..c7315f682d 100644
--- a/packages/react/package.json
+++ b/packages/react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@ionic/react",
-  "version": "6.0.9",
+  "version": "6.0.10",
   "description": "React specific wrapper for @ionic/core",
   "keywords": [
     "ionic",
@@ -41,7 +41,7 @@
     "css/"
   ],
   "dependencies": {
-    "@ionic/core": "^6.0.9",
+    "@ionic/core": "^6.0.10",
     "ionicons": "^6.0.0",
     "tslib": "*"
   },
diff --git a/packages/vue-router/CHANGELOG.md b/packages/vue-router/CHANGELOG.md
index 023c00dfa6..c6b45792dc 100644
--- a/packages/vue-router/CHANGELOG.md
+++ b/packages/vue-router/CHANGELOG.md
@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [6.0.10](https://github.com/ionic-team/ionic/compare/v6.0.9...v6.0.10) (2022-03-02)
+
+**Note:** Version bump only for package @ionic/vue-router
+
+
+
+
+
 ## [6.0.9](https://github.com/ionic-team/ionic/compare/v6.0.8...v6.0.9) (2022-02-23)
 
 **Note:** Version bump only for package @ionic/vue-router
diff --git a/packages/vue-router/package-lock.json b/packages/vue-router/package-lock.json
index b5bef02037..66661bada2 100644
--- a/packages/vue-router/package-lock.json
+++ b/packages/vue-router/package-lock.json
@@ -1,6 +1,6 @@
 {
   "name": "@ionic/vue-router",
-  "version": "6.0.9",
+  "version": "6.0.10",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
diff --git a/packages/vue-router/package.json b/packages/vue-router/package.json
index fc14128b08..683ebceafd 100644
--- a/packages/vue-router/package.json
+++ b/packages/vue-router/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@ionic/vue-router",
-  "version": "6.0.9",
+  "version": "6.0.10",
   "description": "Vue Router integration for @ionic/vue",
   "scripts": {
     "prepublishOnly": "npm run build",
@@ -44,7 +44,7 @@
   },
   "homepage": "https://github.com/ionic-team/ionic#readme",
   "dependencies": {
-    "@ionic/vue": "^6.0.9"
+    "@ionic/vue": "^6.0.10"
   },
   "devDependencies": {
     "@types/jest": "^26.0.13",
diff --git a/packages/vue/CHANGELOG.md b/packages/vue/CHANGELOG.md
index be1489d92c..427f87d326 100644
--- a/packages/vue/CHANGELOG.md
+++ b/packages/vue/CHANGELOG.md
@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [6.0.10](https://github.com/ionic-team/ionic/compare/v6.0.9...v6.0.10) (2022-03-02)
+
+**Note:** Version bump only for package @ionic/vue
+
+
+
+
+
 ## [6.0.9](https://github.com/ionic-team/ionic/compare/v6.0.8...v6.0.9) (2022-02-23)
 
 **Note:** Version bump only for package @ionic/vue
diff --git a/packages/vue/package-lock.json b/packages/vue/package-lock.json
index e92c5c4dee..97456b23d5 100644
--- a/packages/vue/package-lock.json
+++ b/packages/vue/package-lock.json
@@ -1,6 +1,6 @@
 {
   "name": "@ionic/vue",
-  "version": "6.0.9",
+  "version": "6.0.10",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
diff --git a/packages/vue/package.json b/packages/vue/package.json
index c4ca30c894..c1d2438cc1 100644
--- a/packages/vue/package.json
+++ b/packages/vue/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@ionic/vue",
-  "version": "6.0.9",
+  "version": "6.0.10",
   "description": "Vue specific wrapper for @ionic/core",
   "scripts": {
     "prepublishOnly": "npm run build",
@@ -60,7 +60,7 @@
     "vue-router": "^4.0.0-rc.4"
   },
   "dependencies": {
-    "@ionic/core": "^6.0.9",
+    "@ionic/core": "^6.0.10",
     "ionicons": "^6.0.0"
   },
   "vetur": {