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. -->
## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
Adds the base architecture to add a new theme configuration to Ionic
Framework components.
- Components can now specify an additional stylesheet for the `ionic`
theme.
- Developers can specify the `theme` and `mode` independently to control
look and feel of a component.
Test infrastructure has been updated to add support for testing the
theme configuration with Playwright.
- Existing `themes` test configuration has been renamed to `palettes`
This PR is just the initial effort to decouple Ionic's architecture to
separate look and feel and allow our dev team to start introducing the
new component appearance to the UI. There will be additional changes
required to completely add support for the Ionic theme. These changes
are targeted against the `next` branch and are not expected to be used
in a production environment at this time.
## Does this introduce a breaking change?
- [ ] Yes
- [x] 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.
-->
## 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: Maria Hutt <thetaPC@users.noreply.github.com>
Co-authored-by: Brandy Carney <brandyscarney@users.noreply.github.com>
Issue number: resolves#27965
---------
https://www.youtube.com/watch?v=a_m7jxrTlaw&list=PLIvujZeVDLMx040-j1W4WFs1BxuTGdI_b&index=3
<!-- 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. -->
There is a lack of autocomplete support for AlertButton attribute of
`role` (there may be similar situations for other components too,
however, I was working on this component and found it).
## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
- Support for autocomplete for the two types defined `cancel` and
`destructive`, and also supports any arbitrary string if passed in.
## 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. -->
I suggest there to be some global interface similar to the following:
```
interface LooseAutocomplete<T extends string> = T | Omit<string, T>;
```
I referenced this great [video](https://youtu.be/a_m7jxrTlaw) from Matt
@mattpocock
---------
Co-authored-by: Liam DeBeasi <liamdebeasi@users.noreply.github.com>
Issue number: resolves#24905, resolves#26840, resolves#15710
---------
<!-- 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 current picker is only displayed as an overlay which makes it
impossible to use inline with the rest of the application. Additionally,
there are several bugs and missing features. For example, it is
impossible to know when the value of the picker column has changed using
public APIs. This is valuable for updating other columns in response to
that data.
## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
- Introduces `ion-picker` as an inline wheel picker component. The
overlay picker is still available using `ion-picker-legacy`.
- The implementation of this component resolves linked bugs. It also
resolves linked features by exposing an `ionChange` event for developers
to listen for.
## 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.8-dev.11702398696.1ab62ea9`
---------
Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: Shawn Taylor <shawn@ionic.io>
Co-authored-by: Maria Hutt <thetaPC@users.noreply.github.com>
Co-authored-by: Amanda Johnston <90629384+amandaejohnston@users.noreply.github.com>
Co-authored-by: Sean Perkins <13732623+sean-perkins@users.noreply.github.com>
Co-authored-by: Brandy Carney <brandyscarney@users.noreply.github.com>
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. -->
As part of FW-2832, the team would like to swap out usages of the `any`
type for stronger types.
## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
- Added `ionBackButton` event types to the browser utilities
- Updated menuController to use the `doc` utility instead of `document`
so we can get proper types
- Moved the definitions for back button types out of `interface.d.ts`
and into `hardware-back-button`. `interface.d.ts` still exports these
back button interfaces.
- Updated all `BackButtonEvent` imports inside of `@ionic/core` to
import from the utility file instead of the public interface file.
## 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. -->
Note: This PR was separated from other type updates associated with the
FW-3832 work because I had to modify the implementation of a feature in
Ionic. While I don't expect there to be any functional differences, I
have opted to pull this work out into a separate branch and target a
feature branch to a) reduce the impact of any unintended bugs and b)
make it easier to do a `git bisect` if a bug is introduced.
Issue number: resolves#28137
---------
Changes according to [this
comment](https://github.com/ionic-team/ionic-framework/issues/28137#issuecomment-1710283096)
## Does this introduce a breaking change?
- [ ] Yes
- [x] No
@liamdebeasi Sorry for replacing the previous PR. I only copied the main
branch to my fork so I couldn't rebase properly. I am unfortunately not
extremely familiar with Github.
---------
Co-authored-by: Philipp Heuer <philipp@studysmarter.de>
Co-authored-by: Liam DeBeasi <liamdebeasi@users.noreply.github.com>
Issue number: Resolves#27353
---------
<!-- Please refer to our contributing documentation for any questions on
submitting a pull request, or let us know here if you need any help:
https://ionicframework.com/docs/building/contributing -->
<!-- Some docs updates need to be made in the `ionic-docs` repo, in a
separate PR. See
https://github.com/ionic-team/ionic-framework/blob/main/.github/CONTRIBUTING.md#modifying-documentation
for details. -->
<!-- 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. -->
`DatetimeHighlightStyle` is not automatically exported from
`@ionic/core`, since the type is not directly referenced on a prop.
## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
- Manually exports `DatetimeHighlightStyle` to consumers
## 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. -->
Issue number: N/A
---------
<!-- Please refer to our contributing documentation for any questions on
submitting a pull request, or let us know here if you need any help:
https://ionicframework.com/docs/building/contributing -->
<!-- Some docs updates need to be made in the `ionic-docs` repo, in a
separate PR. See
https://github.com/ionic-team/ionic-framework/blob/main/.github/CONTRIBUTING.md#modifying-documentation
for details. -->
<!-- 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 updating to Stencil v3
([commit](1a8bd6d8c6 (diff-83006355bd18aced9f88fd3b27ff6a40527c713b314145c2a34ad54b6361fa87))),
we removed many manual exports that are automatically exported by
Stencil. This change included removing the `MenuI` type from being
exported. This type is not automatically exported since it is not
directly associated to a `@Prop`.
This causes implementers that previously had a typed value against
`MenuI` in v6 for registering menus, to have to import from:
```ts
import { MenuI } from "@ionic/core/dist/types/components/menu/menu-interface";
```
## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->
- Re-exports the `MenuI` interface
## 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. -->
* Add new keyframes proof of concept
* update esm import
* add base before and after methods, add tests
* add base before and after hooks
* update clean up methods, add tests
* add web animations support, change to arrow functions
* remove console logs
* add from, to, fromTo, and other properties
* add more tests, fix onFinish functionality, being testing with nav transitions
* add progress methods, use force linear
* run linter
* Add playSync
* integrate animations with framework components
* onFinish now supports multiple callbacks
* change const to let
* testing reverse
* add support for both animation utilities
* bug fix
* export createAnimation, a few tweaks
* add base tests
* fix issue with onFinish being called out of order. added tests
* fix race conditions in tests
* clean up
* fix bug where onFinish not calling for empty elements array, update test
* clean up
* fix treeshaking, remove old comments
* remove old tests
* Add test for animationbuilder backwards compat
* update typings for menu controller
* mock web animations in tests
* run build
* fix type errors
* sync with master
* use requestAnimationFrame instead of writeTask
* fix flaky tests, fix menu
* fix ordering
* update webdriver
* fix wrong version
* Revert "fix wrong version"
This reverts commit be91296e9701399f8d784b08d09a3c475ca15df7.
Revert chromedriver update
* Revert "update webdriver"
This reverts commit e49bc9d76e335a0af5828725065399bd6795fa37.
Revert chromedriver update
* expose raw animation object, add tests
* add stylesheet recycling
* finalize before and after hook tests
* a few styling changes
* fix lint warnings
* get rid of old code
* Fix progressStep overflow bug
* disable reuse stylesheet
* small updates
* fix old animation create
* setStyleProperty helper
* reuse keyframe styles
* keyframes
* fix css animation issue with display: none, add tests
* add comment
* fix issue with progress animations and css animations
* clean up
* clean up pt2
* fix tests
* fix linter
* add fill for overlays
* fix swipe to go back
* clean up css animations when done
* fix edge cases with css animations
* fix menu open and close
* add reset function
* clean up reset fn
* Fix issue where animation always being reset
* allow updating animations on the fly
* add clear onfinish method
* fix linter
* add callback options, expand force direction
* ensure opts is defined
* fix css animations open and close for menus
* remove test
* add extra check
* clean up
* fix css anim bug swipe to go back
* fix pause
* setup alt animation to avoid flickering
* clean up
* reset flags on destroy
* add ability to change duration on progressEnd
* fix flicker on duration change for css animations
* fix ios transition
* remove unneeded recursion
* increase durability of updating css animations on the fly
* fix gesture anim
* fix web anim as well. more work for cleanup
* simplify progressEnd for css animations
* fix swipe to go back race condition
* clean up
* Add todo
* fix one more bug
Adds the ability to apply a layout to the segment button in order to better match the Material Design spec, updates the design and UI to match the spec more, and separates the segment button styles back into the proper directory.
- moves the segment button css back into segment-button directory
- updates the design to match the MD spec better
- adds layout property to match MD spec
- adds custom properties for better styling
- allows for overscroll / scrolling tabs via scrollable attribute
- changes the indicator to a div - will need to animate it
- updates e2e tests and add spec test
fixes#16232fixes#16081
references #14853
BREAKING CHANGES
Segment Button now requires the text to be wrapped in an `ion-label` element for improved styling.
*Old usage:*
```html
<ion-segment-button>
Item One
</ion-segment-button>
```
*New usage:*
```html
<ion-segment-button>
<ion-label>Item One</ion-label>
</ion-segment-button>
```
Note: this will not technically break your app, but the styles may look wrong.
