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

.github/CODEOWNERS

@@ -11,15 +11,13 @@
 # In each subsection folders are ordered first by depth, then alphabetically.
 # This should make it easy to add new rules without breaking existing ones.
 
-* @ionic-team/framework
-
 # Frameworks
 
 ## Angular
 
-/packages/angular/ @sean-perkins @thetaPC
-/packages/angular-server @sean-perkins @thetaPC
-/packages/angular/test @thetaPC
+/packages/angular/ @sean-perkins
+/packages/angular-server @sean-perkins
+/packages/angular/test
 
 ## React
 
@@ -30,23 +28,19 @@
 
 ## Vue
 
-/packages/vue/ @liamdebeasi @thetaPC
-/packages/vue-router/ @liamdebeasi @thetaPC
-/packages/vue/test/ @thetaPC
-/packages/vue-router/__tests__ @thetaPC
+/packages/vue/ @liamdebeasi
+/packages/vue-router/ @liamdebeasi
+/packages/vue/test/
+/packages/vue-router/__tests__
 
 # Components
 
 /core/src/components/accordion/ @liamdebeasi
 /core/src/components/accordion-group/ @liamdebeasi
 
-/core/src/components/checkbox/ @amandaejohnston
-
 /core/src/components/datetime/ @liamdebeasi @amandaejohnston @sean-perkins
 /core/src/components/datetime-button/ @liamdebeasi
 
-/core/src/components/item/ @brandyscarney
-
 /core/src/components/menu/ @amandaejohnston
 /core/src/components/menu-toggle/ @amandaejohnston
 
@@ -56,19 +50,9 @@
 /core/src/components/picker-internal/ @liamdebeasi
 /core/src/components/picker-column-internal/ @liamdebeasi
 
-/core/src/components/radio/ @amandaejohnston
-/core/src/components/radio-group/ @amandaejohnston
-
 /core/src/components/refresher/ @liamdebeasi
 /core/src/components/refresher-content/ @liamdebeasi
 
-/core/src/components/searchbar/ @brandyscarney
-
-/core/src/components/segment/ @brandyscarney
-/core/src/components/segment-button/ @brandyscarney
-
-/core/src/components/skeleton-text/ @brandyscarney
-
 # Utilities
 
 /core/src/utils/animation/ @liamdebeasi
@@ -80,6 +64,3 @@
 /core/src/utils/sanitization/ @liamdebeasi
 /core/src/utils/tap-click/ @liamdebeasi
 /core/src/utils/transition/ @liamdebeasi
-
-/core/src/css/ @brandyscarney
-/core/src/themes/ @brandyscarney

.github/COMPONENT-GUIDE.md

