ionic-framework

Bug Fixes

• all add missing vendor prefixes to css (0989ea5)

Bug Fixes

• alert: correctly position alert when keyboard is open (#22425) (9752cd6)
• ios: contenteditable elements are now selectable on iOS (#22404) (023fb18), closes #18368
• item: only add click event listener to items with inputs (#22352) (9659ad6), closes #22011
• range: gesture is now properly re-created on connectedCallback (#22407) (2fea36f), closes #22335
• refresher: work properly in modal by waiting for content to be ready (#22390) (91d0414), closes #22256
• segment-button: color property is now reactive if previously undefined (#22405) (04161c9), closes #20831
• vue: correctly switch tabs after going back (#22309) (daf6a92), closes #22307
• vue: ensure view is updated correctly when replacing a route outside of a nav guard (#22429) (5a4d0c0), closes #22412

Performance Improvements

• ios: move content to stacking context to improve scrolling performance on iOS devices (#22180) (9f44966)

Bug Fixes

• select: properly align label with select in item in MD mode (#22330) (1a2e532), closes #19887
• vue: going back with query params now goes to correct view (#22350) (561a4ac), closes #22324
• vue: improve compatibility with route guards (#22371) (31f9bc8), closes #22344
• vue: improve handling of parameterized urls (#22360) (6fad0fe), closes #22359
• vue: lifecycle events are now fired in component context (#22348) (bcef804), closes #22338

This is the first stable release of Ionic Vue.

Enjoy the Vue! 🎉

New to Ionic Vue?

Check out our Quickstart Guide to get up and running. Then be sure to check out our Building Your First App Guide to learn how build a cross platform Ionic Vue application from start to finish!

This version is dedicated to our upcoming Ionic Vue release.

Bug Fixes

• vue: ion-page component is now properly shown with HMR (#22319) (c5ab562)

Upgrade Steps

npm install @ionic/[email protected] @ionic/[email protected] --save-exact

New to Ionic Vue?

Check out our Quickstart Guide to get up and running. Then be sure to check out our Building Your First App Guide to learn how build a cross platform Ionic Vue application from start to finish!

This version is dedicated to our upcoming Ionic Vue release.

Bug Fixes

• vue: do not hide page content when using ion-page in non-routing contexts (#22302) (fff82d0), closes #22300
• vue: going back from tabs page to a non-tabs page now selects correct page (#22275) (b06ae16), closes #22258
• vue: improve swipe to go back reliability (#22288) (c74fd41), closes #22237
• vue: modal, popover, and nav are now created within application context (#22282) (6026c65), closes #22079
• vue: pages now render in correct outlet when using multiple nested outlets (#22301) (52f655c), closes #22286

Upgrade Steps

npm install @ionic/[email protected] @ionic/[email protected] --save-exact

New to Ionic Vue?

Check out our Quickstart Guide to get up and running. Then be sure to check out our Building Your First App Guide to learn how build a cross platform Ionic Vue application from start to finish!

This version is dedicated to our upcoming Ionic Vue release.

Bug Fixes

• vue: correctly handle query params (#22253) (6849dd3), closes #22229
• vue: correctly show ion-back-button when going back (#22260) (39d2530), closes #22217
• vue: hide layout shift on ion-page components (#22254) (2bad1bb), closes #22052
• vue: ion-tab-bar no longer throws undefined error when re-creating tabs (#22261) (d746561), closes #22255

Upgrade Steps

npm install @ionic/[email protected] @ionic/[email protected] --save-exact

New to Ionic Vue?

Check out our Quickstart Guide to get up and running. Then be sure to check out our Building Your First App Guide to learn how build a cross platform Ionic Vue application from start to finish!

Bug Fixes

• button: allow any element type to use the "icon-only" slot (#22168) (c454c84)
• datetime: do not set ampm when the column doesn't exist (#22220) (18fb885), closes #22149
• datetime: remove the automatic switching from am to pm (#22207) (f81d18c), closes #18924 #22171 #22199
• item: properly align datetime and select with fixed or no labels (#22221) (f42c688), closes #18773 #18761 #18779
• label: keep color when focused on a floating or stacked label (#18576) (992580a), closes #18531
• select: do not close popover or set value when switching with arrow keys (#22210) (1878c8e), closes #22179

Bug Fixes

• datetime: do not set ampm when the column doesn't exist (#22224) (210db5b)

Bug Fixes

• datetime: remove the automatic switching from am to pm and vice versa (#22208) (0d56c51), closes #18924

Bug Fixes

• alert: follow accessibility guidelines outlined by wai-aria (#22159) (e9b2cc8), closes #21744
• overlays: return focus to presenting element after dismissal (#22167) (cc45ad8), closes #21768
• picker-column: add cancelable check to avoid intervention error in chrome (#22140) (a24a041), closes #22137
• radio: follow accessibility guidelines outlined by wai-aria (#22113) (ea0e049), closes #21743
• reorder: allow click event propagation when reorder group is disabled (#21947) (baafe08), closes #21017
• segment: do not allow text selection on desktop (#22158) (1526bdf)

Performance Improvements

• segment: improve scrolling performance on ios when using segment (#22110) (68afc49), closes #22095

Bug Fixes

• datetime: do not reset to am when changing hour and pm is set (#21997) (8b85fe0), closes #19175 #19260 #20026 #16630
• input: only focus the first input / textarea when clicking on the parent item (#22049) (99f2532), closes #22037 #22032
• react: Keep a hold of previous routes when doing a redirect, closes #22053 (74af3cb)
• react: redirect routes should unmount leaving component, fixes #22022 (#22029) (b11e06c)
• textarea: do not generate duplicate IDs between ion-input and ion-textarea (#22074) (c72c7ff), closes #21542

Bug Fixes

• datetime: do not reset to am when changing the hour and pm is set (#22016) (1dac5a4), closes #19175 #19260 #20026 #16630

Bug Fixes

• input: improve reliability of scroll assist when accessory bar is enabled (#21936) (22477fb), closes #21912
• input: properly focus the input when clicking the item padding in WebKit (#21930) (e4964ff), closes #21509
• input: remain focused in the input after pressing the clear button (#21985) (6878fb9), closes #21549
• label: use translateY so input caret shows up due to webkit issue (#21949) (00eac33), closes #21943
• overlays: prevent focus from being stolen when presenting another overlay from within a modal (#21856) (5c177d7), closes #21840
• range: properly display stacked labels in an item with a range (#21944) (9f4b01e), closes #21625
• react: export correct animation types (#21950) (36e4bf7)
• react: removed exporting of ionRenderToString to decrease bundle size, closes #21917 (#21928) (434befe)
• react: setting active tab properly on mount, closes #21830 (#21833) (f58424f)
• react: fix tab currentHref when changing tabs, closes #21834 (#21835) (74468ab)

Bug Fixes

• react: properly extend HTMLElement for tabs (bfddb17), closes #21803

Bug Fixes

• angular: per-page animations now work with swipe to go back (#21706) (2664587), closes #21692
• datetime: remove unneeded combobox role (#21708) (f00ad8a)
• input: clear button can now be tabbed to (#21633) (1dcd9de)
• ios: improve scroll assist reliability on password inputs (#21703) (3cbf9e7), closes #21688
• keyboard: keyboard events now consistently fire on android (#21741) (020f3cc), closes #21734
• nav: insertPages method correctly inserts multiple pages with props (#21725) (eb592b8), closes #21724
• overlays: trap focus inside overlay components except toast (#21716) (fff4aec), closes #21647
• segment-button: allow min-width to be overridden (#21722) (88f1828), closes #21105
• title: allow overriding of large title transform-origin (#21770) (dbe6853), closes #21761
• virtual-scroll: properly calculate top offset when nested (#21581) (d297ecb)

Features

• card: expose global card css variables (#21756) (096eef4), closes #21694
• input: accept datetime-local, month, and week type values (#21758) (fa93dff), closes #21757
• input, textarea: expose native events for ionBlur and ionFocus (#21777) (a625c83), closes #17363
• react: add custom history to IonReactRouter (#21775) (d4a5fbd), closes #20297
• react: add new react router (#21693) (c171ccb)
• router: add navigation hooks (#21709) (77464ef)
• segment-button, toast: expose additional shadow parts (#21532) (a5e4669)
• select: add optional generic typings (#21514) (7c2d0c9)

Bug Fixes

• angular: expose createAnimation in addition to AnimationController (#21616) (a5b3750), closes #21615
• select: change role to listbox (#21609) (8c79e2c)
• slides: enable keyboard integration (#21608) (26674f1), closes #21554
• textarea: add aria-labelledby to native textarea (#21606) (88f23b1), closes #21600

Bug Fixes

• action-sheet, alert: resolve double click issue when running in iOS mode on chrome (#21506) (bcccc21), closes #21503
• angular: fix issue where navAnimation was being incorrectly overridden (#21508) (e968bd0), closes #21495
• input: add aria-label to clear button (#21538) (d8b377f), closes #21537
• ios: respect toolbar opacity when doing nav transition (#21512) (24cfdc3)
• segment: ensure checked classes get set after not having a value (#21547) (17308f2), closes #21546

Bug Fixes

• angular: resolve error when not using ngModel on components (4083e32)

Bug Fixes

• action-sheet, toast: allow button handler to return Promise<void> (#21259) (7703da2)
• angular: patch FormControl methods to properly sync Ionic form classes (#21429) (e95b481)
• datetime: ensure year-only values are not affected by timezone when parsing (#21309) (3937101)
• header: large title transition now works on older versions of iOS (#21339) (2dac12c)
• img: use setTimeout fallback on older versions of chrome (#21358) (0bf9449)
• ios: add haptic drag gesture for action sheet and alert components (#21060) (33be1f0)
• item: inherit align-items from parent item (#19278) (882f8fe), closes #18703
• item: input-wrapper now inherits overflow (#21282) (29d208d)
• menu-button: screen readers now properly announce menu button (#21324) (eaf4fb6)
• modal: card style modal no longer gets stuck when swiping quickly (#21224) (448dfa0)
• modal: set card-style modal height using the --height css variable (#21453) (a4f0bdb)
• reorder-group: revert item to original position when passing false to complete (#21396) (5f2001c), closes #19128
• router: use correct nav transition when going back (#21301) (c8db0d5)
• scroll-assist: improve scroll detection accuracy (#21416) (137c49d)
• slides: update Swiper dependency to resolve error when doing SSR (#21350) (3290604)
• textarea: native textarea inherits max/min width and height (#21333) (2377480)

Features

• alert: add destructive role to alert buttons (#21269) (e53f024)
• alert: add support for custom input attributes (#21365) (1ed8169)
• all: add all autocomplete values to input and searchbar (#21297) (4fd7c0c)
• all: add optional generic typings for overlay component methods (#21393) (5bf83b8)
• all: add shadow parts to missing components (#21436) (17375d2)
• all: add support for configuring animations on a per-page basis (#21433) (f34d375)
• angular: expose activatedView (#21302) (829a0d9)
• angular: expose getPlatforms and isPlatform (#21308) (4af54a2)
• angular: add strongly typed Ionic lifecycle hooks (#18044) (53fc8e3), closes #18043
• fab-button: add close icon font size css variable (#19628) (df408f9)
• fab-button: add closeIcon property (#19626) (698e526)
• select-option: pass class from the option to the interface for individual styling (#21304) (5285824)