BREAKING CHANGE: `ion-picker` and `ion-picker-column` have been renamed to `ion-picker-legacy` and `ion-picker-legacy-column`, respectively. This change was made to accommodate the new inline picker component while allowing developers to continue to use the legacy picker during this migration period.
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. -->
`ion-datetime` uses an `ion-item` to render the month/year toggle button
inside of the header.
## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
- `ion-datetime` uses a `button` element for the month/year toggle
button
## Does this introduce a breaking change?
- [x] Yes
- [ ] No
<!-- If this introduces a breaking change, please describe the impact
and migration path for existing applications below. -->
Impact and migration path is noted in the `BREAKING.md`.
## Other information
<!-- Any other information that is important to this PR such as
screenshots of how the component looks before and after the change. -->
- `translucent` is not a valid CSS value for `background`. This was
always intended to be `transparent`.
---------
Co-authored-by: ionitron <hi@ionicframework.com>
Co-authored-by: Brandy Carney <brandyscarney@users.noreply.github.com>
Co-authored-by: Liam DeBeasi <liamdebeasi@users.noreply.github.com>
BREAKING CHANGE: The CSS shadow part for `month-year-button` has been changed to target a `button` element instead of `ion-item`. Developers should verify their UI renders as expected for the month/year toggle button inside of `ion-datetime`.
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>
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>
Issue number: resolves#28385
---------
<!-- 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. -->
Overlay controllers do not register their respective overlays
components. This results in the overlay not appearing.
## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
- Each standalone overlay controller manually calls
`defineCustomElement` for their respective overlay component to ensure
the component is loaded/registered.
## 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.11700492285.1581ed02`
Issue number: Resolves#28514
---------
<!-- 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 the `@ionic/angular` schematic in an Angular 17 project (`ng
add @ionic/angular`), developers will receive an error preventing the
schematic from running.
Additionally, the previous implementations of the schematic are out of
sync with the current state of the Ionic starters:
- `variables.css` is empty and missing Ionic's defaults
- `ionic.config.json` is not created
- Schematic does not have support for module vs. standalone projects.
## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
- `ng add @ionic/angular` works with Angular 17 projects
- `ng add @ionic/angular` has fallback behavior for Angular 16 projects
using `AppModule`
- Schematics now includes the proper `variables.css` from Ionic starters
- Ionicons assets will no longer be copied when being added to a
standalone project
- Refactors a majority of the implementation to use the utilities that
come directly from `@angular-devkit/schematics` and
`@schematics/angular`.
- Sets the `@ionic/angular-toolkit` CLI configuration and schematics
configuration in the `angular.json`
- Creates missing `ionic.config.json`
## 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.11700239837.1925bbdb`
To test this PR:
1. Install Angular CLI v17 - `npm install -g @angular/cli@17`
2. Create a new project - `ng new angular-17`
3. Use the dev-build: - `ng add
@ionic/angular@7.5.5-dev.11700239837.1925bbdb`
4. Confirm the prompts
5. Validate that `provideIonicAngular({})` is added to the
`app.config.ts`
6. Validate that `ionic.config.json` was created
7. Validate that `angular.json` was updated with the
`@ionic/angular-devkit` configurations
Now verify legacy behavior:
1. Install Angular CLI v16 - `npm install -g @angular/cli@16`
2. Create a new project - `ng new angular-16`
3. Use the dev-build - `ng add
@ionic/angular@7.5.5-dev.11700239837.1925bbdb`
4. Confirm the prompts
5. Validate that `IonicModule.forRoot({})` is added to the
`app.module.ts`
8. Validate the ionicons glob pattern is added to the `angular.json`
9. Validate the `ionic.config.json` was created
10. Validate the `angular.json` was updated with the
`@ionic/angular-devkit` configurations
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>