@@ -2,10 +2,10 @@
 
 - [Button States](#button-states)
   * [Component Structure](#component-structure)
+  * [Activated](#activated)
   * [Disabled](#disabled)
   * [Focused](#focused)
   * [Hover](#hover)
-  * [Activated](#activated)
   * [Ripple Effect](#ripple-effect)
   * [Example Components](#example-components)
   * [References](#references)
@@ -21,7 +21,7 @@
 
 ## Button States
 
-Any component that renders a button should have the following states: [`disabled`](#disabled), [`focused`](#focused), [`hover`](#hover), [`activated`](#activated). It should also have a [Ripple Effect](#ripple-effect) component added for Material Design.
+Any component that renders a button should have the following states: [`activated`](#activated), [`disabled`](#disabled), [`focused`](#focused), [`hover`](#hover). It should also have a [Ripple Effect](#ripple-effect) component added for Material Design.
 
 ### Component Structure
 
@@ -89,6 +89,73 @@ The following styles should be set for the CSS to work properly. Note that the `
 ```
 
 
+### Activated
+
+The activated state should be enabled for elements with actions on "press". It usually changes the opacity or background of an element.
+
+> Make sure the component has the correct [component structure](#component-structure) before continuing.
+
+#### JavaScript
+
+The `ion-activatable` class needs to be set on an element that can be activated:
+
+```jsx
+render() {
+  return (
+    <Host class='ion-activatable'>
+      <slot></slot>
+    </Host>
+  );
+}
+```
+
+Once that is done, the element will get the `ion-activated` class added on press.
+
+In addition to setting that class, `ion-activatable-instant` can be set in order to have an instant press with no delay:
+
+```jsx
+<Host class='ion-activatable ion-activatable-instant'>
+```
+
+#### CSS
+
+```css
+ /**
+   * @prop --color-activated: Color of the button when pressed
+   * @prop --background-activated: Background of the button when pressed
+   * @prop --background-activated-opacity: Opacity of the background when pressed
+   */
+```
+
+Style the `ion-activated` class based on the spec for that element:
+
+```scss
+:host(.ion-activated) .button-native {
+  color: var(--color-activated);
+
+  &::after {
+    background: var(--background-activated);
+
+    opacity: var(--background-activated-opacity);
+  }
+}
+```
+
+> Order is important! Activated should be after the focused & hover states.
+
+
+#### User Customization
+
+Setting the activated state on the `::after` pseudo-element allows the user to customize the activated state without knowing what the default opacity is set at. A user can customize in the following ways to have a solid red background on press, or they can leave out `--background-activated-opacity` and the button will use the default activated opacity to match the spec.
+
+```css
+ion-button {
+  --background-activated: red;
+  --background-activated-opacity: 1;
+}
+```
+
+
 ### Disabled
 
 The disabled state should be set via prop on all components that render a native button. Setting a disabled state will change the opacity or color of the button and remove click events from firing.
@@ -125,8 +192,7 @@ render() {
 }
 ```
 
-> [!NOTE]
-> If the class being added was for `ion-back-button` it would be `back-button-disabled`.
+> Note: if the class being added was for `ion-back-button` it would be `back-button-disabled`.
 
 #### CSS
 
@@ -144,18 +210,10 @@ The following CSS _at the bare minimum_ should be added for the disabled class,
 
 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.
 
-> [!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).
-
-> [!IMPORTANT]
 > Make sure the component has the correct [component structure](#component-structure) before continuing.
 
 #### JavaScript
@@ -165,7 +223,7 @@ The `ion-focusable` class needs to be set on an element that can be focused:
 ```jsx
 render() {
   return (
-    <Host class="ion-focusable">
+    <Host class='ion-focusable'>
       <slot></slot>
     </Host>
   );
@@ -200,8 +258,7 @@ Style the `ion-focused` class based on the spec for that element:
 }
 ```
 
-> [!IMPORTANT]
-> Order matters! Focused should be **before** the activated and hover states.
+> Order is important! Focused should be after the activated and before the hover state.
 
 
 #### User Customization
@@ -220,10 +277,6 @@ ion-button {
 
 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.
-
-> [!IMPORTANT]
 > Make sure the component has the correct [component structure](#component-structure) before continuing.
 
 #### CSS
@@ -254,8 +307,7 @@ Style the `:hover` based on the spec for that element:
 }
 ```
 
-> [!IMPORTANT]
-> Order matters! Hover should be **before** the activated state.
+> Order is important! Hover should be before the activated state.
 
 
 #### User Customization
@@ -270,79 +322,6 @@ ion-button {
 ```
 
 
-### Activated
-
-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
-
-> [!IMPORTANT]
-> Make sure the component has the correct [component structure](#component-structure) before continuing.
-
-#### JavaScript
-
-The `ion-activatable` class needs to be set on an element that can be activated:
-
-```jsx
-render() {
-  return (
-    <Host class="ion-activatable">
-      <slot></slot>
-    </Host>
-  );
-}
-```
-
-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:
-
-```jsx
-<Host class="ion-activatable ion-activatable-instant">
-```
-
-#### CSS
-
-```css
- /**
-   * @prop --color-activated: Color of the button when pressed
-   * @prop --background-activated: Background of the button when pressed
-   * @prop --background-activated-opacity: Opacity of the background when pressed
-   */
-```
-
-Style the `ion-activated` class based on the spec for that element:
-
-```scss
-:host(.ion-activated) .button-native {
-  color: var(--color-activated);
-
-  &::after {
-    background: var(--background-activated);
-
-    opacity: var(--background-activated-opacity);
-  }
-}
-```
-
-> [!IMPORTANT]
-> Order matters! Activated should be **after** the focused & hover states.
-
-#### User Customization
-
-Setting the activated state on the `::after` pseudo-element allows the user to customize the activated state without knowing what the default opacity is set at. A user can customize in the following ways to have a solid red background on press, or they can leave out `--background-activated-opacity` and the button will use the default activated opacity to match the spec.
-
-```css
-ion-button {
-  --background-activated: red;
-  --background-activated-opacity: 1;
-}
-```
-
-
 ### Ripple Effect
 
 The ripple effect should be added to elements for Material Design. It *requires* the `ion-activatable` class to be set on the parent element to work, and relative positioning on the parent.

.github/CONTRIBUTING.md

@@ -163,7 +163,7 @@ npm i
 npm run build
 npm pack --pack-destination ~
 
-cd ../packages/angular
+cd ../angular
 npm i
 npm run sync
 npm run build

.github/ISSUE_TEMPLATE/bug_report.yml

@@ -20,10 +20,12 @@ body:
     id: affected-versions
     attributes:
       label: Ionic Framework Version
-      description: Which version(s) of Ionic Framework does this issue impact? [Ionic Framework 1.x to 6.x are no longer supported](https://ionicframework.com/docs/reference/support#framework-maintenance-and-support-status). For extended support, considering visiting [Ionic's Enterprise offering](https://ionic.io/enterprise).
+      description: Which version(s) of Ionic Framework does this issue impact? For Ionic Framework 1.x issues, please use https://github.com/ionic-team/ionic-v1. For Ionic Framework 2.x and 3.x issues, please use https://github.com/ionic-team/ionic-v3.
       options:
+        - v4.x
+        - v5.x
+        - v6.x
         - v7.x
-        - v8.x (Beta)
         - Nightly
       multiple: true
     validations:
@@ -49,11 +51,11 @@ body:
     id: steps-to-reproduce
     attributes:
       label: Steps to Reproduce
-      description: Explain the steps required to reproduce this issue.
+      description: Please explain the steps required to duplicate this issue.
       placeholder: |
-        1. Go to '...'
-        2. Click on '...'
-        3. Observe: '...'
+        1.
+        2.
+        3.
     validations:
       required: true
 
@@ -61,15 +63,8 @@ body:
     id: reproduction-url
     attributes:
       label: Code Reproduction URL
-      description: |
-        Reproduce this issue in a blank [Ionic Framework starter application](https://ionicframework.com/start#basics) or a Stackblitz example.
-
-        You can use the Stackblitz button available on any of the [component playgrounds](https://ionicframework.com/docs/components) to open an editable example. Remember to save your changes to obtain a link to copy.
-
-        Reproductions cases must be minimal and focused around the specific problem you are experiencing. This is the best way to ensure this issue is triaged quickly. Issues without a code reproduction may be closed if the Ionic Team cannot reproduce the issue you are reporting.
+      description: Please reproduce this issue in a blank Ionic Framework starter application and provide a link to the repo. Try out our [Getting Started Wizard](https://ionicframework.com/start#basics) to quickly spin up an Ionic Framework starter app. This is the best way to ensure this issue is triaged quickly. Issues without a code reproduction may be closed if the Ionic Team cannot reproduce the issue you are reporting.
       placeholder: https://github.com/...
-    validations:
-      required: true
 
   - type: textarea
     id: ionic-info

.github/PULL_REQUEST_TEMPLATE.md

@@ -1,4 +1,4 @@
-Issue number: resolves #
+Issue number: #
 
 ---------
 
@@ -21,12 +21,7 @@ Issue number: resolves #
 - [ ] Yes
 - [ ] No
 
-<!--
-  If this introduces a breaking change:
-  1. Describe the impact and migration path for existing applications below.
-  2. Update the BREAKING.md file with the breaking change.
-  3. Add "BREAKING CHANGE: [...]" to the commit description when merging. See https://github.com/ionic-team/ionic-framework/blob/main/.github/CONTRIBUTING.md#footer for more information.
--->
+<!-- If this introduces a breaking change, please describe the impact and migration path for existing applications below. -->
 
 
 ## Other information

.github/dependabot.yml

@@ -0,0 +1,20 @@
+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"

.github/labeler.yml

@@ -6,17 +6,16 @@
 # https://github.com/actions/labeler
 
 'package: core':
-- changed-files:
-  - any-glob-to-any-file: ['core/**/*']
+  - core/**/*
 
 'package: angular':
-- changed-files:
-  - any-glob-to-any-file: ['packages/angular/**/*', 'packages/angular-*/**/*']
+  - packages/angular/**/*
+  - packages/angular-*/**/*
 
 'package: react':
-- changed-files:
-  - any-glob-to-any-file: ['packages/react/**/*', 'packages/react-*/**/*']
+  - packages/react/**/*
+  - packages/react-*/**/*
 
 'package: vue':
-- changed-files:
-  - any-glob-to-any-file: ['packages/vue/**/*', 'packages/vue-*/**/*']
+  - packages/vue/**/*
+  - packages/vue-*/**/*

.github/workflows/actions/build-angular-server/action.yml

@@ -3,9 +3,9 @@ description: 'Build Ionic Angular Server'
 runs:
   using: 'composite'
   steps:
-    - uses: actions/setup-node@v4
+    - uses: actions/setup-node@v3
       with:
-        node-version: 18.x
+        node-version: 16.x
 
     - name: Install Angular Server Dependencies
       run: npm ci

.github/workflows/actions/build-angular/action.yml

@@ -3,9 +3,9 @@ description: 'Build Ionic Angular'
 runs:
   using: 'composite'
   steps:
-    - uses: actions/setup-node@v4
+    - uses: actions/setup-node@v3
       with:
-        node-version: 18.x
+        node-version: 16.x
     - uses: ./.github/workflows/actions/download-archive
       with:
         name: ionic-core

.github/workflows/actions/build-core-stencil-prerelease/action.yml

@@ -8,10 +8,10 @@ inputs:
 runs:
   using: 'composite'
   steps:
-    - uses: actions/checkout@v4
-    - uses: actions/setup-node@v4
+    - uses: actions/checkout@v3
+    - uses: actions/setup-node@v3
       with:
-        node-version: 18.x
+        node-version: 16.x
 
     - name: Install Dependencies
       run: npm ci
@@ -22,7 +22,7 @@ runs:
       run: npm i @stencil/core@${{ inputs.stencil-version }}
       shell: bash
     - name: Build Core
-      run: npm run build -- --ci --debug --verbose
+      run: npm run build -- --ci
       working-directory: ./core
       shell: bash
     - uses: ./.github/workflows/actions/upload-archive

.github/workflows/actions/build-core/action.yml

@@ -1,28 +1,16 @@
 name: 'Build Ionic Core'
 description: 'Build Ionic Core'
-inputs:
-  ionicons-version:
-    description: 'The NPM tag of ionicons to install.'
-    type: string
-    required: false
 runs:
   using: 'composite'
   steps:
-    - uses: actions/checkout@v4
-    - uses: actions/setup-node@v4
+    - uses: actions/checkout@v3
+    - uses: actions/setup-node@v3
       with:
-        node-version: 18.x
+        node-version: 16.x
     - name: Install Dependencies
       run: npm install
       working-directory: ./core
       shell: bash
-    # If an Ionicons version was specified install that.
-    # Otherwise just use the version defined in the package.json.
-    - name: Install Ionicons Version
-      if: inputs.ionicons-version != ''
-      run: npm install ionicons@${{ inputs.ionicons-version }}
-      working-directory: ./core
-      shell: bash
     - name: Build Core
       run: npm run build -- --ci
       working-directory: ./core

.github/workflows/actions/build-react-router/action.yml

@@ -3,9 +3,9 @@ description: 'Build Ionic React Router'
 runs:
   using: 'composite'
   steps:
-    - uses: actions/setup-node@v4
+    - uses: actions/setup-node@v3
       with:
-        node-version: 18.x
+        node-version: 16.x
     - uses: ./.github/workflows/actions/download-archive
       with:
         name: ionic-core

.github/workflows/actions/build-react/action.yml

@@ -3,9 +3,9 @@ description: 'Build Ionic React'
 runs:
   using: 'composite'
   steps:
-    - uses: actions/setup-node@v4
+    - uses: actions/setup-node@v3
       with:
-        node-version: 18.x
+        node-version: 16.x
     - uses: ./.github/workflows/actions/download-archive
       with:
         name: ionic-core

.github/workflows/actions/build-vue-router/action.yml

@@ -3,9 +3,9 @@ description: 'Builds Ionic Vue Router'
 runs:
   using: 'composite'
   steps:
-    - uses: actions/setup-node@v4
+    - uses: actions/setup-node@v3
       with:
-        node-version: 18.x
+        node-version: 16.x
     - uses: ./.github/workflows/actions/download-archive
       with:
         name: ionic-core

.github/workflows/actions/build-vue/action.yml

@@ -3,9 +3,9 @@ description: 'Build Ionic Vue'
 runs:
   using: 'composite'
   steps:
-    - uses: actions/setup-node@v4
+    - uses: actions/setup-node@v3
       with:
-        node-version: 18.x
+        node-version: 16.x
     - uses: ./.github/workflows/actions/download-archive
       with:
         name: ionic-core

.github/workflows/actions/download-archive/action.yml

@@ -10,10 +10,10 @@ inputs:
 runs:
   using: 'composite'
   steps:
-    - uses: actions/download-artifact@v4
+    - uses: actions/download-artifact@v3
       with:
         name: ${{ inputs.name }}
         path: ${{ inputs.path }}
-    - name: Extract Archive
+    - name: Exract Archive
       run: unzip -q -o ${{ inputs.path }}/${{ inputs.filename }}
       shell: bash

.github/workflows/actions/publish-npm/action.yml

@@ -19,9 +19,9 @@ inputs:
 runs:
   using: 'composite'
   steps:
-    - uses: actions/setup-node@v4
+    - uses: actions/setup-node@v3
       with:
-        node-version: 18.x
+        node-version: 16.x
     # Provenance requires npm 9.5.0+
     - name: Install latest npm
       run: npm install -g npm@latest

.github/workflows/actions/test-angular-e2e/action.yml

@@ -6,9 +6,9 @@ inputs:
 runs:
   using: 'composite'
   steps:
-    - uses: actions/setup-node@v4
+    - uses: actions/setup-node@v3
       with:
-        node-version: 18
+        node-version: 16
     - uses: ./.github/workflows/actions/download-archive
       with:
         name: ionic-core

.github/workflows/actions/test-core-clean-build/action.yml

@@ -3,9 +3,9 @@ description: 'Test Core Clean Build'
 runs:
   using: 'composite'
   steps:
-    - uses: actions/setup-node@v4
+    - uses: actions/setup-node@v3
       with:
-        node-version: 18.x
+        node-version: 16.x
 
     - uses: ./.github/workflows/actions/download-archive
       with:
@@ -13,15 +13,6 @@ runs:
         path: ./core
         filename: CoreBuild.zip
     - name: Check Diff
-      run: |
-        git diff --exit-code || {
-          echo -e "\033[1;31m⚠️ Error: Differences Detected ⚠️\033[0m"
-          echo -e "\033[1;31mThere are uncommitted changes between the build outputs from CI and your branch.\033[0m"
-          echo -e "\033[1;31mPlease ensure you have followed these steps:\033[0m"
-          echo -e "\033[1;31m1. Run 'npm run build' locally to generate the latest build output.\033[0m"
-          echo -e "\033[1;31m2. Commit and push all necessary changes to your branch.\033[0m"
-          echo -e "\033[1;31m3. Compare and validate the differences before proceeding.\033[0m"
-          exit 1
-        }
+      run: git diff --exit-code
       shell: bash
       working-directory: ./core

.github/workflows/actions/test-core-lint/action.yml

@@ -3,9 +3,9 @@ description: 'Test Core Lint'
 runs:
   using: 'composite'
   steps:
-    - uses: actions/setup-node@v4
+    - uses: actions/setup-node@v3
       with:
-        node-version: 18.x
+        node-version: 16.x
     - name: Install Dependencies
       run: npm ci
       working-directory: ./core

.github/workflows/actions/test-core-screenshot/action.yml

@@ -7,27 +7,25 @@ inputs:
     description: 'Playwright total number of test shards (ex: 4)'
   update:
     description: 'Whether or not to update the reference snapshots'
-  component:
-    description: 'The component to update the reference snapshots'
 
 runs:
   using: 'composite'
   steps:
-    - uses: actions/setup-node@v4
+    - uses: actions/setup-node@v3
       with:
-        node-version: 18.x
+        node-version: 16.x
     - uses: ./.github/workflows/actions/download-archive
       with:
         name: ionic-core
         path: ./core
         filename: CoreBuild.zip
-    - name: Install Dependencies
-      run: npm install
+    - name: Install Playwright Dependencies
+      run: npm install && npx playwright install && npx playwright install-deps
       shell: bash
       working-directory: ./core
     - name: Test
       if: inputs.update != 'true'
-      run: npm run test.e2e.docker.ci ${{ inputs.component }} -- --shard=${{ inputs.shard }}/${{ inputs.totalShards }}
+      run: npm run test.e2e -- --shard=${{ inputs.shard }}/${{ inputs.totalShards }}
       shell: bash
       working-directory: ./core
     - name: Test and Update
@@ -49,7 +47,7 @@ runs:
       # which is why we not using the upload-archive
       # composite step here.
       run: |
-        npm run test.e2e.docker.ci ${{ inputs.component }} -- --shard=${{ inputs.shard }}/${{ inputs.totalShards }} --update-snapshots
+        npm run test.e2e -- --shard=${{ inputs.shard }}/${{ inputs.totalShards }} --update-snapshots
         git add src/\*.png --force
         mkdir updated-screenshots
         cd ../ && rsync -R --progress $(git diff --name-only --cached) core/updated-screenshots
@@ -62,7 +60,7 @@ runs:
       working-directory: ./core
     - name: Archive Updated Screenshots
       if: inputs.update == 'true' && steps.test-and-update.outputs.hasUpdatedScreenshots == 'true'
-      uses: actions/upload-artifact@v4
+      uses: actions/upload-artifact@v3
       with:
         name: updated-screenshots-${{ inputs.shard }}-${{ inputs.totalShards }}
         path: UpdatedScreenshots-${{ inputs.shard }}-${{ inputs.totalShards }}.zip

.github/workflows/actions/test-core-spec/action.yml

@@ -1,23 +1,15 @@
 name: 'Test Core Spec'
 description: 'Test Core Spec'
-inputs:
-  stencil-version:
-    description: 'The NPM tag of @stencil/core to install.'
 runs:
   using: 'composite'
   steps:
-    - uses: actions/setup-node@v4
+    - uses: actions/setup-node@v3
       with:
-        node-version: 18.x
+        node-version: 16.x
     - name: Install Dependencies
-      run: npm ci
+      run: npm install
       working-directory: ./core
       shell: bash
-    - name: Install Stencil ${{ inputs.stencil-version }}
-      run: npm install @stencil/core@${{ inputs.stencil-version }}
-      shell: bash
-      working-directory: ./core
-      if: ${{ inputs.stencil-version != '' }}
     - uses: ./.github/workflows/actions/download-archive
       with:
         name: ionic-core

.github/workflows/actions/test-react-e2e/action.yml

@@ -6,9 +6,9 @@ inputs:
 runs:
   using: 'composite'
   steps:
-    - uses: actions/setup-node@v4
+    - uses: actions/setup-node@v3
       with:
-        node-version: 18.x
+        node-version: 16.x
     - uses: ./.github/workflows/actions/download-archive
       with:
         name: ionic-core

.github/workflows/actions/test-react-router-e2e/action.yml

@@ -6,9 +6,9 @@ inputs:
 runs:
   using: 'composite'
   steps:
-    - uses: actions/setup-node@v4
+    - uses: actions/setup-node@v3
       with:
-        node-version: 18.x
+        node-version: 16.x
     - uses: ./.github/workflows/actions/download-archive
       with:
         name: ionic-core

.github/workflows/actions/test-vue-e2e/action.yml

@@ -6,9 +6,9 @@ inputs:
 runs:
   using: 'composite'
   steps:
-    - uses: actions/setup-node@v4
+    - uses: actions/setup-node@v3
       with:
-        node-version: 18.x
+        node-version: 16.x
     - uses: ./.github/workflows/actions/download-archive
       with:
         name: ionic-core

.github/workflows/actions/update-reference-screenshots/action.yml

@@ -7,10 +7,10 @@ on:
 runs:
   using: 'composite'
   steps:
-    - uses: actions/setup-node@v4
+    - uses: actions/setup-node@v3
       with:
-        node-version: 18.x
-    - uses: actions/download-artifact@v4
+        node-version: 16.x
+    - uses: actions/download-artifact@v3
       with:
         path: ./artifacts
     - name: Extract Archives
@@ -25,30 +25,17 @@ runs:
       # Configure user as Ionitron
       # and push only the changed .png snapshots
       # to the remote branch.
-      # Non-Linux screenshots are in .gitignore
+      # Screenshots are in .gitignore
       # to prevent local screenshots from getting
-      # pushed to Git.
+      # pushed to Git. As a result, we need --force
+      # here so that CI generated screenshots can
+      # get added to git. Screenshot ground truths
+      # should only be added via this CI process.
       run: |
         git config user.name ionitron
         git config user.email hi@ionicframework.com
-
-        # This adds an empty entry for new
-        # screenshot files so we can track them with
-        # git diff
-        git add src/\*.png -N
-
-        if git diff --exit-code; then
-          echo -e "\033[1;31m⚠️ Error: No new screenshots generated ⚠️\033[0m"
-          echo -e "\033[1;31mThis means that there were zero visual diffs when running screenshot tests.\033[0m"
-          echo -e "\033[1;31mMake sure you have pushed any code changes that would result in visual diffs.\033[0m"
-          exit 1
-        else
-          # This actually adds the contents
-          # of the screenshots (including new ones)
-          git add src/\*.png
-          git commit -m "chore(): add updated snapshots"
-          git push
-        fi
-
+        git add src/\*.png --force
+        git commit -m "chore(): add updated snapshots"
+        git push
       shell: bash
       working-directory: ./core

.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@v4
+    - uses: actions/upload-artifact@v3
       with:
         name: ${{ inputs.name }}
         path: ${{ inputs.output }}

.github/workflows/assign-issues.yml

@@ -1,18 +0,0 @@
-name: Assign issues to triage
-
-on:
-  issues:
-    types: [opened]
-
-jobs:
-  auto-assign:
-    runs-on: ubuntu-latest
-    permissions:
-      issues: write
-    steps:
-      - name: 'Auto-assign issue'
-        uses: pozil/auto-assign-issue@edee9537367a8fbc625d27f9e10aa8bad47b8723 # v1.13.0
-        with:
-          assignees: liamdebeasi, sean-perkins, brandyscarney, amandaejohnston, mapsandapps, thetaPC
-          numOfAssignee: 1
-          allowSelfAssign: false

.github/workflows/build.yml

@@ -4,12 +4,6 @@ on:
   pull_request:
     branches: [ '**' ]
   merge_group:
-  workflow_dispatch:
-    inputs:
-      ionicons_npm_release_tag:
-        required: false
-        type: string
-        description: What version of ionicons should be pulled from NPM? Use this if you want to test a custom version of Ionicons with Ionic.
 
 # When pushing a new commit we should
 # cancel the previous test run to not
@@ -22,30 +16,28 @@ jobs:
   build-core:
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v4
+      - uses: actions/checkout@v3
       - uses: ./.github/workflows/actions/build-core
-        with:
-          ionicons-version: ${{ inputs.ionicons_npm_release_tag }}
 
   test-core-clean-build:
     needs: [build-core]
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v4
+      - uses: actions/checkout@v3
       - uses: ./.github/workflows/actions/test-core-clean-build
 
   test-core-lint:
     needs: [build-core]
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v4
+      - uses: actions/checkout@v3
       - uses: ./.github/workflows/actions/test-core-lint
 
   test-core-spec:
     needs: [build-core]
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v4
+      - uses: actions/checkout@v3
       - uses: ./.github/workflows/actions/test-core-spec
 
   test-core-screenshot:
@@ -62,7 +54,7 @@ jobs:
     needs: [build-core]
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v4
+      - uses: actions/checkout@v3
       - uses: ./.github/workflows/actions/test-core-screenshot
         with:
           shard: ${{ matrix.shard }}
@@ -90,14 +82,14 @@ jobs:
     needs: [build-core]
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v4
+    - uses: actions/checkout@v3
     - uses: ./.github/workflows/actions/build-vue
 
   build-vue-router:
     needs: [build-vue]
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v4
+    - uses: actions/checkout@v3
     - uses: ./.github/workflows/actions/build-vue-router
 
   test-vue-e2e:
@@ -108,7 +100,7 @@ jobs:
     needs: [build-vue, build-vue-router]
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v4
+    - uses: actions/checkout@v3
     - uses: ./.github/workflows/actions/test-vue-e2e
       with:
         app: ${{ matrix.apps }}
@@ -126,25 +118,25 @@ jobs:
     needs: [build-core]
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v4
+    - uses: actions/checkout@v3
     - uses: ./.github/workflows/actions/build-angular
 
   build-angular-server:
     needs: [build-core]
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v4
+    - uses: actions/checkout@v3
     - uses: ./.github/workflows/actions/build-angular-server
 
   test-angular-e2e:
     strategy:
       fail-fast: false
       matrix:
-        apps: [ng14, ng15, ng16, ng17]
+        apps: [ng14, ng15, ng16]
     needs: [build-angular, build-angular-server]
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v4
+    - uses: actions/checkout@v3
     - uses: ./.github/workflows/actions/test-angular-e2e
       with:
         app: ${{ matrix.apps }}
@@ -162,14 +154,14 @@ jobs:
     needs: [build-core]
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v4
+    - uses: actions/checkout@v3
     - uses: ./.github/workflows/actions/build-react
 
   build-react-router:
     needs: [build-react]
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v4
+    - uses: actions/checkout@v3
     - uses: ./.github/workflows/actions/build-react-router
 
   test-react-router-e2e:
@@ -180,7 +172,7 @@ jobs:
     needs: [build-react, build-react-router]
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v4
+    - uses: actions/checkout@v3
     - uses: ./.github/workflows/actions/test-react-router-e2e
       with:
         app: ${{ matrix.apps }}
@@ -202,7 +194,7 @@ jobs:
     needs: [build-react, build-react-router]
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v4
+    - uses: actions/checkout@v3
     - uses: ./.github/workflows/actions/test-react-e2e
       with:
         app: ${{ matrix.apps }}

.github/workflows/codeql-analysis.yml

@@ -14,8 +14,8 @@ jobs:
     permissions:
       security-events: write
     steps:
-      - uses: actions/checkout@v4
-      - uses: github/codeql-action/init@v3
+      - uses: actions/checkout@v3
+      - uses: github/codeql-action/init@v2
         with:
           languages: javascript
-      - uses: github/codeql-action/analyze@v3
+      - uses: github/codeql-action/analyze@v2

.github/workflows/dev-build.yml

@@ -9,7 +9,7 @@ jobs:
     outputs:
       dev-hash: ${{ steps.create-dev-hash.outputs.DEV_HASH }}
     steps:
-      - uses: actions/checkout@v4
+      - uses: actions/checkout@v3
       # A 1 is required before the timestamp
       # as lerna will fail when there is a leading 0
       # See https://github.com/lerna/lerna/issues/2840

.github/workflows/label.yml

@@ -13,7 +13,7 @@ jobs:
   triage:
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/labeler@v5
+    - uses: actions/labeler@main
       with:
         repo-token: "${{ secrets.GITHUB_TOKEN }}"
         sync-labels: true

.github/workflows/nightly.yml

@@ -12,7 +12,7 @@ jobs:
     outputs:
       nightly-hash: ${{ steps.create-nightly-hash.outputs.NIGHTLY_HASH }}
     steps:
-      - uses: actions/checkout@v4
+      - uses: actions/checkout@v3
       # A 1 is required before the timestamp
       # as lerna will fail when there is a leading 0
       # See https://github.com/lerna/lerna/issues/2840
@@ -37,3 +37,45 @@ jobs:
       version: ${{ needs.create-nightly-hash.outputs.nightly-hash }}
     secrets:
       NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
+
+  finalize-release:
+    needs: [create-nightly-hash, release-ionic]
+    runs-on: ubuntu-latest
+    steps:
+    - uses: actions/checkout@v3
+      with:
+        token: ${{ secrets.IONITRON_TOKEN }}
+        fetch-depth: 0
+    - name: Configure Identity
+      # Commits from github-actions do not
+      # trigger other GitHub Actions. As a result,
+      # we publish releases from Ionitron instead
+      # so actions run when merging the release branch
+      # back into main.
+      run: |
+        git config user.name ionitron
+        git config user.email hi@ionicframework.com
+      shell: bash
+    - name: Checkout Nightly Branch
+      # There are branch protection rules for our version
+      # branches (i.e. "6.2.x"), so we cannot name the branch
+      # the nightly hash as it would fall under the protection
+      # rule. As a result, we prefix "tmp-" to the branch.
+      run: |
+        git checkout -b tmp-${{ needs.create-nightly-hash.outputs.nightly-hash }}
+        git push origin tmp-${{ needs.create-nightly-hash.outputs.nightly-hash }}
+      shell: bash
+    - name: Create GitHub Release
+      run: lerna version ${{ needs.create-nightly-hash.outputs.nightly-hash }} --yes --force-publish='*' --conventional-commits --conventional-prerelease --create-release github
+      env:
+        GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+      shell: bash
+    # We need to push the commit changes in order for the tags
+    # to get updated, but we don't need to keep the changelog
+    # changes around.
+    - name: Delete Nightly Branch
+      run: |
+        git checkout main
+        git branch -D tmp-${{ needs.create-nightly-hash.outputs.nightly-hash }}
+        git push origin --delete tmp-${{ needs.create-nightly-hash.outputs.nightly-hash }}
+      shell: bash

.github/workflows/release-ionic.yml

@@ -22,7 +22,7 @@ jobs:
   release-core:
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v4
+    - uses: actions/checkout@v3
     - 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@v4
+    - uses: actions/checkout@v3
     - 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@v4
+    - uses: actions/checkout@v3
     - 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@v4
+    - uses: actions/checkout@v3
     - 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@v4
+    - uses: actions/checkout@v3
     - 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@v4
+    - uses: actions/checkout@v3
     - name: Restore @ionic/core built cache
       uses: ./.github/workflows/actions/download-archive
       with:
@@ -168,7 +168,7 @@ jobs:
     needs: [release-react]
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v4
+    - uses: actions/checkout@v3
     - name: Restore @ionic/core built cache
       uses: ./.github/workflows/actions/download-archive
       with:
@@ -194,7 +194,7 @@ jobs:
     needs: [release-vue]
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v4
+    - uses: actions/checkout@v3
     - name: Restore @ionic/core built cache
       uses: ./.github/workflows/actions/download-archive
       with:

.github/workflows/release.yml

@@ -50,7 +50,7 @@ jobs:
     needs: [release-ionic]
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v4
+    - uses: actions/checkout@v3
       with:
         token: ${{ secrets.IONITRON_TOKEN }}
         fetch-depth: 0
@@ -69,45 +69,16 @@ jobs:
       env:
         GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
       shell: bash
-
-  update-package-lock:
-    # This needs to run after finalize-release
-    # because we also push to the repo in that
-    # job. If these jobs ran in parallel then it is
-    # possible for them to push at the same time.
-    needs: [finalize-release]
-    runs-on: ubuntu-latest
-    steps:
-      - 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
-        # created in the previous job and this next job
-        # will fail.
-        with:
-          ref: ${{ github.ref }}
-      - name: Configure Identity
-        # Commits from github-actions do not
-        # trigger other GitHub Actions. As a result,
-        # we push from Ionitron instead so actions
-        # run when merging the release branch
-        # back into main.
-        run: |
-          git config user.name ionitron
-          git config user.email hi@ionicframework.com
-        shell: bash
-      # Lerna does not automatically bump versions
-      # of Ionic dependencies that have changed,
-      # so we do that here.
-      - name: Bump Package Lock
-        run: |
-          lerna exec "npm install --package-lock-only"
-          git add .
-          git commit -m "chore(): update package lock files"
-          git push
-        env:
-          GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-        shell: bash
+    # Lerna does not automatically bump versions
+    # of Ionic dependencies that have changed,
+    # so we do that here.
+    - name: Bump Package Lock
+      run: |
+        lerna exec "npm install --package-lock-only"
+        git add .
+        git commit -m "chore(): update package lock files"
+        git push
+      shell: bash
 
   purge-cdn-cache:
     needs: [release-ionic]

.github/workflows/stencil-nightly.yml

@@ -8,12 +8,7 @@ on:
     # at 6:00 UTC (6:00 am UTC)
     - cron: '00 06 * * 1-5'
   workflow_dispatch:
-    inputs:
-      npm_release_tag:
-        required: true
-        type: string
-        description: What version should be pulled from NPM?
-        default: nightly
+    # allows for manual invocations in the GitHub UI
 
 # When pushing a new commit we should
 # cancel the previous test run to not
@@ -26,33 +21,31 @@ jobs:
   build-core-with-stencil-nightly:
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v4
+      - uses: actions/checkout@v3
       - uses: ./.github/workflows/actions/build-core-stencil-prerelease
         with:
-          stencil-version: ${{ inputs.npm_release_tag || 'nightly' }}
+          stencil-version: nightly
 
   test-core-clean-build:
     needs: [build-core-with-stencil-nightly]
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v4
+      - uses: actions/checkout@v3
       - 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@v4
+      - uses: actions/checkout@v3
       - uses: ./.github/workflows/actions/test-core-lint
 
   test-core-spec:
     needs: [build-core-with-stencil-nightly]
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v4
+      - uses: actions/checkout@v3
       - uses: ./.github/workflows/actions/test-core-spec
-        with:
-          stencil-version: ${{ inputs.npm_release_tag || 'nightly' }}
 
   test-core-screenshot:
     strategy:
@@ -72,7 +65,7 @@ jobs:
     needs: [build-core-with-stencil-nightly]
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v4
+      - uses: actions/checkout@v3
       - uses: ./.github/workflows/actions/test-core-screenshot
         with:
           shard: ${{ matrix.shard }}
@@ -100,14 +93,14 @@ jobs:
     needs: [build-core-with-stencil-nightly]
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v4
+    - uses: actions/checkout@v3
     - uses: ./.github/workflows/actions/build-vue
 
   build-vue-router:
     needs: [build-vue]
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v4
+    - uses: actions/checkout@v3
     - uses: ./.github/workflows/actions/build-vue-router
 
   test-vue-e2e:
@@ -118,7 +111,7 @@ jobs:
     needs: [build-vue, build-vue-router]
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v4
+    - uses: actions/checkout@v3
     - uses: ./.github/workflows/actions/test-vue-e2e
       with:
         app: ${{ matrix.apps }}
@@ -136,25 +129,25 @@ jobs:
     needs: [build-core-with-stencil-nightly]
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v4
+    - uses: actions/checkout@v3
     - uses: ./.github/workflows/actions/build-angular
 
   build-angular-server:
     needs: [build-core-with-stencil-nightly]
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v4
+    - uses: actions/checkout@v3
     - uses: ./.github/workflows/actions/build-angular-server
 
   test-angular-e2e:
     strategy:
       fail-fast: false
       matrix:
-        apps: [ng16, ng17]
+        apps: [ng12, ng13, ng14, ng15]
     needs: [build-angular, build-angular-server]
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v4
+    - uses: actions/checkout@v3
     - uses: ./.github/workflows/actions/test-angular-e2e
       with:
         app: ${{ matrix.apps }}
@@ -172,14 +165,14 @@ jobs:
     needs: [build-core-with-stencil-nightly]
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v4
+    - uses: actions/checkout@v3
     - uses: ./.github/workflows/actions/build-react
 
   build-react-router:
     needs: [build-react]
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v4
+    - uses: actions/checkout@v3
     - uses: ./.github/workflows/actions/build-react-router
 
   test-react-router-e2e:
@@ -190,7 +183,7 @@ jobs:
     needs: [build-react, build-react-router]
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v4
+    - uses: actions/checkout@v3
     - uses: ./.github/workflows/actions/test-react-router-e2e
       with:
         app: ${{ matrix.apps }}
@@ -212,7 +205,7 @@ jobs:
     needs: [build-react, build-react-router]
     runs-on: ubuntu-latest
     steps:
-    - uses: actions/checkout@v4
+    - uses: actions/checkout@v3
     - uses: ./.github/workflows/actions/test-react-e2e
       with:
         app: ${{ matrix.apps }}

.github/workflows/update-screenshots.yml

@@ -2,31 +2,12 @@ name: 'Update Reference Screenshots'
 
 on:
   workflow_dispatch:
-    inputs:
-      # Screenshots can be updated for all components or specified component(s).
-      # If the `component` variable is set, then the test has the option to
-      # - run all the instances of the specified component(s) in the `src/components` folder
-      # -- For example: if the `component` value is "item", then the following command will be: `npm run test.e2e item`
-      # - run the specified file path
-      # -- For example: if the `component` value is "src/components/item/test/basic", then the following command will be: `npm run test.e2e src/components/item/test/basic`
-      # - run multiple specified components based on the space-separated value
-      # -- For example: if the `component` value is "item basic", then the following command will be: `npm run test.e2e item basic`
-      # -- For example: if the `component` value is "src/components/item/test/basic src/components/item/test/a11y", then the following command will be: `npm run test.e2e src/components/item/test/basic src/components/item/test/a11y`
-      #
-      # If the `component` variable is not set, then the test will run all the instances of the components in the `src/components` folder.
-      # - For example: `npm run test.e2e`
-      #
-      # More common options can be found at the Playwright Command line page: https://playwright.dev/docs/test-cli
-      component:
-        description: 'What component(s) should be updated? (leave blank to update all or use a space-separated list for multiple components)'
-        required: false
-        default: ''
 
 jobs:
   build-core:
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v4
+      - uses: actions/checkout@v3
       - uses: ./.github/workflows/actions/build-core
 
   test-core-screenshot:
@@ -47,19 +28,18 @@ jobs:
     needs: [build-core]
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v4
+      - uses: actions/checkout@v3
       - uses: ./.github/workflows/actions/test-core-screenshot
         with:
           shard: ${{ matrix.shard }}
           totalShards: ${{ matrix.totalShards }}
           update: true
-          component: ${{ inputs.component }}
 
   update-reference-screenshots:
     runs-on: ubuntu-latest
     needs: [test-core-screenshot]
     steps:
-      - uses: actions/checkout@v4
+      - uses: actions/checkout@v3
         # Normally, we could just push with the
         # default GITHUB_TOKEN, but that will
         # not cause the build workflow

.gitignore

@@ -68,16 +68,7 @@ core/www/
 # playwright
 core/test-results/
 core/playwright-report/
-
-# ground truths generated outside of docker should not be committed to the repo
-core/**/*-snapshots/*
-
-# new ground truths should only be generated inside of docker which will result in -linux.png screenshots
-!core/**/*-snapshots/*-linux.png
-
-# these files are going to be different per-developer environment so do not add them to the repo
-core/docker-display.txt
-core/docker-display-volume.txt
+core/**/*-snapshots
 
 # angular
 packages/angular/css/

.stackblitz/codeflow.json

@@ -4,7 +4,7 @@
       "enabled": false
     },
     "pullRequests": {
-      "enabled": false
+      "enabled": true
     }
   }
 }

CHANGELOG.md

@@ -3,573 +3,6 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
-## [7.8.1](https://github.com/ionic-team/ionic-framework/compare/v7.8.0...v7.8.1) (2024-03-20)
-
-
-### Bug Fixes
-
-* **datetime:** wheel picker shows consistently in overlays ([#29147](https://github.com/ionic-team/ionic-framework/issues/29147)) ([19c1bc1](https://github.com/ionic-team/ionic-framework/commit/19c1bc16cbc6725463890382365203824b7fd353)), closes [#26234](https://github.com/ionic-team/ionic-framework/issues/26234)
-* **header:** iOS headers in MD app are not hidden ([#29164](https://github.com/ionic-team/ionic-framework/issues/29164)) ([fdfecd3](https://github.com/ionic-team/ionic-framework/commit/fdfecd32c33c41cf202d3b30c073bfb1b077e2d6)), closes [#28867](https://github.com/ionic-team/ionic-framework/issues/28867)
-* **react:** avoid definitely typed errors with @types/react@18 ([#29182](https://github.com/ionic-team/ionic-framework/issues/29182)) ([58d217d](https://github.com/ionic-team/ionic-framework/commit/58d217d0cf6b716da855c71c169fb1870d4067d3)), closes [#29178](https://github.com/ionic-team/ionic-framework/issues/29178)
-
-
-### Performance Improvements
-
-* **datetime:** calendar body shows immediately in modal on ios ([#29163](https://github.com/ionic-team/ionic-framework/issues/29163)) ([f759776](https://github.com/ionic-team/ionic-framework/commit/f75977699dae5aeea3d97d4318377633e935afb9)), closes [#24542](https://github.com/ionic-team/ionic-framework/issues/24542)
-
-
-
-
-
-# [7.8.0](https://github.com/ionic-team/ionic-framework/compare/v7.7.5...v7.8.0) (2024-03-13)
-
-
-### Features
-
-* **datetime:** formatOptions property for Datetime ([#29065](https://github.com/ionic-team/ionic-framework/issues/29065)) ([7cdbc1b](https://github.com/ionic-team/ionic-framework/commit/7cdbc1b5ad004e17a7c51363653e0e67f50e6860))
-* **searchbar:** autocapitalize, dir, lang, maxlength, and minlength are inherited to native input ([#29098](https://github.com/ionic-team/ionic-framework/issues/29098)) ([a0a77f7](https://github.com/ionic-team/ionic-framework/commit/a0a77f799df0732d9f7182f15866035a3ce5a1eb)), closes [#27606](https://github.com/ionic-team/ionic-framework/issues/27606)
-
-
-
-
-
-## [7.7.5](https://github.com/ionic-team/ionic-framework/compare/v7.7.4...v7.7.5) (2024-03-13)
-
-
-### Bug Fixes
-
-* **angular:** add ionNavWillChange and ionNavDidChange types for nav ([#29122](https://github.com/ionic-team/ionic-framework/issues/29122)) ([85b9d5c](https://github.com/ionic-team/ionic-framework/commit/85b9d5c35f626ffc273d220549b0126ddc1f7e4b)), closes [#29114](https://github.com/ionic-team/ionic-framework/issues/29114)
-* **checkbox:** set aria-checked of indeterminate checkbox to 'mixed' ([#29115](https://github.com/ionic-team/ionic-framework/issues/29115)) ([b2d636f](https://github.com/ionic-team/ionic-framework/commit/b2d636f14dcd33313f6604cfd4a64b542c831b34))
-* **overlay:** do not hide overlay if toast is presented ([#29140](https://github.com/ionic-team/ionic-framework/issues/29140)) ([c0f5e5e](https://github.com/ionic-team/ionic-framework/commit/c0f5e5ebc0c9d45d71e10e09903b00b3ba8e6bba)), closes [#29139](https://github.com/ionic-team/ionic-framework/issues/29139)
-
-
-
-
-
-## [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)
-
-
-### Bug Fixes
-
-* **alert:** remove border-right on ios stacked buttons ([#28821](https://github.com/ionic-team/ionic-framework/issues/28821)) ([ad65824](https://github.com/ionic-team/ionic-framework/commit/ad65824722da0eed90ef9e595b743754bfd360b8))
-* **datetime:** do not animate to new value when multiple values in different months are set ([#28847](https://github.com/ionic-team/ionic-framework/issues/28847)) ([9262f7d](https://github.com/ionic-team/ionic-framework/commit/9262f7da15969706039e9d5f11ef5c7bd73ced0d)), closes [#28602](https://github.com/ionic-team/ionic-framework/issues/28602)
-* **datetime:** enter closes keyboard when typing time ([#28848](https://github.com/ionic-team/ionic-framework/issues/28848)) ([c47a16d](https://github.com/ionic-team/ionic-framework/commit/c47a16d6c3c57f56b053727dd10ead0bfe547e50)), closes [#28325](https://github.com/ionic-team/ionic-framework/issues/28325)
-* **menu:** improve reliability of main content not being scrollable when menu opens ([#28829](https://github.com/ionic-team/ionic-framework/issues/28829)) ([9603a4d](https://github.com/ionic-team/ionic-framework/commit/9603a4de363d2b42622ff3585cd6e4787d9581d1)), closes [#28399](https://github.com/ionic-team/ionic-framework/issues/28399)
-* **popover:** content inside of popover scrolls correctly ([#28861](https://github.com/ionic-team/ionic-framework/issues/28861)) ([10c38d0](https://github.com/ionic-team/ionic-framework/commit/10c38d0354e61e20bec9a313de84b22c3b85c323)), closes [#28455](https://github.com/ionic-team/ionic-framework/issues/28455)
-* **segment:** setting value via binding updates button state ([#28837](https://github.com/ionic-team/ionic-framework/issues/28837)) ([0847c2a](https://github.com/ionic-team/ionic-framework/commit/0847c2ac2c52b5fa6d30e381685d6cbf7a41231a)), closes [#28816](https://github.com/ionic-team/ionic-framework/issues/28816)
-* **select:** click handlers on slotted content fire ([#28839](https://github.com/ionic-team/ionic-framework/issues/28839)) ([aed7a03](https://github.com/ionic-team/ionic-framework/commit/aed7a03532b88628a4358c8cbae1a1cbb861462b)), closes [#28818](https://github.com/ionic-team/ionic-framework/issues/28818)
-* **vue:** tabs and parameterized routes work with latest vue ([#28846](https://github.com/ionic-team/ionic-framework/issues/28846)) ([5bc4399](https://github.com/ionic-team/ionic-framework/commit/5bc439961fda2c595666e67688fdd1b8ff4dd0bf)), closes [#28774](https://github.com/ionic-team/ionic-framework/issues/28774)
-
-
-
-
-
-## [7.6.5](https://github.com/ionic-team/ionic-framework/compare/v7.6.4...v7.6.5) (2024-01-17)
-
-
-### Bug Fixes
-
-* **angular:** add old IonBackButtonDelegate import ([#28831](https://github.com/ionic-team/ionic-framework/issues/28831)) ([fb77353](https://github.com/ionic-team/ionic-framework/commit/fb7735397ed53323dd93a172407117228610b929)), closes [#28827](https://github.com/ionic-team/ionic-framework/issues/28827)
-* **list:** remove uneeded border radius from items in inset list ([#28830](https://github.com/ionic-team/ionic-framework/issues/28830)) ([dbaaa5b](https://github.com/ionic-team/ionic-framework/commit/dbaaa5bd9f43b8ba589b3f9c4b4204d2f203ef18))
-
-
-
-
-
-## [7.6.4](https://github.com/ionic-team/ionic-framework/compare/v7.6.3...v7.6.4) (2024-01-10)
-
-
-### Bug Fixes
-
-* **input:** slotted buttons are clickable ([#28772](https://github.com/ionic-team/ionic-framework/issues/28772)) ([4ccc150](https://github.com/ionic-team/ionic-framework/commit/4ccc150edff4e3f33f453343aedb081d920b2f90)), closes [#28762](https://github.com/ionic-team/ionic-framework/issues/28762)
-
-
-
-
-
-## [7.6.3](https://github.com/ionic-team/ionic-framework/compare/v7.6.2...v7.6.3) (2024-01-03)
-
-
-### Bug Fixes
-
-* **datetime:** selected today button renders correctly on ios ([#28740](https://github.com/ionic-team/ionic-framework/issues/28740)) ([2f99aea](https://github.com/ionic-team/ionic-framework/commit/2f99aeae6f71d5ffd1880f2c549227ecf71becf3))
-* **nav, router-outlet:** ios page transition does not cover menu on larger screens ([#28745](https://github.com/ionic-team/ionic-framework/issues/28745)) ([878eec6](https://github.com/ionic-team/ionic-framework/commit/878eec6ea21d76586466d01e13e5e842e69eaceb)), closes [#28737](https://github.com/ionic-team/ionic-framework/issues/28737)
-* **radio-group:** radio disabled prop can be undefined ([#28712](https://github.com/ionic-team/ionic-framework/issues/28712)) ([75ffeee](https://github.com/ionic-team/ionic-framework/commit/75ffeee933ae353d2601670178896116c81923e0)), closes [#28677](https://github.com/ionic-team/ionic-framework/issues/28677)
-* **refresher:** native ios refresher works on iPadOS ([#28620](https://github.com/ionic-team/ionic-framework/issues/28620)) ([e522601](https://github.com/ionic-team/ionic-framework/commit/e5226016a0f0b066a7bd7fc9997f905d3b87fbc4)), closes [#28617](https://github.com/ionic-team/ionic-framework/issues/28617)
-
-
-
-
-
-## [7.6.2](https://github.com/ionic-team/ionic-framework/compare/v7.6.1...v7.6.2) (2023-12-19)
-
-
-### Bug Fixes
-
-* **input, textarea, select:** reduce padding on slotted buttons ([#28676](https://github.com/ionic-team/ionic-framework/issues/28676)) ([516b844](https://github.com/ionic-team/ionic-framework/commit/516b84475e5d78060f35fa2c4821efc712536353))
-* **item:** label does not expand indefinitely ([#28700](https://github.com/ionic-team/ionic-framework/issues/28700)) ([bc51dd0](https://github.com/ionic-team/ionic-framework/commit/bc51dd05cf036656980de584d2367db46054f774))
-* **refresher:** mode property can be used in typescript ([#28717](https://github.com/ionic-team/ionic-framework/issues/28717)) ([7ce1031](https://github.com/ionic-team/ionic-framework/commit/7ce1031c177487649c2a698664ec98f10d9002b9)), closes [#28716](https://github.com/ionic-team/ionic-framework/issues/28716)
-
-
-
-
-
-## [7.6.1](https://github.com/ionic-team/ionic-framework/compare/v7.6.0...v7.6.1) (2023-12-13)
-
-
-### Bug Fixes
-
-* **datetime:** prefer wheel sets working value on confirmation ([#28520](https://github.com/ionic-team/ionic-framework/issues/28520)) ([e886e3f](https://github.com/ionic-team/ionic-framework/commit/e886e3ff2fcb8a3586a62881c5fc848f3074235d)), closes [#25839](https://github.com/ionic-team/ionic-framework/issues/25839)
-* **input, textarea:** clearOnInput ignores key modifiers ([#28639](https://github.com/ionic-team/ionic-framework/issues/28639)) ([8f7d87c](https://github.com/ionic-team/ionic-framework/commit/8f7d87c6803b1600a3ca21785df0e9bac49f74a3)), closes [#28633](https://github.com/ionic-team/ionic-framework/issues/28633)
-* **menu:** allow styling of the box shadow and transform when visible inside of a split pane ([#28691](https://github.com/ionic-team/ionic-framework/issues/28691)) ([8ee23d2](https://github.com/ionic-team/ionic-framework/commit/8ee23d20d5cc7419ce15f047b92d2f826d3eb681)), closes [#21530](https://github.com/ionic-team/ionic-framework/issues/21530)
-* **react:** avoid type collision with @types/react@18.2.43 and greater ([#28687](https://github.com/ionic-team/ionic-framework/issues/28687)) ([92f1b86](https://github.com/ionic-team/ionic-framework/commit/92f1b8627a240c93891205f75adcb5ce3d46596d))
-* **react:** replacing route uses new route direction and animation ([#28671](https://github.com/ionic-team/ionic-framework/issues/28671)) ([a17b963](https://github.com/ionic-team/ionic-framework/commit/a17b9631829c36c2daf1d5227f5afa69f99f8743)), closes [#24260](https://github.com/ionic-team/ionic-framework/issues/24260)
-* **react:** use custom animation when going back after a replace ([#28674](https://github.com/ionic-team/ionic-framework/issues/28674)) ([fc88613](https://github.com/ionic-team/ionic-framework/commit/fc88613fefa019a3b695a2c6e10c85cd3ce79ae8)), closes [#28673](https://github.com/ionic-team/ionic-framework/issues/28673)
-
-
-
-
-
-# [7.6.0](https://github.com/ionic-team/ionic-framework/compare/v7.5.8...v7.6.0) (2023-12-06)
-
-
-### Bug Fixes
-
-* **angular,vue:** range form value updates while dragging knob ([#28422](https://github.com/ionic-team/ionic-framework/issues/28422)) ([0854a11](https://github.com/ionic-team/ionic-framework/commit/0854a11a25759d0201eae66c96a62fe138d486f8)), closes [#28256](https://github.com/ionic-team/ionic-framework/issues/28256)
-* **animation:** add stronger types to Animation interface ([#28334](https://github.com/ionic-team/ionic-framework/issues/28334)) ([4a088d5](https://github.com/ionic-team/ionic-framework/commit/4a088d5d612ab0387064d388b37d46cdf15cf1ff))
-* **animation:** progressEnd coercion is reset before onFinish ([#28394](https://github.com/ionic-team/ionic-framework/issues/28394)) ([eae8162](https://github.com/ionic-team/ionic-framework/commit/eae8162d0dc2e0bd7a9d56a3662a8e5f5d142b72)), closes [#28393](https://github.com/ionic-team/ionic-framework/issues/28393)
-* **infinite-scroll:** remaining in threshold after ionInfinite can trigger event again on scroll ([#28569](https://github.com/ionic-team/ionic-framework/issues/28569)) ([8c235fd](https://github.com/ionic-team/ionic-framework/commit/8c235fd30c50f317de1f37f69068507aa0979068)), closes [#18071](https://github.com/ionic-team/ionic-framework/issues/18071)
-* **item:** allow item to grow when it is used in a flex container ([#28594](https://github.com/ionic-team/ionic-framework/issues/28594)) ([1c1b567](https://github.com/ionic-team/ionic-framework/commit/1c1b567279dee44da70bb9b90c129946c9043987))
-* **item:** wrap elements and label contents when the font size increases or the elements do not fit ([#28146](https://github.com/ionic-team/ionic-framework/issues/28146)) ([6438e3e](https://github.com/ionic-team/ionic-framework/commit/6438e3e919c665569b731a2d74fe1547b4f3c1cc))
-* **select:** do not collapse to width: 0 when placed in flex container ([#28631](https://github.com/ionic-team/ionic-framework/issues/28631)) ([e71e7a0](https://github.com/ionic-team/ionic-framework/commit/e71e7a069000db8738abc304758de64286817442))
-* **toast:** add swipeGesture to ToastOptions ([#28518](https://github.com/ionic-team/ionic-framework/issues/28518)) ([4ad6df6](https://github.com/ionic-team/ionic-framework/commit/4ad6df67f01cebce30d4da46c7541c4b14c5d4a4))
-
-
-### Features
-
-* **checkbox:** add shadow part for label ([#28604](https://github.com/ionic-team/ionic-framework/issues/28604)) ([f9f5654](https://github.com/ionic-team/ionic-framework/commit/f9f5654ab0e920bf97089fbabfb9eedbcf6fe8ae)), closes [#28300](https://github.com/ionic-team/ionic-framework/issues/28300)
-* **input, textarea, select:** add start and end slots ([#28583](https://github.com/ionic-team/ionic-framework/issues/28583)) ([357b8b2](https://github.com/ionic-team/ionic-framework/commit/357b8b2beb29b95d53ef043af349067be1d32658)), closes [#26297](https://github.com/ionic-team/ionic-framework/issues/26297)
-* **radio-group:** add compareWith property ([#28452](https://github.com/ionic-team/ionic-framework/issues/28452)) ([0ae327f](https://github.com/ionic-team/ionic-framework/commit/0ae327f0e09cd97d705f2d3051c215034381e226))
-* **radio:** add shadow part for label ([#28607](https://github.com/ionic-team/ionic-framework/issues/28607)) ([b757970](https://github.com/ionic-team/ionic-framework/commit/b757970d23e87c59aa883ecb1bfa9b66bcae8de2)), closes [#28300](https://github.com/ionic-team/ionic-framework/issues/28300)
-* **range:** expose label wrapper as shadow part ([#28601](https://github.com/ionic-team/ionic-framework/issues/28601)) ([52ed2bf](https://github.com/ionic-team/ionic-framework/commit/52ed2bf63777c764f57bb4c3a5d4a127bff46c50))
-* **toast:** add swipe to dismiss functionality ([#28442](https://github.com/ionic-team/ionic-framework/issues/28442)) ([30c21aa](https://github.com/ionic-team/ionic-framework/commit/30c21aab3ed40d73c28e7d60d0952d8891b0a9d3)), closes [#21769](https://github.com/ionic-team/ionic-framework/issues/21769)
-* **toggle:** expose label wrapper as shadow part ([#28585](https://github.com/ionic-team/ionic-framework/issues/28585)) ([a34188f](https://github.com/ionic-team/ionic-framework/commit/a34188f7dbec4a16e4f2043ed3dc096e337725a7))
-
-Note: Text inside of `ion-item` can now wrap to resolve accessibility issues related to readability. We recommend evaluating your application to account for text wrapping.
-
-
-
-
-
-## [7.5.8](https://github.com/ionic-team/ionic-framework/compare/v7.5.7...v7.5.8) (2023-12-06)
-
-
-### Bug Fixes
-
-* **angular:** add missing menu controller methods ([#28618](https://github.com/ionic-team/ionic-framework/issues/28618)) ([7871b56](https://github.com/ionic-team/ionic-framework/commit/7871b56eccfe63326b6dd4b56ade3b3afd444fce)), closes [#20053](https://github.com/ionic-team/ionic-framework/issues/20053)
-* **overlays:** trigger is configured on load ([#28526](https://github.com/ionic-team/ionic-framework/issues/28526)) ([a3cd204](https://github.com/ionic-team/ionic-framework/commit/a3cd204f616606ccffc35082655e55fdfb19fe28)), closes [#28524](https://github.com/ionic-team/ionic-framework/issues/28524)
-* **react:** router creates new view instances of parameterized routes ([#28616](https://github.com/ionic-team/ionic-framework/issues/28616)) ([1705d06](https://github.com/ionic-team/ionic-framework/commit/1705d064cc041e99f432a27207f3aab7fa62c778)), closes [#26524](https://github.com/ionic-team/ionic-framework/issues/26524)
-* **vue:** nav component accepts kebab-case component properties ([#28615](https://github.com/ionic-team/ionic-framework/issues/28615)) ([60303aa](https://github.com/ionic-team/ionic-framework/commit/60303aad23f823488afc8f8824e9c72e3ab86acc)), closes [#28611](https://github.com/ionic-team/ionic-framework/issues/28611)
-
-
-
-
-
-## [7.5.7](https://github.com/ionic-team/ionic-framework/compare/v7.5.6...v7.5.7) (2023-11-29)
-
-
-### Bug Fixes
-
-* **alert:** date inputs render correctly in mobile safari ([#28495](https://github.com/ionic-team/ionic-framework/issues/28495)) ([b833f0e](https://github.com/ionic-team/ionic-framework/commit/b833f0e826ddd261230e2e29b70e2dc884d8cb04)), closes [#28494](https://github.com/ionic-team/ionic-framework/issues/28494)
-* **datetime:** allow disabling datetime with prefer-wheel ([#28511](https://github.com/ionic-team/ionic-framework/issues/28511)) ([01130e1](https://github.com/ionic-team/ionic-framework/commit/01130e12e1d73bbf558da9d4dffd7122822ff39c))
-
-
-
-
-
-## [7.5.6](https://github.com/ionic-team/ionic-framework/compare/v7.5.5...v7.5.6) (2023-11-21)
-
-
-### Bug Fixes
-
-* **alert:** match MD spec on tablet  ([#28501](https://github.com/ionic-team/ionic-framework/issues/28501)) ([6a2be9f](https://github.com/ionic-team/ionic-framework/commit/6a2be9fa3c12a893d98dc139a1575a6e7e3c7c26)), closes [#23977](https://github.com/ionic-team/ionic-framework/issues/23977)
-* **angular:** ng add @ionic/angular in standalone projects ([#28523](https://github.com/ionic-team/ionic-framework/issues/28523)) ([c07312e](https://github.com/ionic-team/ionic-framework/commit/c07312e5ed931f6f825ccf083c9dead9fa815843)), closes [#28514](https://github.com/ionic-team/ionic-framework/issues/28514)
-* **angular:** overlays are defined when using standalone controllers ([#28560](https://github.com/ionic-team/ionic-framework/issues/28560)) ([9453132](https://github.com/ionic-team/ionic-framework/commit/9453132aa8952b4adfa1326e61138b329e254f76)), closes [#28385](https://github.com/ionic-team/ionic-framework/issues/28385)
-* **datetime:** updating value with min scrolls to new value ([#28549](https://github.com/ionic-team/ionic-framework/issues/28549)) ([388d19e](https://github.com/ionic-team/ionic-framework/commit/388d19e04f83f85abd4602adb04cc71ac575764a)), closes [#28548](https://github.com/ionic-team/ionic-framework/issues/28548)
-
-
-
-
-
-## [7.5.5](https://github.com/ionic-team/ionic-framework/compare/v7.5.4...v7.5.5) (2023-11-15)
-
-
-### Bug Fixes
-
-* **accordion-group:** correct accordion is open on load ([#28510](https://github.com/ionic-team/ionic-framework/issues/28510)) ([a000dd2](https://github.com/ionic-team/ionic-framework/commit/a000dd2c0b65be8ab5b2ad19f2748fbca13d5085)), closes [#28506](https://github.com/ionic-team/ionic-framework/issues/28506)
-* **action-sheet:** adjust height for safe area with scrollable options ([#28504](https://github.com/ionic-team/ionic-framework/issues/28504)) ([900267e](https://github.com/ionic-team/ionic-framework/commit/900267eb36c36f2af63435f6b46acca52b3bdab7)), closes [#27777](https://github.com/ionic-team/ionic-framework/issues/27777)
-* **header:** collapsible large title does not flicker when collapse prop not reflected ([#28472](https://github.com/ionic-team/ionic-framework/issues/28472)) ([8227b0e](https://github.com/ionic-team/ionic-framework/commit/8227b0ee6d5250e122a34a83c644f8a74fbbafd5)), closes [#28466](https://github.com/ionic-team/ionic-framework/issues/28466)
-* **item-divider:** apply safe area to proper side regardless of direction ([#28420](https://github.com/ionic-team/ionic-framework/issues/28420)) ([4513e0c](https://github.com/ionic-team/ionic-framework/commit/4513e0c6b066d4990800c707e1d97f69c8fcfb0c))
-* **radio-group:** emit value change on componentDidLoad ([#28488](https://github.com/ionic-team/ionic-framework/issues/28488)) ([73b8bfd](https://github.com/ionic-team/ionic-framework/commit/73b8bfde3f060490958c10f58d0f68de80cb957f)), closes [#28356](https://github.com/ionic-team/ionic-framework/issues/28356)
-* **searchbar:** cancel icon aligns with back button ([#28478](https://github.com/ionic-team/ionic-framework/issues/28478)) ([c053fd9](https://github.com/ionic-team/ionic-framework/commit/c053fd9c68d9b1add1335db80be962215946a0b1)), closes [#28468](https://github.com/ionic-team/ionic-framework/issues/28468)
-
-
-
-
-
-## [7.5.4](https://github.com/ionic-team/ionic-framework/compare/v7.5.3...v7.5.4) (2023-11-08)
-
-
-### Bug Fixes
-
-* **inputs:** remove invalid legacy warnings in input, textarea, and select ([#28484](https://github.com/ionic-team/ionic-framework/issues/28484)) ([c765dcb](https://github.com/ionic-team/ionic-framework/commit/c765dcbac4148762768d8c2bea9103e7d38c510b))
-* **item:** apply safe area to proper side regardless of direction ([#28403](https://github.com/ionic-team/ionic-framework/issues/28403)) ([ed040b0](https://github.com/ionic-team/ionic-framework/commit/ed040b09e9cbd4246864e690542132defc6a6578))
-* **list:** remove border from last item with item-sliding ([#28439](https://github.com/ionic-team/ionic-framework/issues/28439)) ([cafafcc](https://github.com/ionic-team/ionic-framework/commit/cafafcc9d166ef536dcb73edd522c8f2a0fb95b6)), closes [#28435](https://github.com/ionic-team/ionic-framework/issues/28435)
-
-
-
-
-
-## [7.5.3](https://github.com/ionic-team/ionic-framework/compare/v7.5.2...v7.5.3) (2023-11-01)
-
-
-### Bug Fixes
-
-* **alert:** long words wrap to next line ([#28408](https://github.com/ionic-team/ionic-framework/issues/28408)) ([34257d6](https://github.com/ionic-team/ionic-framework/commit/34257d681e9034b0a001aa45e17222f3aab5ed76)), closes [#28406](https://github.com/ionic-team/ionic-framework/issues/28406)
-* **angular:** inputs on standalone form controls are reactive ([#28434](https://github.com/ionic-team/ionic-framework/issues/28434)) ([3b6e631](https://github.com/ionic-team/ionic-framework/commit/3b6e6318bf94125b3f8305b4d072a5945ceb3730)), closes [#28431](https://github.com/ionic-team/ionic-framework/issues/28431)
-* **angular:** NavController works with nested outlets ([#28421](https://github.com/ionic-team/ionic-framework/issues/28421)) ([90acad1](https://github.com/ionic-team/ionic-framework/commit/90acad1837b117542830ec0083389a35c5b4ee76)), closes [#28417](https://github.com/ionic-team/ionic-framework/issues/28417)
-* **angular:** run platform subscriptions inside zone ([#28404](https://github.com/ionic-team/ionic-framework/issues/28404)) ([a4b303e](https://github.com/ionic-team/ionic-framework/commit/a4b303e1338a35756a9cf7f67508d24d2f8537a2)), closes [#19539](https://github.com/ionic-team/ionic-framework/issues/19539)
-* **angular:** standalone form components do not error when multiple are used ([#28423](https://github.com/ionic-team/ionic-framework/issues/28423)) ([89698b3](https://github.com/ionic-team/ionic-framework/commit/89698b338fb05cde427c98720c238d2365abdaa7)), closes [#28418](https://github.com/ionic-team/ionic-framework/issues/28418)
-* **datetime:** allow calendar navigation in readonly mode; disallow keyboard navigation when disabled ([#28336](https://github.com/ionic-team/ionic-framework/issues/28336)) ([f6a6877](https://github.com/ionic-team/ionic-framework/commit/f6a6877044a6d912a92aab00c3c78897da09415d)), closes [#28121](https://github.com/ionic-team/ionic-framework/issues/28121)
-* **input, textarea, select:** use consistent sizes ([#28390](https://github.com/ionic-team/ionic-framework/issues/28390)) ([b31ecbb](https://github.com/ionic-team/ionic-framework/commit/b31ecbbfe8deb87604686d752e92e672dd9b277a)), closes [#28388](https://github.com/ionic-team/ionic-framework/issues/28388)
-* **list-header:** apply safe area to proper side regardless of direction ([#28371](https://github.com/ionic-team/ionic-framework/issues/28371)) ([f99d530](https://github.com/ionic-team/ionic-framework/commit/f99d5305fb4b1607b42e34a0b7653d8e1b5bf23f))
-* **segment:** avoid scrolling webkit bug ([#28376](https://github.com/ionic-team/ionic-framework/issues/28376)) ([8e2f818](https://github.com/ionic-team/ionic-framework/commit/8e2f81867175e9980e6d072b0a4414baae571223)), closes [#28373](https://github.com/ionic-team/ionic-framework/issues/28373)
-* **tab-bar:** apply safe area to proper side regardless of direction ([#28372](https://github.com/ionic-team/ionic-framework/issues/28372)) ([d47b7e7](https://github.com/ionic-team/ionic-framework/commit/d47b7e750310ceb2f2c7ecfda8343923ff8d564a))
-
-
-
-
-
-## [7.5.2](https://github.com/ionic-team/ionic-framework/compare/v7.5.1...v7.5.2) (2023-10-25)
-
-
-### Bug Fixes
-
-* **alert, action-sheet:** show scrollbar for long list of options ([#28369](https://github.com/ionic-team/ionic-framework/issues/28369)) ([60f3d65](https://github.com/ionic-team/ionic-framework/commit/60f3d6579498ebad75c4f5163fca3947ac2dadff)), closes [#18487](https://github.com/ionic-team/ionic-framework/issues/18487)
-* **angular:** remove form control side effects ([#28359](https://github.com/ionic-team/ionic-framework/issues/28359)) ([82d6309](https://github.com/ionic-team/ionic-framework/commit/82d6309ef1675c0a6e767e87c23f166d84579d8f)), closes [#28358](https://github.com/ionic-team/ionic-framework/issues/28358)
-* **fab:** apply safe area in positioning to proper side regardless of direction ([#28377](https://github.com/ionic-team/ionic-framework/issues/28377)) ([331c08a](https://github.com/ionic-team/ionic-framework/commit/331c08aad542de158e53ed351705d4c396bb4e90))
-* **input, searchbar, textarea:** ensure nativeInput is always available ([#28362](https://github.com/ionic-team/ionic-framework/issues/28362)) ([2b015b2](https://github.com/ionic-team/ionic-framework/commit/2b015b22144e306444f2bf30ace0b5cc7e32a710)), closes [#28283](https://github.com/ionic-team/ionic-framework/issues/28283)
-* **menu:** menu no longer disappears with multiple split panes ([#28370](https://github.com/ionic-team/ionic-framework/issues/28370)) ([5a30082](https://github.com/ionic-team/ionic-framework/commit/5a30082546cb19eb98128ca9091b35094841d4f2)), closes [#18683](https://github.com/ionic-team/ionic-framework/issues/18683) [#15538](https://github.com/ionic-team/ionic-framework/issues/15538) [#22341](https://github.com/ionic-team/ionic-framework/issues/22341)
-* **rtl:** allow :host to use rtl() ([#28353](https://github.com/ionic-team/ionic-framework/issues/28353)) ([6b7d288](https://github.com/ionic-team/ionic-framework/commit/6b7d288536307fcb49231dca66ab938b389ea85e))
-
-
-
-
-
-## [7.5.1](https://github.com/ionic-team/ionic-framework/compare/v7.5.0...v7.5.1) (2023-10-18)
-
-
-### Bug Fixes
-
-* **angular:** do not create duplicate menuController instances ([#28343](https://github.com/ionic-team/ionic-framework/issues/28343)) ([fa78676](https://github.com/ionic-team/ionic-framework/commit/fa78676d57eb80655ee9447ffa07dcfdae0c6b2a)), closes [#28337](https://github.com/ionic-team/ionic-framework/issues/28337)
-* **angular:** export missing lifecycle interfaces for standalone package ([#28346](https://github.com/ionic-team/ionic-framework/issues/28346)) ([dd93e0b](https://github.com/ionic-team/ionic-framework/commit/dd93e0b2689511f3145606f4dbb2c30dcf4c2950)), closes [/github.com/ionic-team/ionic-angular-standalone-codemods/pull/13/files/baa37ef1e3e8ba773b693db280542efba815482a#r1356414362](https://github.com//github.com/ionic-team/ionic-angular-standalone-codemods/pull/13/files/baa37ef1e3e8ba773b693db280542efba815482a/issues/r1356414362)
-* **react:** cleanup functions are execute for lifecycle hooks ([#28319](https://github.com/ionic-team/ionic-framework/issues/28319)) ([1ba9973](https://github.com/ionic-team/ionic-framework/commit/1ba9973857503c6e47cb225b77a5b89e0a9d2718)), closes [#28186](https://github.com/ionic-team/ionic-framework/issues/28186)
-* **react:** lifecycle events are removed on page unmount ([#28316](https://github.com/ionic-team/ionic-framework/issues/28316)) ([f14a59c](https://github.com/ionic-team/ionic-framework/commit/f14a59c5e0670ed7cc9ce1a73a087a5af13266e2))
-* **title:** large title transition supports dynamic font scaling ([#28290](https://github.com/ionic-team/ionic-framework/issues/28290)) ([fe47594](https://github.com/ionic-team/ionic-framework/commit/fe47594dc0bbb047f0bade144cf07b084fbeef5e)), closes [#28351](https://github.com/ionic-team/ionic-framework/issues/28351)
-
-
-
-
-
-# [7.5.0](https://github.com/ionic-team/ionic-framework/compare/v7.4.4...v7.5.0) (2023-10-11)
-
-
-### Bug Fixes
-
-* **alert:** stop Enter keypress for checkboxes ([#28279](https://github.com/ionic-team/ionic-framework/issues/28279)) ([72b3899](https://github.com/ionic-team/ionic-framework/commit/72b389993df4b0dc392262a106d7949e176b13af))
-* **select:** use correct aria-haspopup value ([#28265](https://github.com/ionic-team/ionic-framework/issues/28265)) ([01167fc](https://github.com/ionic-team/ionic-framework/commit/01167fc185db9bbb45b3a4086aff98008a76af2c))
-* **toast:** toast does not warn when positionAnchor is undefined ([#28312](https://github.com/ionic-team/ionic-framework/issues/28312)) ([c37b3d8](https://github.com/ionic-team/ionic-framework/commit/c37b3d8bf4b440506fdc96455a532c6316e5673d))
-
-
-### Features
-
-* **a11y:** add dynamic font scaling ([#28314](https://github.com/ionic-team/ionic-framework/issues/28314)) ([f806781](https://github.com/ionic-team/ionic-framework/commit/f8067819eeb577db163bf3e0f95fc73064d62b8a)), closes [#24638](https://github.com/ionic-team/ionic-framework/issues/24638) [#18592](https://github.com/ionic-team/ionic-framework/issues/18592)
-* **angular, react, vue, core:** export openURL utility ([#28295](https://github.com/ionic-team/ionic-framework/issues/28295)) ([6da82aa](https://github.com/ionic-team/ionic-framework/commit/6da82aab816b28bfc174f7634ded1fc1e06502ab)), closes [#27911](https://github.com/ionic-team/ionic-framework/issues/27911)
-* **angular:** ship Ionic components as Angular standalone components ([#28311](https://github.com/ionic-team/ionic-framework/issues/28311)) ([57e2476](https://github.com/ionic-team/ionic-framework/commit/57e247637005b10f0d21d5ac5f5232bcb1908301))
-* **datetime:** add support for h11 and h24 hour formats ([#28219](https://github.com/ionic-team/ionic-framework/issues/28219)) ([597bc3f](https://github.com/ionic-team/ionic-framework/commit/597bc3f085c5ff1451c73d0cf4d7d664943e712f)), closes [#23750](https://github.com/ionic-team/ionic-framework/issues/23750)
-* **toast:** allow custom positioning relative to specific element ([#28248](https://github.com/ionic-team/ionic-framework/issues/28248)) ([897ff6f](https://github.com/ionic-team/ionic-framework/commit/897ff6f7493d8d7e4ab22c6ae59de066b43ce682)), closes [#17499](https://github.com/ionic-team/ionic-framework/issues/17499)
-
-
-
-
-
-## [7.4.4](https://github.com/ionic-team/ionic-framework/compare/v7.4.3...v7.4.4) (2023-10-11)
-
-
-### Bug Fixes
-
-* **animation:** play method resolves when animation is stopped ([#28264](https://github.com/ionic-team/ionic-framework/issues/28264)) ([e6031fb](https://github.com/ionic-team/ionic-framework/commit/e6031fbef0698dac0a346cd6202c47f2abf54f95))
-* **checkbox, radio, toggle:** disabled elements are not interactive ([#28294](https://github.com/ionic-team/ionic-framework/issues/28294)) ([c70432e](https://github.com/ionic-team/ionic-framework/commit/c70432e6934bcf1d570e1f7cf671c52d2bb52a8b)), closes [#28293](https://github.com/ionic-team/ionic-framework/issues/28293)
-* **content:** fullscreen offset is computed correctly with tab bar ([#28245](https://github.com/ionic-team/ionic-framework/issues/28245)) ([7375dd6](https://github.com/ionic-team/ionic-framework/commit/7375dd6abafdf7457f23deb53ad5f016456a6af2)), closes [#21130](https://github.com/ionic-team/ionic-framework/issues/21130)
-* **core:** allow fullscreen scroll content to flow outside container for translucent tab bar ([#28246](https://github.com/ionic-team/ionic-framework/issues/28246)) ([b297529](https://github.com/ionic-team/ionic-framework/commit/b297529afc4b93a93f7eaecd31dd5a88a3de5f4e)), closes [#17676](https://github.com/ionic-team/ionic-framework/issues/17676)
-* **core:** swipe to go back gesture has priority over other horizontal swipe gestures ([#28304](https://github.com/ionic-team/ionic-framework/issues/28304)) ([d5f0c77](https://github.com/ionic-team/ionic-framework/commit/d5f0c776dfb5cb40b8119c596805dad3adb621e0)), closes [#28303](https://github.com/ionic-team/ionic-framework/issues/28303)
-* **header:** collapsible large title main header does not flicker on load ([#28277](https://github.com/ionic-team/ionic-framework/issues/28277)) ([3259da0](https://github.com/ionic-team/ionic-framework/commit/3259da0de181c8f82c38d9de13733213c77d398f)), closes [#27060](https://github.com/ionic-team/ionic-framework/issues/27060)
-* **menu:** do not error if disabled or swipeGesture is changed mid-animation ([#28268](https://github.com/ionic-team/ionic-framework/issues/28268)) ([a169044](https://github.com/ionic-team/ionic-framework/commit/a1690441e5bcee8176da32700de6f9e3fde9635e)), closes [#20092](https://github.com/ionic-team/ionic-framework/issues/20092) [#19676](https://github.com/ionic-team/ionic-framework/issues/19676) [#19000](https://github.com/ionic-team/ionic-framework/issues/19000)
-* **segment:** scroll to active segment-button on first load ([#28276](https://github.com/ionic-team/ionic-framework/issues/28276)) ([1167a93](https://github.com/ionic-team/ionic-framework/commit/1167a9325fb930b6c727bc26889f5488d9620062)), closes [#28096](https://github.com/ionic-team/ionic-framework/issues/28096)
-
-
-
-
-
-## [7.4.3](https://github.com/ionic-team/ionic-framework/compare/v7.4.2...v7.4.3) (2023-10-04)
-
-
-### Bug Fixes
-
-* **fab-button:** position is correct with custom sizes ([#28195](https://github.com/ionic-team/ionic-framework/issues/28195)) ([eb41b55](https://github.com/ionic-team/ionic-framework/commit/eb41b556b57c97139b9c36dc3e3be3711d8afaca)), closes [#22564](https://github.com/ionic-team/ionic-framework/issues/22564)
-* **range:** knob positions are correct on initial render with custom elements build ([#28257](https://github.com/ionic-team/ionic-framework/issues/28257)) ([ac2c8e6](https://github.com/ionic-team/ionic-framework/commit/ac2c8e6c22da4d0d8224def24ddef56ee9d26246)), closes [#25444](https://github.com/ionic-team/ionic-framework/issues/25444)
-
-
-
-
-
-## [7.4.2](https://github.com/ionic-team/ionic-framework/compare/v7.4.1...v7.4.2) (2023-09-27)
-
-
-### Bug Fixes
-
-* **react:** Nav unmounts component while invoking popTo or popToRoot ([#27821](https://github.com/ionic-team/ionic-framework/issues/27821)) ([0edcb2c](https://github.com/ionic-team/ionic-framework/commit/0edcb2cd85133ae8c304c53c37ca829e5fbad447)), closes [#27798](https://github.com/ionic-team/ionic-framework/issues/27798)
-* **title:** large title uses custom font on transition ([#28231](https://github.com/ionic-team/ionic-framework/issues/28231)) ([71a7af0](https://github.com/ionic-team/ionic-framework/commit/71a7af0f52fe62937b1dea1ca2739e78801a2a6d))
-
-
-
-
-
-## [7.4.1](https://github.com/ionic-team/ionic-framework/compare/v7.4.0...v7.4.1) (2023-09-20)
-
-
-### Bug Fixes
-
-* **overlays:** correctly re-add root to accessibility tree ([#28183](https://github.com/ionic-team/ionic-framework/issues/28183)) ([81714d4](https://github.com/ionic-team/ionic-framework/commit/81714d45bd97f0ba91729959b60a0dc1d1d06533)), closes [#28180](https://github.com/ionic-team/ionic-framework/issues/28180)
-* **radio,toggle,checkbox,select:** padded space is clickable in items ([#28136](https://github.com/ionic-team/ionic-framework/issues/28136)) ([5b7e422](https://github.com/ionic-team/ionic-framework/commit/5b7e422dc0bfd4d58fb31f62715af47e62dabb57)), closes [#27169](https://github.com/ionic-team/ionic-framework/issues/27169)
-* **range:** knob is not cut off in item with modern syntax ([#28199](https://github.com/ionic-team/ionic-framework/issues/28199)) ([0104d89](https://github.com/ionic-team/ionic-framework/commit/0104d899270d73e16f2850a5fd7d2ba25a9e7ef0)), closes [#27199](https://github.com/ionic-team/ionic-framework/issues/27199)
-* **scroll-assist:** improve input scroll accuracy with native resizing ([#28169](https://github.com/ionic-team/ionic-framework/issues/28169)) ([b5c736f](https://github.com/ionic-team/ionic-framework/commit/b5c736f5ac829efebedf3256ddf77ab3daa7a5f6)), closes [#22940](https://github.com/ionic-team/ionic-framework/issues/22940)
-* **scroll-assist:** re-run when keyboard changes ([#28174](https://github.com/ionic-team/ionic-framework/issues/28174)) ([3f06da4](https://github.com/ionic-team/ionic-framework/commit/3f06da4cfc0d59c658e17e09ccb1ea28a29339f9)), closes [#22940](https://github.com/ionic-team/ionic-framework/issues/22940)
-
-
-
-
-
-# [7.4.0](https://github.com/ionic-team/ionic-framework/compare/v7.3.4...v7.4.0) (2023-09-14)
-
-
-### Bug Fixes
-
-* **datetime:** scroll to newly selected date when value changes ([#27806](https://github.com/ionic-team/ionic-framework/issues/27806)) ([32244fb](https://github.com/ionic-team/ionic-framework/commit/32244fbdd1931e59a9e3cedd2b143c8ee7d01459)), closes [#26391](https://github.com/ionic-team/ionic-framework/issues/26391)
-* **many:** add correct scale to stacked labels ([#28163](https://github.com/ionic-team/ionic-framework/issues/28163)) ([8cb8786](https://github.com/ionic-team/ionic-framework/commit/8cb878669e53bad25bbe2787826b6d02d292848a))
-* **range:** add correct margin in item ([#28161](https://github.com/ionic-team/ionic-framework/issues/28161)) ([1d2b867](https://github.com/ionic-team/ionic-framework/commit/1d2b867f2207d366e355265b081bc9aabe31ce7e))
-
-
-### Features
-
-* **checkbox, radio, toggle, range:** stacked labels for form controls ([#28075](https://github.com/ionic-team/ionic-framework/issues/28075)) ([e6c7bb6](https://github.com/ionic-team/ionic-framework/commit/e6c7bb60e7e61c965f45e2bf3e3bd16f5125ad56))
-* **datetime:** add disabled part ([#28134](https://github.com/ionic-team/ionic-framework/issues/28134)) ([cd8d509](https://github.com/ionic-team/ionic-framework/commit/cd8d5091a133804ac97d0394354dcf7cd73d9355))
-* **datetime:** add parts for calendar day, active, and today ([#27641](https://github.com/ionic-team/ionic-framework/issues/27641)) ([79b005d](https://github.com/ionic-team/ionic-framework/commit/79b005da704c2ce481e1e3bc4d24cdba06a36d04)), closes [#25340](https://github.com/ionic-team/ionic-framework/issues/25340)
-* export TransitionOptions interface and getIonPageElement ([#28140](https://github.com/ionic-team/ionic-framework/issues/28140)) ([19f3bb2](https://github.com/ionic-team/ionic-framework/commit/19f3bb23fd5587848fc41a744ca46ef5985c04d2)), closes [#28137](https://github.com/ionic-team/ionic-framework/issues/28137)
-
-
-
-
-
-## [7.3.4](https://github.com/ionic-team/ionic-framework/compare/v7.3.3...v7.3.4) (2023-09-13)
-
-
-### Bug Fixes
-
-* **menu:** remove app dir from safe area padding ([#28123](https://github.com/ionic-team/ionic-framework/issues/28123)) ([e0542a7](https://github.com/ionic-team/ionic-framework/commit/e0542a7867871fa45a7fe6a4986e7de633063b4b))
-
-
-
-
-
-## [7.3.3](https://github.com/ionic-team/ionic-framework/compare/v7.3.2...v7.3.3) (2023-09-06)
-
-
-### Bug Fixes
-
-* **modal:** swipe to dismiss resets status bar style ([#28110](https://github.com/ionic-team/ionic-framework/issues/28110)) ([176585f](https://github.com/ionic-team/ionic-framework/commit/176585f446b04a6a0cedab2e09417637dbfc78ee)), closes [#28105](https://github.com/ionic-team/ionic-framework/issues/28105)
-* **overlays:** prevent overlays from getting stuck open ([#28069](https://github.com/ionic-team/ionic-framework/issues/28069)) ([584e9d3](https://github.com/ionic-team/ionic-framework/commit/584e9d3be220343451c2d4b9bf90658ecd530de1)), closes [#27200](https://github.com/ionic-team/ionic-framework/issues/27200)
-* **popover:** dynamic width popover is positioned correctly ([#28072](https://github.com/ionic-team/ionic-framework/issues/28072)) ([2a80eb6](https://github.com/ionic-team/ionic-framework/commit/2a80eb6bd0b16a9dab9bea600bb7f935d25c0e1b)), closes [#27190](https://github.com/ionic-team/ionic-framework/issues/27190) [#24780](https://github.com/ionic-team/ionic-framework/issues/24780)
-* **react:** overlay content is shown with hook  ([#28109](https://github.com/ionic-team/ionic-framework/issues/28109)) ([7b551fd](https://github.com/ionic-team/ionic-framework/commit/7b551fd54b9e16a2538e5b82a13d72b3007fa045)), closes [#28102](https://github.com/ionic-team/ionic-framework/issues/28102)
-* **textarea:** cols property is respected ([#28081](https://github.com/ionic-team/ionic-framework/issues/28081)) ([6d4eabc](https://github.com/ionic-team/ionic-framework/commit/6d4eabcc1046c28c1abf69a8bda3e06f80cf3f8f)), closes [#22142](https://github.com/ionic-team/ionic-framework/issues/22142)
-
-
-
-
-
-## [7.3.2](https://github.com/ionic-team/ionic-framework/compare/v7.3.1...v7.3.2) (2023-08-30)
-
-
-### Bug Fixes
-
-* **datetime:** gracefully handle invalid min/max ([#28054](https://github.com/ionic-team/ionic-framework/issues/28054)) ([01fc9b4](https://github.com/ionic-team/ionic-framework/commit/01fc9b45116f7ad6ddc56c7fb1535dec798c2b3a)), closes [#28041](https://github.com/ionic-team/ionic-framework/issues/28041)
-
-
-
-
-
-## [7.3.1](https://github.com/ionic-team/ionic-framework/compare/v7.3.0...v7.3.1) (2023-08-23)
-
-
-### Bug Fixes
-
-* **angular:** ionTabsWillChange is fired before tab activation ([#27991](https://github.com/ionic-team/ionic-framework/issues/27991)) ([bbfb8f8](https://github.com/ionic-team/ionic-framework/commit/bbfb8f81a61475d7e73b63743db5d6a0cd979d21)), closes [#27212](https://github.com/ionic-team/ionic-framework/issues/27212)
-* **input, textarea:** clearOnEdit does not clear when pressing Tab ([#28005](https://github.com/ionic-team/ionic-framework/issues/28005)) ([444acc1](https://github.com/ionic-team/ionic-framework/commit/444acc1f1bca348b62dfb398067cc087529f67f1)), closes [#27746](https://github.com/ionic-team/ionic-framework/issues/27746)
-* **react:** avoid multiple invocations of onDidDismiss and onWillPresent ([#28020](https://github.com/ionic-team/ionic-framework/issues/28020)) ([0ac3df3](https://github.com/ionic-team/ionic-framework/commit/0ac3df3f378bdefc3a927adc798ebd9ec7a54fee)), closes [#28010](https://github.com/ionic-team/ionic-framework/issues/28010)
-
-
-
-
-
-# [7.3.0](https://github.com/ionic-team/ionic-framework/compare/v7.2.4...v7.3.0) (2023-08-16)
-
-
-### Bug Fixes
-
-* **alert:** radio and checkbox labels wrap to next line ([#27898](https://github.com/ionic-team/ionic-framework/issues/27898)) ([0d3127a](https://github.com/ionic-team/ionic-framework/commit/0d3127ad09df3c914a8c254f14931de5ca3beb31)), closes [#17269](https://github.com/ionic-team/ionic-framework/issues/17269)
-
-
-### Features
-
-* **action-sheet:** add htmlAttributes property for passing attributes to buttons ([#27863](https://github.com/ionic-team/ionic-framework/issues/27863)) ([5ce4ec0](https://github.com/ionic-team/ionic-framework/commit/5ce4ec0439e4f31aba31062fd8af4a2ad792a54f))
-* **alert:** add htmlAttributes property for passing attributes to buttons ([#27862](https://github.com/ionic-team/ionic-framework/issues/27862)) ([06be0e5](https://github.com/ionic-team/ionic-framework/commit/06be0e511164ebdaa6af9a3747d0585260c030a9))
-* **toast:** add htmlAttributes property for passing attributes to buttons   ([#27855](https://github.com/ionic-team/ionic-framework/issues/27855)) ([9a68588](https://github.com/ionic-team/ionic-framework/commit/9a685882b7085d911ff09eedacc367629e32348a))
-* **toast:** add shadow part for cancel button ([#27921](https://github.com/ionic-team/ionic-framework/issues/27921)) ([e9faf54](https://github.com/ionic-team/ionic-framework/commit/e9faf54d0a7409521706ce9c8b0d26f3fbe9ba41)), closes [#27920](https://github.com/ionic-team/ionic-framework/issues/27920)
-
-
-
-
-
-## [7.2.4](https://github.com/ionic-team/ionic-framework/compare/v7.2.3...v7.2.4) (2023-08-16)
-
-
-### Bug Fixes
-
-* **tap-click:** do not error in document-less environment ([#27972](https://github.com/ionic-team/ionic-framework/issues/27972)) ([28bd4ba](https://github.com/ionic-team/ionic-framework/commit/28bd4ba720bb77d5f5c48cd7a45e0015daddc9dd))
-* **title:** large title aligns with ios spec ([#27969](https://github.com/ionic-team/ionic-framework/issues/27969)) ([8fa12fc](https://github.com/ionic-team/ionic-framework/commit/8fa12fc88857df27a1ca11249f0085e100fe1474)), closes [#27966](https://github.com/ionic-team/ionic-framework/issues/27966)
-
-
-
-
-
-## [7.2.3](https://github.com/ionic-team/ionic-framework/compare/v7.2.2...v7.2.3) (2023-08-09)
-
-
-### Bug Fixes
-
-* **button:** hidden button is added when form is set async ([#27955](https://github.com/ionic-team/ionic-framework/issues/27955)) ([e9fa300](https://github.com/ionic-team/ionic-framework/commit/e9fa30002bd5dec4f2f56a15c84eec1b3e794942)), closes [#27952](https://github.com/ionic-team/ionic-framework/issues/27952)
-* **datetime:** changing months work if partially visible ([#27917](https://github.com/ionic-team/ionic-framework/issues/27917)) ([eb19c28](https://github.com/ionic-team/ionic-framework/commit/eb19c289d6581639f6df7aff002bebdf2b27d31c)), closes [#27913](https://github.com/ionic-team/ionic-framework/issues/27913)
-* **item-sliding:** account for options added before watcher ([#27915](https://github.com/ionic-team/ionic-framework/issues/27915)) ([a0b3ef0](https://github.com/ionic-team/ionic-framework/commit/a0b3ef02af718e232246515bb873ad8c090fa55d)), closes [#27910](https://github.com/ionic-team/ionic-framework/issues/27910)
-* **many:** overlays present if isOpen is true on load ([#27933](https://github.com/ionic-team/ionic-framework/issues/27933)) ([a0e6ac6](https://github.com/ionic-team/ionic-framework/commit/a0e6ac6013552c5e3acdde33575d4aaf4d4c0bda)), closes [#27928](https://github.com/ionic-team/ionic-framework/issues/27928)
-* **modal:** setCurrentBreakpoint respects animated prop ([#27924](https://github.com/ionic-team/ionic-framework/issues/27924)) ([da55ab9](https://github.com/ionic-team/ionic-framework/commit/da55ab949ef1894738da5a6241176089b7a2b6e3)), closes [#27923](https://github.com/ionic-team/ionic-framework/issues/27923)
-* **nav:** improve reliability of swipe back gesture when quickly swiping back ([#27904](https://github.com/ionic-team/ionic-framework/issues/27904)) ([9500769](https://github.com/ionic-team/ionic-framework/commit/9500769f114d180613f0340b1a328b5e631b7188)), closes [#27893](https://github.com/ionic-team/ionic-framework/issues/27893)
-* **tab-button:** update event type interface on React ([#27950](https://github.com/ionic-team/ionic-framework/issues/27950)) ([1cf1eca](https://github.com/ionic-team/ionic-framework/commit/1cf1eca00239f3e98854466116e42f9a2e7b4590)), closes [#27949](https://github.com/ionic-team/ionic-framework/issues/27949)
-
-
-
-
-
-## [7.2.2](https://github.com/ionic-team/ionic-framework/compare/v7.2.1...v7.2.2) (2023-08-02)
-
-
-### Bug Fixes
-
-* **datetime-button:** render correct text when passing partial date values ([#27816](https://github.com/ionic-team/ionic-framework/issues/27816)) ([bd1910b](https://github.com/ionic-team/ionic-framework/commit/bd1910ba69348877ad5f99d9db2b59d06693b91e)), closes [#27797](https://github.com/ionic-team/ionic-framework/issues/27797)
-* **input, textarea:** input does not block floating label ([#27870](https://github.com/ionic-team/ionic-framework/issues/27870)) ([f14c440](https://github.com/ionic-team/ionic-framework/commit/f14c440d6321ef9f168b272338e5cd21cab384ef)), closes [#27812](https://github.com/ionic-team/ionic-framework/issues/27812)
-* **item-options:** use correct safe area padding ([#27853](https://github.com/ionic-team/ionic-framework/issues/27853)) ([0b8f1bc](https://github.com/ionic-team/ionic-framework/commit/0b8f1bc7dd4170a2a8c9ed3aede173dd489b25ea))
-* **radio:** radios can be focused and are announced with group ([#27817](https://github.com/ionic-team/ionic-framework/issues/27817)) ([ba2f49b](https://github.com/ionic-team/ionic-framework/commit/ba2f49b8a460520d20ac198db800ea2d9e5b015f)), closes [#27438](https://github.com/ionic-team/ionic-framework/issues/27438)
-* **react, vue:** custom animations are used when going back ([#27895](https://github.com/ionic-team/ionic-framework/issues/27895)) ([824033f](https://github.com/ionic-team/ionic-framework/commit/824033f1d4b4a3e5d4c6a978a39e5bb1f33b5bb4)), closes [#27873](https://github.com/ionic-team/ionic-framework/issues/27873)
-* **select:** popover uses modern form syntax ([#27818](https://github.com/ionic-team/ionic-framework/issues/27818)) ([0c117cf](https://github.com/ionic-team/ionic-framework/commit/0c117cfe7f383b7c7837d27de5a6eee12ddd6c2f)), closes [#27071](https://github.com/ionic-team/ionic-framework/issues/27071) [#27786](https://github.com/ionic-team/ionic-framework/issues/27786)
-
-
-
-
-
 ## [7.2.1](https://github.com/ionic-team/ionic-framework/compare/v7.2.0...v7.2.1) (2023-07-26)
 
 

README.md

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

core/.eslintrc.js

@@ -46,8 +46,7 @@ module.exports = {
     {
       "files": ["*.e2e.ts"],
       "rules": {
-        "custom-rules/await-playwright-promise-assertion": "error",
-        "custom-rules/no-playwright-to-match-snapshot-assertion": "error"
+        "custom-rules/await-playwright-promise-assertion": "error"
       }
     }
   ]

core/CHANGELOG.md

@@ -3,548 +3,6 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
-## [7.8.1](https://github.com/ionic-team/ionic-framework/compare/v7.8.0...v7.8.1) (2024-03-20)
-
-
-### Bug Fixes
-
-* **datetime:** wheel picker shows consistently in overlays ([#29147](https://github.com/ionic-team/ionic-framework/issues/29147)) ([19c1bc1](https://github.com/ionic-team/ionic-framework/commit/19c1bc16cbc6725463890382365203824b7fd353)), closes [#26234](https://github.com/ionic-team/ionic-framework/issues/26234)
-* **header:** iOS headers in MD app are not hidden ([#29164](https://github.com/ionic-team/ionic-framework/issues/29164)) ([fdfecd3](https://github.com/ionic-team/ionic-framework/commit/fdfecd32c33c41cf202d3b30c073bfb1b077e2d6)), closes [#28867](https://github.com/ionic-team/ionic-framework/issues/28867)
-
-
-### Performance Improvements
-
-* **datetime:** calendar body shows immediately in modal on ios ([#29163](https://github.com/ionic-team/ionic-framework/issues/29163)) ([f759776](https://github.com/ionic-team/ionic-framework/commit/f75977699dae5aeea3d97d4318377633e935afb9)), closes [#24542](https://github.com/ionic-team/ionic-framework/issues/24542)
-
-
-
-
-
-# [7.8.0](https://github.com/ionic-team/ionic-framework/compare/v7.7.5...v7.8.0) (2024-03-13)
-
-
-### Features
-
-* **datetime:** formatOptions property for Datetime ([#29065](https://github.com/ionic-team/ionic-framework/issues/29065)) ([7cdbc1b](https://github.com/ionic-team/ionic-framework/commit/7cdbc1b5ad004e17a7c51363653e0e67f50e6860))
-* **searchbar:** autocapitalize, dir, lang, maxlength, and minlength are inherited to native input ([#29098](https://github.com/ionic-team/ionic-framework/issues/29098)) ([a0a77f7](https://github.com/ionic-team/ionic-framework/commit/a0a77f799df0732d9f7182f15866035a3ce5a1eb)), closes [#27606](https://github.com/ionic-team/ionic-framework/issues/27606)
-
-
-
-
-
-## [7.7.5](https://github.com/ionic-team/ionic-framework/compare/v7.7.4...v7.7.5) (2024-03-13)
-
-
-### Bug Fixes
-
-* **checkbox:** set aria-checked of indeterminate checkbox to 'mixed' ([#29115](https://github.com/ionic-team/ionic-framework/issues/29115)) ([b2d636f](https://github.com/ionic-team/ionic-framework/commit/b2d636f14dcd33313f6604cfd4a64b542c831b34))
-* **overlay:** do not hide overlay if toast is presented ([#29140](https://github.com/ionic-team/ionic-framework/issues/29140)) ([c0f5e5e](https://github.com/ionic-team/ionic-framework/commit/c0f5e5ebc0c9d45d71e10e09903b00b3ba8e6bba)), closes [#29139](https://github.com/ionic-team/ionic-framework/issues/29139)
-
-
-
-
-
-## [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)
-
-
-### Bug Fixes
-
-* **alert:** remove border-right on ios stacked buttons ([#28821](https://github.com/ionic-team/ionic-framework/issues/28821)) ([ad65824](https://github.com/ionic-team/ionic-framework/commit/ad65824722da0eed90ef9e595b743754bfd360b8))
-* **datetime:** do not animate to new value when multiple values in different months are set ([#28847](https://github.com/ionic-team/ionic-framework/issues/28847)) ([9262f7d](https://github.com/ionic-team/ionic-framework/commit/9262f7da15969706039e9d5f11ef5c7bd73ced0d)), closes [#28602](https://github.com/ionic-team/ionic-framework/issues/28602)
-* **datetime:** enter closes keyboard when typing time ([#28848](https://github.com/ionic-team/ionic-framework/issues/28848)) ([c47a16d](https://github.com/ionic-team/ionic-framework/commit/c47a16d6c3c57f56b053727dd10ead0bfe547e50)), closes [#28325](https://github.com/ionic-team/ionic-framework/issues/28325)
-* **menu:** improve reliability of main content not being scrollable when menu opens ([#28829](https://github.com/ionic-team/ionic-framework/issues/28829)) ([9603a4d](https://github.com/ionic-team/ionic-framework/commit/9603a4de363d2b42622ff3585cd6e4787d9581d1)), closes [#28399](https://github.com/ionic-team/ionic-framework/issues/28399)
-* **popover:** content inside of popover scrolls correctly ([#28861](https://github.com/ionic-team/ionic-framework/issues/28861)) ([10c38d0](https://github.com/ionic-team/ionic-framework/commit/10c38d0354e61e20bec9a313de84b22c3b85c323)), closes [#28455](https://github.com/ionic-team/ionic-framework/issues/28455)
-* **segment:** setting value via binding updates button state ([#28837](https://github.com/ionic-team/ionic-framework/issues/28837)) ([0847c2a](https://github.com/ionic-team/ionic-framework/commit/0847c2ac2c52b5fa6d30e381685d6cbf7a41231a)), closes [#28816](https://github.com/ionic-team/ionic-framework/issues/28816)
-* **select:** click handlers on slotted content fire ([#28839](https://github.com/ionic-team/ionic-framework/issues/28839)) ([aed7a03](https://github.com/ionic-team/ionic-framework/commit/aed7a03532b88628a4358c8cbae1a1cbb861462b)), closes [#28818](https://github.com/ionic-team/ionic-framework/issues/28818)
-
-
-
-
-
-## [7.6.5](https://github.com/ionic-team/ionic-framework/compare/v7.6.3...v7.6.5) (2024-01-17)
-
-
-### Bug Fixes
-
-* **list:** remove uneeded border radius from items in inset list ([#28830](https://github.com/ionic-team/ionic-framework/issues/28830)) ([dbaaa5b](https://github.com/ionic-team/ionic-framework/commit/dbaaa5bd9f43b8ba589b3f9c4b4204d2f203ef18))
-
-
-
-
-
-## [7.6.4](https://github.com/ionic-team/ionic-framework/compare/v7.6.3...v7.6.4) (2024-01-10)
-
-
-### Bug Fixes
-
-* **input:** slotted buttons are clickable ([#28772](https://github.com/ionic-team/ionic-framework/issues/28772)) ([4ccc150](https://github.com/ionic-team/ionic-framework/commit/4ccc150edff4e3f33f453343aedb081d920b2f90)), closes [#28762](https://github.com/ionic-team/ionic-framework/issues/28762)
-
-
-
-
-
-## [7.6.3](https://github.com/ionic-team/ionic-framework/compare/v7.6.2...v7.6.3) (2024-01-03)
-
-
-### Bug Fixes
-
-* **datetime:** selected today button renders correctly on ios ([#28740](https://github.com/ionic-team/ionic-framework/issues/28740)) ([2f99aea](https://github.com/ionic-team/ionic-framework/commit/2f99aeae6f71d5ffd1880f2c549227ecf71becf3))
-* **nav, router-outlet:** ios page transition does not cover menu on larger screens ([#28745](https://github.com/ionic-team/ionic-framework/issues/28745)) ([878eec6](https://github.com/ionic-team/ionic-framework/commit/878eec6ea21d76586466d01e13e5e842e69eaceb)), closes [#28737](https://github.com/ionic-team/ionic-framework/issues/28737)
-* **radio-group:** radio disabled prop can be undefined ([#28712](https://github.com/ionic-team/ionic-framework/issues/28712)) ([75ffeee](https://github.com/ionic-team/ionic-framework/commit/75ffeee933ae353d2601670178896116c81923e0)), closes [#28677](https://github.com/ionic-team/ionic-framework/issues/28677)
-* **refresher:** native ios refresher works on iPadOS ([#28620](https://github.com/ionic-team/ionic-framework/issues/28620)) ([e522601](https://github.com/ionic-team/ionic-framework/commit/e5226016a0f0b066a7bd7fc9997f905d3b87fbc4)), closes [#28617](https://github.com/ionic-team/ionic-framework/issues/28617)
-
-
-
-
-
-## [7.6.2](https://github.com/ionic-team/ionic-framework/compare/v7.6.1...v7.6.2) (2023-12-19)
-
-
-### Bug Fixes
-
-* **input, textarea, select:** reduce padding on slotted buttons ([#28676](https://github.com/ionic-team/ionic-framework/issues/28676)) ([516b844](https://github.com/ionic-team/ionic-framework/commit/516b84475e5d78060f35fa2c4821efc712536353))
-* **item:** label does not expand indefinitely ([#28700](https://github.com/ionic-team/ionic-framework/issues/28700)) ([bc51dd0](https://github.com/ionic-team/ionic-framework/commit/bc51dd05cf036656980de584d2367db46054f774))
-* **refresher:** mode property can be used in typescript ([#28717](https://github.com/ionic-team/ionic-framework/issues/28717)) ([7ce1031](https://github.com/ionic-team/ionic-framework/commit/7ce1031c177487649c2a698664ec98f10d9002b9)), closes [#28716](https://github.com/ionic-team/ionic-framework/issues/28716)
-
-
-
-
-
-## [7.6.1](https://github.com/ionic-team/ionic-framework/compare/v7.6.0...v7.6.1) (2023-12-13)
-
-
-### Bug Fixes
-
-* **datetime:** prefer wheel sets working value on confirmation ([#28520](https://github.com/ionic-team/ionic-framework/issues/28520)) ([e886e3f](https://github.com/ionic-team/ionic-framework/commit/e886e3ff2fcb8a3586a62881c5fc848f3074235d)), closes [#25839](https://github.com/ionic-team/ionic-framework/issues/25839)
-* **input, textarea:** clearOnInput ignores key modifiers ([#28639](https://github.com/ionic-team/ionic-framework/issues/28639)) ([8f7d87c](https://github.com/ionic-team/ionic-framework/commit/8f7d87c6803b1600a3ca21785df0e9bac49f74a3)), closes [#28633](https://github.com/ionic-team/ionic-framework/issues/28633)
-* **menu:** allow styling of the box shadow and transform when visible inside of a split pane ([#28691](https://github.com/ionic-team/ionic-framework/issues/28691)) ([8ee23d2](https://github.com/ionic-team/ionic-framework/commit/8ee23d20d5cc7419ce15f047b92d2f826d3eb681)), closes [#21530](https://github.com/ionic-team/ionic-framework/issues/21530)
-
-
-
-
-
-# [7.6.0](https://github.com/ionic-team/ionic-framework/compare/v7.5.8...v7.6.0) (2023-12-06)
-
-
-### Bug Fixes
-
-* **angular,vue:** range form value updates while dragging knob ([#28422](https://github.com/ionic-team/ionic-framework/issues/28422)) ([0854a11](https://github.com/ionic-team/ionic-framework/commit/0854a11a25759d0201eae66c96a62fe138d486f8)), closes [#28256](https://github.com/ionic-team/ionic-framework/issues/28256)
-* **animation:** add stronger types to Animation interface ([#28334](https://github.com/ionic-team/ionic-framework/issues/28334)) ([4a088d5](https://github.com/ionic-team/ionic-framework/commit/4a088d5d612ab0387064d388b37d46cdf15cf1ff))
-* **animation:** progressEnd coercion is reset before onFinish ([#28394](https://github.com/ionic-team/ionic-framework/issues/28394)) ([eae8162](https://github.com/ionic-team/ionic-framework/commit/eae8162d0dc2e0bd7a9d56a3662a8e5f5d142b72)), closes [#28393](https://github.com/ionic-team/ionic-framework/issues/28393)
-* **infinite-scroll:** remaining in threshold after ionInfinite can trigger event again on scroll ([#28569](https://github.com/ionic-team/ionic-framework/issues/28569)) ([8c235fd](https://github.com/ionic-team/ionic-framework/commit/8c235fd30c50f317de1f37f69068507aa0979068)), closes [#18071](https://github.com/ionic-team/ionic-framework/issues/18071)
-* **item:** allow item to grow when it is used in a flex container ([#28594](https://github.com/ionic-team/ionic-framework/issues/28594)) ([1c1b567](https://github.com/ionic-team/ionic-framework/commit/1c1b567279dee44da70bb9b90c129946c9043987))
-* **item:** wrap elements and label contents when the font size increases or the elements do not fit ([#28146](https://github.com/ionic-team/ionic-framework/issues/28146)) ([6438e3e](https://github.com/ionic-team/ionic-framework/commit/6438e3e919c665569b731a2d74fe1547b4f3c1cc))
-* **select:** do not collapse to width: 0 when placed in flex container ([#28631](https://github.com/ionic-team/ionic-framework/issues/28631)) ([e71e7a0](https://github.com/ionic-team/ionic-framework/commit/e71e7a069000db8738abc304758de64286817442))
-* **toast:** add swipeGesture to ToastOptions ([#28518](https://github.com/ionic-team/ionic-framework/issues/28518)) ([4ad6df6](https://github.com/ionic-team/ionic-framework/commit/4ad6df67f01cebce30d4da46c7541c4b14c5d4a4))
-
-
-### Features
-
-* **checkbox:** add shadow part for label ([#28604](https://github.com/ionic-team/ionic-framework/issues/28604)) ([f9f5654](https://github.com/ionic-team/ionic-framework/commit/f9f5654ab0e920bf97089fbabfb9eedbcf6fe8ae)), closes [#28300](https://github.com/ionic-team/ionic-framework/issues/28300)
-* **input, textarea, select:** add start and end slots ([#28583](https://github.com/ionic-team/ionic-framework/issues/28583)) ([357b8b2](https://github.com/ionic-team/ionic-framework/commit/357b8b2beb29b95d53ef043af349067be1d32658)), closes [#26297](https://github.com/ionic-team/ionic-framework/issues/26297)
-* **radio-group:** add compareWith property ([#28452](https://github.com/ionic-team/ionic-framework/issues/28452)) ([0ae327f](https://github.com/ionic-team/ionic-framework/commit/0ae327f0e09cd97d705f2d3051c215034381e226))
-* **radio:** add shadow part for label ([#28607](https://github.com/ionic-team/ionic-framework/issues/28607)) ([b757970](https://github.com/ionic-team/ionic-framework/commit/b757970d23e87c59aa883ecb1bfa9b66bcae8de2)), closes [#28300](https://github.com/ionic-team/ionic-framework/issues/28300)
-* **range:** expose label wrapper as shadow part ([#28601](https://github.com/ionic-team/ionic-framework/issues/28601)) ([52ed2bf](https://github.com/ionic-team/ionic-framework/commit/52ed2bf63777c764f57bb4c3a5d4a127bff46c50))
-* **toast:** add swipe to dismiss functionality ([#28442](https://github.com/ionic-team/ionic-framework/issues/28442)) ([30c21aa](https://github.com/ionic-team/ionic-framework/commit/30c21aab3ed40d73c28e7d60d0952d8891b0a9d3)), closes [#21769](https://github.com/ionic-team/ionic-framework/issues/21769)
-* **toggle:** expose label wrapper as shadow part ([#28585](https://github.com/ionic-team/ionic-framework/issues/28585)) ([a34188f](https://github.com/ionic-team/ionic-framework/commit/a34188f7dbec4a16e4f2043ed3dc096e337725a7))
-
-
-
-
-
-## [7.5.8](https://github.com/ionic-team/ionic-framework/compare/v7.5.7...v7.5.8) (2023-12-06)
-
-
-### Bug Fixes
-
-* **overlays:** trigger is configured on load ([#28526](https://github.com/ionic-team/ionic-framework/issues/28526)) ([a3cd204](https://github.com/ionic-team/ionic-framework/commit/a3cd204f616606ccffc35082655e55fdfb19fe28)), closes [#28524](https://github.com/ionic-team/ionic-framework/issues/28524)
-
-
-
-
-
-## [7.5.7](https://github.com/ionic-team/ionic-framework/compare/v7.5.6...v7.5.7) (2023-11-29)
-
-
-### Bug Fixes
-
-* **alert:** date inputs render correctly in mobile safari ([#28495](https://github.com/ionic-team/ionic-framework/issues/28495)) ([b833f0e](https://github.com/ionic-team/ionic-framework/commit/b833f0e826ddd261230e2e29b70e2dc884d8cb04)), closes [#28494](https://github.com/ionic-team/ionic-framework/issues/28494)
-* **datetime:** allow disabling datetime with prefer-wheel ([#28511](https://github.com/ionic-team/ionic-framework/issues/28511)) ([01130e1](https://github.com/ionic-team/ionic-framework/commit/01130e12e1d73bbf558da9d4dffd7122822ff39c))
-
-
-
-
-
-## [7.5.6](https://github.com/ionic-team/ionic-framework/compare/v7.5.5...v7.5.6) (2023-11-21)
-
-
-### Bug Fixes
-
-* **alert:** match MD spec on tablet  ([#28501](https://github.com/ionic-team/ionic-framework/issues/28501)) ([6a2be9f](https://github.com/ionic-team/ionic-framework/commit/6a2be9fa3c12a893d98dc139a1575a6e7e3c7c26)), closes [#23977](https://github.com/ionic-team/ionic-framework/issues/23977)
-* **datetime:** updating value with min scrolls to new value ([#28549](https://github.com/ionic-team/ionic-framework/issues/28549)) ([388d19e](https://github.com/ionic-team/ionic-framework/commit/388d19e04f83f85abd4602adb04cc71ac575764a)), closes [#28548](https://github.com/ionic-team/ionic-framework/issues/28548)
-
-
-
-
-
-## [7.5.5](https://github.com/ionic-team/ionic-framework/compare/v7.5.4...v7.5.5) (2023-11-15)
-
-
-### Bug Fixes
-
-* **accordion-group:** correct accordion is open on load ([#28510](https://github.com/ionic-team/ionic-framework/issues/28510)) ([a000dd2](https://github.com/ionic-team/ionic-framework/commit/a000dd2c0b65be8ab5b2ad19f2748fbca13d5085)), closes [#28506](https://github.com/ionic-team/ionic-framework/issues/28506)
-* **action-sheet:** adjust height for safe area with scrollable options ([#28504](https://github.com/ionic-team/ionic-framework/issues/28504)) ([900267e](https://github.com/ionic-team/ionic-framework/commit/900267eb36c36f2af63435f6b46acca52b3bdab7)), closes [#27777](https://github.com/ionic-team/ionic-framework/issues/27777)
-* **header:** collapsible large title does not flicker when collapse prop not reflected ([#28472](https://github.com/ionic-team/ionic-framework/issues/28472)) ([8227b0e](https://github.com/ionic-team/ionic-framework/commit/8227b0ee6d5250e122a34a83c644f8a74fbbafd5)), closes [#28466](https://github.com/ionic-team/ionic-framework/issues/28466)
-* **item-divider:** apply safe area to proper side regardless of direction ([#28420](https://github.com/ionic-team/ionic-framework/issues/28420)) ([4513e0c](https://github.com/ionic-team/ionic-framework/commit/4513e0c6b066d4990800c707e1d97f69c8fcfb0c))
-* **radio-group:** emit value change on componentDidLoad ([#28488](https://github.com/ionic-team/ionic-framework/issues/28488)) ([73b8bfd](https://github.com/ionic-team/ionic-framework/commit/73b8bfde3f060490958c10f58d0f68de80cb957f)), closes [#28356](https://github.com/ionic-team/ionic-framework/issues/28356)
-* **searchbar:** cancel icon aligns with back button ([#28478](https://github.com/ionic-team/ionic-framework/issues/28478)) ([c053fd9](https://github.com/ionic-team/ionic-framework/commit/c053fd9c68d9b1add1335db80be962215946a0b1)), closes [#28468](https://github.com/ionic-team/ionic-framework/issues/28468)
-
-> [!NOTE]
-> Ionic Vue developers utilizing the `v-ion-change` or `v-ion-input` workaround for https://github.com/ionic-team/ionic-framework/issues/27292 should remove this workaround when updating to Ionic v7.5.5.
-
-
-
-
-
-## [7.5.4](https://github.com/ionic-team/ionic-framework/compare/v7.5.3...v7.5.4) (2023-11-08)
-
-
-### Bug Fixes
-
-* **inputs:** remove invalid legacy warnings in input, textarea, and select ([#28484](https://github.com/ionic-team/ionic-framework/issues/28484)) ([c765dcb](https://github.com/ionic-team/ionic-framework/commit/c765dcbac4148762768d8c2bea9103e7d38c510b))
-* **item:** apply safe area to proper side regardless of direction ([#28403](https://github.com/ionic-team/ionic-framework/issues/28403)) ([ed040b0](https://github.com/ionic-team/ionic-framework/commit/ed040b09e9cbd4246864e690542132defc6a6578))
-* **list:** remove border from last item with item-sliding ([#28439](https://github.com/ionic-team/ionic-framework/issues/28439)) ([cafafcc](https://github.com/ionic-team/ionic-framework/commit/cafafcc9d166ef536dcb73edd522c8f2a0fb95b6)), closes [#28435](https://github.com/ionic-team/ionic-framework/issues/28435)
-
-
-
-
-
-## [7.5.3](https://github.com/ionic-team/ionic-framework/compare/v7.5.2...v7.5.3) (2023-11-01)
-
-
-### Bug Fixes
-
-* **alert:** long words wrap to next line ([#28408](https://github.com/ionic-team/ionic-framework/issues/28408)) ([34257d6](https://github.com/ionic-team/ionic-framework/commit/34257d681e9034b0a001aa45e17222f3aab5ed76)), closes [#28406](https://github.com/ionic-team/ionic-framework/issues/28406)
-* **angular:** standalone form components do not error when multiple are used ([#28423](https://github.com/ionic-team/ionic-framework/issues/28423)) ([89698b3](https://github.com/ionic-team/ionic-framework/commit/89698b338fb05cde427c98720c238d2365abdaa7)), closes [#28418](https://github.com/ionic-team/ionic-framework/issues/28418)
-* **datetime:** allow calendar navigation in readonly mode; disallow keyboard navigation when disabled ([#28336](https://github.com/ionic-team/ionic-framework/issues/28336)) ([f6a6877](https://github.com/ionic-team/ionic-framework/commit/f6a6877044a6d912a92aab00c3c78897da09415d)), closes [#28121](https://github.com/ionic-team/ionic-framework/issues/28121)
-* **input, textarea, select:** use consistent sizes ([#28390](https://github.com/ionic-team/ionic-framework/issues/28390)) ([b31ecbb](https://github.com/ionic-team/ionic-framework/commit/b31ecbbfe8deb87604686d752e92e672dd9b277a)), closes [#28388](https://github.com/ionic-team/ionic-framework/issues/28388)
-* **list-header:** apply safe area to proper side regardless of direction ([#28371](https://github.com/ionic-team/ionic-framework/issues/28371)) ([f99d530](https://github.com/ionic-team/ionic-framework/commit/f99d5305fb4b1607b42e34a0b7653d8e1b5bf23f))
-* **segment:** avoid scrolling webkit bug ([#28376](https://github.com/ionic-team/ionic-framework/issues/28376)) ([8e2f818](https://github.com/ionic-team/ionic-framework/commit/8e2f81867175e9980e6d072b0a4414baae571223)), closes [#28373](https://github.com/ionic-team/ionic-framework/issues/28373)
-* **tab-bar:** apply safe area to proper side regardless of direction ([#28372](https://github.com/ionic-team/ionic-framework/issues/28372)) ([d47b7e7](https://github.com/ionic-team/ionic-framework/commit/d47b7e750310ceb2f2c7ecfda8343923ff8d564a))
-
-
-
-
-
-## [7.5.2](https://github.com/ionic-team/ionic-framework/compare/v7.5.1...v7.5.2) (2023-10-25)
-
-
-### Bug Fixes
-
-* **alert, action-sheet:** show scrollbar for long list of options ([#28369](https://github.com/ionic-team/ionic-framework/issues/28369)) ([60f3d65](https://github.com/ionic-team/ionic-framework/commit/60f3d6579498ebad75c4f5163fca3947ac2dadff)), closes [#18487](https://github.com/ionic-team/ionic-framework/issues/18487)
-* **fab:** apply safe area in positioning to proper side regardless of direction ([#28377](https://github.com/ionic-team/ionic-framework/issues/28377)) ([331c08a](https://github.com/ionic-team/ionic-framework/commit/331c08aad542de158e53ed351705d4c396bb4e90))
-* **input, searchbar, textarea:** ensure nativeInput is always available ([#28362](https://github.com/ionic-team/ionic-framework/issues/28362)) ([2b015b2](https://github.com/ionic-team/ionic-framework/commit/2b015b22144e306444f2bf30ace0b5cc7e32a710)), closes [#28283](https://github.com/ionic-team/ionic-framework/issues/28283)
-* **menu:** menu no longer disappears with multiple split panes ([#28370](https://github.com/ionic-team/ionic-framework/issues/28370)) ([5a30082](https://github.com/ionic-team/ionic-framework/commit/5a30082546cb19eb98128ca9091b35094841d4f2)), closes [#18683](https://github.com/ionic-team/ionic-framework/issues/18683) [#15538](https://github.com/ionic-team/ionic-framework/issues/15538) [#22341](https://github.com/ionic-team/ionic-framework/issues/22341)
-* **rtl:** allow :host to use rtl() ([#28353](https://github.com/ionic-team/ionic-framework/issues/28353)) ([6b7d288](https://github.com/ionic-team/ionic-framework/commit/6b7d288536307fcb49231dca66ab938b389ea85e))
-
-
-
-
-
-## [7.5.1](https://github.com/ionic-team/ionic-framework/compare/v7.5.0...v7.5.1) (2023-10-18)
-
-
-### Bug Fixes
-
-* **angular:** do not create duplicate menuController instances ([#28343](https://github.com/ionic-team/ionic-framework/issues/28343)) ([fa78676](https://github.com/ionic-team/ionic-framework/commit/fa78676d57eb80655ee9447ffa07dcfdae0c6b2a)), closes [#28337](https://github.com/ionic-team/ionic-framework/issues/28337)
-* **title:** large title transition supports dynamic font scaling ([#28290](https://github.com/ionic-team/ionic-framework/issues/28290)) ([fe47594](https://github.com/ionic-team/ionic-framework/commit/fe47594dc0bbb047f0bade144cf07b084fbeef5e)), closes [#28351](https://github.com/ionic-team/ionic-framework/issues/28351)
-
-
-
-
-
-# [7.5.0](https://github.com/ionic-team/ionic-framework/compare/v7.4.4...v7.5.0) (2023-10-11)
-
-
-### Bug Fixes
-
-* **alert:** stop Enter keypress for checkboxes ([#28279](https://github.com/ionic-team/ionic-framework/issues/28279)) ([72b3899](https://github.com/ionic-team/ionic-framework/commit/72b389993df4b0dc392262a106d7949e176b13af))
-* **select:** use correct aria-haspopup value ([#28265](https://github.com/ionic-team/ionic-framework/issues/28265)) ([01167fc](https://github.com/ionic-team/ionic-framework/commit/01167fc185db9bbb45b3a4086aff98008a76af2c))
-* **toast:** toast does not warn when positionAnchor is undefined ([#28312](https://github.com/ionic-team/ionic-framework/issues/28312)) ([c37b3d8](https://github.com/ionic-team/ionic-framework/commit/c37b3d8bf4b440506fdc96455a532c6316e5673d))
-
-
-### Features
-
-* **a11y:** add dynamic font scaling ([#28314](https://github.com/ionic-team/ionic-framework/issues/28314)) ([f806781](https://github.com/ionic-team/ionic-framework/commit/f8067819eeb577db163bf3e0f95fc73064d62b8a)), closes [#24638](https://github.com/ionic-team/ionic-framework/issues/24638) [#18592](https://github.com/ionic-team/ionic-framework/issues/18592)
-* **angular, react, vue, core:** export openURL utility ([#28295](https://github.com/ionic-team/ionic-framework/issues/28295)) ([6da82aa](https://github.com/ionic-team/ionic-framework/commit/6da82aab816b28bfc174f7634ded1fc1e06502ab)), closes [#27911](https://github.com/ionic-team/ionic-framework/issues/27911)
-* **angular:** ship Ionic components as Angular standalone components ([#28311](https://github.com/ionic-team/ionic-framework/issues/28311)) ([57e2476](https://github.com/ionic-team/ionic-framework/commit/57e247637005b10f0d21d5ac5f5232bcb1908301))
-* **datetime:** add support for h11 and h24 hour formats ([#28219](https://github.com/ionic-team/ionic-framework/issues/28219)) ([597bc3f](https://github.com/ionic-team/ionic-framework/commit/597bc3f085c5ff1451c73d0cf4d7d664943e712f)), closes [#23750](https://github.com/ionic-team/ionic-framework/issues/23750)
-* **toast:** allow custom positioning relative to specific element ([#28248](https://github.com/ionic-team/ionic-framework/issues/28248)) ([897ff6f](https://github.com/ionic-team/ionic-framework/commit/897ff6f7493d8d7e4ab22c6ae59de066b43ce682)), closes [#17499](https://github.com/ionic-team/ionic-framework/issues/17499)
-
-
-
-
-
-## [7.4.4](https://github.com/ionic-team/ionic-framework/compare/v7.4.3...v7.4.4) (2023-10-11)
-
-
-### Bug Fixes
-
-* **animation:** play method resolves when animation is stopped ([#28264](https://github.com/ionic-team/ionic-framework/issues/28264)) ([e6031fb](https://github.com/ionic-team/ionic-framework/commit/e6031fbef0698dac0a346cd6202c47f2abf54f95))
-* **checkbox, radio, toggle:** disabled elements are not interactive ([#28294](https://github.com/ionic-team/ionic-framework/issues/28294)) ([c70432e](https://github.com/ionic-team/ionic-framework/commit/c70432e6934bcf1d570e1f7cf671c52d2bb52a8b)), closes [#28293](https://github.com/ionic-team/ionic-framework/issues/28293)
-* **content:** fullscreen offset is computed correctly with tab bar ([#28245](https://github.com/ionic-team/ionic-framework/issues/28245)) ([7375dd6](https://github.com/ionic-team/ionic-framework/commit/7375dd6abafdf7457f23deb53ad5f016456a6af2)), closes [#21130](https://github.com/ionic-team/ionic-framework/issues/21130)
-* **core:** allow fullscreen scroll content to flow outside container for translucent tab bar ([#28246](https://github.com/ionic-team/ionic-framework/issues/28246)) ([b297529](https://github.com/ionic-team/ionic-framework/commit/b297529afc4b93a93f7eaecd31dd5a88a3de5f4e)), closes [#17676](https://github.com/ionic-team/ionic-framework/issues/17676)
-* **core:** swipe to go back gesture has priority over other horizontal swipe gestures ([#28304](https://github.com/ionic-team/ionic-framework/issues/28304)) ([d5f0c77](https://github.com/ionic-team/ionic-framework/commit/d5f0c776dfb5cb40b8119c596805dad3adb621e0)), closes [#28303](https://github.com/ionic-team/ionic-framework/issues/28303)
-* **header:** collapsible large title main header does not flicker on load ([#28277](https://github.com/ionic-team/ionic-framework/issues/28277)) ([3259da0](https://github.com/ionic-team/ionic-framework/commit/3259da0de181c8f82c38d9de13733213c77d398f)), closes [#27060](https://github.com/ionic-team/ionic-framework/issues/27060)
-* **menu:** do not error if disabled or swipeGesture is changed mid-animation ([#28268](https://github.com/ionic-team/ionic-framework/issues/28268)) ([a169044](https://github.com/ionic-team/ionic-framework/commit/a1690441e5bcee8176da32700de6f9e3fde9635e)), closes [#20092](https://github.com/ionic-team/ionic-framework/issues/20092) [#19676](https://github.com/ionic-team/ionic-framework/issues/19676) [#19000](https://github.com/ionic-team/ionic-framework/issues/19000)
-* **segment:** scroll to active segment-button on first load ([#28276](https://github.com/ionic-team/ionic-framework/issues/28276)) ([1167a93](https://github.com/ionic-team/ionic-framework/commit/1167a9325fb930b6c727bc26889f5488d9620062)), closes [#28096](https://github.com/ionic-team/ionic-framework/issues/28096)
-
-
-
-
-
-## [7.4.3](https://github.com/ionic-team/ionic-framework/compare/v7.4.2...v7.4.3) (2023-10-04)
-
-
-### Bug Fixes
-
-* **fab-button:** position is correct with custom sizes ([#28195](https://github.com/ionic-team/ionic-framework/issues/28195)) ([eb41b55](https://github.com/ionic-team/ionic-framework/commit/eb41b556b57c97139b9c36dc3e3be3711d8afaca)), closes [#22564](https://github.com/ionic-team/ionic-framework/issues/22564)
-* **range:** knob positions are correct on initial render with custom elements build ([#28257](https://github.com/ionic-team/ionic-framework/issues/28257)) ([ac2c8e6](https://github.com/ionic-team/ionic-framework/commit/ac2c8e6c22da4d0d8224def24ddef56ee9d26246)), closes [#25444](https://github.com/ionic-team/ionic-framework/issues/25444)
-
-
-
-
-
-## [7.4.2](https://github.com/ionic-team/ionic-framework/compare/v7.4.1...v7.4.2) (2023-09-27)
-
-
-### Bug Fixes
-
-* **title:** large title uses custom font on transition ([#28231](https://github.com/ionic-team/ionic-framework/issues/28231)) ([71a7af0](https://github.com/ionic-team/ionic-framework/commit/71a7af0f52fe62937b1dea1ca2739e78801a2a6d))
-
-
-
-
-
-## [7.4.1](https://github.com/ionic-team/ionic-framework/compare/v7.4.0...v7.4.1) (2023-09-20)
-
-
-### Bug Fixes
-
-* **overlays:** correctly re-add root to accessibility tree ([#28183](https://github.com/ionic-team/ionic-framework/issues/28183)) ([81714d4](https://github.com/ionic-team/ionic-framework/commit/81714d45bd97f0ba91729959b60a0dc1d1d06533)), closes [#28180](https://github.com/ionic-team/ionic-framework/issues/28180)
-* **radio,toggle,checkbox,select:** padded space is clickable in items ([#28136](https://github.com/ionic-team/ionic-framework/issues/28136)) ([5b7e422](https://github.com/ionic-team/ionic-framework/commit/5b7e422dc0bfd4d58fb31f62715af47e62dabb57)), closes [#27169](https://github.com/ionic-team/ionic-framework/issues/27169)
-* **range:** knob is not cut off in item with modern syntax ([#28199](https://github.com/ionic-team/ionic-framework/issues/28199)) ([0104d89](https://github.com/ionic-team/ionic-framework/commit/0104d899270d73e16f2850a5fd7d2ba25a9e7ef0)), closes [#27199](https://github.com/ionic-team/ionic-framework/issues/27199)
-* **scroll-assist:** improve input scroll accuracy with native resizing ([#28169](https://github.com/ionic-team/ionic-framework/issues/28169)) ([b5c736f](https://github.com/ionic-team/ionic-framework/commit/b5c736f5ac829efebedf3256ddf77ab3daa7a5f6)), closes [#22940](https://github.com/ionic-team/ionic-framework/issues/22940)
-* **scroll-assist:** re-run when keyboard changes ([#28174](https://github.com/ionic-team/ionic-framework/issues/28174)) ([3f06da4](https://github.com/ionic-team/ionic-framework/commit/3f06da4cfc0d59c658e17e09ccb1ea28a29339f9)), closes [#22940](https://github.com/ionic-team/ionic-framework/issues/22940)
-
-
-
-
-
-# [7.4.0](https://github.com/ionic-team/ionic-framework/compare/v7.3.4...v7.4.0) (2023-09-14)
-
-
-### Bug Fixes
-
-* **datetime:** scroll to newly selected date when value changes ([#27806](https://github.com/ionic-team/ionic-framework/issues/27806)) ([32244fb](https://github.com/ionic-team/ionic-framework/commit/32244fbdd1931e59a9e3cedd2b143c8ee7d01459)), closes [#26391](https://github.com/ionic-team/ionic-framework/issues/26391)
-* **many:** add correct scale to stacked labels ([#28163](https://github.com/ionic-team/ionic-framework/issues/28163)) ([8cb8786](https://github.com/ionic-team/ionic-framework/commit/8cb878669e53bad25bbe2787826b6d02d292848a))
-* **range:** add correct margin in item ([#28161](https://github.com/ionic-team/ionic-framework/issues/28161)) ([1d2b867](https://github.com/ionic-team/ionic-framework/commit/1d2b867f2207d366e355265b081bc9aabe31ce7e))
-
-
-### Features
-
-* **checkbox, radio, toggle, range:** stacked labels for form controls ([#28075](https://github.com/ionic-team/ionic-framework/issues/28075)) ([e6c7bb6](https://github.com/ionic-team/ionic-framework/commit/e6c7bb60e7e61c965f45e2bf3e3bd16f5125ad56))
-* **datetime:** add disabled part ([#28134](https://github.com/ionic-team/ionic-framework/issues/28134)) ([cd8d509](https://github.com/ionic-team/ionic-framework/commit/cd8d5091a133804ac97d0394354dcf7cd73d9355))
-* **datetime:** add parts for calendar day, active, and today ([#27641](https://github.com/ionic-team/ionic-framework/issues/27641)) ([79b005d](https://github.com/ionic-team/ionic-framework/commit/79b005da704c2ce481e1e3bc4d24cdba06a36d04)), closes [#25340](https://github.com/ionic-team/ionic-framework/issues/25340)
-* export TransitionOptions interface and getIonPageElement ([#28140](https://github.com/ionic-team/ionic-framework/issues/28140)) ([19f3bb2](https://github.com/ionic-team/ionic-framework/commit/19f3bb23fd5587848fc41a744ca46ef5985c04d2)), closes [#28137](https://github.com/ionic-team/ionic-framework/issues/28137)
-
-
-
-
-
-## [7.3.4](https://github.com/ionic-team/ionic-framework/compare/v7.3.3...v7.3.4) (2023-09-13)
-
-
-### Bug Fixes
-
-* **menu:** remove app dir from safe area padding ([#28123](https://github.com/ionic-team/ionic-framework/issues/28123)) ([e0542a7](https://github.com/ionic-team/ionic-framework/commit/e0542a7867871fa45a7fe6a4986e7de633063b4b))
-
-
-
-
-
-## [7.3.3](https://github.com/ionic-team/ionic-framework/compare/v7.3.2...v7.3.3) (2023-09-06)
-
-
-### Bug Fixes
-
-* **modal:** swipe to dismiss resets status bar style ([#28110](https://github.com/ionic-team/ionic-framework/issues/28110)) ([176585f](https://github.com/ionic-team/ionic-framework/commit/176585f446b04a6a0cedab2e09417637dbfc78ee)), closes [#28105](https://github.com/ionic-team/ionic-framework/issues/28105)
-* **overlays:** prevent overlays from getting stuck open ([#28069](https://github.com/ionic-team/ionic-framework/issues/28069)) ([584e9d3](https://github.com/ionic-team/ionic-framework/commit/584e9d3be220343451c2d4b9bf90658ecd530de1)), closes [#27200](https://github.com/ionic-team/ionic-framework/issues/27200)
-* **popover:** dynamic width popover is positioned correctly ([#28072](https://github.com/ionic-team/ionic-framework/issues/28072)) ([2a80eb6](https://github.com/ionic-team/ionic-framework/commit/2a80eb6bd0b16a9dab9bea600bb7f935d25c0e1b)), closes [#27190](https://github.com/ionic-team/ionic-framework/issues/27190) [#24780](https://github.com/ionic-team/ionic-framework/issues/24780)
-* **textarea:** cols property is respected ([#28081](https://github.com/ionic-team/ionic-framework/issues/28081)) ([6d4eabc](https://github.com/ionic-team/ionic-framework/commit/6d4eabcc1046c28c1abf69a8bda3e06f80cf3f8f)), closes [#22142](https://github.com/ionic-team/ionic-framework/issues/22142)
-
-
-
-
-
-## [7.3.2](https://github.com/ionic-team/ionic-framework/compare/v7.3.1...v7.3.2) (2023-08-30)
-
-
-### Bug Fixes
-
-* **datetime:** gracefully handle invalid min/max ([#28054](https://github.com/ionic-team/ionic-framework/issues/28054)) ([01fc9b4](https://github.com/ionic-team/ionic-framework/commit/01fc9b45116f7ad6ddc56c7fb1535dec798c2b3a)), closes [#28041](https://github.com/ionic-team/ionic-framework/issues/28041)
-
-
-
-
-
-## [7.3.1](https://github.com/ionic-team/ionic-framework/compare/v7.3.0...v7.3.1) (2023-08-23)
-
-
-### Bug Fixes
-
-* **input, textarea:** clearOnEdit does not clear when pressing Tab ([#28005](https://github.com/ionic-team/ionic-framework/issues/28005)) ([444acc1](https://github.com/ionic-team/ionic-framework/commit/444acc1f1bca348b62dfb398067cc087529f67f1)), closes [#27746](https://github.com/ionic-team/ionic-framework/issues/27746)
-
-
-
-
-
-# [7.3.0](https://github.com/ionic-team/ionic-framework/compare/v7.2.4...v7.3.0) (2023-08-16)
-
-
-### Bug Fixes
-
-* **alert:** radio and checkbox labels wrap to next line ([#27898](https://github.com/ionic-team/ionic-framework/issues/27898)) ([0d3127a](https://github.com/ionic-team/ionic-framework/commit/0d3127ad09df3c914a8c254f14931de5ca3beb31)), closes [#17269](https://github.com/ionic-team/ionic-framework/issues/17269)
-
-
-### Features
-
-* **action-sheet:** add htmlAttributes property for passing attributes to buttons ([#27863](https://github.com/ionic-team/ionic-framework/issues/27863)) ([5ce4ec0](https://github.com/ionic-team/ionic-framework/commit/5ce4ec0439e4f31aba31062fd8af4a2ad792a54f))
-* **alert:** add htmlAttributes property for passing attributes to buttons ([#27862](https://github.com/ionic-team/ionic-framework/issues/27862)) ([06be0e5](https://github.com/ionic-team/ionic-framework/commit/06be0e511164ebdaa6af9a3747d0585260c030a9))
-* **toast:** add htmlAttributes property for passing attributes to buttons   ([#27855](https://github.com/ionic-team/ionic-framework/issues/27855)) ([9a68588](https://github.com/ionic-team/ionic-framework/commit/9a685882b7085d911ff09eedacc367629e32348a))
-* **toast:** add shadow part for cancel button ([#27921](https://github.com/ionic-team/ionic-framework/issues/27921)) ([e9faf54](https://github.com/ionic-team/ionic-framework/commit/e9faf54d0a7409521706ce9c8b0d26f3fbe9ba41)), closes [#27920](https://github.com/ionic-team/ionic-framework/issues/27920)
-
-
-
-
-
-## [7.2.4](https://github.com/ionic-team/ionic-framework/compare/v7.2.3...v7.2.4) (2023-08-16)
-
-
-### Bug Fixes
-
-* **tap-click:** do not error in document-less environment ([#27972](https://github.com/ionic-team/ionic-framework/issues/27972)) ([28bd4ba](https://github.com/ionic-team/ionic-framework/commit/28bd4ba720bb77d5f5c48cd7a45e0015daddc9dd))
-* **title:** large title aligns with ios spec ([#27969](https://github.com/ionic-team/ionic-framework/issues/27969)) ([8fa12fc](https://github.com/ionic-team/ionic-framework/commit/8fa12fc88857df27a1ca11249f0085e100fe1474)), closes [#27966](https://github.com/ionic-team/ionic-framework/issues/27966)
-
-
-
-
-
-## [7.2.3](https://github.com/ionic-team/ionic-framework/compare/v7.2.2...v7.2.3) (2023-08-09)
-
-
-### Bug Fixes
-
-* **button:** hidden button is added when form is set async ([#27955](https://github.com/ionic-team/ionic-framework/issues/27955)) ([e9fa300](https://github.com/ionic-team/ionic-framework/commit/e9fa30002bd5dec4f2f56a15c84eec1b3e794942)), closes [#27952](https://github.com/ionic-team/ionic-framework/issues/27952)
-* **datetime:** changing months work if partially visible ([#27917](https://github.com/ionic-team/ionic-framework/issues/27917)) ([eb19c28](https://github.com/ionic-team/ionic-framework/commit/eb19c289d6581639f6df7aff002bebdf2b27d31c)), closes [#27913](https://github.com/ionic-team/ionic-framework/issues/27913)
-* **item-sliding:** account for options added before watcher ([#27915](https://github.com/ionic-team/ionic-framework/issues/27915)) ([a0b3ef0](https://github.com/ionic-team/ionic-framework/commit/a0b3ef02af718e232246515bb873ad8c090fa55d)), closes [#27910](https://github.com/ionic-team/ionic-framework/issues/27910)
-* **many:** overlays present if isOpen is true on load ([#27933](https://github.com/ionic-team/ionic-framework/issues/27933)) ([a0e6ac6](https://github.com/ionic-team/ionic-framework/commit/a0e6ac6013552c5e3acdde33575d4aaf4d4c0bda)), closes [#27928](https://github.com/ionic-team/ionic-framework/issues/27928)
-* **modal:** setCurrentBreakpoint respects animated prop ([#27924](https://github.com/ionic-team/ionic-framework/issues/27924)) ([da55ab9](https://github.com/ionic-team/ionic-framework/commit/da55ab949ef1894738da5a6241176089b7a2b6e3)), closes [#27923](https://github.com/ionic-team/ionic-framework/issues/27923)
-* **nav:** improve reliability of swipe back gesture when quickly swiping back ([#27904](https://github.com/ionic-team/ionic-framework/issues/27904)) ([9500769](https://github.com/ionic-team/ionic-framework/commit/9500769f114d180613f0340b1a328b5e631b7188)), closes [#27893](https://github.com/ionic-team/ionic-framework/issues/27893)
-
-
-
-
-
-## [7.2.2](https://github.com/ionic-team/ionic-framework/compare/v7.2.1...v7.2.2) (2023-08-02)
-
-
-### Bug Fixes
-
-* **datetime-button:** render correct text when passing partial date values ([#27816](https://github.com/ionic-team/ionic-framework/issues/27816)) ([bd1910b](https://github.com/ionic-team/ionic-framework/commit/bd1910ba69348877ad5f99d9db2b59d06693b91e)), closes [#27797](https://github.com/ionic-team/ionic-framework/issues/27797)
-* **input, textarea:** input does not block floating label ([#27870](https://github.com/ionic-team/ionic-framework/issues/27870)) ([f14c440](https://github.com/ionic-team/ionic-framework/commit/f14c440d6321ef9f168b272338e5cd21cab384ef)), closes [#27812](https://github.com/ionic-team/ionic-framework/issues/27812)
-* **item-options:** use correct safe area padding ([#27853](https://github.com/ionic-team/ionic-framework/issues/27853)) ([0b8f1bc](https://github.com/ionic-team/ionic-framework/commit/0b8f1bc7dd4170a2a8c9ed3aede173dd489b25ea))
-* **radio:** radios can be focused and are announced with group ([#27817](https://github.com/ionic-team/ionic-framework/issues/27817)) ([ba2f49b](https://github.com/ionic-team/ionic-framework/commit/ba2f49b8a460520d20ac198db800ea2d9e5b015f)), closes [#27438](https://github.com/ionic-team/ionic-framework/issues/27438)
-* **select:** popover uses modern form syntax ([#27818](https://github.com/ionic-team/ionic-framework/issues/27818)) ([0c117cf](https://github.com/ionic-team/ionic-framework/commit/0c117cfe7f383b7c7837d27de5a6eee12ddd6c2f)), closes [#27071](https://github.com/ionic-team/ionic-framework/issues/27071) [#27786](https://github.com/ionic-team/ionic-framework/issues/27786)
-
-
-
-
-
 ## [7.2.1](https://github.com/ionic-team/ionic-framework/compare/v7.2.0...v7.2.1) (2023-07-26)
 
 

core/Dockerfile

@@ -1,5 +0,0 @@
-# Get Playwright
-FROM mcr.microsoft.com/playwright:v1.42.1
-
-# Set the working directory
-WORKDIR /ionic

core/api.txt

@@ -289,13 +289,12 @@ ion-card-title,prop,mode,"ios" | "md",undefined,false,false
 ion-card-title,css-prop,--color
 
 ion-checkbox,shadow
-ion-checkbox,prop,alignment,"center" | "start",'center',false,false
 ion-checkbox,prop,checked,boolean,false,false,false
 ion-checkbox,prop,color,"danger" | "dark" | "light" | "medium" | "primary" | "secondary" | "success" | "tertiary" | "warning" | string & Record<never, never> | undefined,undefined,false,true
 ion-checkbox,prop,disabled,boolean,false,false,false
 ion-checkbox,prop,indeterminate,boolean,false,false,false
 ion-checkbox,prop,justify,"end" | "space-between" | "start",'space-between',false,false
-ion-checkbox,prop,labelPlacement,"end" | "fixed" | "stacked" | "start",'start',false,false
+ion-checkbox,prop,labelPlacement,"end" | "fixed" | "start",'start',false,false
 ion-checkbox,prop,legacy,boolean | undefined,undefined,false,false
 ion-checkbox,prop,mode,"ios" | "md",undefined,false,false
 ion-checkbox,prop,name,string,this.inputId,false,false
@@ -315,7 +314,6 @@ ion-checkbox,css-prop,--checkmark-width
 ion-checkbox,css-prop,--size
 ion-checkbox,css-prop,--transition
 ion-checkbox,part,container
-ion-checkbox,part,label
 ion-checkbox,part,mark
 
 ion-chip,shadow
@@ -394,9 +392,8 @@ ion-datetime,prop,dayValues,number | number[] | string | undefined,undefined,fal
 ion-datetime,prop,disabled,boolean,false,false,false
 ion-datetime,prop,doneText,string,'Done',false,false
 ion-datetime,prop,firstDayOfWeek,number,0,false,false
-ion-datetime,prop,formatOptions,undefined | { date: DateTimeFormatOptions; time?: DateTimeFormatOptions | undefined; } | { date?: DateTimeFormatOptions | undefined; time: DateTimeFormatOptions; },undefined,false,false
 ion-datetime,prop,highlightedDates,((dateIsoString: string) => DatetimeHighlightStyle | undefined) | DatetimeHighlight[] | undefined,undefined,false,false
-ion-datetime,prop,hourCycle,"h11" | "h12" | "h23" | "h24" | undefined,undefined,false,false
+ion-datetime,prop,hourCycle,"h12" | "h23" | undefined,undefined,false,false
 ion-datetime,prop,hourValues,number | number[] | string | undefined,undefined,false,false
 ion-datetime,prop,isDateEnabled,((dateIsoString: string) => boolean) | undefined,undefined,false,false
 ion-datetime,prop,locale,string,'default',false,false
@@ -430,10 +427,6 @@ ion-datetime,css-prop,--background-rgb
 ion-datetime,css-prop,--title-color
 ion-datetime,css-prop,--wheel-fade-background-rgb
 ion-datetime,css-prop,--wheel-highlight-background
-ion-datetime,part,calendar-day
-ion-datetime,part,calendar-day active
-ion-datetime,part,calendar-day disabled
-ion-datetime,part,calendar-day today
 ion-datetime,part,month-year-button
 ion-datetime,part,time-button
 ion-datetime,part,time-button active
@@ -549,7 +542,7 @@ ion-infinite-scroll-content,prop,loadingText,IonicSafeString | string | undefine
 ion-input,scoped
 ion-input,prop,accept,string | undefined,undefined,false,false
 ion-input,prop,autocapitalize,string,'off',false,false
-ion-input,prop,autocomplete,"name" | "on" | "off" | "honorific-prefix" | "given-name" | "additional-name" | "family-name" | "honorific-suffix" | "nickname" | "email" | "username" | "new-password" | "current-password" | "one-time-code" | "organization-title" | "organization" | "street-address" | "address-line1" | "address-line2" | "address-line3" | "address-level4" | "address-level3" | "address-level2" | "address-level1" | "country" | "country-name" | "postal-code" | "cc-name" | "cc-given-name" | "cc-additional-name" | "cc-family-name" | "cc-number" | "cc-exp" | "cc-exp-month" | "cc-exp-year" | "cc-csc" | "cc-type" | "transaction-currency" | "transaction-amount" | "language" | "bday" | "bday-day" | "bday-month" | "bday-year" | "sex" | "tel" | "tel-country-code" | "tel-national" | "tel-area-code" | "tel-local" | "tel-extension" | "impp" | "url" | "photo",'off',false,false
+ion-input,prop,autocomplete,"name" | "email" | "tel" | "url" | "on" | "off" | "honorific-prefix" | "given-name" | "additional-name" | "family-name" | "honorific-suffix" | "nickname" | "username" | "new-password" | "current-password" | "one-time-code" | "organization-title" | "organization" | "street-address" | "address-line1" | "address-line2" | "address-line3" | "address-level4" | "address-level3" | "address-level2" | "address-level1" | "country" | "country-name" | "postal-code" | "cc-name" | "cc-given-name" | "cc-additional-name" | "cc-family-name" | "cc-number" | "cc-exp" | "cc-exp-month" | "cc-exp-year" | "cc-csc" | "cc-type" | "transaction-currency" | "transaction-amount" | "language" | "bday" | "bday-day" | "bday-month" | "bday-year" | "sex" | "tel-country-code" | "tel-national" | "tel-area-code" | "tel-local" | "tel-extension" | "impp" | "photo",'off',false,false
 ion-input,prop,autocorrect,"off" | "on",'off',false,false
 ion-input,prop,autofocus,boolean,false,false,false
 ion-input,prop,clearInput,boolean,false,false,false
@@ -1015,11 +1008,10 @@ ion-progress-bar,part,stream
 ion-progress-bar,part,track
 
 ion-radio,shadow
-ion-radio,prop,alignment,"center" | "start",'center',false,false
 ion-radio,prop,color,"danger" | "dark" | "light" | "medium" | "primary" | "secondary" | "success" | "tertiary" | "warning" | string & Record<never, never> | undefined,undefined,false,true
 ion-radio,prop,disabled,boolean,false,false,false
 ion-radio,prop,justify,"end" | "space-between" | "start",'space-between',false,false
-ion-radio,prop,labelPlacement,"end" | "fixed" | "stacked" | "start",'start',false,false
+ion-radio,prop,labelPlacement,"end" | "fixed" | "start",'start',false,false
 ion-radio,prop,legacy,boolean | undefined,undefined,false,false
 ion-radio,prop,mode,"ios" | "md",undefined,false,false
 ion-radio,prop,name,string,this.inputId,false,false
@@ -1031,12 +1023,10 @@ ion-radio,css-prop,--color
 ion-radio,css-prop,--color-checked
 ion-radio,css-prop,--inner-border-radius
 ion-radio,part,container
-ion-radio,part,label
 ion-radio,part,mark
 
 ion-radio-group,none
 ion-radio-group,prop,allowEmptySelection,boolean,false,false,false
-ion-radio-group,prop,compareWith,((currentValue: any, compareValue: any) => boolean) | null | string | undefined,undefined,false,false
 ion-radio-group,prop,name,string,this.inputId,false,false
 ion-radio-group,prop,value,any,undefined,false,false
 ion-radio-group,event,ionChange,RadioGroupChangeEventDetail<any>,true
@@ -1048,7 +1038,7 @@ ion-range,prop,debounce,number | undefined,undefined,false,false
 ion-range,prop,disabled,boolean,false,false,false
 ion-range,prop,dualKnobs,boolean,false,false,false
 ion-range,prop,label,string | undefined,undefined,false,false
-ion-range,prop,labelPlacement,"end" | "fixed" | "stacked" | "start",'start',false,false
+ion-range,prop,labelPlacement,"end" | "fixed" | "start",'start',false,false
 ion-range,prop,legacy,boolean | undefined,undefined,false,false
 ion-range,prop,max,number,100,false,false
 ion-range,prop,min,number,0,false,false
@@ -1080,7 +1070,6 @@ ion-range,css-prop,--pin-color
 ion-range,part,bar
 ion-range,part,bar-active
 ion-range,part,knob
-ion-range,part,label
 ion-range,part,pin
 ion-range,part,tick
 ion-range,part,tick-active
@@ -1088,7 +1077,6 @@ ion-range,part,tick-active
 ion-refresher,none
 ion-refresher,prop,closeDuration,string,'280ms',false,false
 ion-refresher,prop,disabled,boolean,false,false,false
-ion-refresher,prop,mode,"ios" | "md",undefined,false,false
 ion-refresher,prop,pullFactor,number,1,false,false
 ion-refresher,prop,pullMax,number,this.pullMin + 60,false,false
 ion-refresher,prop,pullMin,number,60,false,false
@@ -1158,8 +1146,7 @@ ion-row,shadow
 
 ion-searchbar,scoped
 ion-searchbar,prop,animated,boolean,false,false,false
-ion-searchbar,prop,autocapitalize,string,'default',false,false
-ion-searchbar,prop,autocomplete,"name" | "on" | "off" | "honorific-prefix" | "given-name" | "additional-name" | "family-name" | "honorific-suffix" | "nickname" | "email" | "username" | "new-password" | "current-password" | "one-time-code" | "organization-title" | "organization" | "street-address" | "address-line1" | "address-line2" | "address-line3" | "address-level4" | "address-level3" | "address-level2" | "address-level1" | "country" | "country-name" | "postal-code" | "cc-name" | "cc-given-name" | "cc-additional-name" | "cc-family-name" | "cc-number" | "cc-exp" | "cc-exp-month" | "cc-exp-year" | "cc-csc" | "cc-type" | "transaction-currency" | "transaction-amount" | "language" | "bday" | "bday-day" | "bday-month" | "bday-year" | "sex" | "tel" | "tel-country-code" | "tel-national" | "tel-area-code" | "tel-local" | "tel-extension" | "impp" | "url" | "photo",'off',false,false
+ion-searchbar,prop,autocomplete,"name" | "email" | "tel" | "url" | "on" | "off" | "honorific-prefix" | "given-name" | "additional-name" | "family-name" | "honorific-suffix" | "nickname" | "username" | "new-password" | "current-password" | "one-time-code" | "organization-title" | "organization" | "street-address" | "address-line1" | "address-line2" | "address-line3" | "address-level4" | "address-level3" | "address-level2" | "address-level1" | "country" | "country-name" | "postal-code" | "cc-name" | "cc-given-name" | "cc-additional-name" | "cc-family-name" | "cc-number" | "cc-exp" | "cc-exp-month" | "cc-exp-year" | "cc-csc" | "cc-type" | "transaction-currency" | "transaction-amount" | "language" | "bday" | "bday-day" | "bday-month" | "bday-year" | "sex" | "tel-country-code" | "tel-national" | "tel-area-code" | "tel-local" | "tel-extension" | "impp" | "photo",'off',false,false
 ion-searchbar,prop,autocorrect,"off" | "on",'off',false,false
 ion-searchbar,prop,cancelButtonIcon,string,config.get('backButtonIcon', arrowBackSharp) as string,false,false
 ion-searchbar,prop,cancelButtonText,string,'Cancel',false,false
@@ -1169,8 +1156,6 @@ ion-searchbar,prop,debounce,number | undefined,undefined,false,false
 ion-searchbar,prop,disabled,boolean,false,false,false
 ion-searchbar,prop,enterkeyhint,"done" | "enter" | "go" | "next" | "previous" | "search" | "send" | undefined,undefined,false,false
 ion-searchbar,prop,inputmode,"decimal" | "email" | "none" | "numeric" | "search" | "tel" | "text" | "url" | undefined,undefined,false,false
-ion-searchbar,prop,maxlength,number | undefined,undefined,false,false
-ion-searchbar,prop,minlength,number | undefined,undefined,false,false
 ion-searchbar,prop,mode,"ios" | "md",undefined,false,false
 ion-searchbar,prop,name,string,this.inputId,false,false
 ion-searchbar,prop,placeholder,string,'Search',false,false
@@ -1379,7 +1364,7 @@ ion-textarea,prop,autocapitalize,string,'none',false,false
 ion-textarea,prop,autofocus,boolean,false,false,false
 ion-textarea,prop,clearOnEdit,boolean,false,false,false
 ion-textarea,prop,color,"danger" | "dark" | "light" | "medium" | "primary" | "secondary" | "success" | "tertiary" | "warning" | string & Record<never, never> | undefined,undefined,false,true
-ion-textarea,prop,cols,number | undefined,undefined,false,true
+ion-textarea,prop,cols,number | undefined,undefined,false,false
 ion-textarea,prop,counter,boolean,false,false,false
 ion-textarea,prop,counterFormatter,((inputLength: number, maxLength: number) => string) | undefined,undefined,false,false
 ion-textarea,prop,debounce,number | undefined,undefined,false,false
@@ -1454,8 +1439,6 @@ ion-toast,prop,leaveAnimation,((baseEl: any, opts?: any) => Animation) | undefin
 ion-toast,prop,message,IonicSafeString | string | undefined,undefined,false,false
 ion-toast,prop,mode,"ios" | "md",undefined,false,false
 ion-toast,prop,position,"bottom" | "middle" | "top",'bottom',false,false
-ion-toast,prop,positionAnchor,HTMLElement | string | undefined,undefined,false,false
-ion-toast,prop,swipeGesture,"vertical" | undefined,undefined,false,false
 ion-toast,prop,translucent,boolean,false,false,false
 ion-toast,prop,trigger,string | undefined,undefined,false,false
 ion-toast,method,dismiss,dismiss(data?: any, role?: string) => Promise<boolean>
@@ -1488,20 +1471,18 @@ ion-toast,css-prop,--start
 ion-toast,css-prop,--white-space
 ion-toast,css-prop,--width
 ion-toast,part,button
-ion-toast,part,button cancel
 ion-toast,part,container
 ion-toast,part,header
 ion-toast,part,icon
 ion-toast,part,message
 
 ion-toggle,shadow
-ion-toggle,prop,alignment,"center" | "start",'center',false,false
 ion-toggle,prop,checked,boolean,false,false,false
 ion-toggle,prop,color,"danger" | "dark" | "light" | "medium" | "primary" | "secondary" | "success" | "tertiary" | "warning" | string & Record<never, never> | undefined,undefined,false,true
 ion-toggle,prop,disabled,boolean,false,false,false
 ion-toggle,prop,enableOnOffLabels,boolean | undefined,config.get('toggleOnOffLabels'),false,false
 ion-toggle,prop,justify,"end" | "space-between" | "start",'space-between',false,false
-ion-toggle,prop,labelPlacement,"end" | "fixed" | "stacked" | "start",'start',false,false
+ion-toggle,prop,labelPlacement,"end" | "fixed" | "start",'start',false,false
 ion-toggle,prop,legacy,boolean | undefined,undefined,false,false
 ion-toggle,prop,mode,"ios" | "md",undefined,false,false
 ion-toggle,prop,name,string,this.inputId,false,false
@@ -1522,7 +1503,6 @@ ion-toggle,css-prop,--handle-width
 ion-toggle,css-prop,--track-background
 ion-toggle,css-prop,--track-background-checked
 ion-toggle,part,handle
-ion-toggle,part,label
 ion-toggle,part,track
 
 ion-toolbar,shadow

core/custom-rules/index.js

@@ -1,7 +1,6 @@
 module.exports = {
   rules: {
     'no-component-on-ready-method': require('./no-component-on-ready-method.js'),
-    'await-playwright-promise-assertion': require('./await-playwright-promise-assertion.js'),
-    'no-playwright-to-match-snapshot-assertion': require('./no-playwright-to-match-snapshot-assertion.js')
+    'await-playwright-promise-assertion': require('./await-playwright-promise-assertion.js')
   }
 }

core/custom-rules/no-playwright-to-match-snapshot-assertion.js

@@ -1,29 +0,0 @@
-module.exports = {
-  meta: {
-    messages: {
-      noPlaywrightToMatchSnapshotAssertion: '"toHaveScreenshot" assertions should be used in favor of "toMatchSnapshot". "toHaveScreenshot" brings file size reductions and anti-flake behaviors such as disabling animations by default.',
-    },
-  },
-  create(context) {
-    return {
-      ExpressionStatement(node) {
-        if (node.expression.callee === undefined) {
-          return;
-        }
-
-        const { property } = node.expression.callee;
-
-        /**
-         * Check to see if toMatchSnapshot is being used
-         */
-        if (
-          property !== undefined &&
-          property.type === 'Identifier' &&
-          property.name === 'toMatchSnapshot'
-        ) {
-          context.report({ node: node, messageId: 'noPlaywrightToMatchSnapshotAssertion' });
-        }
-      }
-    }
-  }
-};

core/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ionic/core",
-  "version": "7.8.1",
+  "version": "7.2.1",
   "description": "Base components for Ionic",
   "keywords": [
     "ionic",
@@ -31,29 +31,30 @@
     "loader/"
   ],
   "dependencies": {
-    "@stencil/core": "^4.12.2",
-    "ionicons": "^7.2.2",
+    "@stencil/core": "^3.4.0",
+    "ionicons": "7.1.0",
     "tslib": "^2.1.0"
   },
   "devDependencies": {
-    "@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",
+    "@axe-core/playwright": "^4.7.3",
+    "@capacitor/core": "^5.2.2",
+    "@capacitor/haptics": "^5.0.6",
+    "@capacitor/keyboard": "^5.0.6",
+    "@capacitor/status-bar": "^5.0.6",
     "@ionic/eslint-config": "^0.3.0",
     "@ionic/prettier-config": "^2.0.0",
-    "@playwright/test": "^1.39.0",
+    "@jest/core": "^27.5.1",
+    "@playwright/test": "^1.36.2",
     "@rollup/plugin-node-resolve": "^8.4.0",
     "@rollup/plugin-virtual": "^2.0.3",
-    "@stencil/angular-output-target": "^0.8.4",
+    "@stencil/angular-output-target": "^0.7.1",
     "@stencil/react-output-target": "^0.5.3",
-    "@stencil/sass": "^3.0.9",
-    "@stencil/vue-output-target": "^0.0.1-dev.11711372539.10de27e3",
-    "@types/jest": "^29.5.6",
+    "@stencil/sass": "^3.0.5",
+    "@stencil/vue-output-target": "^0.8.6",
+    "@types/jest": "^27.5.2",
     "@types/node": "^14.6.0",
-    "@typescript-eslint/eslint-plugin": "^6.7.2",
-    "@typescript-eslint/parser": "^6.7.2",
+    "@typescript-eslint/eslint-plugin": "^5.17.0",
+    "@typescript-eslint/parser": "^5.17.0",
     "clean-css-cli": "^5.6.1",
     "domino": "^2.1.6",
     "eslint": "^7.32.0",
@@ -61,14 +62,15 @@
     "eslint-plugin-custom-rules": "file:custom-rules",
     "execa": "^5.0.0",
     "fs-extra": "^9.0.1",
-    "jest": "^29.7.0",
-    "jest-cli": "^29.7.0",
+    "jest": "^27.5.1",
+    "jest-cli": "^27.5.1",
     "prettier": "^2.6.1",
     "rollup": "^2.26.4",
-    "sass": "^1.33.0",
+    "sass": "^1.26.10",
     "serve": "^14.0.1",
     "stylelint": "^13.13.1",
-    "stylelint-order": "^4.1.0"
+    "stylelint-order": "^4.1.0",
+    "typescript": "^4.0.5"
   },
   "scripts": {
     "build": "npm run clean && npm run build.css && stencil build --es5 --docs-json dist/docs.json",
@@ -85,21 +87,17 @@
     "lint.sass.fix": "npm run lint.sass -- --fix",
     "lint.ts": "npm run eslint",
     "lint.ts.fix": "npm run eslint -- --fix",
+    "prerelease": "npm run validate && np prerelease --yolo --any-branch --tag next",
     "prerender.e2e": "node scripts/testing/prerender.js",
     "prettier": "prettier \"./src/**/*.{html,ts,tsx,js,jsx}\"",
     "start": "npm run build.css && stencil build --dev --watch --serve",
     "test": "npm run test.spec && npm run test.e2e",
     "test.spec": "stencil test --spec --max-workers=2",
+    "test.spec.debug": "npx --node-arg=\"--inspect-brk\" stencil test --spec",
     "test.e2e": "npx playwright test",
-    "test.e2e.update-snapshots": "npm run test.e2e -- --update-snapshots",
     "test.watch": "jest --watch --no-cache",
     "test.treeshake": "node scripts/treeshaking.js dist/index.js",
-    "validate": "npm run lint && npm run test && npm run build && npm run test.treeshake",
-    "docker.build": "docker build -t ionic-playwright .",
-    "test.e2e.docker": "npm run docker.build && docker run -it --rm -e DISPLAY=$(cat docker-display.txt) -v $(cat docker-display-volume.txt) --ipc=host --mount=type=bind,source=./,target=/ionic ionic-playwright npm run test.e2e --",
-    "test.e2e.docker.update-snapshots": "npm run test.e2e.docker -- --update-snapshots",
-    "test.e2e.docker.ci": "npm run docker.build && docker run -e CI='true' --rm --ipc=host --mount=type=bind,source=./,target=/ionic ionic-playwright npm run test.e2e --",
-    "test.report": "npx playwright show-report"
+    "validate": "npm run lint && npm run test && npm run build && npm run test.treeshake"
   },
   "author": "Ionic Team",
   "license": "MIT",

core/playwright.config.ts

@@ -55,21 +55,21 @@ const config: PlaywrightTestConfig = {
     timeout: 5000,
     toHaveScreenshot: {
       threshold: 0.1
+    },
+    toMatchSnapshot: {
+      threshold: 0.1
     }
   },
   /* Fail the build on CI if you accidentally left test.only in the source code. */
   forbidOnly: !!process.env.CI,
-  maxFailures: 0,
-  /* Test retries help catch flaky tests on CI */
-  retries: process.env.CI ? 2 : 0,
-  reportSlowTests: null,
+  /* Fail fast on CI */
+  maxFailures: process.env.CI ? 1 : 0,
+  /* Flaky test should be either addressed or disabled until we can address them */
+  retries: 0,
   /* Opt out of parallel tests on CI. */
   workers: process.env.CI ? 1 : undefined,
   /* Reporter to use. See https://playwright.dev/docs/test-reporters */
-  reporter: [
-    ['html'],
-    ['github']
-  ],
+  reporter: 'html',
   /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
   use: {
     /* Maximum time each action such as `click()` can take. Defaults to 0 (no limit). */

core/scripts/testing/themes/dark.css

@@ -1,151 +0,0 @@
-/*
- * Dark Colors
- * -------------------------------------------
- */
-
-:root {
-  --ion-color-primary: #428cff;
-  --ion-color-primary-rgb: 66, 140, 255;
-  --ion-color-primary-contrast: #ffffff;
-  --ion-color-primary-contrast-rgb: 255, 255, 255;
-  --ion-color-primary-shade: #3a7be0;
-  --ion-color-primary-tint: #5598ff;
-
-  --ion-color-secondary: #50c8ff;
-  --ion-color-secondary-rgb: 80, 200, 255;
-  --ion-color-secondary-contrast: #ffffff;
-  --ion-color-secondary-contrast-rgb: 255, 255, 255;
-  --ion-color-secondary-shade: #46b0e0;
-  --ion-color-secondary-tint: #62ceff;
-
-  --ion-color-tertiary: #6a64ff;
-  --ion-color-tertiary-rgb: 106, 100, 255;
-  --ion-color-tertiary-contrast: #ffffff;
-  --ion-color-tertiary-contrast-rgb: 255, 255, 255;
-  --ion-color-tertiary-shade: #5d58e0;
-  --ion-color-tertiary-tint: #7974ff;
-
-  --ion-color-success: #2fdf75;
-  --ion-color-success-rgb: 47, 223, 117;
-  --ion-color-success-contrast: #000000;
-  --ion-color-success-contrast-rgb: 0, 0, 0;
-  --ion-color-success-shade: #29c467;
-  --ion-color-success-tint: #44e283;
-
-  --ion-color-warning: #ffd534;
-  --ion-color-warning-rgb: 255, 213, 52;
-  --ion-color-warning-contrast: #000000;
-  --ion-color-warning-contrast-rgb: 0, 0, 0;
-  --ion-color-warning-shade: #e0bb2e;
-  --ion-color-warning-tint: #ffd948;
-
-  --ion-color-danger: #ff4961;
-  --ion-color-danger-rgb: 255, 73, 97;
-  --ion-color-danger-contrast: #ffffff;
-  --ion-color-danger-contrast-rgb: 255, 255, 255;
-  --ion-color-danger-shade: #e04055;
-  --ion-color-danger-tint: #ff5b71;
-
-  --ion-color-dark: #f4f5f8;
-  --ion-color-dark-rgb: 244, 245, 248;
-  --ion-color-dark-contrast: #000000;
-  --ion-color-dark-contrast-rgb: 0, 0, 0;
-  --ion-color-dark-shade: #d7d8da;
-  --ion-color-dark-tint: #f5f6f9;
-
-  --ion-color-medium: #989aa2;
-  --ion-color-medium-rgb: 152, 154, 162;
-  --ion-color-medium-contrast: #000000;
-  --ion-color-medium-contrast-rgb: 0, 0, 0;
-  --ion-color-medium-shade: #86888f;
-  --ion-color-medium-tint: #a2a4ab;
-
-  --ion-color-light: #222428;
-  --ion-color-light-rgb: 34, 36, 40;
-  --ion-color-light-contrast: #ffffff;
-  --ion-color-light-contrast-rgb: 255, 255, 255;
-  --ion-color-light-shade: #1e2023;
-  --ion-color-light-tint: #383a3e;
-}
-
-/*
- * iOS Dark Theme
- * -------------------------------------------
- */
-
-.ios body {
-  --ion-background-color: #000000;
-  --ion-background-color-rgb: 0, 0, 0;
-
-  --ion-text-color: #ffffff;
-  --ion-text-color-rgb: 255, 255, 255;
-
-  --ion-color-step-50: #0d0d0d;
-  --ion-color-step-100: #1a1a1a;
-  --ion-color-step-150: #262626;
-  --ion-color-step-200: #333333;
-  --ion-color-step-250: #404040;
-  --ion-color-step-300: #4d4d4d;
-  --ion-color-step-350: #595959;
-  --ion-color-step-400: #666666;
-  --ion-color-step-450: #737373;
-  --ion-color-step-500: #808080;
-  --ion-color-step-550: #8c8c8c;
-  --ion-color-step-600: #999999;
-  --ion-color-step-650: #a6a6a6;
-  --ion-color-step-700: #b3b3b3;
-  --ion-color-step-750: #bfbfbf;
-  --ion-color-step-800: #cccccc;
-  --ion-color-step-850: #d9d9d9;
-  --ion-color-step-900: #e6e6e6;
-  --ion-color-step-950: #f2f2f2;
-
-  --ion-toolbar-background: #0d0d0d;
-
-  --ion-item-background: #000000;
-
-  --ion-card-background: #1c1c1d;
-}
-
-/*
- * Material Design Dark Theme
- * -------------------------------------------
- */
-
-.md body {
-  --ion-background-color: #121212;
-  --ion-background-color-rgb: 18, 18, 18;
-
-  --ion-text-color: #ffffff;
-  --ion-text-color-rgb: 255, 255, 255;
-
-  --ion-border-color: #222222;
-
-  --ion-color-step-50: #1e1e1e;
-  --ion-color-step-100: #2a2a2a;
-  --ion-color-step-150: #363636;
-  --ion-color-step-200: #414141;
-  --ion-color-step-250: #4d4d4d;
-  --ion-color-step-300: #595959;
-  --ion-color-step-350: #656565;
-  --ion-color-step-400: #717171;
-  --ion-color-step-450: #7d7d7d;
-  --ion-color-step-500: #898989;
-  --ion-color-step-550: #949494;
-  --ion-color-step-600: #a0a0a0;
-  --ion-color-step-650: #acacac;
-  --ion-color-step-700: #b8b8b8;
-  --ion-color-step-750: #c4c4c4;
-  --ion-color-step-800: #d0d0d0;
-  --ion-color-step-850: #dbdbdb;
-  --ion-color-step-900: #e7e7e7;
-  --ion-color-step-950: #f3f3f3;
-
-  --ion-item-background: #1e1e1e;
-
-  --ion-toolbar-background: #1f1f1f;
-
-  --ion-tab-bar-background: #1f1f1f;
-
-  --ion-card-background: #1e1e1e;
-}

core/setupJest.js

@@ -1,21 +0,0 @@
-expect.extend({
-  toHaveShadowPart(received, part) {
-    if (typeof part !== 'string') {
-      throw new Error('expected toHaveShadowPart to be called with a string of the CSS shadow part name');
-    }
-
-    if (received.shadowRoot === null) {
-      throw new Error('expected toHaveShadowPart to be called on an element with a shadow root');
-    }
-
-    const shadowPart = received.shadowRoot.querySelector(`[part="${part}"]`);
-    const pass = shadowPart !== null;
-
-    const message = `expected ${received.tagName.toLowerCase()} to have shadow part "${part}"`;
-
-    return {
-      pass,
-      message: () => message,
-    };
-  },
-});

core/src/components/accordion-group/accordion-group.tsx

@@ -180,16 +180,6 @@ export class AccordionGroup implements ComponentInterface {
     if (this.readonly) {
       this.readonlyChanged();
     }
-    /**
-     * When binding values in frameworks such as Angular
-     * it is possible for the value to be set after the Web Component
-     * initializes but before the value watcher is set up in Stencil.
-     * As a result, the watcher callback may not be fired.
-     * We work around this by manually calling the watcher
-     * callback when the component has loaded and the watcher
-     * is configured.
-     */
-    this.valueChanged();
   }
 
   /**

core/src/components/accordion/accordion.tsx

@@ -382,10 +382,7 @@ export class Accordion implements ComponentInterface {
   };
 
   private toggleExpanded() {
-    const { accordionGroupEl, disabled, readonly, value, state } = this;
-
-    if (disabled || readonly) return;
-
+    const { accordionGroupEl, value, state } = this;
     if (accordionGroupEl) {
       /**
        * Because the accordion group may or may

core/src/components/accordion/test/a11y/index.html

@@ -23,22 +23,28 @@
 
             <ion-list slot="content">
               <ion-item>
-                <ion-input label="Name" type="text"></ion-input>
+                <ion-label>Name</ion-label>
+                <ion-input type="text"></ion-input>
               </ion-item>
               <ion-item>
-                <ion-input label="Email" type="email"></ion-input>
+                <ion-label>Email</ion-label>
+                <ion-input type="email"></ion-input>
               </ion-item>
               <ion-item>
-                <ion-input label="Phone" type="tel"></ion-input>
+                <ion-label>Phone</ion-label>
+                <ion-input type="tel"></ion-input>
               </ion-item>
               <ion-item>
-                <ion-input label="Extension" type="text"></ion-input>
+                <ion-label>Extension</ion-label>
+                <ion-input type="text"></ion-input>
               </ion-item>
               <ion-item>
-                <ion-input label="Country" type="text"></ion-input>
+                <ion-label>Country</ion-label>
+                <ion-input type="text"></ion-input>
               </ion-item>
               <ion-item>
-                <ion-input label="City/Province" type="text"></ion-input>
+                <ion-label>City/Province</ion-label>
+                <ion-input type="text"></ion-input>
               </ion-item>
             </ion-list>
           </ion-accordion>
@@ -50,19 +56,24 @@
 
             <ion-list slot="content">
               <ion-item>
-                <ion-input label="Address 1" type="text"></ion-input>
+                <ion-label>Address 1</ion-label>
+                <ion-input type="text"></ion-input>
               </ion-item>
               <ion-item>
-                <ion-input label="Address 2" type="email"></ion-input>
+                <ion-label>Address 2</ion-label>
+                <ion-input type="email"></ion-input>
               </ion-item>
               <ion-item>
-                <ion-input label="City" type="tel"></ion-input>
+                <ion-label>City</ion-label>
+                <ion-input type="tel"></ion-input>
               </ion-item>
               <ion-item>
-                <ion-input label="State" type="text"></ion-input>
+                <ion-label>State</ion-label>
+                <ion-input type="text"></ion-input>
               </ion-item>
               <ion-item>
-                <ion-input label="Zip Code" type="text"></ion-input>
+                <ion-label>Zip Code</ion-label>
+                <ion-input type="text"></ion-input>
               </ion-item>
             </ion-list>
           </ion-accordion>
@@ -74,19 +85,24 @@
 
             <ion-list slot="content">
               <ion-item>
-                <ion-input label="Address 1" id="address1" type="text"></ion-input>
+                <ion-label>Address 1</ion-label>
+                <ion-input id="address1" type="text"></ion-input>
               </ion-item>
               <ion-item>
-                <ion-input label="Address 2" type="email"></ion-input>
+                <ion-label>Address 2</ion-label>
+                <ion-input type="email"></ion-input>
               </ion-item>
               <ion-item>
-                <ion-input label="City" type="tel"></ion-input>
+                <ion-label>City</ion-label>
+                <ion-input type="tel"></ion-input>
               </ion-item>
               <ion-item>
-                <ion-input lable="State" type="text"></ion-input>
+                <ion-label>State</ion-label>
+                <ion-input type="text"></ion-input>
               </ion-item>
               <ion-item>
-                <ion-input label="Zip Code" type="text"></ion-input>
+                <ion-label>Zip Code</ion-label>
+                <ion-input type="text"></ion-input>
               </ion-item>
             </ion-list>
           </ion-accordion>

core/src/components/accordion/test/accordion.e2e.ts

@@ -0,0 +1,49 @@
+import { expect } from '@playwright/test';
+import { configs, test } from '@utils/test/playwright';
+
+configs({ modes: ['md'], directions: ['ltr'] }).forEach(({ config, title }) => {
+  test.describe(title('accordion: states'), () => {
+    test.beforeEach(async ({ page }) => {
+      await page.setContent(
+        `
+      <ion-accordion-group animated="false">
+        <ion-accordion>
+          <ion-item slot="header">Label</ion-item>
+          <div slot="content">Content</div>
+        </ion-accordion>
+      </ion-accordion-group>
+    `,
+        config
+      );
+    });
+    test('should properly set readonly on child accordions', async ({ page }) => {
+      const accordionGroup = page.locator('ion-accordion-group');
+      const accordion = page.locator('ion-accordion');
+
+      await expect(accordion).toHaveJSProperty('readonly', false);
+
+      await accordionGroup.evaluate((el: HTMLIonAccordionGroupElement) => {
+        el.readonly = true;
+      });
+
+      await page.waitForChanges();
+
+      await expect(accordion).toHaveJSProperty('readonly', true);
+    });
+
+    test('should properly set disabled on child accordions', async ({ page }) => {
+      const accordionGroup = page.locator('ion-accordion-group');
+      const accordion = page.locator('ion-accordion');
+
+      await expect(accordion).toHaveJSProperty('disabled', false);
+
+      await accordionGroup.evaluate((el: HTMLIonAccordionGroupElement) => {
+        el.disabled = true;
+      });
+
+      await page.waitForChanges();
+
+      await expect(accordion).toHaveJSProperty('disabled', true);
+    });
+  });
+});

core/src/components/accordion/test/accordion.spec.ts

@@ -1,8 +1,8 @@
 import { newSpecPage } from '@stencil/core/testing';
 
-import { AccordionGroup } from '../../accordion-group/accordion-group';
-import { Item } from '../../item/item';
-import { Accordion } from '../accordion';
+import { AccordionGroup } from '../../accordion-group/accordion-group.tsx';
+import { Item } from '../../item/item.tsx';
+import { Accordion } from '../accordion.tsx';
 
 it('should open correct accordions when accordion group value is set', async () => {
   const page = await newSpecPage({
@@ -25,7 +25,7 @@ it('should open correct accordions when accordion group value is set', async ()
     `,
   });
 
-  const accordionGroup = page.body.querySelector('ion-accordion-group')!;
+  const accordionGroup = page.body.querySelector('ion-accordion-group');
   const accordions = accordionGroup.querySelectorAll('ion-accordion');
 
   accordions.forEach((accordion) => {
@@ -61,7 +61,7 @@ it('should open correct accordions when accordion value is set', async () => {
     `,
   });
 
-  const accordionGroup = page.body.querySelector('ion-accordion-group')!;
+  const accordionGroup = page.body.querySelector('ion-accordion-group');
   const accordions = accordionGroup.querySelectorAll('ion-accordion');
 
   accordions.forEach((accordion) => {
@@ -97,7 +97,7 @@ it('should open more than one accordion when multiple="true"', async () => {
     `,
   });
 
-  const accordionGroup = page.body.querySelector('ion-accordion-group')!;
+  const accordionGroup = page.body.querySelector('ion-accordion-group');
   const accordions = accordionGroup.querySelectorAll('ion-accordion');
 
   accordions.forEach((accordion) => {
@@ -133,7 +133,7 @@ it('should render with accordion open', async () => {
     `,
   });
 
-  const accordionGroup = page.body.querySelector('ion-accordion-group')!;
+  const accordionGroup = page.body.querySelector('ion-accordion-group');
   const accordions = accordionGroup.querySelectorAll('ion-accordion');
 
   expect(accordions[0].classList.contains('accordion-collapsed')).toEqual(false);
@@ -162,7 +162,7 @@ it('should accept a string when multiple="true"', async () => {
     `,
   });
 
-  const accordionGroup = page.body.querySelector('ion-accordion-group')!;
+  const accordionGroup = page.body.querySelector('ion-accordion-group');
   const accordions = accordionGroup.querySelectorAll('ion-accordion');
 
   expect(accordions[0].classList.contains('accordion-collapsed')).toEqual(false);
@@ -183,8 +183,8 @@ it('should set default values if not provided', async () => {
     `,
   });
 
-  const accordionGroup = page.body.querySelector('ion-accordion-group')!;
-  const accordion = accordionGroup.querySelector('ion-accordion')!;
+  const accordionGroup = page.body.querySelector('ion-accordion-group');
+  const accordion = accordionGroup.querySelector('ion-accordion');
 
   /**
    * ID is determined via an auto incrementing counter

core/src/components/accordion/test/disabled/accordion.e2e.ts

@@ -1,137 +0,0 @@
-import { expect } from '@playwright/test';
-import { configs, test } from '@utils/test/playwright';
-
-// NOTE: these tests cannot be re-written as spec tests because the `getAccordions` method in accordion-group.tsx uses a `:scope` selector
-configs({ modes: ['md'], directions: ['ltr'] }).forEach(({ config, title }) => {
-  test.describe(title('accordion: disabled'), () => {
-    test('should properly set disabled on child accordions', async ({ page }) => {
-      await page.setContent(
-        `
-      <ion-accordion-group animated="false">
-        <ion-accordion>
-          <ion-item slot="header">Label</ion-item>
-          <div slot="content">Content</div>
-        </ion-accordion>
-      </ion-accordion-group>
-    `,
-        config
-      );
-
-      const accordionGroup = page.locator('ion-accordion-group');
-      const accordion = page.locator('ion-accordion');
-
-      await expect(accordion).toHaveJSProperty('disabled', false);
-
-      await accordionGroup.evaluate((el: HTMLIonAccordionGroupElement) => {
-        el.disabled = true;
-      });
-
-      await page.waitForChanges();
-
-      await expect(accordion).toHaveJSProperty('disabled', true);
-    });
-
-    test('should not open accordion on click when group is disabled', async ({ page }) => {
-      await page.setContent(
-        `
-      <ion-accordion-group animated="false" disabled>
-        <ion-accordion>
-          <ion-item slot="header">Label</ion-item>
-          <div slot="content">Content</div>
-        </ion-accordion>
-      </ion-accordion-group>
-    `,
-        config
-      );
-
-      const accordion = page.locator('ion-accordion');
-
-      await expect(accordion).toHaveClass(/accordion-collapsed/);
-
-      accordion.click();
-      await page.waitForChanges();
-
-      await expect(accordion).toHaveClass(/accordion-collapsed/);
-    });
-
-    test('should not open accordion on click when accordion is disabled', async ({ page }) => {
-      await page.setContent(
-        `
-      <ion-accordion-group animated="false">
-        <ion-accordion disabled>
-          <ion-item slot="header">Label</ion-item>
-          <div slot="content">Content</div>
-        </ion-accordion>
-      </ion-accordion-group>
-    `,
-        config
-      );
-
-      const accordion = page.locator('ion-accordion');
-
-      await expect(accordion).toHaveClass(/accordion-collapsed/);
-
-      accordion.click();
-      await page.waitForChanges();
-
-      await expect(accordion).toHaveClass(/accordion-collapsed/);
-    });
-
-    test('should not open accordion via keyboard navigation when group is disabled', async ({ page, browserName }) => {
-      await page.setContent(
-        `
-      <ion-accordion-group animated="false" disabled>
-        <ion-accordion>
-          <ion-item slot="header">Label</ion-item>
-          <div slot="content">Content</div>
-        </ion-accordion>
-      </ion-accordion-group>
-    `,
-        config
-      );
-
-      const accordion = page.locator('ion-accordion');
-      const tabKey = browserName === 'webkit' ? 'Alt+Tab' : 'Tab';
-
-      await expect(accordion).toHaveClass(/accordion-collapsed/);
-
-      await page.keyboard.press(tabKey);
-      await page.waitForChanges();
-
-      await page.keyboard.press('Enter');
-      await page.waitForChanges();
-
-      await expect(accordion).toHaveClass(/accordion-collapsed/);
-    });
-
-    test('should not open accordion via keyboard navigation when accordion is disabled', async ({
-      page,
-      browserName,
-    }) => {
-      await page.setContent(
-        `
-      <ion-accordion-group animated="false">
-        <ion-accordion disabled>
-          <ion-item slot="header">Label</ion-item>
-          <div slot="content">Content</div>
-        </ion-accordion>
-      </ion-accordion-group>
-    `,
-        config
-      );
-
-      const accordion = page.locator('ion-accordion');
-      const tabKey = browserName === 'webkit' ? 'Alt+Tab' : 'Tab';
-
-      await expect(accordion).toHaveClass(/accordion-collapsed/);
-
-      await page.keyboard.press(tabKey);
-      await page.waitForChanges();
-
-      await page.keyboard.press('Enter');
-      await page.waitForChanges();
-
-      await expect(accordion).toHaveClass(/accordion-collapsed/);
-    });
-  });
-});

core/src/components/accordion/test/disabled/index.html

@@ -1,91 +0,0 @@
-<!DOCTYPE html>
-<html lang="en" dir="ltr">
-  <head>
-    <meta charset="UTF-8" />
-    <title>Accordion - Disabled</title>
-    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0" />
-    <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>
-    <style>
-      .grid {
-        display: grid;
-        grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
-        grid-row-gap: 20px;
-        grid-column-gap: 20px;
-      }
-    </style>
-  </head>
-  <body>
-    <ion-app>
-      <ion-header translucent="true">
-        <ion-toolbar>
-          <ion-title>Accordion - Disabled</ion-title>
-        </ion-toolbar>
-      </ion-header>
-      <ion-content fullscreen="true" color="light">
-        <ion-header collapse="condense">
-          <ion-toolbar color="light">
-            <ion-title size="large">Accordion - Disabled</ion-title>
-          </ion-toolbar>
-        </ion-header>
-
-        <div class="grid ion-padding">
-          <div class="grid-item">
-            <ion-accordion-group>
-              <ion-accordion value="first">
-                <ion-item slot="header" color="light">
-                  <ion-label>First Accordion</ion-label>
-                </ion-item>
-                <div class="ion-padding" slot="content">First Content</div>
-              </ion-accordion>
-              <ion-accordion value="second" disabled="true">
-                <ion-item slot="header" color="light">
-                  <ion-label>Second Accordion (Disabled)</ion-label>
-                </ion-item>
-                <div class="ion-padding" slot="content">Second Content</div>
-              </ion-accordion>
-              <ion-accordion value="third">
-                <ion-item slot="header" color="light">
-                  <ion-label>Third Accordion</ion-label>
-                </ion-item>
-                <div class="ion-padding" slot="content">Third Content</div>
-              </ion-accordion>
-            </ion-accordion-group>
-          </div>
-          <div class="grid-item">
-            <ion-accordion-group disabled="true">
-              <ion-accordion value="first">
-                <ion-item slot="header" color="light">
-                  <ion-label>First Accordion in Disabled Group</ion-label>
-                </ion-item>
-                <div class="ion-padding" slot="content">First Content</div>
-              </ion-accordion>
-              <ion-accordion value="second">
-                <ion-item slot="header" color="light">
-                  <ion-label>Second Accordion in Disabled Group</ion-label>
-                </ion-item>
-                <div class="ion-padding" slot="content">Second Content</div>
-              </ion-accordion>
-              <ion-accordion value="third">
-                <ion-item slot="header" color="light">
-                  <ion-label>Third Accordion in Disabled Group</ion-label>
-                </ion-item>
-                <div class="ion-padding" slot="content">Third Content</div>
-              </ion-accordion>
-            </ion-accordion-group>
-          </div>
-          <div class="grid-item">
-            <ion-accordion value="second" disabled="true">
-              <ion-item slot="header" color="light">
-                <ion-label>Accordion Without Group (Disabled)</ion-label>
-              </ion-item>
-              <div class="ion-padding" slot="content">Second Content</div>
-            </ion-accordion>
-          </div>
-        </div>
-      </ion-content>
-    </ion-app>
-  </body>
-</html>

core/src/components/accordion/test/readonly/accordion.e2e.ts

@@ -1,137 +0,0 @@
-import { expect } from '@playwright/test';
-import { configs, test } from '@utils/test/playwright';
-
-// NOTE: these tests cannot be re-written as spec tests because the `getAccordions` method in accordion-group.tsx uses a `:scope` selector
-configs({ modes: ['md'], directions: ['ltr'] }).forEach(({ config, title }) => {
-  test.describe(title('accordion: readonly'), () => {
-    test('should properly set readonly on child accordions', async ({ page }) => {
-      await page.setContent(
-        `
-      <ion-accordion-group animated="false">
-        <ion-accordion>
-          <ion-item slot="header">Label</ion-item>
-          <div slot="content">Content</div>
-        </ion-accordion>
-      </ion-accordion-group>
-    `,
-        config
-      );
-
-      const accordionGroup = page.locator('ion-accordion-group');
-      const accordion = page.locator('ion-accordion');
-
-      await expect(accordion).toHaveJSProperty('readonly', false);
-
-      await accordionGroup.evaluate((el: HTMLIonAccordionGroupElement) => {
-        el.readonly = true;
-      });
-
-      await page.waitForChanges();
-
-      await expect(accordion).toHaveJSProperty('readonly', true);
-    });
-
-    test('should not open accordion on click when group is readonly', async ({ page }) => {
-      await page.setContent(
-        `
-      <ion-accordion-group animated="false" readonly>
-        <ion-accordion>
-          <ion-item slot="header">Label</ion-item>
-          <div slot="content">Content</div>
-        </ion-accordion>
-      </ion-accordion-group>
-    `,
-        config
-      );
-
-      const accordion = page.locator('ion-accordion');
-
-      await expect(accordion).toHaveClass(/accordion-collapsed/);
-
-      accordion.click();
-      await page.waitForChanges();
-
-      await expect(accordion).toHaveClass(/accordion-collapsed/);
-    });
-
-    test('should not open accordion on click when accordion is readonly', async ({ page }) => {
-      await page.setContent(
-        `
-      <ion-accordion-group animated="false">
-        <ion-accordion readonly>
-          <ion-item slot="header">Label</ion-item>
-          <div slot="content">Content</div>
-        </ion-accordion>
-      </ion-accordion-group>
-    `,
-        config
-      );
-
-      const accordion = page.locator('ion-accordion');
-
-      await expect(accordion).toHaveClass(/accordion-collapsed/);
-
-      accordion.click();
-      await page.waitForChanges();
-
-      await expect(accordion).toHaveClass(/accordion-collapsed/);
-    });
-
-    test('should not open accordion via keyboard navigation when group is readonly', async ({ page, browserName }) => {
-      await page.setContent(
-        `
-      <ion-accordion-group animated="false" readonly>
-        <ion-accordion>
-          <ion-item slot="header">Label</ion-item>
-          <div slot="content">Content</div>
-        </ion-accordion>
-      </ion-accordion-group>
-    `,
-        config
-      );
-
-      const accordion = page.locator('ion-accordion');
-      const tabKey = browserName === 'webkit' ? 'Alt+Tab' : 'Tab';
-
-      await expect(accordion).toHaveClass(/accordion-collapsed/);
-
-      await page.keyboard.press(tabKey);
-      await page.waitForChanges();
-
-      await page.keyboard.press('Enter');
-      await page.waitForChanges();
-
-      await expect(accordion).toHaveClass(/accordion-collapsed/);
-    });
-
-    test('should not open accordion via keyboard navigation when accordion is readonly', async ({
-      page,
-      browserName,
-    }) => {
-      await page.setContent(
-        `
-      <ion-accordion-group animated="false">
-        <ion-accordion readonly>
-          <ion-item slot="header">Label</ion-item>
-          <div slot="content">Content</div>
-        </ion-accordion>
-      </ion-accordion-group>
-    `,
-        config
-      );
-
-      const accordion = page.locator('ion-accordion');
-      const tabKey = browserName === 'webkit' ? 'Alt+Tab' : 'Tab';
-
-      await expect(accordion).toHaveClass(/accordion-collapsed/);
-
-      await page.keyboard.press(tabKey);
-      await page.waitForChanges();
-
-      await page.keyboard.press('Enter');
-      await page.waitForChanges();
-
-      await expect(accordion).toHaveClass(/accordion-collapsed/);
-    });
-  });
-});

core/src/components/accordion/test/readonly/index.html

@@ -1,91 +0,0 @@
-<!DOCTYPE html>
-<html lang="en" dir="ltr">
-  <head>
-    <meta charset="UTF-8" />
-    <title>Accordion - Readonly</title>
-    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0" />
-    <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>
-    <style>
-      .grid {
-        display: grid;
-        grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
-        grid-row-gap: 20px;
-        grid-column-gap: 20px;
-      }
-    </style>
-  </head>
-  <body>
-    <ion-app>
-      <ion-header translucent="true">
-        <ion-toolbar>
-          <ion-title>Accordion - Readonly</ion-title>
-        </ion-toolbar>
-      </ion-header>
-      <ion-content fullscreen="true" color="light">
-        <ion-header collapse="condense">
-          <ion-toolbar color="light">
-            <ion-title size="large">Accordion - Readonly</ion-title>
-          </ion-toolbar>
-        </ion-header>
-
-        <div class="grid ion-padding">
-          <div class="grid-item">
-            <ion-accordion-group>
-              <ion-accordion value="first">
-                <ion-item slot="header" color="light">
-                  <ion-label>First Accordion</ion-label>
-                </ion-item>
-                <div class="ion-padding" slot="content">First Content</div>
-              </ion-accordion>
-              <ion-accordion value="second" readonly="true">
-                <ion-item slot="header" color="light">
-                  <ion-label>Second Accordion (Readonly)</ion-label>
-                </ion-item>
-                <div class="ion-padding" slot="content">Second Content</div>
-              </ion-accordion>
-              <ion-accordion value="third">
-                <ion-item slot="header" color="light">
-                  <ion-label>Third Accordion</ion-label>
-                </ion-item>
-                <div class="ion-padding" slot="content">Third Content</div>
-              </ion-accordion>
-            </ion-accordion-group>
-          </div>
-          <div class="grid-item">
-            <ion-accordion-group readonly="true">
-              <ion-accordion value="first">
-                <ion-item slot="header" color="light">
-                  <ion-label>First Accordion in Readonly Group</ion-label>
-                </ion-item>
-                <div class="ion-padding" slot="content">First Content</div>
-              </ion-accordion>
-              <ion-accordion value="second">
-                <ion-item slot="header" color="light">
-                  <ion-label>Second Accordion in Readonly Group</ion-label>
-                </ion-item>
-                <div class="ion-padding" slot="content">Second Content</div>
-              </ion-accordion>
-              <ion-accordion value="third">
-                <ion-item slot="header" color="light">
-                  <ion-label>Third Accordion in Readonly Group</ion-label>
-                </ion-item>
-                <div class="ion-padding" slot="content">Third Content</div>
-              </ion-accordion>
-            </ion-accordion-group>
-          </div>
-          <div class="grid-item">
-            <ion-accordion value="second" readonly="true">
-              <ion-item slot="header" color="light">
-                <ion-label>Accordion Without Group (Readonly)</ion-label>
-              </ion-item>
-              <div class="ion-padding" slot="content">Second Content</div>
-            </ion-accordion>
-          </div>
-        </div>
-      </ion-content>
-    </ion-app>
-  </body>
-</html>

core/src/components/action-sheet/action-sheet-interface.ts

@@ -1,4 +1,4 @@
-import type { AnimationBuilder, LiteralUnion, Mode } from '../../interface';
+import type { AnimationBuilder, Mode } from '../../interface';
 
 export interface ActionSheetOptions {
   header?: string;
@@ -19,11 +19,10 @@ export interface ActionSheetOptions {
 
 export interface ActionSheetButton<T = any> {
   text?: string;
-  role?: LiteralUnion<'cancel' | 'destructive' | 'selected', string>;
+  role?: 'cancel' | 'destructive' | 'selected' | string;
   icon?: string;
   cssClass?: string | string[];
   id?: string;
-  htmlAttributes?: { [key: string]: any };
   handler?: () => boolean | void | Promise<boolean | void>;
   data?: T;
 }

core/src/components/action-sheet/action-sheet.ios.scss

@@ -26,24 +26,7 @@
 // ---------------------------------------------------
 
 .action-sheet-wrapper {
-  @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;
+  @include margin(var(--ion-safe-area-top, 0), auto, var(--ion-safe-area-bottom, 0), auto);
 }
 
 // iOS Action Sheet Container
@@ -148,11 +131,11 @@
 .action-sheet-button {
   @include padding($action-sheet-ios-button-padding);
 
-  min-height: $action-sheet-ios-button-height;
+  height: $action-sheet-ios-button-height;
 
   font-size: $action-sheet-ios-button-font-size;
 
-  contain: content;
+  contain: strict;
 }
 
 .action-sheet-button .action-sheet-icon {

core/src/components/action-sheet/action-sheet.ios.vars.scss

@@ -50,7 +50,7 @@ $action-sheet-ios-title-padding-start:                            $action-sheet-
 $action-sheet-ios-title-color:                                    $text-color-step-600 !default;
 
 /// @prop - Font size of the action sheet title
-$action-sheet-ios-title-font-size:                                dynamic-font-min(1, 13px) !default;
+$action-sheet-ios-title-font-size:                                13px !default;
 
 /// @prop - Font weight of the action sheet title
 $action-sheet-ios-title-font-weight:                              400 !default;
@@ -58,11 +58,24 @@ $action-sheet-ios-title-font-weight:                              400 !default;
 /// @prop - Font weight of the action sheet title when it has a sub title
 $action-sheet-ios-title-with-sub-title-font-weight:               600 !default;
 
+/// @prop - Border width of the action sheet title
+$action-sheet-ios-title-border-width:                             $hairlines-width !default;
+
+/// @prop - Border style of the action sheet title
+$action-sheet-ios-title-border-style:                             solid !default;
+
+/// @prop - Border color alpha of the action sheet title
+$action-sheet-ios-title-border-color-alpha:                       .08 !default;
+
+/// @prop - Border color of the action sheet title
+$action-sheet-ios-title-border-color:                             rgba($text-color-rgb, $action-sheet-ios-title-border-color-alpha) !default;
+
+
 // Action Sheet Subtitle
 // --------------------------------------------------
 
 /// @prop - Font size of the action sheet sub title
-$action-sheet-ios-sub-title-font-size:                            dynamic-font-min(1, 13px) !default;
+$action-sheet-ios-sub-title-font-size:                            13px !default;
 
 /// @prop - Padding top of the action sheet sub title
 $action-sheet-ios-sub-title-padding-top:                          6px !default;
@@ -84,19 +97,19 @@ $action-sheet-ios-sub-title-padding-start:                        $action-sheet-
 $action-sheet-ios-button-height:                                  56px !default;
 
 /// @prop - Padding of the action sheet button
-$action-sheet-ios-button-padding:                                 14px !default;
+$action-sheet-ios-button-padding:                                 18px !default;
 
 /// @prop - Text color of the action sheet button
 $action-sheet-ios-button-text-color:                              ion-color(primary, base) !default;
 
 /// @prop - Font size of the action sheet button icon
-$action-sheet-ios-button-icon-font-size:                          dynamic-font-min(1, 28px) !default;
+$action-sheet-ios-button-icon-font-size:                          28px !default;
 
 /// @prop - Padding right of the action sheet button icon
 $action-sheet-ios-button-icon-padding-right:                      .3em !default;
 
 /// @prop - Font size of the action sheet button
-$action-sheet-ios-button-font-size:                               dynamic-font-min(1, 20px) !default;
+$action-sheet-ios-button-font-size:                               20px !default;
 
 /// @prop - Border color alpha of the action sheet button
 $action-sheet-ios-button-border-color-alpha:                      .08 !default;
@@ -116,6 +129,9 @@ $action-sheet-ios-button-background-selected:                     var(--ion-colo
 /// @prop - Destructive text color of the action sheet button
 $action-sheet-ios-button-destructive-text-color:                  ion-color(danger, base) !default;
 
+/// @prop - Background color of the action sheet cancel button
+$action-sheet-ios-button-cancel-background:                       $background-color !default;
+
 /// @prop - Font weight of the action sheet cancel button
 $action-sheet-ios-button-cancel-font-weight:                      600 !default;
 

core/src/components/action-sheet/action-sheet.md.scss

@@ -67,13 +67,13 @@
 
   position: relative;
 
-  min-height: $action-sheet-md-button-height;
+  height: $action-sheet-md-button-height;
 
   font-size: $action-sheet-md-button-font-size;
 
   text-align: $action-sheet-md-text-align;
 
-  contain: content;
+  contain: strict;
   overflow: hidden;
 }
 

core/src/components/action-sheet/action-sheet.md.vars.scss

@@ -26,7 +26,7 @@ $action-sheet-md-title-height:                          60px !default;
 $action-sheet-md-title-color:                           rgba($text-color-rgb, 0.54) !default;
 
 /// @prop - Font size of the action sheet title
-$action-sheet-md-title-font-size:                       dynamic-font(16px) !default;
+$action-sheet-md-title-font-size:                       16px !default;
 
 /// @prop - Padding top of the action sheet title
 $action-sheet-md-title-padding-top:                     20px !default;
@@ -45,7 +45,7 @@ $action-sheet-md-title-padding-start:                   $action-sheet-md-title-p
 // --------------------------------------------------
 
 /// @prop - Font size of the action sheet sub title
-$action-sheet-md-sub-title-font-size:                   dynamic-font(14px) !default;
+$action-sheet-md-sub-title-font-size:                   14px !default;
 
 /// @prop - Padding top of the action sheet sub title
 $action-sheet-md-sub-title-padding-top:                 16px !default;
@@ -70,10 +70,10 @@ $action-sheet-md-button-height:                         52px !default;
 $action-sheet-md-button-text-color:                     $text-color-step-150 !default;
 
 /// @prop - Font size of the action sheet button
-$action-sheet-md-button-font-size:                      dynamic-font(16px) !default;
+$action-sheet-md-button-font-size:                      16px !default;
 
 /// @prop - Padding top of the action sheet button
-$action-sheet-md-button-padding-top:                    12px !default;
+$action-sheet-md-button-padding-top:                    0 !default;
 
 /// @prop - Padding end of the action sheet button
 $action-sheet-md-button-padding-end:                    16px !default;
@@ -84,11 +84,14 @@ $action-sheet-md-button-padding-bottom:                 $action-sheet-md-button-
 /// @prop - Padding start of the action sheet button
 $action-sheet-md-button-padding-start:                  $action-sheet-md-button-padding-end !default;
 
+/// @prop - Background color of the action sheet button
+$action-sheet-md-button-background:                     transparent !default;
+
 // Action Sheet Icon
 // --------------------------------------------------
 
 /// @prop - Font size of the icon in the action sheet button
-$action-sheet-md-icon-font-size:                        dynamic-font(24px) !default;
+$action-sheet-md-icon-font-size:                        24px !default;
 
 /// @prop - Margin top of the icon in the action sheet button
 $action-sheet-md-icon-margin-top:                       0 !default;
@@ -101,3 +104,6 @@ $action-sheet-md-icon-margin-bottom:                    0 !default;
 
 /// @prop - Margin start of the icon in the action sheet button
 $action-sheet-md-icon-margin-start:                     0 !default;
+
+/// @prop - Color of the icon in the action sheet button
+$action-sheet-md-icon-color:                            $action-sheet-md-title-color !default;

core/src/components/action-sheet/action-sheet.scss

@@ -126,10 +126,7 @@
   justify-content: flex-end;
 
   height: 100%;
-
-  /* Fallback for browsers that do not support dvh */
-  max-height: calc(100vh - (var(--ion-safe-area-top, 0) + var(--ion-safe-area-bottom, 0)));
-  max-height: calc(100dvh - (var(--ion-safe-area-top, 0) + var(--ion-safe-area-bottom, 0)));
+  max-height: 100vh;
 }
 
 .action-sheet-group {
@@ -142,22 +139,8 @@
   background: var(--background);
 }
 
-/**
-  * Scrollbars on mobile devices will be hidden.
-  * Users can still scroll the content by swiping.
-  * If a user has a fine pointing device, such as a
-  * mouse or trackpad, then scrollbars will be
-  * visible. This allows users to scroll the
-  * content with their pointing device.
-  * Otherwise, the user would have to use the
-  * keyboard to navigate through the options.
-  * This may not be intuitive for users who
-  * are not familiar with keyboard navigation.
-  */
-@media (any-pointer: coarse) {
-  .action-sheet-group::-webkit-scrollbar {
-    display: none;
-  }
+.action-sheet-group::-webkit-scrollbar {
+  display: none;
 }
 
 .action-sheet-group-cancel {

core/src/components/action-sheet/action-sheet.tsx

@@ -2,8 +2,6 @@ import type { ComponentInterface, EventEmitter } from '@stencil/core';
 import { Watch, Component, Element, Event, Host, Method, Prop, h, readTask } from '@stencil/core';
 import type { Gesture } from '@utils/gesture';
 import { createButtonActiveGesture } from '@utils/gesture/button-active';
-import { raf } from '@utils/helpers';
-import { createLockController } from '@utils/lock-controller';
 import {
   BACKDROP,
   createDelegateController,
@@ -41,8 +39,8 @@ import { mdLeaveAnimation } from './animations/md.leave';
 })
 export class ActionSheet implements ComponentInterface, OverlayInterface {
   private readonly delegateController = createDelegateController(this);
-  private readonly lockController = createLockController();
   private readonly triggerController = createTriggerController();
+  private currentTransition?: Promise<any>;
   private wrapperEl?: HTMLElement;
   private groupEl?: HTMLElement;
   private gesture?: Gesture;
@@ -199,13 +197,25 @@ export class ActionSheet implements ComponentInterface, OverlayInterface {
    */
   @Method()
   async present(): Promise<void> {
-    const unlock = await this.lockController.lock();
+    /**
+     * When using an inline action sheet
+     * and dismissing a action sheet it is possible to
+     * quickly present the action sheet while it is
+     * dismissing. We need to await any current
+     * transition to allow the dismiss to finish
+     * before presenting again.
+     */
+    if (this.currentTransition !== undefined) {
+      await this.currentTransition;
+    }
 
     await this.delegateController.attachViewToDom();
 
-    await present(this, 'actionSheetEnter', iosEnterAnimation, mdEnterAnimation);
+    this.currentTransition = present(this, 'actionSheetEnter', iosEnterAnimation, mdEnterAnimation);
 
-    unlock();
+    await this.currentTransition;
+
+    this.currentTransition = undefined;
   }
 
   /**
@@ -216,23 +226,16 @@ 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> {
-    const unlock = await this.lockController.lock();
-
-    const dismissed = await dismiss(this, data, role, 'actionSheetLeave', iosLeaveAnimation, mdLeaveAnimation);
+    this.currentTransition = dismiss(this, data, role, 'actionSheetLeave', iosLeaveAnimation, mdLeaveAnimation);
+    const dismissed = await this.currentTransition;
 
     if (dismissed) {
       this.delegateController.removeViewFromDom();
     }
 
-    unlock();
-
     return dismissed;
   }
 
@@ -315,43 +318,25 @@ export class ActionSheet implements ComponentInterface, OverlayInterface {
 
   componentDidLoad() {
     /**
-     * Only create gesture if:
-     * 1. A gesture does not already exist
-     * 2. App is running in iOS mode
-     * 3. A wrapper ref exists
-     * 4. A group ref exists
+     * Do not create gesture if:
+     * 1. A gesture already exists
+     * 2. App is running in MD mode
+     * 3. A wrapper ref does not exist
      */
     const { groupEl, wrapperEl } = this;
-    if (!this.gesture && getIonMode(this) === 'ios' && wrapperEl && groupEl) {
-      readTask(() => {
-        const isScrollable = groupEl.scrollHeight > groupEl.clientHeight;
-        if (!isScrollable) {
-          this.gesture = createButtonActiveGesture(wrapperEl, (refEl: HTMLElement) =>
-            refEl.classList.contains('action-sheet-button')
-          );
-          this.gesture.enable(true);
-        }
-      });
+    if (this.gesture || getIonMode(this) === 'md' || !wrapperEl || !groupEl) {
+      return;
     }
 
-    /**
-     * If action sheet was rendered with isOpen="true"
-     * then we should open action sheet immediately.
-     */
-    if (this.isOpen === true) {
-      raf(() => this.present());
-    }
-
-    /**
-     * When binding values in frameworks such as Angular
-     * it is possible for the value to be set after the Web Component
-     * initializes but before the value watcher is set up in Stencil.
-     * As a result, the watcher callback may not be fired.
-     * We work around this by manually calling the watcher
-     * callback when the component has loaded and the watcher
-     * is configured.
-     */
-    this.triggerChanged();
+    readTask(() => {
+      const isScrollable = groupEl.scrollHeight > groupEl.clientHeight;
+      if (!isScrollable) {
+        this.gesture = createButtonActiveGesture(wrapperEl, (refEl: HTMLElement) =>
+          refEl.classList.contains('action-sheet-button')
+        );
+        this.gesture.enable(true);
+      }
+    });
   }
 
   render() {
@@ -401,13 +386,7 @@ export class ActionSheet implements ComponentInterface, OverlayInterface {
                 </div>
               )}
               {buttons.map((b) => (
-                <button
-                  {...b.htmlAttributes}
-                  type="button"
-                  id={b.id}
-                  class={buttonClass(b)}
-                  onClick={() => this.buttonClick(b)}
-                >
+                <button type="button" id={b.id} class={buttonClass(b)} onClick={() => this.buttonClick(b)}>
                   <span class="action-sheet-button-inner">
                     {b.icon && <ion-icon icon={b.icon} aria-hidden="true" lazy={false} class="action-sheet-icon" />}
                     {b.text}
@@ -419,12 +398,7 @@ export class ActionSheet implements ComponentInterface, OverlayInterface {
 
             {cancelButton && (
               <div class="action-sheet-group action-sheet-group-cancel">
-                <button
-                  {...cancelButton.htmlAttributes}
-                  type="button"
-                  class={buttonClass(cancelButton)}
-                  onClick={() => this.buttonClick(cancelButton)}
-                >
+                <button type="button" class={buttonClass(cancelButton)} onClick={() => this.buttonClick(cancelButton)}>
                   <span class="action-sheet-button-inner">
                     {cancelButton.icon && (
                       <ion-icon icon={cancelButton.icon} aria-hidden="true" lazy={false} class="action-sheet-icon" />

core/src/components/action-sheet/test/a11y/action-sheet.e2e.ts

@@ -10,36 +10,16 @@ const testAria = async (page: E2EPage, buttonID: string, expectedAriaLabelledBy:
   await button.click();
   await didPresent.next();
 
-  const actionSheet = page.locator('ion-action-sheet');
+  const alert = page.locator('ion-action-sheet');
 
   /**
    * expect().toHaveAttribute() can't check for a null value, so grab and check
    * the value manually instead.
    */
-  const ariaLabelledBy = await actionSheet.getAttribute('aria-labelledby');
+  const ariaLabelledBy = await alert.getAttribute('aria-labelledby');
 
   expect(ariaLabelledBy).toBe(expectedAriaLabelledBy);
 };
-
-const testAriaButton = async (
-  page: E2EPage,
-  buttonID: string,
-  expectedAriaLabelledBy: string,
-  expectedAriaLabel: string
-) => {
-  const didPresent = await page.spyOnEvent('ionActionSheetDidPresent');
-
-  const button = page.locator(`#${buttonID}`);
-  await button.click();
-
-  await didPresent.next();
-
-  const actionSheetButton = page.locator('ion-action-sheet .action-sheet-button');
-
-  await expect(actionSheetButton).toHaveAttribute('aria-labelledby', expectedAriaLabelledBy);
-  await expect(actionSheetButton).toHaveAttribute('aria-label', expectedAriaLabel);
-};
-
 configs({ directions: ['ltr'] }).forEach(({ config, title }) => {
   test.describe(title('action-sheet: a11y'), () => {
     test.beforeEach(async ({ page }) => {
@@ -72,51 +52,5 @@ configs({ directions: ['ltr'] }).forEach(({ config, title }) => {
     test('should allow for manually specifying aria attributes', async ({ page }) => {
       await testAria(page, 'customAria', 'Custom title');
     });
-
-    test('should have aria-labelledby and aria-label added to the button when htmlAttributes is set', async ({
-      page,
-    }) => {
-      await testAriaButton(page, 'ariaLabelButton', 'close-label', 'close button');
-    });
-
-    test('should have aria-labelledby and aria-label added to the cancel button when htmlAttributes is set', async ({
-      page,
-    }) => {
-      await testAriaButton(page, 'ariaLabelCancelButton', 'cancel-label', 'cancel button');
-    });
-  });
-});
-
-configs({ directions: ['ltr'] }).forEach(({ title, screenshot, config }) => {
-  test.describe(title('action-sheet: font scaling'), () => {
-    test('should scale text on larger font sizes', async ({ page }) => {
-      await page.setContent(
-        `
-        <style>
-          html {
-            font-size: 36px;
-          }
-        </style>
-
-        <ion-action-sheet></ion-action-sheet>
-
-        <script>
-          const actionSheet = document.querySelector('ion-action-sheet');
-          actionSheet.header = 'Header';
-          actionSheet.subHeader = 'Sub Header';
-          actionSheet.buttons = ['Ok', { role: 'cancel', text: 'Cancel' }];
-        </script>
-      `,
-        config
-      );
-
-      const ionActionSheetDidPresent = await page.spyOnEvent('ionActionSheetDidPresent');
-      const actionSheet = page.locator('ion-action-sheet');
-
-      await actionSheet.evaluate((el: HTMLIonActionSheetElement) => el.present());
-      await ionActionSheetDidPresent.next();
-
-      await expect(actionSheet).toHaveScreenshot(screenshot(`action-sheet-scale`));
-    });
   });
 });

core/src/components/action-sheet/test/a11y/index.html

@@ -19,14 +19,10 @@
     <main class="ion-padding">
       <h1>Action Sheet - A11y</h1>
 
-      <ion-button id="bothHeaders" onclick="presentBothHeaders()">Both Headers</ion-button>
-      <ion-button id="subHeaderOnly" onclick="presentSubHeaderOnly()">Subheader Only</ion-button>
-      <ion-button id="noHeaders" onclick="presentNoHeaders()">No Headers</ion-button>
-      <ion-button id="customAria" onclick="presentCustomAria()">Custom Aria</ion-button>
-      <ion-button id="ariaLabelButton" onclick="presentAriaLabelButton()">Aria Label Button</ion-button>
-      <ion-button id="ariaLabelCancelButton" onclick="presentAriaLabelCancelButton()"
-        >Aria Label Cancel Button</ion-button
-      >
+      <ion-button id="bothHeaders" expand="block" onclick="presentBothHeaders()">Both Headers</ion-button>
+      <ion-button id="subHeaderOnly" expand="block" onclick="presentSubHeaderOnly()">Subheader Only</ion-button>
+      <ion-button id="noHeaders" expand="block" onclick="presentNoHeaders()">No Headers</ion-button>
+      <ion-button id="customAria" expand="block" onclick="presentCustomAria()">Custom Aria</ion-button>
     </main>
 
     <script>
@@ -67,39 +63,6 @@
           },
         });
       }
-
-      function presentAriaLabelButton() {
-        openActionSheet({
-          header: 'Header',
-          subHeader: 'Subtitle',
-          buttons: [
-            {
-              text: 'Close',
-              htmlAttributes: {
-                'aria-label': 'close button',
-                'aria-labelledby': 'close-label',
-              },
-            },
-          ],
-        });
-      }
-
-      function presentAriaLabelCancelButton() {
-        openActionSheet({
-          header: 'Header',
-          subHeader: 'Subtitle',
-          buttons: [
-            {
-              text: 'Cancel',
-              role: 'cancel',
-              htmlAttributes: {
-                'aria-label': 'cancel button',
-                'aria-labelledby': 'cancel-label',
-              },
-            },
-          ],
-        });
-      }
     </script>
   </body>
 </html>

core/src/components/action-sheet/test/basic/action-sheet.e2e.ts

@@ -100,69 +100,3 @@ configs({ modes: ['ios'], directions: ['ltr'] }).forEach(({ config, title }) =>
     });
   });
 });
-
-/**
- * This behavior needs to be tested in both modes but does not vary
- * across directions due to the component only applying safe area
- * to the top and bottom
- */
-configs({ directions: ['ltr'] }).forEach(({ title, screenshot, config }) => {
-  test.describe(title('action-sheet: basic'), () => {
-    test.describe('safe area', () => {
-      test('should have padding added by the safe area', async ({ page }, testInfo) => {
-        testInfo.annotations.push({
-          type: 'issue',
-          description: 'https://github.com/ionic-team/ionic-framework/issues/27777',
-        });
-        await page.setContent(
-          `
-          <style>
-            :root {
-              --ion-safe-area-top: 60px;
-              --ion-safe-area-bottom: 40px;
-            }
-          </style>
-
-          <ion-action-sheet></ion-action-sheet>
-
-          <script>
-            const actionSheet = document.querySelector('ion-action-sheet');
-            actionSheet.header = 'Header';
-            actionSheet.subHeader = 'Sub Header';
-            actionSheet.buttons = [
-              'Add Reaction',
-              'Copy Text',
-              'Share Text',
-              'Copy Link to Message',
-              'Remind Me',
-              'Pin File',
-              'Star File',
-              'Mark Unread',
-              'Mark Read',
-              'Edit Title',
-              'Erase Title',
-              'Save Image',
-              'Copy Image',
-              'Erase Image',
-              'Delete File',
-              {
-                text: 'Cancel',
-                role: 'cancel'
-              },
-            ];
-          </script>
-        `,
-          config
-        );
-
-        const ionActionSheetDidPresent = await page.spyOnEvent('ionActionSheetDidPresent');
-        const actionSheet = page.locator('ion-action-sheet');
-
-        await actionSheet.evaluate((el: HTMLIonActionSheetElement) => el.present());
-        await ionActionSheetDidPresent.next();
-
-        await expect(actionSheet).toHaveScreenshot(screenshot(`action-sheet-safe-area`));
-      });
-    });
-  });
-});

core/src/components/action-sheet/test/basic/action-sheet.spec.tsx

@@ -7,17 +7,10 @@ describe('action sheet: htmlAttributes inheritance', () => {
   it('should correctly inherit attributes on host', async () => {
     const page = await newSpecPage({
       components: [ActionSheet],
-      template: () => (
-        <ion-action-sheet
-          htmlAttributes={{
-            'data-testid': 'basic-action-sheet',
-          }}
-          overlayIndex={1}
-        ></ion-action-sheet>
-      ),
+      template: () => <ion-action-sheet htmlAttributes={{ 'data-testid': 'basic-action-sheet' }}></ion-action-sheet>,
     });
 
-    const actionSheet = page.body.querySelector('ion-action-sheet')!;
+    const actionSheet = page.body.querySelector('ion-action-sheet');
 
     await expect(actionSheet.getAttribute('data-testid')).toBe('basic-action-sheet');
   });

core/src/components/action-sheet/test/is-open/action-sheet.e2e.ts

@@ -30,10 +30,5 @@ configs({ directions: ['ltr'], modes: ['ios'] }).forEach(({ config, title }) =>
 
       await expect(actionSheet).toBeHidden();
     });
-
-    test('should open if isOpen is true on load', async ({ page }) => {
-      await page.setContent('<ion-action-sheet is-open="true"></ion-action-sheet>', config);
-      await expect(page.locator('ion-action-sheet')).toBeVisible();
-    });
   });
 });

core/src/components/alert/alert-interface.ts

@@ -1,4 +1,4 @@
-import type { AnimationBuilder, LiteralUnion, Mode, TextFieldTypes } from '../../interface';
+import type { AnimationBuilder, Mode, TextFieldTypes } from '../../interface';
 import type { IonicSafeString } from '../../utils/sanitization';
 
 export interface AlertOptions {
@@ -45,10 +45,9 @@ type AlertButtonOverlayHandler = boolean | void | { [key: string]: any };
 
 export interface AlertButton {
   text: string;
-  role?: LiteralUnion<'cancel' | 'destructive', string>;
+  role?: 'cancel' | 'destructive' | string;
   cssClass?: string | string[];
   id?: string;
-  htmlAttributes?: { [key: string]: any };
   // TODO(FW-2832): type
   handler?: (value: any) => AlertButtonOverlayHandler | Promise<AlertButtonOverlayHandler>;
 }