javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-11-08 23:58:13 +08:00
Code Issues Packages Projects Releases Wiki Activity

merge release-5.0.5

Browse Source 
Release 5.0.5
This commit is contained in:
Liam DeBeasi
2020-03-11 14:30:12 -04:00
committed by GitHub
parent a360ea6d19 572f7b6934
commit ac229528eb
36 changed files with 262 additions and 53 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
CHANGELOG.md
View File

@ -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)

4
angular/package.json
View File

@ -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": {

2
angular/test/test-app/package.json
View File

@ -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",

4
core/package.json
View File

@ -1,6 +1,6 @@
{
"name": "@ionic/core",
"version": "5.0.4",
"version": "5.0.5",
"description": "Base components for Ionic",
"keywords": [
"ionic",
@ -30,7 +30,7 @@
"loader/"
],
"dependencies": {
"ionicons": "^5.0.0",
"ionicons": "^5.0.1",
"tslib": "^1.10.0"
},
"devDependencies": {

6
core/src/components/action-sheet/animations/ios.enter.ts
View File

@ -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')!)

6
core/src/components/action-sheet/animations/md.enter.ts
View File

@ -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')!)

6
core/src/components/alert/animations/ios.enter.ts
View File

@ -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')!)

6
core/src/components/alert/animations/md.enter.ts
View File

@ -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')!)

4
core/src/components/button/button.scss
View File

@ -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;

12
core/src/components/button/test/states/index.html
View File

@ -23,7 +23,7 @@
<ion-button fill="clear">Clear</ion-button>
<ion-button color="secondary">Default</ion-button>
<ion-button color="tertiary"><ion-icon slot="icon-only" name="star"></ion-icon></ion-button>
<ion-button color="danger" shape="round">Round</ion-button>
<ion-button color="danger" shape="round" fill="outline">Round</ion-button>
<ion-button color="warning" fill="outline">Outline</ion-button>
<ion-button color="dark" fill="clear">Clear</ion-button>
</p>
@ -37,7 +37,7 @@
<ion-button class="ion-focused" fill="clear">Clear</ion-button>
<ion-button class="ion-focused" color="secondary">Default</ion-button>
<ion-button class="ion-focused" color="tertiary"><ion-icon slot="icon-only" name="star"></ion-icon></ion-button>
<ion-button class="ion-focused" color="danger" shape="round">Round</ion-button>
<ion-button class="ion-focused" color="danger" shape="round" fill="outline">Round</ion-button>
<ion-button class="ion-focused" color="warning" fill="outline">Outline</ion-button>
<ion-button class="ion-focused" color="dark" fill="clear">Clear</ion-button>
</p>
@ -51,7 +51,7 @@
<ion-button class="ion-activated" fill="clear">Clear</ion-button>
<ion-button class="ion-activated" color="secondary">Default</ion-button>
<ion-button class="ion-activated" color="tertiary"><ion-icon slot="icon-only" name="star"></ion-icon></ion-button>
<ion-button class="ion-activated" color="danger" shape="round">Round</ion-button>
<ion-button class="ion-activated" color="danger" shape="round" fill="outline">Round</ion-button>
<ion-button class="ion-activated" color="warning" fill="outline">Outline</ion-button>
<ion-button class="ion-activated" color="dark" fill="clear">Clear</ion-button>
</p>
@ -65,7 +65,7 @@
<ion-button class="custom" fill="clear">Clear</ion-button>
<ion-button class="custom" color="secondary">Default</ion-button>
<ion-button class="custom" color="tertiary"><ion-icon slot="icon-only" name="star"></ion-icon></ion-button>
<ion-button class="custom" color="danger" shape="round">Round</ion-button>
<ion-button class="custom" color="danger" shape="round" fill="outline">Round</ion-button>
<ion-button class="custom" color="warning" fill="outline">Outline</ion-button>
<ion-button class="custom" color="dark" fill="clear">Clear</ion-button>
<ion-button class="custom ion-focused">Default</ion-button>
@ -75,7 +75,7 @@
<ion-button class="custom ion-focused" fill="clear">Clear</ion-button>
<ion-button class="custom ion-focused" color="secondary">Default</ion-button>
<ion-button class="custom ion-focused" color="tertiary"><ion-icon slot="icon-only" name="star"></ion-icon></ion-button>
<ion-button class="custom ion-focused" color="danger" shape="round">Round</ion-button>
<ion-button class="custom ion-focused" color="danger" shape="round" fill="outline">Round</ion-button>
<ion-button class="custom ion-focused" color="warning" fill="outline">Outline</ion-button>
<ion-button class="custom ion-focused" color="dark" fill="clear">Clear</ion-button>
<ion-button class="custom ion-activated">Default</ion-button>
@ -85,7 +85,7 @@
<ion-button class="custom ion-activated" fill="clear">Clear</ion-button>
<ion-button class="custom ion-activated" color="secondary">Default</ion-button>
<ion-button class="custom ion-activated" color="tertiary"><ion-icon slot="icon-only" name="star"></ion-icon></ion-button>
<ion-button class="custom ion-activated" color="danger" shape="round">Round</ion-button>
<ion-button class="custom ion-activated" color="danger" shape="round" fill="outline">Round</ion-button>
<ion-button class="custom ion-activated" color="warning" fill="outline">Outline</ion-button>
<ion-button class="custom ion-activated" color="dark" fill="clear">Clear</ion-button>
</p>

6
core/src/components/datetime/datetime.tsx
View File

@ -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) {

6
core/src/components/header/header.ios.scss
View File

@ -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;
}

4
core/src/components/header/header.tsx
View File

@ -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;

2
core/src/components/item/item.ios.vars.scss
View File

@ -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;

14
core/src/components/label/label.scss
View File

@ -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;
}

