ionic-framework

Bug Fixes

• all: resolve compilation issues with Stencil 2.10 (#24152) (8b940e5), closes #24153
• datetime: resolve month and year jumping issue on ios (#24142) (27aef93), closes #23910

Bug Fixes

• accordion-group: ionChange is now fired properly in vue (#24063) (61b99d1), closes #23762
• angular: resolve issues with ng add on angular 12 (#23970) (3451a34)
• datetime: clear button is now rendered even if showDefaultButtons is false (#24075) (e3996cf)
• datetime: default sizing preserves shape of datetime (#24104) (71fab0f)
• infinite-scroll: infinite scroll event now fired with custom elements build (#24043) (8a86cfb), closes #24034
• modal: fix backdrop animation for sheets with off-center backdropBreakpoint (#24061) (49db6d0)
• react: overlays shown with useIonModal and useIonPopover no longer render outside of main react tree (f3e492c), closes #23516 #23516

Bug Fixes

• menu: added focus trapping, improved compatibility with screen readers (#24076) (bdb268a)
• vue: back button now selects correct route when navigating from view multiple times (#24060) (a09d7d4), closes #23987
• vue: mount correct views when navigating (#24056) (24659a5), closes #23914

Bug Fixes

• angular: setup config properly (#24054) (e001f24), closes #24051 #24052
• back-button: pass aria-label to native element (#24027) (68a7e43)

Bug Fixes

• react: overlay hooks dismiss method now works (#24038) (655631d), closes #24030

Bug Fixes

• angular: setup config properly (#24028) (907996c)

Bug Fixes

• datetime: ionBlur and ionFocus now fires correctly (#23980) (86a77bd)
• datetime: ionChange is no longer called for out of range dates (#23940) (ea39c6e), closes #23939
• datetime: time picker uses new iOS 15 style (#23996) (0ab37b5), closes #23768
• modal: backdropBreakpoint is now an exclusive value (#23954) (ed455ab)
• react: ensure inline modal content is visible (#23968) (285a371)
• reorder-group: wait for content to render before getting scroll position (#24007) (225a278), closes #23875
• select: ensure popover options with number values are searched for correctly (#23998) (c204083)
• select: focus selected item in popovers (#23991) (2497a53)

Features

• all: add CustomEvents types to components that emit events (#23956) (8708095), closes #22925
• header, footer: add ios fading header style (#24011) (7ce3959)

BREAKING CHANGES

• radio: The RadioChangeEventDetail interface has been removed in favor of RadioGroupChangeEventDetail.

Bug Fixes

• alert: made it easier to tell if alert is scrollable in MD mode (#23976) (a262753)
• angular: use initialize function when setting up ionic angular to avoid config errors (#24004) (f112ad4), closes #22853
• item-sliding: closing an item can no longer be interrupted (#23973) (3ca0419), closes #23969
• react: overlay hooks memorised properly to prevent re-renders (#24010) (2c97712), closes #23741
• select-popover: non-scrollable popovers no longer have forced overscroll (#23972) (aa4ba89), closes #23971
• status-bar: tapping status bar correctly scrolls content to top (#24001) (25eb8cd), closes #20423

Bug Fixes

• angular: select method now has correct types (#23953) (3c1be89), closes #23952
• item-sliding: item-sliding accounts for multiple ion-item elements (#23943) (8108edd), closes #19312
• label: only inherit color if color property is set on ion-item (#23944) (ae1325c), closes #20125

Bug Fixes

• menu: add console error for incorrect usage of contentId (#23871) (879ab8e), closes #23810
• modal: add sheet modal properties for angular (#23899) (d1763fc)
• modal: expose breakpoint props in ModalOptions interface (#23867) (5fd80fd), closes #23866
• modal: handle on sheet modal can now be turned off (#23900) (e2d2ad6)
• modal: modal displays in middle of screen on desktop (#23911) (9d87028)
• modal: sheet animation works correctly if breakpoints value does not include 1 (#23927) (414f246)
• modal: sheet modal handle is now positioned correctly (#23901) (58a4ba2)
• modal: sheet modal now accounts for safe area (#23884) (195d817), closes #23874

Features

• datetime: add ability to select only month, year, or month and year (#23913) (4ae44b7)
• datetime: add clear button (#23920) (18765e7), closes #17482
• platform: add ability to override platform detection methods (#23915) (45cabae), closes #19737
• react: add custom elements bundle (#23896) (c50d895)

Bug Fixes

• angular: nested tabs now go to correct page (#23902) (1ed9f07), closes #23897
• header: role attribute can now be customized (#23888) (8888e2b), closes #21327
• react: modal now mounts child component independently of other modals (#23903) (1e13429), closes #23904
• tab-bar: safe area padding now added when slot="top" (#23895) (4782969), closes #23893

Features

• action-sheet, loading, modal, picker, popover: pass HTML attributes to host element (#23929) (bd96a81)
• alert, toast: pass arbitrary HTML attributes to host element (#23891) (73a1daf), closes #23825

Bug Fixes

• angular: overlay interfaces are now properly exported (#23847) (c925274), closes #23846
• datetime: prevent vertical page scroll on interaction (#23780) (950350a), closes #23554
• item: form validation states are now properly shown (#23853) (5ca2ce9), closes #23733 #23850
• overlays: thrown errors are no longer suppressed (#23831) (a212eb5), closes #22724

Features

• modal: add bottom sheet functionality (#23828) (12216d3), closes #21039
• popover: add ability to pass event to present method (#23827) (1d2ee92), closes #23813

Bug Fixes

• alert: AlertButton role now has correct types (#23791) (864212b)
• label: label now only takes up as much space as needed when slotted (#23807) (9932e26), closes #23806
• reorder-group: dragging reorder item to bottom no longer gives out of bounds index (#23797) (02409f2), closes #23796
• vue: router guards are now fire correctly when written in a component (#23821) (3c44222), closes #23820

Features

• slides: add IonicSlides module for Swiper migration, deprecate ion-slides (#23844) (11fda41), closes #23447

Code Refactoring

• virtual-scroll: deprecated virtual scroll in favor of solutions provided by JS frameworks (#23854) (a0229bc)

Bug Fixes

• datetime: reduce time presentation min height (#23771) (bc4e826), closes #23690
• datetime: text color on ios mode now accounts for color contrast (#23729) (5980db4), closes #23723
• item: highlight now appears above helper/error text (#23763) (2995e33), closes #23510
• toast: ToastOptions interface now contains icon prop (#23737) (fbd32ff), closes #23736
• vue: custom element internal properties are no longer overridden in vue 3.1.0 (#23738) (ea39c70), closes #23539
• vue: modal and popover components now correctly pass properties (#23761) (578b906), closes #23698

Features

• action-sheet: add data property to ActionSheetButton (#23744) (30f8508), closes #23700
• datetime: add firstDayOfWeek property (#23692) (ea348f0), closes #23556
• datetime: add hourCycle property (#23686) (6342fde), closes #23661

Bug Fixes

• back-button: MD ripple now accounts for --ripple-color (#23749) (6b18a89), closes #23748
• img: correctly determine when to load image when scrolling quickly on slower devices (#23704) (067e621), closes #23703
• item-sliding: prevent scrolling during slide gesture (#23774) (e0c4ad3), closes #19564
• nav: custom animation is now used correctly (#23779) (f9415ef), closes #23777
• vue: using router.go now shows correct view (#23773) (621f4fa), closes #22563

Bug Fixes

• list: change inset border radius to match iOS 15 (#23711) (fe2810b)
• popover: fix keyboard arrow navigation (#23709) (f2e7a26), closes #23512
• vue: popover positioning is now correct with custom elements build (#23680) (3a1a9cb)

Features

• toast: add icon property to show icon at start of toast content (#23596) (df24c8c), closes #23524

Bug Fixes

• checkbox, radio: change event interfaces correctly use TypeScript generics for value (#23044) (8a941fd)
• gesture: onEnd now correctly fires even if the event target was removed from the DOM (#23713) (4edb5e2), closes #22819
• item-sliding: opening item while other items are open no longer requires multiple swipes (#23683) (792864f), closes #21579
• react: IonTabs no longer causes SSR to fail (#23696) (f2a05be), closes #23651
• vue: improve accuracy of ion-page dev warning (#23677) (fb260a9), closes #23675
• vue: tabs warning about user-provided router outlet change is now correctly logged (#23724) (4a64e97), closes #23719

Bug Fixes

• accordion: value can now be set as string when using multiple is true (#23581) (8f172de), closes #23550
• angular: modal and popover now have correct props defined on angular component (#23565) (e5a7b34)
• datetime: keyboard can now be used to navigate between years (#23585) (55bd1f7), closes #21553 #18122
• datetime: selecting time now works correctly on firefox (#23583) (4188964), closes #23545
• datetime: years displayed now more consistent with v5 datetime, max and min are now accounted for in MD mode (#23616) (be219a2), closes #23615

Features

• breadcrumbs: ionCollapsedClick event payload now contains references to collapsed breadcrumb elements (#23611) (9ce57d2), closes #23552
• datetime: add showDefaultTimeLabel property and time-label slot (#23577) (7ac0109), closes #23555
• datetime: add size property (#23649) (321341d), closes #23518
• range: add support for customizing pin format (#22972) (8f2c4f7)
• segment: add keyboard navigation, add selectOnFocus property to control selection follow focus behavior (#23590) (b6c53e5), closes #23520
• select: update popover interface to match MD spec on desktop, allow multiple values in popover interface (#23474) (2c07a15), closes #23657 #15500 #12310

Performance Improvements

• remove shims for legacy browsers no longer supported in v6 (#23592) (259b135)

Bug Fixes

• action-sheet: header, subheader, and icon alignment better matches native ios (#23322) (39315bc), closes #23317
• button: buttons are now disabled during page transitions (#23589) (3b803eb), closes #23588
• item: mirror disabled prop to aria attribute (#23544) (9021e7c), closes #23513
• menu-button: custom aria-label can now be set (#23608) (c08345d), closes #23604
• overlays: overlay interfaces are now exported from framework packages and documented (#23619) (773bbcb), closes #22790
• router-outlet: improve reliability of swipe back gesture when quickly swiping back (#23527) (fa06942), closes #22895

Bug Fixes

• accordion: improved reliability of accordion animations (#23531) (6fbd60b), closes #23504
• content: add touch-action manipulation for zoom and pan (#23534) (6ca1780), closes #22805
• datetime: scroll position no longer gets reset when using datetime in overlay (#23543) (b735b58)
• input, select, textarea: change type of placeholder prop to string only (#23500) (f3ae431), closes #22976
• popover: size property now works when providing only event (#23532) (bdc1f23), closes #23528
• popover: update animation to better match MD spec (#23541) (bdb95b7)
• react: export accordion and accordion group components (#23497) (a664d42)
• vue: navigating between parameterized pages now results in page transition (#23525) (e30b17c), closes #22662

Features

• accordion-group: add animated property to disable animations (#23530) (9a60dd0)
• action-sheet, alert: add id to AlertButton and ActionSheetButton (#18992) (9e24a0b), closes #22959
• vue: extend useIonRouter hook for programmatic navigation with animation control (#23499) (fc9e1b4), closes #23450

BREAKING CHANGES

We recommend updating to the latest version of 5.x before trying out version 6 in order to see deprecation warnings related to your app in the developer console.

• input, select, textarea: Updated the placeholder property on ion-input, ion-textarea, and ion-select to have a type of string | undefined.
• vue: The IonRouter type for useIonRouter has been renamed to UseIonRouterResult, and the IonKeyboardRef type for useKeyboard has been renamed to UseKeyboardResult.

Please see the BREAKING.md file for a complete list of breaking changes in Framework v6.

Looking to test out the Framework v6 beta? Check out our v6 Beta Getting Started Guide.