mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2026-03-13 10:22:08 +08:00
e2cbc9c15fbc1c24993267cb0acb56db69cac8ac
4022 Commits
| Author | SHA1 | Message | Date | |
|---|---|---|---|---|
dependabot[bot]
|
e2cbc9c15f |
chore(deps): Bump @stencil/core from 4.8.0 to 4.8.1 in /core (#28632)
Bumps [@stencil/core](https://github.com/ionic-team/stencil) from 4.8.0 to 4.8.1. <details> <summary>Release notes</summary> <p><em>Sourced from <a href="https://github.com/ionic-team/stencil/releases"><code>@stencil/core</code>'s releases</a>.</em></p> <blockquote> <h2>🍹 v4.8.1 (2023-12-04)</h2> <h3>Bug Fixes</h3> <ul> <li><strong>runtime:</strong> apply nonce to data styles before DOM insert (<a href="https://redirect.github.com/ionic-team/stencil/issues/5112">#5112</a>) (<a href=" |
||
|
Shawn Taylor
|
fe3c3d500a |
docs(input, searchbar, textarea): improve docs for managing focus (#28614)
Issue number: Related to #18132 --------- <!-- Please do not submit updates to dependencies unless it fixes an issue. --> <!-- Please try to limit your pull request to one type (bugfix, feature, etc). Submit multiple pull requests if needed. --> ## What is the current behavior? <!-- Please describe the current behavior that you are modifying. --> The documentation about the `autofocus` prop is unclear and does not accurately reflect how it actually works across browsers and devices. ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - The documentation for `autofocus` and `setFocus` are more detailed. - The documentation links to the relevant page in the docs. ## Does this introduce a breaking change? - [ ] Yes - [x] No <!-- If this introduces a breaking change, please describe the impact and migration path for existing applications below. --> ## Other information <!-- Any other information that is important to this PR such as screenshots of how the component looks before and after the change. --> |
||
|
Liam DeBeasi
|
a3cd204f61 |
fix(overlays): trigger is configured on load (#28526)
Issue number: resolves #28524 --------- <!-- Please do not submit updates to dependencies unless it fixes an issue. --> <!-- Please try to limit your pull request to one type (bugfix, feature, etc). Submit multiple pull requests if needed. --> ## What is the current behavior? <!-- Please describe the current behavior that you are modifying. --> Watchers in Stencil are constructed sometime between `connectedCallback` and `componentDidLoad`. If a property is set/changed during that time it is possible for the callback associated with the watcher to not fire because the watcher has not been setup yet. This is most often with `dist-custom-elements` and frameworks such as Angular when using a binding (i.e. `[trigger]` instead of `trigger`) ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - The trigger callback associated with the watcher is manually called in `componentDidLoad` for each overlay. ## Does this introduce a breaking change? - [ ] Yes - [x] No <!-- If this introduces a breaking change, please describe the impact and migration path for existing applications below. --> ## Other information <!-- Any other information that is important to this PR such as screenshots of how the component looks before and after the change. --> Dev build: `7.5.5-dev.11699974376.13a15397` Note: This is a timing related bug due to a behavior in Stencil, so I did not write automated tests. However, I manually verified that this issue a) reproduces on `main` and b) is fixed with this dev build for each overlay component. |
||
|
Sean Perkins
|
5c2a73b262 |
chore(playwright): dark mode support (#28593)
Issue number: N/A --------- <!-- Please do not submit updates to dependencies unless it fixes an issue. --> <!-- Please try to limit your pull request to one type (bugfix, feature, etc). Submit multiple pull requests if needed. --> ## What is the current behavior? <!-- Please describe the current behavior that you are modifying. --> Testing dark mode is manual per test in Playwright. Ionic developer needs to setup the variables and assign them to a selector that applies in the class. ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - The `.setContent` API will now work with a new config option to test dark mode automatically without additional configuration/test set-up. - Default theme is no theme (fallback theme) - Screenshot names and test titles remain the same for all existing tests. Only tests that opt into a theme will be pre-pended with `-dark` or `-light` (as an example for current themes). ## Does this introduce a breaking change? - [ ] Yes - [x] No <!-- If this introduces a breaking change, please describe the impact and migration path for existing applications below. --> ## Other information <!-- Any other information that is important to this PR such as screenshots of how the component looks before and after the change. --> |
||
|
dependabot[bot]
|
34417a5835 |
chore(deps): Bump @stencil/core from 4.7.2 to 4.8.0 in /core (#28586)
Bumps [@stencil/core](https://github.com/ionic-team/stencil) from 4.7.2 to 4.8.0. <details> <summary>Release notes</summary> <p><em>Sourced from <a href="https://github.com/ionic-team/stencil/releases"><code>@stencil/core</code>'s releases</a>.</em></p> <blockquote> <h2>🌞 v4.8.0 (2023-11-27)</h2> <h3>Bug Fixes</h3> <ul> <li><strong>hydrate:</strong> prevent dead code elimination of patch dom implementation (<a href="https://redirect.github.com/ionic-team/stencil/issues/4966">#4966</a>) (<a href=" |
||
|
ionitron
|
3a35fdd2f5 | v7.5.7 | ||
|
Sean Perkins
|
bd27846b28 |
chore(playwright): resolve axe violations with setContent (#28592)
Issue number: N/A --------- <!-- Please do not submit updates to dependencies unless it fixes an issue. --> <!-- Please try to limit your pull request to one type (bugfix, feature, etc). Submit multiple pull requests if needed. --> ## What is the current behavior? <!-- Please describe the current behavior that you are modifying. --> When using `.setContent`, the initial page template is lacking key metadata that will result in AXE violations. ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - Adds a default `lang` to the `html` document root - Adds a default `title` tag ## Does this introduce a breaking change? - [ ] Yes - [x] No <!-- If this introduces a breaking change, please describe the impact and migration path for existing applications below. --> ## Other information <!-- Any other information that is important to this PR such as screenshots of how the component looks before and after the change. --> |
||
|
Shawn Taylor
|
01130e12e1 |
fix(datetime): allow disabling datetime with prefer-wheel (#28511)
Issue number: Internal --------- <!-- Please do not submit updates to dependencies unless it fixes an issue. --> <!-- Please try to limit your pull request to one type (bugfix, feature, etc). Submit multiple pull requests if needed. --> ## What is the current behavior? <!-- Please describe the current behavior that you are modifying. --> It is possible to navigate the columns of a disabled Datetime with `prefer-wheel` via the keyboard. https://github.com/ionic-team/ionic-framework/assets/14926794/9c9dafc4-4b77-45a6-a276-70201c5c3ea5 ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - Picker Column Internal has a disabled state that disables the full column - When a Datetime is disabled with `prefer-wheel`, the columns in the Datetime will be disabled - It is no longer possible to navigate the wheels in a disabled Datetime via the keyboard Comparison of native & Ionic components:  ## Does this introduce a breaking change? - [ ] Yes - [x] No <!-- If this introduces a breaking change, please describe the impact and migration path for existing applications below. --> --------- Co-authored-by: ionitron <hi@ionicframework.com> Co-authored-by: Liam DeBeasi <liamdebeasi@users.noreply.github.com> |
||
|
Sean Perkins
|
b833f0e826 |
fix(alert): date inputs render correctly in mobile safari (#28495)
Issue number: resolves #28494 --------- <!-- Please do not submit updates to dependencies unless it fixes an issue. --> <!-- Please try to limit your pull request to one type (bugfix, feature, etc). Submit multiple pull requests if needed. --> ## What is the current behavior? <!-- Please describe the current behavior that you are modifying. --> The appearance of the input is being set to `none` which clears the browser appearance settings for height on the control. This results in the `<input type="date" />` to render without a height. ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - Minimum height is assigned to the alert input, forcing it to render at it's expected height - Date input renders correctly in Mobile Safari ## Does this introduce a breaking change? - [ ] Yes - [x] No <!-- If this introduces a breaking change, please describe the impact and migration path for existing applications below. --> ## Other information <!-- Any other information that is important to this PR such as screenshots of how the component looks before and after the change. --> We have screenshots for this component, but Playwright runs an emulation of Mobile Safari that does not reproduce this issue that is only present on device. There for we cannot write a test on this change. --------- Co-authored-by: ionitron <hi@ionicframework.com> |
||
|
ionitron
|
f6a740dce5 | v7.5.6 | ||
|
Liam DeBeasi
|
388d19e04f |
fix(datetime): updating value with min scrolls to new value (#28549)
Issue number: resolves #28548 --------- <!-- Please do not submit updates to dependencies unless it fixes an issue. --> <!-- Please try to limit your pull request to one type (bugfix, feature, etc). Submit multiple pull requests if needed. --> ## What is the current behavior? <!-- Please describe the current behavior that you are modifying. --> Datetime was not scrolling at all when the `value` prop was changed programmatically. This was due to some logic we had in `componentDidRender` to work around a WebKit bug which was causing the scroll position to be moved back to where it was prior to setting the `value` prop. This caused the scroll position to never move. ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - Datetime scrolls to the new value when `value` is updated programmatically even if `min` is set. ## Does this introduce a breaking change? - [ ] Yes - [x] No <!-- If this introduces a breaking change, please describe the impact and migration path for existing applications below. --> ## Other information <!-- Any other information that is important to this PR such as screenshots of how the component looks before and after the change. --> Dev build: `7.5.6-dev.11700169088.140f3e6a` Co-authored-by: amandaejohnston <amandaejohnston@users.noreply.github.com> |
||
|
Sean Perkins
|
4f1b4cdc29 |
chore(core): type checking for unit tests (#28529)
Issue number: N/A --------- <!-- Please do not submit updates to dependencies unless it fixes an issue. --> <!-- Please try to limit your pull request to one type (bugfix, feature, etc). Submit multiple pull requests if needed. --> ## What is the current behavior? <!-- Please describe the current behavior that you are modifying. --> Type checking inside of the Stencil unit tests have been disabled for a long time. This has resulted in a difficult developer experience and numerous issues (both types and implementation) within our unit tests. ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - Type checking is now enabled for all Stencil unit tests - Tests have been updated to resolve type errors and implementation errors - Many `as any` casts were introduced, as many legacy tests test invalid configurations of functions that require it (for example passing `undefined` to an argument that cannot be `undefined`). ## Does this introduce a breaking change? - [ ] Yes - [x] No <!-- If this introduces a breaking change, please describe the impact and migration path for existing applications below. --> ## Other information <!-- Any other information that is important to this PR such as screenshots of how the component looks before and after the change. --> To test this PR you can checkout the branch locally. Install dependencies in the `/core` directory to make sure you are on at least `@stencil/core@4.7.2`. Opening either a `.spec.ts` or `.spec.tsx` file, validate that your IDE detects types and can provide auto completions for jest global types. If you desire, you can provide an invalid type and try building the project - you will observe the build will fail due to the invalid type. |
||
|
Liam DeBeasi
|
6a2be9fa3c |
fix(alert): match MD spec on tablet (#28501)
Issue number: resolves #23977 --------- <!-- Please do not submit updates to dependencies unless it fixes an issue. --> <!-- Please try to limit your pull request to one type (bugfix, feature, etc). Submit multiple pull requests if needed. --> ## What is the current behavior? <!-- Please describe the current behavior that you are modifying. --> The MD Alert on tablet dimensions does not match the MD spec ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - MD Alert now follows the MD spec for tablet dimensions - Added tablet and mobile viewport mixins for alert and the card modal. (There should be no visual diffs for the card modal) ## Does this introduce a breaking change? - [ ] Yes - [x] No <!-- If this introduces a breaking change, please describe the impact and migration path for existing applications below. --> ## Other information <!-- Any other information that is important to this PR such as screenshots of how the component looks before and after the change. --> This supersedes https://github.com/ionic-team/ionic-framework/pull/27462 since I needed to add new screenshot tests. The author of that PR has been given co-author credit here. --------- Co-authored-by: GlenOttley <GlenOttley@users.noreply.github.com> Co-authored-by: ionitron <hi@ionicframework.com> Co-authored-by: Brandy Carney <brandyscarney@users.noreply.github.com> |
||
|
Liam DeBeasi
|
6dcf9cadb3 | chore: add note for Ionic Vue developers | ||
|
ionitron
|
78ce39f8c6 | v7.5.5 | ||
|
dependabot[bot]
|
ed80b7f118 |
chore(deps): Bump @stencil/core from 4.7.1 to 4.7.2 in /core (#28522)
Bumps [@stencil/core](https://github.com/ionic-team/stencil) from 4.7.1 to 4.7.2. <details> <summary>Release notes</summary> <p><em>Sourced from <a href="https://github.com/ionic-team/stencil/releases"><code>@stencil/core</code>'s releases</a>.</em></p> <blockquote> <h2>🐄 v4.7.2 (2023-11-13)</h2> <h3>Bug Fixes</h3> <ul> <li><strong>compiler:</strong> normalize paths on windows (<a href="https://redirect.github.com/ionic-team/stencil/issues/4997">#4997</a>) (<a href=" |
||
|
dependabot[bot]
|
83f9ac0fac |
chore(deps-dev): Bump @stencil/vue-output-target from 0.8.6 to 0.8.7 in /core (#28508)
Bumps [@stencil/vue-output-target](https://github.com/ionic-team/stencil-ds-output-targets) from 0.8.6 to 0.8.7. <details> <summary>Commits</summary> <ul> <li>See full diff in <a href="https://github.com/ionic-team/stencil-ds-output-targets/commits">compare view</a></li> </ul> </details> <br /> [](https://docs.github.com/en/github/managing-security-vulnerabilities/about-dependabot-security-updates#about-compatibility-scores) Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting `@dependabot rebase`. [//]: # (dependabot-automerge-start) [//]: # (dependabot-automerge-end) --- <details> <summary>Dependabot commands and options</summary> <br /> You can trigger Dependabot actions by commenting on this PR: - `@dependabot rebase` will rebase this PR - `@dependabot recreate` will recreate this PR, overwriting any edits that have been made to it - `@dependabot merge` will merge this PR after your CI passes on it - `@dependabot squash and merge` will squash and merge this PR after your CI passes on it - `@dependabot cancel merge` will cancel a previously requested merge and block automerging - `@dependabot reopen` will reopen this PR if it is closed - `@dependabot close` will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually - `@dependabot show <dependency name> ignore conditions` will show all of the ignore conditions of the specified dependency - `@dependabot ignore this major version` will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself) - `@dependabot ignore this minor version` will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself) - `@dependabot ignore this dependency` will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself) </details> --------- Signed-off-by: dependabot[bot] <support@github.com> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> Co-authored-by: Liam DeBeasi <liamdebeasi@users.noreply.github.com> |
||
|
Mohamed Ben Makhlouf
|
a000dd2c0b |
fix(accordion-group): correct accordion is open on load (#28510)
Issue number: resolves #28506
---------
<!-- Please do not submit updates to dependencies unless it fixes an
issue. -->
<!-- Please try to limit your pull request to one type (bugfix, feature,
etc). Submit multiple pull requests if needed. -->
## What is the current behavior?
<!-- Please describe the current behavior that you are modifying. -->
ion-accordion-group would not set the value when using it as a Angular
standalone component and data binding:
``` html
<ion-accordion-group #accordionGroup [value]="fromValue">
<ion-accordion value="turtles">
<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">
<ion-item slot="header" color="light">
<ion-label>Second Accordion</ion-label>
</ion-item>
<div class="ion-padding" slot="content">Second Content</div>
</ion-accordion>
</ion-accordion-group>
```
The problem here is Angular is setting the value of the accordion group
after the component has been initialized (but not loaded) and before the
component watchers are setup, so
[valueChanged](
|
||
|
Liam DeBeasi
|
342511959a |
chore(datetime): remove unused code (#28502)
Issue number: N/A --------- <!-- Please do not submit updates to dependencies unless it fixes an issue. --> <!-- Please try to limit your pull request to one type (bugfix, feature, etc). Submit multiple pull requests if needed. --> ## What is the current behavior? <!-- Please describe the current behavior that you are modifying. --> While evaluating step colors for high contrast themes I discovered that this code is not actually applied anywhere. ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - Remove unused code ## Does this introduce a breaking change? - [ ] Yes - [x] No <!-- If this introduces a breaking change, please describe the impact and migration path for existing applications below. --> ## Other information <!-- Any other information that is important to this PR such as screenshots of how the component looks before and after the change. --> |
||
|
Brandy Carney
|
900267eb36 |
fix(action-sheet): adjust height for safe area with scrollable options (#28504)
Issue number: fixes #27777 --------- ## What is the current behavior? When safe area (top/bottom) is applied to an action sheet with scrollable options and a cancel button, the cancel button is pushed off the screen and cannot be reached. ## What is the new behavior? Properly adjust the height of the action sheet container to account for the top and bottom safe area. ## Does this introduce a breaking change? - [ ] Yes - [x] No ## Other information The below screenshots use the following CSS when safe area is added so it is expected that the action sheet will adjust the top and bottom: ```css :root { --ion-safe-area-top: 60px; --ion-safe-area-bottom: 40px; } ``` ### iOS | | Before (`main`) | After (`FW-4715`) | | -------------------| ----------------| ------------------| | **No** Safe Area |  |  | | **Safe Area** |  |  | ### Material Design | | Before (`main`) | After (`FW-4715`) | | -------------------| ----------------| ------------------| | **No** Safe Area |  |  | | **Safe Area** |  |  | --------- Co-authored-by: ionitron <hi@ionicframework.com> |
||
|
Maria Hutt
|
73b8bfde3f |
fix(radio-group): emit value change on componentDidLoad (#28488)
Issue number: resolves #28356 --------- <!-- Please do not submit updates to dependencies unless it fixes an issue. --> <!-- Please try to limit your pull request to one type (bugfix, feature, etc). Submit multiple pull requests if needed. --> ## What is the current behavior? <!-- Please describe the current behavior that you are modifying. --> `ion-radio-group` would not set the radio value when using it as a Angular standalone component and data binding: ```html <ion-radio-group [value]="fromValue"> <ion-radio value="dogs">Dogs</ion-radio><br /> <ion-radio value="cats">Cats</ion-radio><br /> <ion-radio value="turtles">Turtles</ion-radio><br /> <ion-radio value="fish">Fish</ion-radio><br /> </ion-radio-group> ``` This is happening because the value is set before the [value watcher]( |
||
|
Ryan Waskiewicz
|
d69ad43482 |
chore(dev-deps): upgrade to jest v29 (#28412)
Issue number: # --------- <!-- Please do not submit updates to dependencies unless it fixes an issue. --> <!-- Please try to limit your pull request to one type (bugfix, feature, etc). Submit multiple pull requests if needed. --> ## What is the current behavior? <!-- Please describe the current behavior that you are modifying. --> Ionic Framework uses Jest 27. Previously, this was due to a limitation of Stencil. As of Stencil v4.7.0, this limitation no longer exists & the Framework can upgrade to the latest version of Jest. ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> There was a top level dependency on `@jest/core` that I could not find to be used anywhere. This dependency is included in `jest` by default, and has been removed as a top level/`package.json` dependency. Otherwise, all jest packages have been upgraded to jest v29. This is two major version bumps and a switch to the jest-circus runtime (instead of jest-jasmine2). ## Does this introduce a breaking change? - [ ] Yes - [x] No <!-- If this introduces a breaking change, please describe the impact and migration path for existing applications below. --> ## Other information There is some inherent risk of _something_ breaking when someone like me who doesn't work on this project day-to-day bumps packages. I did this as a part of testing Jest 29 when implementing its support in Stencil and thought "Well, why not?". Feel free to reject this PR if you feel it's not worth the risk/effort at the moment. <!-- Any other information that is important to this PR such as screenshots of how the component looks before and after the change. --> |
||
|
Liam DeBeasi
|
8227b0ee6d |
fix(header): collapsible large title does not flicker when collapse prop not reflected (#28472)
Issue number: resolves #28466 --------- <!-- Please do not submit updates to dependencies unless it fixes an issue. --> <!-- Please try to limit your pull request to one type (bugfix, feature, etc). Submit multiple pull requests if needed. --> ## What is the current behavior? <!-- Please describe the current behavior that you are modifying. --> In https://github.com/ionic-team/ionic-framework/issues/27060 I fixed an issue where the main title would be visible briefly before the collapsible large title a) was configured and b) hid the main title. I accomplished this by using CSS to target `ion-header[collapse="condense"]`. However, I failed to account for when the property is not reflected on the host. Some JS frameworks allow the property to remain on the element but some do not. ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - I improved this fix by also targeting the class set on the host. This class is set regardless of property reflection status. | main | branch | | - | - | | <video src="https://github.com/ionic-team/ionic-framework/assets/2721089/991523da-8549-451b-930f-5df45c2783de"></video> | <video src="https://github.com/ionic-team/ionic-framework/assets/2721089/149c9546-2d9b-42a2-89f1-a17fa146aee6"></video> | ## Does this introduce a breaking change? - [ ] Yes - [x] No <!-- If this introduces a breaking change, please describe the impact and migration path for existing applications below. --> ## Other information <!-- Any other information that is important to this PR such as screenshots of how the component looks before and after the change. --> Dev build: `7.5.4-dev.11699282935.1db450b0` --------- Co-authored-by: Brandy Carney <brandyscarney@users.noreply.github.com> |
||
|
Liam DeBeasi
|
c053fd9c68 |
fix(searchbar): cancel icon aligns with back button (#28478)
Issue number: resolves #28468 --------- <!-- Please do not submit updates to dependencies unless it fixes an issue. --> <!-- Please try to limit your pull request to one type (bugfix, feature, etc). Submit multiple pull requests if needed. --> ## What is the current behavior? <!-- Please describe the current behavior that you are modifying. --> The cancel button in the searchbar used to align with the back button, but that behavior gradually regressed between Ionic v4 and Ionic v7. ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - Adjusted the padding on the searchbar back button - Reduced the size of the searchbar back button. It was currently set to 25.6px whereas the `ion-back-button` icon was 24px. This caused the icons to never align even with 9px. (This should cause a few additional diffs) - Added a screenshot test | v4 | v5 | v6 | v7 | branch | | - | - | - | - | - | |  |  |  |  |  | Note that in v4 the alignment was slightly off. It was fixed in v5, but then broke in v6 and remained unchanged in v7 (until now). ## Does this introduce a breaking change? - [ ] Yes - [x] No <!-- If this introduces a breaking change, please describe the impact and migration path for existing applications below. --> ## Other information <!-- Any other information that is important to this PR such as screenshots of how the component looks before and after the change. --> Dev build: `7.5.4-dev.11699310489.151b2717` --------- Co-authored-by: Brandy Carney <brandyscarney@users.noreply.github.com> Co-authored-by: ionitron <hi@ionicframework.com> |
||
|
Liam DeBeasi
|
9e1e55a898 |
merge release-7.5.4
Release 7.5.4 |
||
|
Shawn Taylor
|
4513e0c6b0 |
fix(item-divider): apply safe area to proper side regardless of direction (#28420)
Issue number: Internal --------- <!-- Please do not submit updates to dependencies unless it fixes an issue. --> <!-- Please try to limit your pull request to one type (bugfix, feature, etc). Submit multiple pull requests if needed. --> ## What is the current behavior? <!-- Please describe the current behavior that you are modifying. --> The safe area for Item Divider would change sides when the direction changed. e.g., if the safe area padding should be on the left, it would be on the left when the direction was LTR but would be on the right when the direction was RTL. It should always be on the left. ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - The left safe area padding is on the left side of an Item Divider whether the direction is LTR or RTL. - The right safe area padding is on the right side of an Item Divider whether the direction is LTR or RTL. - Updated LTR and RTL screenshots for item to include an item divider Similar to #28403 but for Item Divider. ## Does this introduce a breaking change? - [ ] Yes - [x] No <!-- If this introduces a breaking change, please describe the impact and migration path for existing applications below. --> ## Other information <!-- Any other information that is important to this PR such as screenshots of how the component looks before and after the change. --> --------- Co-authored-by: ionitron <hi@ionicframework.com> Co-authored-by: Liam DeBeasi <liamdebeasi@users.noreply.github.com> Co-authored-by: Brandy Carney <brandyscarney@users.noreply.github.com> |
||
|
ionitron
|
5bd4af2c51 | v7.5.4 | ||
|
dependabot[bot]
|
8b877f8fb9 |
chore(deps): Bump @stencil/core from 4.7.0 to 4.7.1 in /core (#28479)
Bumps [@stencil/core](https://github.com/ionic-team/stencil) from 4.7.0 to 4.7.1. <details> <summary>Release notes</summary> <p><em>Sourced from <a href="https://github.com/ionic-team/stencil/releases"><code>@stencil/core</code>'s releases</a>.</em></p> <blockquote> <h2>🍿 v4.7.1 (2023-11-06)</h2> <h3>Bug Fixes</h3> <ul> <li><strong>compiler:</strong> correctly generate CSS rules using <code>::slotted</code> outside shadow DOM (<a href="https://redirect.github.com/ionic-team/stencil/issues/4969">#4969</a>) (<a href=" |
||
|
Brandy Carney
|
c765dcbac4 |
fix(inputs): remove invalid legacy warnings in input, textarea, and select (#28484)
Issue number: N/A
---------
## What is the current behavior?
<!-- Please describe the current behavior that you are modifying. -->
When using an `ion-label` as a `label` slot inside of an `ion-input`,
`ion-textarea` or `ion-select` it erroneously flags the input as a
legacy component and ignores the `label-placement`:
<table>
<tr>
<td>
Code
</td>
<td>
Result
</td>
</tr>
<tr>
<td>
<pre lang="html">
<ion-item>
<ion-input label-placement="floating">
<ion-label slot="label">
<ion-icon name="home"></ion-icon>
Slotted Label
</ion-label>
</ion-input>
</ion-item>
<ion-item>
<ion-input label-placement="floating" value="Value">
<ion-label slot="label">
<ion-icon name="person"></ion-icon>
Slotted Label
</ion-label>
</ion-input>
</ion-item>
</pre>
</td>
<td>
<img
src="https://github.com/ionic-team/ionic-framework/assets/6577830/91ef5470-aba4-4bb6-b277-09e2b1a4650c">
</td>
</tr>
</table>
<img width="1005" alt="Screenshot 2023-11-07 at 10 37 43 AM"
src="https://github.com/ionic-team/ionic-framework/assets/6577830/00208625-2bdb-4b60-b7ce-e487dd89c47e">
## What is the new behavior?
Adds `ion-input`, `ion-textarea`, and `ion-select` as components that
can contain a named label slot so it no longer assumes that they are
legacy components.
<table>
<tr>
<td>
Code
</td>
<td>
Result
</td>
</tr>
<tr>
<td>
<pre lang="html">
<ion-item>
<ion-input label-placement="floating">
<ion-label slot="label">
<ion-icon name="home"></ion-icon>
Slotted Label
</ion-label>
</ion-input>
</ion-item>
<ion-item>
<ion-input label-placement="floating" value="Value">
<ion-label slot="label">
<ion-icon name="person"></ion-icon>
Slotted Label
</ion-label>
</ion-input>
</ion-item>
</pre>
</td>
<td>
<img
src="https://github.com/ionic-team/ionic-framework/assets/6577830/75f06c5e-6887-4e8e-8022-264b716b3e62">
</td>
</tr>
</table>
## Does this introduce a breaking change?
- [ ] Yes
- [x] No
|
||
|
Liam DeBeasi
|
63a8b765bb |
chore(core): remove old scripts (#28465)
Issue number: N/A --------- <!-- Please do not submit updates to dependencies unless it fixes an issue. --> <!-- Please try to limit your pull request to one type (bugfix, feature, etc). Submit multiple pull requests if needed. --> ## What is the current behavior? <!-- Please describe the current behavior that you are modifying. --> The "prerelease" script hasn't been used since we switched off our custom release scripts. The "test.spec.debug" script doesn't do anything special now because the `--node-arg` argument has been removed: ``` liamdebeasi@MacBook-Pro core % npx --node-arg=\"--inspect-brk\" stencil test --spec npx: the --node-arg argument has been removed. See `npm help exec` for more information ``` ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - Removed the "prerelease" and "test.spec.debug" scripts from "core" ## Does this introduce a breaking change? - [ ] Yes - [x] No <!-- If this introduces a breaking change, please describe the impact and migration path for existing applications below. --> ## Other information <!-- Any other information that is important to this PR such as screenshots of how the component looks before and after the change. --> |
||
|
Liam DeBeasi
|
cafafcc9d1 |
fix(list): remove border from last item with item-sliding (#28439)
Issue number: resolves #28435 --------- <!-- Please do not submit updates to dependencies unless it fixes an issue. --> <!-- Please try to limit your pull request to one type (bugfix, feature, etc). Submit multiple pull requests if needed. --> ## What is the current behavior? <!-- Please describe the current behavior that you are modifying. --> The item in the last item-sliding still has a border in an inset list. ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - Item in last item-sliding no longer has a border I originally only added `ion-item-sliding:last-of-type ion-item` but I discovered that the original `ion-item:last-child` causes items in item-sliding where the item is the last element in the item-sliding container to not have a border, so the original fix was incomplete. I added comments as to what each line does and why we didn't just do `ion-item:last-child`. ## Does this introduce a breaking change? - [ ] Yes - [x] No <!-- If this introduces a breaking change, please describe the impact and migration path for existing applications below. --> ## Other information <!-- Any other information that is important to this PR such as screenshots of how the component looks before and after the change. --> -------- Co-authored-by: Brandy Carney <brandyscarney@users.noreply.github.com> --------- Co-authored-by: ionitron <hi@ionicframework.com> Co-authored-by: Brandy Carney <brandyscarney@users.noreply.github.com> |
||
|
Shawn Taylor
|
00c3a4431a |
test(picker-internal): reduce flakiness of picker internal screenshot test (#28456)
Issue number: N/A --------- <!-- Please do not submit updates to dependencies unless it fixes an issue. --> <!-- Please try to limit your pull request to one type (bugfix, feature, etc). Submit multiple pull requests if needed. --> <!-- Please describe the current behavior that you are modifying. --> Sometimes the screenshot gets captured as  when it should be  <!-- Please describe the behavior or changes that are being added by this PR. --> - Hopefully the screenshot will be more consistent. - [ ] Yes - [x] No <!-- If this introduces a breaking change, please describe the impact and migration path for existing applications below. --> <!-- Any other information that is important to this PR such as screenshots of how the component looks before and after the change. --> |
||
|
Shawn Taylor
|
ed040b09e9 |
fix(item): apply safe area to proper side regardless of direction (#28403)
Issue number: Internal --------- <!-- Please do not submit updates to dependencies unless it fixes an issue. --> <!-- Please try to limit your pull request to one type (bugfix, feature, etc). Submit multiple pull requests if needed. --> ## What is the current behavior? <!-- Please describe the current behavior that you are modifying. --> The safe area for Item would change sides when the direction changed. e.g., if the safe area padding should be on the left, it would be on the left when the direction was LTR but would be on the right when the direction was RTL. It should always be on the left. ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - The left safe area padding is on the left side of Item whether the direction is LTR or RTL. - The right safe area padding is on the right side of Item whether the direction is LTR or RTL. - There's now a screenshot test for left and right padding for both directions. Note: There is a separate ticket for updating the safe area padding for ion-item-divider. ## Does this introduce a breaking change? - [ ] Yes - [x] No <!-- If this introduces a breaking change, please describe the impact and migration path for existing applications below. --> ## Other information <!-- Any other information that is important to this PR such as screenshots of how the component looks before and after the change. --> --------- Co-authored-by: ionitron <hi@ionicframework.com> Co-authored-by: Amanda Johnston <90629384+amandaejohnston@users.noreply.github.com> Co-authored-by: Brandy Carney <brandyscarney@users.noreply.github.com> |
||
|
dependabot[bot]
|
a4551470a9 |
chore(deps): Bump @stencil/core from 4.6.0 to 4.7.0 in /core (#28436)
Bumps [@stencil/core](https://github.com/ionic-team/stencil) from 4.6.0 to 4.7.0. <details> <summary>Changelog</summary> <p><em>Sourced from <a href="https://github.com/ionic-team/stencil/blob/main/CHANGELOG.md"><code>@stencil/core</code>'s changelog</a>.</em></p> <blockquote> <h1>💪 <a href="https://github.com/ionic-team/stencil/compare/v4.6.0...v4.7.0">4.7.0</a> (2023-10-30)</h1> <h3>Bug Fixes</h3> <ul> <li><strong>runtime:</strong> prevent additional attempted move of slot content (<a href="https://redirect.github.com/ionic-team/stencil/issues/4921">#4921</a>) (<a href=" |
||
|
ionitron
|
d70c89c0e2 | v7.5.3 | ||
|
Shawn Taylor
|
f6a6877044 |
fix(datetime): allow calendar navigation in readonly mode; disallow keyboard navigation when disabled (#28336)
Issue number: #28121 --------- <!-- Please do not submit updates to dependencies unless it fixes an issue. --> <!-- Please try to limit your pull request to one type (bugfix, feature, etc). Submit multiple pull requests if needed. --> ## What is the current behavior? <!-- Please describe the current behavior that you are modifying. --> It is not possible to navigate between months when ion-datetime is in readonly mode. This means that if there are multiple dates selected, the user cannot browse to view them all. Also, keyboard navigation is not prevented in `readonly` or `disabled` mode where it should be. ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> When `readonly`: - Clicking the month-year button changes the month & year in readonly mode - Clicking the next & prev buttons changes the month in readonly mode - Left and right arrow keys change the month in readonly mode - Swiping/scrolling changes the month in readonly mode - The selected date does not change when doing any of the above - You cannot clear the value using keyboard navigation of the clear button in readonly mode When `disabled`: - You cannot navigate months via keyboard navigation of the month-year button in disabled mode - You cannot navigate months using keyboard navigation of the previous & next buttons in disabled mode - You cannot navigate months via the left and right arrow keys in disabled mode - The selected date does not change when doing any of the above - You cannot clear the value using keyboard navigation of the clear button in disabled mode Known bug: - It is still possible to navigate through dates in `prefers-wheel` when `disabled`. This bug existed prior to this PR. I created FW-5408 to track this. ## Does this introduce a breaking change? - [ ] Yes - [x] No <!-- If this introduces a breaking change, please describe the impact and migration path for existing applications below. --> ## Other information <!-- Any other information that is important to this PR such as screenshots of how the component looks before and after the change. --> --------- Co-authored-by: ionitron <hi@ionicframework.com> Co-authored-by: Amanda Johnston <90629384+amandaejohnston@users.noreply.github.com> |
||
|
Liam DeBeasi
|
89698b338f |
fix(angular): standalone form components do not error when multiple are used (#28423)
Issue number: resolves #28418 --------- <!-- Please do not submit updates to dependencies unless it fixes an issue. --> <!-- Please try to limit your pull request to one type (bugfix, feature, etc). Submit multiple pull requests if needed. --> ## What is the current behavior? <!-- Please describe the current behavior that you are modifying. --> Due to https://github.com/ionic-team/stencil-ds-output-targets/issues/397, calling `proxyInputs` for the form controls caused an error to be logged in developer applications. ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - Updated to a version of the Angular output targets with a patch for this error - I also excluded the `utils.ts` from all `angular-component-lib` directories from prettier since it was causing a diff. These changes are autogenerated so we should not be linting them anyways. ## Does this introduce a breaking change? - [ ] Yes - [x] No <!-- If this introduces a breaking change, please describe the impact and migration path for existing applications below. --> ## Other information <!-- Any other information that is important to this PR such as screenshots of how the component looks before and after the change. --> Dev build: `7.5.3-dev.11698340692.18daff2f` |
||
|
dependabot[bot]
|
dbcd1ac489 |
chore(deps-dev): Bump @capacitor/core from 5.5.0 to 5.5.1 in /core (#28416)
Bumps [@capacitor/core](https://github.com/ionic-team/capacitor) from 5.5.0 to 5.5.1. <details> <summary>Release notes</summary> <p><em>Sourced from <a href="https://github.com/ionic-team/capacitor/releases"><code>@capacitor/core</code>'s releases</a>.</em></p> <blockquote> <h2>5.5.1</h2> <h2><a href="https://github.com/ionic-team/capacitor/compare/5.5.0...5.5.1">5.5.1</a> (2023-10-25)</h2> <h3>Bug Fixes</h3> <ul> <li><strong>ios:</strong> CAPWebView config update (<a href="https://redirect.github.com/ionic-team/capacitor/issues/7004">#7004</a>) (<a href=" |
||
|
Liam DeBeasi
|
b31ecbbfe8 |
fix(input, textarea, select): use consistent sizes (#28390)
aIssue number: resolves #28388 --------- <!-- Please do not submit updates to dependencies unless it fixes an issue. --> <!-- Please try to limit your pull request to one type (bugfix, feature, etc). Submit multiple pull requests if needed. --> ## What is the current behavior? <!-- Please describe the current behavior that you are modifying. --> We added a `min-height: 56px` to the input, textarea, and select components for MD mode. However, these were added for the outline/solid style inputs to align with the Material Design spec: https://material-components.github.io/material-components-web-catalog/#/component/text-field They should not apply to regular inputs in an item. The end result is inconsistently sized items when used with non-control items. ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - Non-filled and non-stacked/floating label controls are now have a minimum height of 44px. There should be **no changes** to the following types of controls: 1. iOS controls (all variants) 2. MD filled controls 3. MD stacked controls ## Does this introduce a breaking change? - [ ] Yes - [x] No <!-- If this introduces a breaking change, please describe the impact and migration path for existing applications below. --> ## Other information <!-- Any other information that is important to this PR such as screenshots of how the component looks before and after the change. --> Dev build: `7.5.2-dev.11697818830.1a33c881` --------- Co-authored-by: ionitron <hi@ionicframework.com> |
||
|
Liam DeBeasi
|
dc94ae01fe |
test(alert): add annotations (#28414)
Issue number: N/A --------- <!-- Please do not submit updates to dependencies unless it fixes an issue. --> <!-- Please try to limit your pull request to one type (bugfix, feature, etc). Submit multiple pull requests if needed. --> ## What is the current behavior? <!-- Please describe the current behavior that you are modifying. --> I forgot to add annotations to tests to indicate the bug fix they are validating: https://github.com/ionic-team/ionic-framework/pull/28408 ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - Added annotations ## Does this introduce a breaking change? - [ ] Yes - [x] No <!-- If this introduces a breaking change, please describe the impact and migration path for existing applications below. --> ## Other information <!-- Any other information that is important to this PR such as screenshots of how the component looks before and after the change. --> |
||
|
Liam DeBeasi
|
8e2f818671 |
fix(segment): avoid scrolling webkit bug (#28376)
Issue number: resolves #28373
---------
🚨 Reviewers: Please test this on Chrome, Firefox, and Safari
<!-- Please do not submit updates to dependencies unless it fixes an
issue. -->
<!-- Please try to limit your pull request to one type (bugfix, feature,
etc). Submit multiple pull requests if needed. -->
## What is the current behavior?
<!-- Please describe the current behavior that you are modifying. -->
The fix in
|
||
|
Liam DeBeasi
|
34257d681e |
fix(alert): long words wrap to next line (#28408)
Issue number: resolves #28406 --------- <!-- Please do not submit updates to dependencies unless it fixes an issue. --> <!-- Please try to limit your pull request to one type (bugfix, feature, etc). Submit multiple pull requests if needed. --> ## What is the current behavior? <!-- Please describe the current behavior that you are modifying. --> As part of https://github.com/ionic-team/ionic-framework/pull/27898 we updated the radio and checkbox labels to wrap to the next line instead of truncate. However, we did not consider long words. As a result, long words run outside of the container. ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - The radio and checkbox labels now break on words too in addition to white space characters. ## Does this introduce a breaking change? - [ ] Yes - [x] No <!-- If this introduces a breaking change, please describe the impact and migration path for existing applications below. --> ## Other information <!-- Any other information that is important to this PR such as screenshots of how the component looks before and after the change. --> --------- Co-authored-by: ionitron <hi@ionicframework.com> |
||
|
Brandy Carney
|
d47b7e7503 |
fix(tab-bar): apply safe area to proper side regardless of direction (#28372)
Issue number: Internal --------- ## What is the current behavior? The safe area padding (both left and right) swap sides when the app's direction changes from LTR to RTL. The `--ion-safe-area-left` should always apply to the left side of the device and the `--ion-safe-area-right` should always apply to the right side of the device. ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - Updates the tab bar stylesheet to always set `padding-left` and `padding-right` - Adds an e2e test for the basic directory which adds screenshots in both modes/directions for: - the default tab bar - a tab bar with safe area left applied - a tab bar with safe area right applied ## Does this introduce a breaking change? - [ ] Yes - [x] No --------- Co-authored-by: ionitron <hi@ionicframework.com> |
||
|
Brandy Carney
|
f99d5305fb |
fix(list-header): apply safe area to proper side regardless of direction (#28371)
Issue number: Internal --------- ## What is the current behavior? The list header adds padding to the "start" side (`padding-left` in LTR and `padding-right` in RTL) based on the value of `--ion-safe-area-left`. It does not account for `--ion-safe-area-right` at all even though the list header can extend to the right side of the content. ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - The `--ion-safe-area-left` always applies to the left side of the screen, regardless of direction. This means that in both LTR and RTL it applies as `padding-left`. - Added support for `--ion-safe-area-right` which applies to `padding-right` in both LTR and RTL. - Adds an e2e test which captures the list header with a button to ensure the proper padding is added for the safe area. ## Does this introduce a breaking change? - [ ] Yes - [x] No ## Other information ### Safe Area Left | mode | direction | `main` | `branch` | | ---| ---| ---| ---| | `ios` | `LTR` |  |  | | `ios` | `RTL` |  |  | | `md` | `LTR` |  |  | | `md` | `RTL` |  |  | ### Safe Area Right | mode | direction | `main` | `branch` | | ---| ---| ---| ---| | `ios` | `LTR` |  | | | `ios` | `RTL` |  |  | | `md` |`LTR` |  |  | | `md` |`RTL` |  |  | --------- Co-authored-by: ionitron <hi@ionicframework.com> |
||
|
ionitron
|
7722ba05eb | v7.5.2 | ||
|
dependabot[bot]
|
d72a55eb65 |
chore(deps-dev): Bump @stencil/sass from 3.0.6 to 3.0.7 in /core (#28401)
Bumps [@stencil/sass](https://github.com/ionic-team/stencil-sass) from 3.0.6 to 3.0.7. <details> <summary>Release notes</summary> <p><em>Sourced from <a href="https://github.com/ionic-team/stencil-sass/releases"><code>@stencil/sass</code>'s releases</a>.</em></p> <blockquote> <h2>v3.0.7</h2> <h2>What's Changed</h2> <ul> <li>chore(deps): update dependency npm to v10.2.0 by <a href="https://github.com/renovate"><code>@renovate</code></a> in <a href="https://redirect.github.com/ionic-team/stencil-sass/pull/410">ionic-team/stencil-sass#410</a></li> <li>chore(deps): update dependency <code>@rollup/plugin-node-resolve</code> to v15.2.2 by <a href="https://github.com/renovate"><code>@renovate</code></a> in <a href="https://redirect.github.com/ionic-team/stencil-sass/pull/409">ionic-team/stencil-sass#409</a></li> <li>chore(deps): update dependency terser to v5.21.0 by <a href="https://github.com/renovate"><code>@renovate</code></a> in <a href="https://redirect.github.com/ionic-team/stencil-sass/pull/411">ionic-team/stencil-sass#411</a></li> <li>chore(repo): group rollup in renovate by <a href="https://github.com/rwaskiewicz"><code>@rwaskiewicz</code></a> in <a href="https://redirect.github.com/ionic-team/stencil-sass/pull/413">ionic-team/stencil-sass#413</a></li> <li>chore(deps): update rollup, by <a href="https://github.com/renovate"><code>@renovate</code></a> in <a href="https://redirect.github.com/ionic-team/stencil-sass/pull/414">ionic-team/stencil-sass#414</a></li> <li>chore(deps): update dependency <code>@stencil/core</code> to v4.4.0 by <a href="https://github.com/renovate"><code>@renovate</code></a> in <a href="https://redirect.github.com/ionic-team/stencil-sass/pull/408">ionic-team/stencil-sass#408</a></li> <li>chore(deps): update dependency <code>@stencil/core</code> to v4.4.1 by <a href="https://github.com/renovate"><code>@renovate</code></a> in <a href="https://redirect.github.com/ionic-team/stencil-sass/pull/416">ionic-team/stencil-sass#416</a></li> <li>chore(deps-dev): bump <code>@babel/traverse</code> from 7.15.4 to 7.23.2 by <a href="https://github.com/dependabot"><code>@dependabot</code></a> in <a href="https://redirect.github.com/ionic-team/stencil-sass/pull/418">ionic-team/stencil-sass#418</a></li> <li>chore(deps): update node.js to v20.8.1 by <a href="https://github.com/renovate"><code>@renovate</code></a> in <a href="https://redirect.github.com/ionic-team/stencil-sass/pull/417">ionic-team/stencil-sass#417</a></li> <li>chore(deps): update dependency <code>@stencil/core</code> to v4.5.0 by <a href="https://github.com/renovate"><code>@renovate</code></a> in <a href="https://redirect.github.com/ionic-team/stencil-sass/pull/419">ionic-team/stencil-sass#419</a></li> <li>chore(deps): update dependency terser to v5.22.0 by <a href="https://github.com/renovate"><code>@renovate</code></a> in <a href="https://redirect.github.com/ionic-team/stencil-sass/pull/420">ionic-team/stencil-sass#420</a></li> <li>chore(deps): update dependency rollup to v4 by <a href="https://github.com/renovate"><code>@renovate</code></a> in <a href="https://redirect.github.com/ionic-team/stencil-sass/pull/415">ionic-team/stencil-sass#415</a></li> <li>chore(deps): update dependency npm to v10.2.1 by <a href="https://github.com/renovate"><code>@renovate</code></a> in <a href="https://redirect.github.com/ionic-team/stencil-sass/pull/422">ionic-team/stencil-sass#422</a></li> <li>chore(deps): update actions/checkout action to v4.1.1 by <a href="https://github.com/renovate"><code>@renovate</code></a> in <a href="https://redirect.github.com/ionic-team/stencil-sass/pull/421">ionic-team/stencil-sass#421</a></li> </ul> <p><strong>Full Changelog</strong>: <a href="https://github.com/ionic-team/stencil-sass/compare/v3.0.6...v3.0.7">https://github.com/ionic-team/stencil-sass/compare/v3.0.6...v3.0.7</a></p> </blockquote> </details> <details> <summary>Commits</summary> <ul> <li><a href=" |
||
|
dependabot[bot]
|
026efeb0a8 |
chore(deps): Bump @stencil/core from 4.5.0 to 4.6.0 in /core (#28400)
Bumps [@stencil/core](https://github.com/ionic-team/stencil) from 4.5.0 to 4.6.0. <details> <summary>Changelog</summary> <p><em>Sourced from <a href="https://github.com/ionic-team/stencil/blob/main/CHANGELOG.md"><code>@stencil/core</code>'s changelog</a>.</em></p> <blockquote> <h1>💥 <a href="https://github.com/ionic-team/stencil/compare/v4.5.0...v4.6.0">4.6.0</a> (2023-10-23)</h1> <h3>Bug Fixes</h3> <ul> <li><strong>compiler:</strong> consistently generate additional type files (<a href="https://redirect.github.com/ionic-team/stencil/issues/4938">#4938</a>) (<a href=" |
||
|
Maria Hutt
|
60f3d65794 |
fix(alert, action-sheet): show scrollbar for long list of options (#28369)
Issue number: resolves #18487 --------- <!-- Please do not submit updates to dependencies unless it fixes an issue. --> <!-- Please try to limit your pull request to one type (bugfix, feature, etc). Submit multiple pull requests if needed. --> ## What is the current behavior? <!-- Please describe the current behavior that you are modifying. --> Web-based users do not get a scrollbar when: - alert has a long list of inputs (this also happens on `ion-select` with the alert interface) - `ion-select` uses the action-sheet interface and has a long list of options This makes it difficult for users to navigate through the options by forcing them to use their keyboards. Some users may also not be used to using their keyboards for navigation. Additionally, this can lead to potential confusion that there are no other options. ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> Web-based users get a scrollbar when: - alert has a long list of inputs (this also happens on `ion-select` with the alert interface) - `ion-select` uses the action-sheet interface and has a long list of options ## Does this introduce a breaking change? - [ ] Yes - [x] No <!-- If this introduces a breaking change, please describe the impact and migration path for existing applications below. --> ## Other information <!-- Any other information that is important to this PR such as screenshots of how the component looks before and after the change. --> The issue was filed for the alert interface but it's also happening on the action-sheet interface. Dev build: 7.5.1-dev.11697570585.1774584d |
||
|
Maria Hutt
|
7ecd41f385 |
test(radio): skip Safari on legacy tab key tests (#28387)
Issue number: internal --------- <!-- Please do not submit updates to dependencies unless it fixes an issue. --> <!-- Please try to limit your pull request to one type (bugfix, feature, etc). Submit multiple pull requests if needed. --> ## What is the current behavior? <!-- Please describe the current behavior that you are modifying. --> Legacy radio has tests that use `Tab` key presses. These tend to flake at unknown moments and were skipped until a fix can be implemented. ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> Unable to replicate the flakiness locally or on GitHub. However, it only fails on Safari so the tests were re-enabled except for Safari. ## Does this introduce a breaking change? - [ ] Yes - [x] No <!-- If this introduces a breaking change, please describe the impact and migration path for existing applications below. --> ## Other information <!-- Any other information that is important to this PR such as screenshots of how the component looks before and after the change. --> This only happens on legacy. The legacy form controls will also be removed in the future. Due to this, these tests will be removed anyways at that time. |
||
|
Maria Hutt
|
2b015b2214 |
fix(input, searchbar, textarea): ensure nativeInput is always available (#28362)
Issue number: resolves #28283 --------- <!-- Please do not submit updates to dependencies unless it fixes an issue. --> <!-- Please try to limit your pull request to one type (bugfix, feature, etc). Submit multiple pull requests if needed. --> ## What is the current behavior? <!-- Please describe the current behavior that you are modifying. --> `getInputElement()` is used to access the native input. If the component has yet to render, then the function will return `undefined`. This happens mostly when using `ref` on React. ```tsx <IonInput ref={async input => { const nativeInput = await input.getInputElement(); // nativeInput is undefined }} /> ``` ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - `getInputElement()` will wait to return once the component is ready. ## Does this introduce a breaking change? - [ ] Yes - [x] No <!-- If this introduces a breaking change, please describe the impact and migration path for existing applications below. --> ## Other information <!-- Any other information that is important to this PR such as screenshots of how the component looks before and after the change. --> Dev build: `7.5.1-dev.11697488622.175c9183` |