10
core/src/components/label/test/headings/e2e.ts Normal file
View File

@ -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();
});

70
core/src/components/label/test/headings/index.html Normal file
View File

@ -0,0 +1,70 @@
<!DOCTYPE html>
<html dir="ltr">
<head>
<meta charset="UTF-8">
<title>Label - Headings</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover">
<link href="../../../../../css/ionic.bundle.css" rel="stylesheet">
<link href="../../../../../scripts/testing/styles.css" rel="stylesheet">
<script src="../../../../../scripts/testing/scripts.js"></script>
<script nomodule src="../../../../../dist/ionic/ionic.js"></script>
<script type="module" src="../../../../../dist/ionic/ionic.esm.js"></script></head>
<body>
<ion-app>
<ion-header>
<ion-toolbar>
<ion-title>Label - Headings</ion-title>
</ion-toolbar>
</ion-header>
<ion-content>
<ion-list>
<ion-item>
<ion-label>
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Architecto laborum, voluptatum corporis reprehenderit ipsa nostrum aperiam optio porro?
</ion-label>
</ion-item>
<ion-item>
<ion-label>
<p>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Architecto laborum, voluptatum corporis reprehenderit ipsa nostrum aperiam optio porro?</p>
</ion-label>
</ion-item>
<ion-item>
<ion-label>
<h1>Lorem, ipsum dolor sit amet consectetur adipisicing elit.</h1>
</ion-label>
</ion-item>
<ion-item>
<ion-label class="ion-text-wrap">
<h1>Lorem, ipsum dolor sit amet consectetur adipisicing elit.</h1>
</ion-label>
</ion-item>
<ion-item>
<ion-label>
<h2>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Architecto laborum, voluptatum corporis reprehenderit ipsa nostrum aperiam optio porro?</h2>
</ion-label>
</ion-item>
<ion-item>
<ion-label class="ion-text-wrap">
<h2>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Architecto laborum, voluptatum corporis reprehenderit ipsa nostrum aperiam optio porro?</h2>
</ion-label>
</ion-item>
<ion-item>
<ion-label>
<h3>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Architecto laborum, voluptatum corporis reprehenderit ipsa nostrum aperiam optio porro?</h3>
</ion-label>
</ion-item>
<ion-item>
<ion-label class="ion-text-wrap">
<h3>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Architecto laborum, voluptatum corporis reprehenderit ipsa nostrum aperiam optio porro?</h3>
</ion-label>
</ion-item>
</ion-list>
</ion-content>
</ion-app>
</body>
</html>

6
core/src/components/loading/animations/ios.enter.ts
View File

@ -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')!)

6
core/src/components/loading/animations/md.enter.ts
View File

@ -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')!)

16
core/src/components/modal/animations/ios.enter.ts
View File

@ -12,12 +12,16 @@ 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')!)
.beforeStyles({ 'opacity': 1 })
.fromTo('transform', 'translateY(100%)', 'translateY(0%)');
.fromTo('transform', 'translateY(100vh)', 'translateY(0vh)');
const baseAnimation = createAnimation()
.addElement(baseEl)
@ -27,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})`;

5
core/src/components/modal/animations/ios.leave.ts
View File

@ -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)
@ -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()

6
core/src/components/modal/animations/md.enter.ts
View File

@ -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')!)

6
core/src/components/modal/modal.ios.scss
View File

@ -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% - 40px);
}
@supports (width: max(0px, 1px)) {
:host(.modal-card) .modal-wrapper {
height: calc(100% - max(30px, var(--ion-safe-area-top)) - 10px);
}
}

6
core/src/components/picker/animations/ios.enter.ts
View File

@ -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')!)

6
core/src/components/popover/animations/ios.enter.ts
View File

@ -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')!)

6
core/src/components/popover/animations/md.enter.ts
View File

@ -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')!)

4
core/src/components/segment-button/segment-button.scss
View File

@ -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 {

1
core/src/components/segment/segment.tsx
View File

@ -143,7 +143,6 @@ export class Segment implements ComponentInterface {
const checkedValidButton = this.setNextIndex(detail, true);
detail.event.preventDefault();
detail.event.stopImmediatePropagation();
if (checkedValidButton) {

2
core/src/utils/transition/ios.transition.ts
View File

@ -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';

2
docs/package.json
View File

@ -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",

4
packages/angular-server/package.json
View File

@ -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",

28
packages/angular-server/src/ionic-server-module.ts
View File

@ -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 => {

10
packages/react-router/package.json
View File

@ -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",

6
packages/react/package.json
View File

@ -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,8 +39,8 @@
"css/"
],
"dependencies": {
"@ionic/core": "5.0.4",
"ionicons": "^5.0.0",
"@ionic/core": "5.0.5",
"ionicons": "^5.0.1",
"tslib": "*"
},
"peerDependencies": {

6
vue/package-lock.json generated
View File

@ -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",

2
vue/package.json
View File

@ -46,7 +46,7 @@
},
"dependencies": {
"@ionic/core": "^4.6.0",
"ionicons": "^5.0.0-13"
"ionicons": "^5.0.1"
},
"devDependencies": {
"rollup": "^0.62.0",