From 21774612d8d70ab7eda3eab0e6e9ac039b5c87d8 Mon Sep 17 00:00:00 2001
From: Ni Tianzhen
Date: Tue, 3 Mar 2020 00:23:43 +0800
Subject: [PATCH 01/16] fix(datetime): max property now works when hour,
minute, or second set to 0 (#20665)
fixes #20652
---
core/src/components/datetime/datetime.tsx | 6 +++---
1 file changed, 3 insertions(+), 3 deletions(-)
diff --git a/core/src/components/datetime/datetime.tsx b/core/src/components/datetime/datetime.tsx
index 1d1cc91fa8..3300fbee5d 100644
--- a/core/src/components/datetime/datetime.tsx
+++ b/core/src/components/datetime/datetime.tsx
@@ -501,11 +501,11 @@ export class Datetime implements ComponentInterface {
min.day = min.day || 1;
max.day = max.day || 31;
min.hour = min.hour || 0;
- max.hour = max.hour || 23;
+ max.hour = max.hour === undefined ? 23 : max.hour;
min.minute = min.minute || 0;
- max.minute = max.minute || 59;
+ max.minute = max.minute === undefined ? 59 : max.minute;
min.second = min.second || 0;
- max.second = max.second || 59;
+ max.second = max.second === undefined ? 59 : max.second;
// Ensure min/max constraints
if (min.year > max.year) {
From f64b1420aead39b9056dc25cfdbcf95bc4f6f621 Mon Sep 17 00:00:00 2001
From: Mike Hartington
Date: Mon, 2 Mar 2020 14:46:03 -0500
Subject: [PATCH 02/16] fix(): exclude components from ssr (#20674)
---
.../angular-server/src/ionic-server-module.ts | 28 ++++++++++++++++++-
1 file changed, 27 insertions(+), 1 deletion(-)
diff --git a/packages/angular-server/src/ionic-server-module.ts b/packages/angular-server/src/ionic-server-module.ts
index f334a57606..212abcaf33 100644
--- a/packages/angular-server/src/ionic-server-module.ts
+++ b/packages/angular-server/src/ionic-server-module.ts
@@ -21,7 +21,33 @@ export class IonicServerModule {}
export function hydrateIonicComponents(doc: any, appId: any) {
return () => {
return hydrateDocument(doc, {
- clientHydrateAnnotations: false
+ clientHydrateAnnotations: false,
+ excludeComponents: [
+ // overlays
+ 'ion-action-sheet',
+ 'ion-alert',
+ 'ion-loading',
+ 'ion-modal',
+ 'ion-picker',
+ 'ion-popover',
+ 'ion-toast',
+ 'ion-toast',
+
+ // navigation
+ 'ion-router',
+ 'ion-route',
+ 'ion-route-redirect',
+ 'ion-router-link',
+ 'ion-router-outlet',
+
+ // tabs
+ 'ion-tabs',
+ 'ion-tab',
+
+ // auxiliar
+ 'ion-picker-column',
+ 'ion-virtual-scroll'
+ ]
})
.then(hydrateResults => {
hydrateResults.diagnostics.forEach(d => {
From 44993b7987031b6618409675fdbb1f15ec4ea343 Mon Sep 17 00:00:00 2001
From: Liam DeBeasi
Date: Thu, 5 Mar 2020 11:56:54 -0500
Subject: [PATCH 03/16] fix(segment): iOS mode segment now works on older
Android devices (#20673)
fixes #20648
---
core/src/components/segment-button/segment-button.scss | 4 ++++
1 file changed, 4 insertions(+)
diff --git a/core/src/components/segment-button/segment-button.scss b/core/src/components/segment-button/segment-button.scss
index 824e621c3d..2c6d1a1ef2 100644
--- a/core/src/components/segment-button/segment-button.scss
+++ b/core/src/components/segment-button/segment-button.scss
@@ -271,6 +271,8 @@ ion-ripple-effect {
box-sizing: border-box;
will-change: transform, opacity;
+
+ pointer-events: none;
}
.segment-button-indicator-background {
@@ -280,6 +282,8 @@ ion-ripple-effect {
transform: var(--indicator-transform);
box-shadow: var(--indicator-box-shadow);
+
+ pointer-events: none;
}
.segment-button-indicator-animated {
From 314dbb1a4d970327fcbb2f3fbdec0627c626fe4d Mon Sep 17 00:00:00 2001
From: Liam DeBeasi
Date: Thu, 5 Mar 2020 12:38:51 -0500
Subject: [PATCH 04/16] fix(segment): allow routerLink to work on segment
buttons (#20682)
fixes #20678
---
core/src/components/segment/segment.tsx | 1 -
1 file changed, 1 deletion(-)
diff --git a/core/src/components/segment/segment.tsx b/core/src/components/segment/segment.tsx
index 6526ad3fd0..72464ad9d8 100644
--- a/core/src/components/segment/segment.tsx
+++ b/core/src/components/segment/segment.tsx
@@ -143,7 +143,6 @@ export class Segment implements ComponentInterface {
const checkedValidButton = this.setNextIndex(detail, true);
- detail.event.preventDefault();
detail.event.stopImmediatePropagation();
if (checkedValidButton) {
From ec4878ac085d8ff92cb8b2ea0852523f174ab01b Mon Sep 17 00:00:00 2001
From: Liam DeBeasi
Date: Fri, 6 Mar 2020 10:09:39 -0500
Subject: [PATCH 05/16] fix(ios): large title animation now works properly in a
modal (#20703)
fixes #20696
---
core/src/utils/transition/ios.transition.ts | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/core/src/utils/transition/ios.transition.ts b/core/src/utils/transition/ios.transition.ts
index 422abc0d21..9462fa09d6 100644
--- a/core/src/utils/transition/ios.transition.ts
+++ b/core/src/utils/transition/ios.transition.ts
@@ -157,7 +157,7 @@ const animateBackButton = (rootAnimation: Animation, rtl: boolean, backDirection
};
const animateLargeTitle = (rootAnimation: Animation, rtl: boolean, backDirection: boolean, largeTitleEl: any, largeTitleBox: DOMRect, backButtonBox: DOMRect) => {
- const TITLE_START_OFFSET = (rtl) ? `calc(100% - ${largeTitleEl.right}px)` : `${largeTitleEl.left}px`;
+ const TITLE_START_OFFSET = (rtl) ? `calc(100% - ${largeTitleBox.right}px)` : `${largeTitleBox.left}px`;
const START_TRANSLATE = (rtl) ? '-18px' : '18px';
const ORIGIN_X = (rtl) ? 'right' : 'left';
From b6c2a77deb1c09eb1fd414f7737794e208ab5081 Mon Sep 17 00:00:00 2001
From: Liam DeBeasi
Date: Fri, 6 Mar 2020 10:11:20 -0500
Subject: [PATCH 06/16] fix(overlays): prevent accidental dismiss of overlays
when tapping screen twice (#20683)
fixes #20608
---
core/src/components/action-sheet/animations/ios.enter.ts | 6 +++++-
core/src/components/action-sheet/animations/md.enter.ts | 6 +++++-
core/src/components/alert/animations/ios.enter.ts | 6 +++++-
core/src/components/alert/animations/md.enter.ts | 6 +++++-
core/src/components/loading/animations/ios.enter.ts | 6 +++++-
core/src/components/loading/animations/md.enter.ts | 6 +++++-
core/src/components/modal/animations/ios.enter.ts | 6 +++++-
core/src/components/modal/animations/md.enter.ts | 6 +++++-
core/src/components/picker/animations/ios.enter.ts | 6 +++++-
core/src/components/popover/animations/ios.enter.ts | 6 +++++-
core/src/components/popover/animations/md.enter.ts | 6 +++++-
11 files changed, 55 insertions(+), 11 deletions(-)
diff --git a/core/src/components/action-sheet/animations/ios.enter.ts b/core/src/components/action-sheet/animations/ios.enter.ts
index faef96ff8f..0fb7754959 100644
--- a/core/src/components/action-sheet/animations/ios.enter.ts
+++ b/core/src/components/action-sheet/animations/ios.enter.ts
@@ -11,7 +11,11 @@ export const iosEnterAnimation = (baseEl: HTMLElement): Animation => {
backdropAnimation
.addElement(baseEl.querySelector('ion-backdrop')!)
- .fromTo('opacity', 0.01, 'var(--backdrop-opacity)');
+ .fromTo('opacity', 0.01, 'var(--backdrop-opacity)')
+ .beforeStyles({
+ 'pointer-events': 'none'
+ })
+ .afterClearStyles(['pointer-events']);
wrapperAnimation
.addElement(baseEl.querySelector('.action-sheet-wrapper')!)
diff --git a/core/src/components/action-sheet/animations/md.enter.ts b/core/src/components/action-sheet/animations/md.enter.ts
index 6d69774407..9f03de8ec5 100644
--- a/core/src/components/action-sheet/animations/md.enter.ts
+++ b/core/src/components/action-sheet/animations/md.enter.ts
@@ -11,7 +11,11 @@ export const mdEnterAnimation = (baseEl: HTMLElement): Animation => {
backdropAnimation
.addElement(baseEl.querySelector('ion-backdrop')!)
- .fromTo('opacity', 0.01, 'var(--backdrop-opacity)');
+ .fromTo('opacity', 0.01, 'var(--backdrop-opacity)')
+ .beforeStyles({
+ 'pointer-events': 'none'
+ })
+ .afterClearStyles(['pointer-events']);
wrapperAnimation
.addElement(baseEl.querySelector('.action-sheet-wrapper')!)
diff --git a/core/src/components/alert/animations/ios.enter.ts b/core/src/components/alert/animations/ios.enter.ts
index 3abd5cf619..2aac5ac227 100644
--- a/core/src/components/alert/animations/ios.enter.ts
+++ b/core/src/components/alert/animations/ios.enter.ts
@@ -11,7 +11,11 @@ export const iosEnterAnimation = (baseEl: HTMLElement): Animation => {
backdropAnimation
.addElement(baseEl.querySelector('ion-backdrop')!)
- .fromTo('opacity', 0.01, 'var(--backdrop-opacity)');
+ .fromTo('opacity', 0.01, 'var(--backdrop-opacity)')
+ .beforeStyles({
+ 'pointer-events': 'none'
+ })
+ .afterClearStyles(['pointer-events']);
wrapperAnimation
.addElement(baseEl.querySelector('.alert-wrapper')!)
diff --git a/core/src/components/alert/animations/md.enter.ts b/core/src/components/alert/animations/md.enter.ts
index 0e4e6eb612..2a98adbc9a 100644
--- a/core/src/components/alert/animations/md.enter.ts
+++ b/core/src/components/alert/animations/md.enter.ts
@@ -11,7 +11,11 @@ export const mdEnterAnimation = (baseEl: HTMLElement): Animation => {
backdropAnimation
.addElement(baseEl.querySelector('ion-backdrop')!)
- .fromTo('opacity', 0.01, 'var(--backdrop-opacity)');
+ .fromTo('opacity', 0.01, 'var(--backdrop-opacity)')
+ .beforeStyles({
+ 'pointer-events': 'none'
+ })
+ .afterClearStyles(['pointer-events']);
wrapperAnimation
.addElement(baseEl.querySelector('.alert-wrapper')!)
diff --git a/core/src/components/loading/animations/ios.enter.ts b/core/src/components/loading/animations/ios.enter.ts
index e5d3c335f5..962c588857 100644
--- a/core/src/components/loading/animations/ios.enter.ts
+++ b/core/src/components/loading/animations/ios.enter.ts
@@ -11,7 +11,11 @@ export const iosEnterAnimation = (baseEl: HTMLElement): Animation => {
backdropAnimation
.addElement(baseEl.querySelector('ion-backdrop')!)
- .fromTo('opacity', 0.01, 'var(--backdrop-opacity)');
+ .fromTo('opacity', 0.01, 'var(--backdrop-opacity)')
+ .beforeStyles({
+ 'pointer-events': 'none'
+ })
+ .afterClearStyles(['pointer-events']);
wrapperAnimation
.addElement(baseEl.querySelector('.loading-wrapper')!)
diff --git a/core/src/components/loading/animations/md.enter.ts b/core/src/components/loading/animations/md.enter.ts
index 9a6f45db21..dfba8b39cb 100644
--- a/core/src/components/loading/animations/md.enter.ts
+++ b/core/src/components/loading/animations/md.enter.ts
@@ -11,7 +11,11 @@ export const mdEnterAnimation = (baseEl: HTMLElement): Animation => {
backdropAnimation
.addElement(baseEl.querySelector('ion-backdrop')!)
- .fromTo('opacity', 0.01, 'var(--backdrop-opacity)');
+ .fromTo('opacity', 0.01, 'var(--backdrop-opacity)')
+ .beforeStyles({
+ 'pointer-events': 'none'
+ })
+ .afterClearStyles(['pointer-events']);
wrapperAnimation
.addElement(baseEl.querySelector('.loading-wrapper')!)
diff --git a/core/src/components/modal/animations/ios.enter.ts b/core/src/components/modal/animations/ios.enter.ts
index 884c0d4858..2d6c78b5b4 100644
--- a/core/src/components/modal/animations/ios.enter.ts
+++ b/core/src/components/modal/animations/ios.enter.ts
@@ -12,7 +12,11 @@ export const iosEnterAnimation = (
// The top translate Y for the presenting element
const backdropAnimation = createAnimation()
.addElement(baseEl.querySelector('ion-backdrop')!)
- .fromTo('opacity', 0.01, 'var(--backdrop-opacity)');
+ .fromTo('opacity', 0.01, 'var(--backdrop-opacity)')
+ .beforeStyles({
+ 'pointer-events': 'none'
+ })
+ .afterClearStyles(['pointer-events']);
const wrapperAnimation = createAnimation()
.addElement(baseEl.querySelector('.modal-wrapper')!)
diff --git a/core/src/components/modal/animations/md.enter.ts b/core/src/components/modal/animations/md.enter.ts
index 0f0b2b767d..750d72d2d5 100644
--- a/core/src/components/modal/animations/md.enter.ts
+++ b/core/src/components/modal/animations/md.enter.ts
@@ -11,7 +11,11 @@ export const mdEnterAnimation = (baseEl: HTMLElement): Animation => {
backdropAnimation
.addElement(baseEl.querySelector('ion-backdrop')!)
- .fromTo('opacity', 0.01, 'var(--backdrop-opacity)');
+ .fromTo('opacity', 0.01, 'var(--backdrop-opacity)')
+ .beforeStyles({
+ 'pointer-events': 'none'
+ })
+ .afterClearStyles(['pointer-events']);
wrapperAnimation
.addElement(baseEl.querySelector('.modal-wrapper')!)
diff --git a/core/src/components/picker/animations/ios.enter.ts b/core/src/components/picker/animations/ios.enter.ts
index d79166f6e1..c6a2c6ac1b 100644
--- a/core/src/components/picker/animations/ios.enter.ts
+++ b/core/src/components/picker/animations/ios.enter.ts
@@ -11,7 +11,11 @@ export const iosEnterAnimation = (baseEl: HTMLElement): Animation => {
backdropAnimation
.addElement(baseEl.querySelector('ion-backdrop')!)
- .fromTo('opacity', 0.01, 'var(--backdrop-opacity)');
+ .fromTo('opacity', 0.01, 'var(--backdrop-opacity)')
+ .beforeStyles({
+ 'pointer-events': 'none'
+ })
+ .afterClearStyles(['pointer-events']);
wrapperAnimation
.addElement(baseEl.querySelector('.picker-wrapper')!)
diff --git a/core/src/components/popover/animations/ios.enter.ts b/core/src/components/popover/animations/ios.enter.ts
index 3c94cc3072..0c3655ef32 100644
--- a/core/src/components/popover/animations/ios.enter.ts
+++ b/core/src/components/popover/animations/ios.enter.ts
@@ -104,7 +104,11 @@ export const iosEnterAnimation = (baseEl: HTMLElement, ev?: Event): Animation =>
backdropAnimation
.addElement(baseEl.querySelector('ion-backdrop')!)
- .fromTo('opacity', 0.01, 'var(--backdrop-opacity)');
+ .fromTo('opacity', 0.01, 'var(--backdrop-opacity)')
+ .beforeStyles({
+ 'pointer-events': 'none'
+ })
+ .afterClearStyles(['pointer-events']);
wrapperAnimation
.addElement(baseEl.querySelector('.popover-wrapper')!)
diff --git a/core/src/components/popover/animations/md.enter.ts b/core/src/components/popover/animations/md.enter.ts
index b553316e1b..30cc2dbdce 100644
--- a/core/src/components/popover/animations/md.enter.ts
+++ b/core/src/components/popover/animations/md.enter.ts
@@ -86,7 +86,11 @@ export const mdEnterAnimation = (baseEl: HTMLElement, ev?: Event): Animation =>
backdropAnimation
.addElement(baseEl.querySelector('ion-backdrop')!)
- .fromTo('opacity', 0.01, 'var(--backdrop-opacity)');
+ .fromTo('opacity', 0.01, 'var(--backdrop-opacity)')
+ .beforeStyles({
+ 'pointer-events': 'none'
+ })
+ .afterClearStyles(['pointer-events']);
wrapperAnimation
.addElement(baseEl.querySelector('.popover-wrapper')!)
From 22d52568100d8096ee36e3a61a19614f0d63d45f Mon Sep 17 00:00:00 2001
From: Liam DeBeasi
Date: Fri, 6 Mar 2020 10:12:21 -0500
Subject: [PATCH 07/16] fix(modal): leave animation transitions modal
completely out of viewport on ipad (#20702)
fixes #20697
---
core/src/components/modal/animations/ios.enter.ts | 2 +-
core/src/components/modal/animations/ios.leave.ts | 2 +-
2 files changed, 2 insertions(+), 2 deletions(-)
diff --git a/core/src/components/modal/animations/ios.enter.ts b/core/src/components/modal/animations/ios.enter.ts
index 2d6c78b5b4..608fb04b31 100644
--- a/core/src/components/modal/animations/ios.enter.ts
+++ b/core/src/components/modal/animations/ios.enter.ts
@@ -21,7 +21,7 @@ export const iosEnterAnimation = (
const wrapperAnimation = createAnimation()
.addElement(baseEl.querySelector('.modal-wrapper')!)
.beforeStyles({ 'opacity': 1 })
- .fromTo('transform', 'translateY(100%)', 'translateY(0%)');
+ .fromTo('transform', 'translateY(100vh)', 'translateY(0vh)');
const baseAnimation = createAnimation()
.addElement(baseEl)
diff --git a/core/src/components/modal/animations/ios.leave.ts b/core/src/components/modal/animations/ios.leave.ts
index 09056d3d03..dc220e8165 100644
--- a/core/src/components/modal/animations/ios.leave.ts
+++ b/core/src/components/modal/animations/ios.leave.ts
@@ -18,7 +18,7 @@ export const iosLeaveAnimation = (
const wrapperAnimation = createAnimation()
.addElement(baseEl.querySelector('.modal-wrapper')!)
.beforeStyles({ 'opacity': 1 })
- .fromTo('transform', 'translateY(0%)', 'translateY(100%)');
+ .fromTo('transform', 'translateY(0vh)', 'translateY(100vh)');
const baseAnimation = createAnimation()
.addElement(baseEl)
From 7d260b96a73958709fa93a4fe58f816a445471ee Mon Sep 17 00:00:00 2001
From: Liam DeBeasi
Date: Fri, 6 Mar 2020 13:19:48 -0500
Subject: [PATCH 08/16] fix(modal): swipeable modal now works in firefox
(#20714)
fixes #20706
---
core/src/components/modal/animations/ios.enter.ts | 8 +++++++-
core/src/components/modal/animations/ios.leave.ts | 3 ++-
core/src/components/modal/modal.ios.scss | 8 +++++++-
3 files changed, 16 insertions(+), 3 deletions(-)
diff --git a/core/src/components/modal/animations/ios.enter.ts b/core/src/components/modal/animations/ios.enter.ts
index 608fb04b31..b21f237cf0 100644
--- a/core/src/components/modal/animations/ios.enter.ts
+++ b/core/src/components/modal/animations/ios.enter.ts
@@ -31,7 +31,13 @@ export const iosEnterAnimation = (
.addAnimation([backdropAnimation, wrapperAnimation]);
if (presentingEl) {
- const modalTransform = (presentingEl.tagName === 'ION-MODAL' && (presentingEl as HTMLIonModalElement).presentingElement !== undefined) ? '-10px' : 'max(30px, var(--ion-safe-area-top))';
+ /**
+ * Fallback for browsers that does not support `max()` (ex: Firefox)
+ * No need to wrry about statusbar padding since engines like Gecko
+ * are not used as the engine for standlone Cordova/Capacitor apps
+ */
+ const transformOffset = (!CSS.supports('width', 'max(0px, 1px)')) ? '30px' : 'max(30px, var(--ion-safe-area-top))';
+ const modalTransform = (presentingEl.tagName === 'ION-MODAL' && (presentingEl as HTMLIonModalElement).presentingElement !== undefined) ? '-10px' : transformOffset;
const bodyEl = document.body;
const toPresentingScale = SwipeToCloseDefaults.MIN_PRESENTING_SCALE;
const finalTransform = `translateY(${modalTransform}) scale(${toPresentingScale})`;
diff --git a/core/src/components/modal/animations/ios.leave.ts b/core/src/components/modal/animations/ios.leave.ts
index dc220e8165..1500f224bf 100644
--- a/core/src/components/modal/animations/ios.leave.ts
+++ b/core/src/components/modal/animations/ios.leave.ts
@@ -27,7 +27,8 @@ export const iosLeaveAnimation = (
.addAnimation([backdropAnimation, wrapperAnimation]);
if (presentingEl) {
- const modalTransform = (presentingEl.tagName === 'ION-MODAL' && (presentingEl as HTMLIonModalElement).presentingElement !== undefined) ? '-10px' : 'max(30px, var(--ion-safe-area-top))';
+ const transformOffset = (!CSS.supports('width', 'max(0px, 1px)')) ? '30px' : 'max(30px, var(--ion-safe-area-top))';
+ const modalTransform = (presentingEl.tagName === 'ION-MODAL' && (presentingEl as HTMLIonModalElement).presentingElement !== undefined) ? '-10px' : transformOffset;
const bodyEl = document.body;
const currentPresentingScale = SwipeToCloseDefaults.MIN_PRESENTING_SCALE;
const presentingAnimation = createAnimation()
diff --git a/core/src/components/modal/modal.ios.scss b/core/src/components/modal/modal.ios.scss
index a92867c32b..98f714a459 100644
--- a/core/src/components/modal/modal.ios.scss
+++ b/core/src/components/modal/modal.ios.scss
@@ -28,5 +28,11 @@
:host(.modal-card) .modal-wrapper {
@include border-radius($modal-ios-border-radius, $modal-ios-border-radius, 0, 0);
- height: calc(100% - max(30px, var(--ion-safe-area-top)) - 10px);
+ height: calc(100% - 40px);
+}
+
+@supports (width: max(0px, 1px)) {
+ :host(.modal-card) .modal-wrapper {
+ height: calc(100% - max(30px, var(--ion-safe-area-top)) - 10px);
+ }
}
\ No newline at end of file
From f796074f33bc7165452fb30fcf1d2289eb5598a2 Mon Sep 17 00:00:00 2001
From: Liam DeBeasi
Date: Tue, 10 Mar 2020 11:22:36 -0400
Subject: [PATCH 09/16] chore(): set @nguniversal/builders dependency to exact
version (#20734)
---
angular/test/test-app/package.json | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/angular/test/test-app/package.json b/angular/test/test-app/package.json
index 84c79db167..5299f995b7 100644
--- a/angular/test/test-app/package.json
+++ b/angular/test/test-app/package.json
@@ -41,7 +41,7 @@
"@angular/cli": "^9.0.0-rc.2",
"@angular/compiler-cli": "^9.0.0-rc.2",
"@angular/language-service": "^9.0.0-rc.2",
- "@nguniversal/builders": "^9.0.0-next.9",
+ "@nguniversal/builders": "9.0.0-next.9",
"@types/express": "^4.17.0",
"@types/jasmine": "3.4.1",
"@types/node": "^12.11.1",
From f6c3ba7e5af2af9e32f75306cde7704509e82263 Mon Sep 17 00:00:00 2001
From: Liam DeBeasi
Date: Wed, 11 Mar 2020 10:52:33 -0400
Subject: [PATCH 10/16] fix(header): collapsable header should default to using
content background (#20736)
fixes #20691
---
core/src/components/header/header.ios.scss | 8 +++++++-
1 file changed, 7 insertions(+), 1 deletion(-)
diff --git a/core/src/components/header/header.ios.scss b/core/src/components/header/header.ios.scss
index e401c1bef9..d722f67c74 100644
--- a/core/src/components/header/header.ios.scss
+++ b/core/src/components/header/header.ios.scss
@@ -50,7 +50,13 @@
z-index: 1;
}
+/**
+ * Large title toolbar should just use the content background
+ * since it needs to blend in with the header above it.
+ */
.header-collapse-condense ion-toolbar {
+ --background: var(--ion-background-color, #fff);
+
z-index: 0;
}
@@ -81,4 +87,4 @@
.header-collapse-condense-inactive.header-collapse-condense ion-toolbar.in-toolbar ion-title,
.header-collapse-condense-inactive.header-collapse-condense ion-toolbar.in-toolbar ion-buttons.buttons-collapse {
visibility: hidden;
-}
\ No newline at end of file
+}
From 87a27216d011f1d02ac0fc0aeb3ae0400ecfbd8c Mon Sep 17 00:00:00 2001
From: Liam DeBeasi
Date: Wed, 11 Mar 2020 10:58:26 -0400
Subject: [PATCH 11/16] fix(header): collapsible header now works when
navigating quickly (#20728)
fixes #20725
---
core/src/components/header/header.tsx | 4 +++-
1 file changed, 3 insertions(+), 1 deletion(-)
diff --git a/core/src/components/header/header.tsx b/core/src/components/header/header.tsx
index f9f59a4862..17376a2e56 100644
--- a/core/src/components/header/header.tsx
+++ b/core/src/components/header/header.tsx
@@ -129,7 +129,9 @@ export class Header implements ComponentInterface {
cloneElement('ion-title');
cloneElement('ion-back-button');
- this.collapsibleMainHeader!.classList.add('header-collapse-main');
+ if (this.collapsibleMainHeader !== undefined) {
+ this.collapsibleMainHeader.classList.add('header-collapse-main');
+ }
});
this.collapsibleHeaderInitialized = true;
From 7ecde36f9d31327a45f7b5023ed533edbb9cc709 Mon Sep 17 00:00:00 2001
From: Brandy Carney
Date: Wed, 11 Mar 2020 11:35:26 -0400
Subject: [PATCH 12/16] fix(button): allow overflow to be overridden by the CSS
variable (#20738)
fixes #20726
---
core/src/components/button/button.scss | 4 ++--
core/src/components/button/test/states/index.html | 12 ++++++------
2 files changed, 8 insertions(+), 8 deletions(-)
diff --git a/core/src/components/button/button.scss b/core/src/components/button/button.scss
index 7fef42e6a6..44b2288767 100644
--- a/core/src/components/button/button.scss
+++ b/core/src/components/button/button.scss
@@ -179,13 +179,13 @@
line-height: 1;
box-shadow: var(--box-shadow);
+
contain: layout style;
cursor: pointer;
+
opacity: var(--opacity);
overflow: var(--overflow);
- overflow: hidden;
-
z-index: 0;
box-sizing: border-box;
appearance: none;
diff --git a/core/src/components/button/test/states/index.html b/core/src/components/button/test/states/index.html
index b804cd495e..19c8d48a3f 100644
--- a/core/src/components/button/test/states/index.html
+++ b/core/src/components/button/test/states/index.html
@@ -23,7 +23,7 @@
Clear
Default
- Round
+ Round
Outline
Clear
@@ -37,7 +37,7 @@
Clear
Default
- Round
+ Round
Outline
Clear
@@ -51,7 +51,7 @@
Clear
Default
- Round
+ Round
Outline
Clear
@@ -65,7 +65,7 @@
Clear
Default
- Round
+ Round
Outline
Clear
Default
@@ -75,7 +75,7 @@
Clear
Default
- Round
+ Round
Outline
Clear
Default
@@ -85,7 +85,7 @@
Clear
Default
- Round
+ Round
Outline
Clear
From a1bf2f5b8f47182152c1c434f4bb47607334d35f Mon Sep 17 00:00:00 2001
From: Adam Bradley
Date: Wed, 11 Mar 2020 10:36:04 -0500
Subject: [PATCH 13/16] chore(ionicons): bump ionicons version (#20704)
---
core/package.json | 2 +-
packages/react/package.json | 2 +-
vue/package-lock.json | 6 +++---
vue/package.json | 2 +-
4 files changed, 6 insertions(+), 6 deletions(-)
diff --git a/core/package.json b/core/package.json
index a28d78077e..36e014af96 100644
--- a/core/package.json
+++ b/core/package.json
@@ -30,7 +30,7 @@
"loader/"
],
"dependencies": {
- "ionicons": "^5.0.0",
+ "ionicons": "^5.0.1",
"tslib": "^1.10.0"
},
"devDependencies": {
diff --git a/packages/react/package.json b/packages/react/package.json
index 4251df4383..c26051c7d7 100644
--- a/packages/react/package.json
+++ b/packages/react/package.json
@@ -40,7 +40,7 @@
],
"dependencies": {
"@ionic/core": "5.0.4",
- "ionicons": "^5.0.0",
+ "ionicons": "^5.0.1",
"tslib": "*"
},
"peerDependencies": {
diff --git a/vue/package-lock.json b/vue/package-lock.json
index d8a758966e..e8bc51665c 100644
--- a/vue/package-lock.json
+++ b/vue/package-lock.json
@@ -571,9 +571,9 @@
"dev": true
},
"ionicons": {
- "version": "5.0.0-13",
- "resolved": "https://registry.npmjs.org/ionicons/-/ionicons-5.0.0-13.tgz",
- "integrity": "sha512-CG9tZRWm4S3abz8ie7JsoO4ZvY5JeNYG6UEIHjCNNns0m/XVNhEK50CTVSAkc+ybPmSnbMh3r0ELVRyordshpg=="
+ "version": "5.0.1",
+ "resolved": "https://registry.npmjs.org/ionicons/-/ionicons-5.0.1.tgz",
+ "integrity": "sha512-P9GHr7pgCJcG211W0wute49NZ9AvJZvFJf4OwYybakjX6j7tu0q5t5HNWn9bcb9YjI7SxBblJg8iqQ1Yb59DXw=="
},
"is-buffer": {
"version": "1.1.6",
diff --git a/vue/package.json b/vue/package.json
index dd6ad3bbaf..b8de75ec21 100644
--- a/vue/package.json
+++ b/vue/package.json
@@ -46,7 +46,7 @@
},
"dependencies": {
"@ionic/core": "^4.6.0",
- "ionicons": "^5.0.0-13"
+ "ionicons": "^5.0.1"
},
"devDependencies": {
"rollup": "^0.62.0",
From d53595eb1629e0d60f7e832414e84c544e184346 Mon Sep 17 00:00:00 2001
From: Brandy Carney
Date: Wed, 11 Mar 2020 11:52:01 -0400
Subject: [PATCH 14/16] fix(item): apply proper margin left for slotted icon in
RTL (#20684)
fixes #20653
---
core/src/components/item/item.ios.vars.scss | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/core/src/components/item/item.ios.vars.scss b/core/src/components/item/item.ios.vars.scss
index d8a8fb053a..a798da6317 100644
--- a/core/src/components/item/item.ios.vars.scss
+++ b/core/src/components/item/item.ios.vars.scss
@@ -113,7 +113,7 @@ $item-ios-icon-slot-margin-end: null !default;
$item-ios-icon-slot-margin-bottom: 7px !default;
/// @prop - Margin start for an icon in the start/end slot
-$item-ios-icon-slot-margin-start: 0 !default;
+$item-ios-icon-slot-margin-start: null !default;
/// @prop - Margin top for the end slot inside of a floating/stacked label
$item-ios-label-slot-end-margin-top: 7px !default;
From 4d34ce6a31eaa19859699646cc614f5be6239e10 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Simon=20H=C3=A4nisch?=
Date: Wed, 11 Mar 2020 17:42:46 +0100
Subject: [PATCH 15/16] fix(label): text overflow for slotted headings (#20690)
fixes #17087
---
core/src/components/label/label.scss | 14 ++++
.../src/components/label/test/headings/e2e.ts | 10 +++
.../components/label/test/headings/index.html | 70 +++++++++++++++++++
3 files changed, 94 insertions(+)
create mode 100644 core/src/components/label/test/headings/e2e.ts
create mode 100644 core/src/components/label/test/headings/index.html
diff --git a/core/src/components/label/label.scss b/core/src/components/label/label.scss
index 394281aaa2..f2041041e4 100644
--- a/core/src/components/label/label.scss
+++ b/core/src/components/label/label.scss
@@ -79,3 +79,17 @@
:host(.label-no-animate.label-floating) {
transition: none;
}
+
+// Headings
+// --------------------------------------------------
+
+::slotted(*) h1,
+::slotted(*) h2,
+::slotted(*) h3,
+::slotted(*) h4,
+::slotted(*) h5,
+::slotted(*) h6 {
+ text-overflow: inherit;
+
+ overflow: inherit;
+}
diff --git a/core/src/components/label/test/headings/e2e.ts b/core/src/components/label/test/headings/e2e.ts
new file mode 100644
index 0000000000..cdbb7726a9
--- /dev/null
+++ b/core/src/components/label/test/headings/e2e.ts
@@ -0,0 +1,10 @@
+import { newE2EPage } from '@stencil/core/testing';
+
+test('label: headings', async () => {
+ const page = await newE2EPage({
+ url: '/src/components/label/test/headings?ionic:_testing=true'
+ });
+
+ const compare = await page.compareScreenshot();
+ expect(compare).toMatchScreenshot();
+});
diff --git a/core/src/components/label/test/headings/index.html b/core/src/components/label/test/headings/index.html
new file mode 100644
index 0000000000..e0a1fdada0
--- /dev/null
+++ b/core/src/components/label/test/headings/index.html
@@ -0,0 +1,70 @@
+
+
+
+
+
+ Label - Headings
+
+
+
+
+
+
+
+
+
+
+
+
+ Label - Headings
+
+
+
+
+
+
+
+ Lorem, ipsum dolor sit amet consectetur adipisicing elit. Architecto laborum, voluptatum corporis reprehenderit ipsa nostrum aperiam optio porro?
+
+
+
+
+ Lorem, ipsum dolor sit amet consectetur adipisicing elit. Architecto laborum, voluptatum corporis reprehenderit ipsa nostrum aperiam optio porro?
+
+
+
+
+ Lorem, ipsum dolor sit amet consectetur adipisicing elit.
+
+
+
+
+ Lorem, ipsum dolor sit amet consectetur adipisicing elit.
+
+
+
+
+ Lorem, ipsum dolor sit amet consectetur adipisicing elit. Architecto laborum, voluptatum corporis reprehenderit ipsa nostrum aperiam optio porro?
+
+
+
+
+ Lorem, ipsum dolor sit amet consectetur adipisicing elit. Architecto laborum, voluptatum corporis reprehenderit ipsa nostrum aperiam optio porro?
+
+
+
+
+ Lorem, ipsum dolor sit amet consectetur adipisicing elit. Architecto laborum, voluptatum corporis reprehenderit ipsa nostrum aperiam optio porro?
+
+
+
+
+ Lorem, ipsum dolor sit amet consectetur adipisicing elit. Architecto laborum, voluptatum corporis reprehenderit ipsa nostrum aperiam optio porro?
+
+
+
+
+
+
+
+
From 572f7b6934609527a7982ea7fb953672ff625785 Mon Sep 17 00:00:00 2001
From: Liam DeBeasi
Date: Wed, 11 Mar 2020 13:07:09 -0400
Subject: [PATCH 16/16] 5.0.5
---
CHANGELOG.md | 21 +++++++++++++++++++++
angular/package.json | 4 ++--
core/package.json | 2 +-
docs/package.json | 2 +-
packages/angular-server/package.json | 4 ++--
packages/react-router/package.json | 10 +++++-----
packages/react/package.json | 4 ++--
7 files changed, 34 insertions(+), 13 deletions(-)
diff --git a/CHANGELOG.md b/CHANGELOG.md
index d2ca1d94a0..8b43a3ecdb 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,24 @@
+## [5.0.5](https://github.com/ionic-team/ionic/compare/v5.0.4...v5.0.5) (2020-03-11)
+
+
+### Bug Fixes
+
+* **button:** allow overflow to be overridden by the CSS variable ([#20738](https://github.com/ionic-team/ionic/issues/20738)) ([7ecde36](https://github.com/ionic-team/ionic/commit/7ecde36f9d31327a45f7b5023ed533edbb9cc709)), closes [#20726](https://github.com/ionic-team/ionic/issues/20726)
+* **datetime:** account for max property when hour, minute, or second is set to 0 ([#20665](https://github.com/ionic-team/ionic/issues/20665)) ([2177461](https://github.com/ionic-team/ionic/commit/21774612d8d70ab7eda3eab0e6e9ac039b5c87d8)), closes [#20652](https://github.com/ionic-team/ionic/issues/20652)
+* **header:** collapsable header should default to using content background ([#20736](https://github.com/ionic-team/ionic/issues/20736)) ([f6c3ba7](https://github.com/ionic-team/ionic/commit/f6c3ba7e5af2af9e32f75306cde7704509e82263)), closes [#20691](https://github.com/ionic-team/ionic/issues/20691)
+* **header:** resolve undefined error on collapsible header when navigating quickly ([#20728](https://github.com/ionic-team/ionic/issues/20728)) ([87a2721](https://github.com/ionic-team/ionic/commit/87a27216d011f1d02ac0fc0aeb3ae0400ecfbd8c)), closes [#20725](https://github.com/ionic-team/ionic/issues/20725)
+* **ios:** large title animation now works properly in a modal ([#20703](https://github.com/ionic-team/ionic/issues/20703)) ([ec4878a](https://github.com/ionic-team/ionic/commit/ec4878ac085d8ff92cb8b2ea0852523f174ab01b)), closes [#20696](https://github.com/ionic-team/ionic/issues/20696)
+* **item:** apply proper margin left for slotted icon in RTL ([#20684](https://github.com/ionic-team/ionic/issues/20684)) ([d53595e](https://github.com/ionic-team/ionic/commit/d53595eb1629e0d60f7e832414e84c544e184346)), closes [#20653](https://github.com/ionic-team/ionic/issues/20653)
+* **label:** text overflow for slotted headings ([#20690](https://github.com/ionic-team/ionic/issues/20690)) ([4d34ce6](https://github.com/ionic-team/ionic/commit/4d34ce6a31eaa19859699646cc614f5be6239e10)), closes [#17087](https://github.com/ionic-team/ionic/issues/17087)
+* **modal:** leave animation transitions modal completely out of viewport on ipad ([#20702](https://github.com/ionic-team/ionic/issues/20702)) ([22d5256](https://github.com/ionic-team/ionic/commit/22d52568100d8096ee36e3a61a19614f0d63d45f)), closes [#20697](https://github.com/ionic-team/ionic/issues/20697)
+* **angular** exclude components from ssr ([#20674](https://github.com/ionic-team/ionic/issues/20674)) ([f64b142](https://github.com/ionic-team/ionic/commit/f64b1420aead39b9056dc25cfdbcf95bc4f6f621))
+* **modal:** swipeable modal now works in firefox ([#20714](https://github.com/ionic-team/ionic/issues/20714)) ([7d260b9](https://github.com/ionic-team/ionic/commit/7d260b96a73958709fa93a4fe58f816a445471ee)), closes [#20706](https://github.com/ionic-team/ionic/issues/20706)
+* **overlays:** prevent accidental dismiss of overlays when tapping screen twice ([#20683](https://github.com/ionic-team/ionic/issues/20683)) ([b6c2a77](https://github.com/ionic-team/ionic/commit/b6c2a77deb1c09eb1fd414f7737794e208ab5081)), closes [#20608](https://github.com/ionic-team/ionic/issues/20608)
+* **segment:** allow routerLink to work on segment buttons ([#20682](https://github.com/ionic-team/ionic/issues/20682)) ([314dbb1](https://github.com/ionic-team/ionic/commit/314dbb1a4d970327fcbb2f3fbdec0627c626fe4d)), closes [#20678](https://github.com/ionic-team/ionic/issues/20678)
+* **segment:** iOS mode segment now works on older Android devices ([#20673](https://github.com/ionic-team/ionic/issues/20673)) ([44993b7](https://github.com/ionic-team/ionic/commit/44993b7987031b6618409675fdbb1f15ec4ea343)), closes [#20648](https://github.com/ionic-team/ionic/issues/20648)
+
+
+
## [5.0.4](https://github.com/ionic-team/ionic/compare/v5.0.3...v5.0.4) (2020-02-27)
diff --git a/angular/package.json b/angular/package.json
index ead605b588..3efd5b9cd1 100644
--- a/angular/package.json
+++ b/angular/package.json
@@ -1,6 +1,6 @@
{
"name": "@ionic/angular",
- "version": "5.0.4",
+ "version": "5.0.5",
"description": "Angular specific wrappers for @ionic/core",
"keywords": [
"ionic",
@@ -42,7 +42,7 @@
"validate": "npm i && npm run lint && npm run test && npm run build"
},
"dependencies": {
- "@ionic/core": "5.0.4",
+ "@ionic/core": "5.0.5",
"tslib": "^1.9.3"
},
"peerDependencies": {
diff --git a/core/package.json b/core/package.json
index 36e014af96..b7a17f1d02 100644
--- a/core/package.json
+++ b/core/package.json
@@ -1,6 +1,6 @@
{
"name": "@ionic/core",
- "version": "5.0.4",
+ "version": "5.0.5",
"description": "Base components for Ionic",
"keywords": [
"ionic",
diff --git a/docs/package.json b/docs/package.json
index f3cf0085e1..5302fadf5c 100644
--- a/docs/package.json
+++ b/docs/package.json
@@ -1,6 +1,6 @@
{
"name": "@ionic/docs",
- "version": "5.0.4",
+ "version": "5.0.5",
"description": "Pre-packaged API documentation for the Ionic docs.",
"main": "core.json",
"types": "core.d.ts",
diff --git a/packages/angular-server/package.json b/packages/angular-server/package.json
index dcd90d8a70..118c751262 100644
--- a/packages/angular-server/package.json
+++ b/packages/angular-server/package.json
@@ -1,6 +1,6 @@
{
"name": "@ionic/angular-server",
- "version": "5.0.4",
+ "version": "5.0.5",
"description": "Angular SSR Module for Ionic",
"keywords": [
"ionic",
@@ -49,7 +49,7 @@
"@angular/core": "8.2.13",
"@angular/platform-browser": "8.2.13",
"@angular/platform-server": "8.2.13",
- "@ionic/core": "5.0.4",
+ "@ionic/core": "5.0.5",
"ng-packagr": "5.7.1",
"tslint": "^5.12.1",
"tslint-ionic-rules": "0.0.21",
diff --git a/packages/react-router/package.json b/packages/react-router/package.json
index 7f20378ebf..f01ba09448 100644
--- a/packages/react-router/package.json
+++ b/packages/react-router/package.json
@@ -1,6 +1,6 @@
{
"name": "@ionic/react-router",
- "version": "5.0.4",
+ "version": "5.0.5",
"description": "React Router wrapper for @ionic/react",
"keywords": [
"ionic",
@@ -39,16 +39,16 @@
"tslib": "*"
},
"peerDependencies": {
- "@ionic/core": "5.0.4",
- "@ionic/react": "5.0.4",
+ "@ionic/core": "5.0.5",
+ "@ionic/react": "5.0.5",
"react": "^16.8.6",
"react-dom": "^16.8.6",
"react-router": "^5.0.1",
"react-router-dom": "^5.0.1"
},
"devDependencies": {
- "@ionic/core": "5.0.4",
- "@ionic/react": "5.0.4",
+ "@ionic/core": "5.0.5",
+ "@ionic/react": "5.0.5",
"@testing-library/jest-dom": "^4.2.4",
"@testing-library/react": "^9.3.2",
"@testing-library/user-event": "^7.1.2",
diff --git a/packages/react/package.json b/packages/react/package.json
index c26051c7d7..2d9b8f1b04 100644
--- a/packages/react/package.json
+++ b/packages/react/package.json
@@ -1,6 +1,6 @@
{
"name": "@ionic/react",
- "version": "5.0.4",
+ "version": "5.0.5",
"description": "React specific wrapper for @ionic/core",
"keywords": [
"ionic",
@@ -39,7 +39,7 @@
"css/"
],
"dependencies": {
- "@ionic/core": "5.0.4",
+ "@ionic/core": "5.0.5",
"ionicons": "^5.0.1",
"tslib": "*"
},