@ionic/core 7.4.4-dev.11696545130.1171e7a9 → 7.4.4-dev.11696860023.1b8ee3ef
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/checkbox.js +0 -3
- package/components/ion-footer.js +21 -11
- package/components/ion-tab-bar.js +21 -11
- package/components/ion-toggle.js +0 -3
- package/components/radio-group.js +1 -1
- package/components/radio.js +1 -4
- package/dist/cjs/ion-app_8.cjs.entry.js +21 -12
- package/dist/cjs/ion-checkbox.cjs.entry.js +0 -3
- package/dist/cjs/ion-radio_2.cjs.entry.js +2 -5
- package/dist/cjs/ion-tab-bar_2.cjs.entry.js +21 -12
- package/dist/cjs/ion-toggle.cjs.entry.js +0 -3
- package/dist/collection/components/checkbox/checkbox.js +0 -3
- package/dist/collection/components/footer/footer.js +21 -11
- package/dist/collection/components/radio/radio.js +1 -4
- package/dist/collection/components/radio-group/radio-group.js +1 -1
- package/dist/collection/components/tab-bar/tab-bar.js +21 -11
- package/dist/collection/components/toggle/toggle.js +0 -3
- package/dist/collection/utils/keyboard/keyboard-controller.js +1 -1
- package/dist/docs.json +1 -1
- package/dist/esm/ion-app_8.entry.js +21 -12
- package/dist/esm/ion-checkbox.entry.js +0 -3
- package/dist/esm/ion-radio_2.entry.js +2 -5
- package/dist/esm/ion-tab-bar_2.entry.js +21 -12
- package/dist/esm/ion-toggle.entry.js +0 -3
- package/dist/esm-es5/ion-app_8.entry.js +1 -1
- package/dist/esm-es5/ion-checkbox.entry.js +1 -1
- package/dist/esm-es5/ion-radio_2.entry.js +1 -1
- package/dist/esm-es5/ion-tab-bar_2.entry.js +1 -1
- package/dist/esm-es5/ion-toggle.entry.js +1 -1
- package/dist/ionic/ionic.esm.js +1 -1
- package/dist/ionic/{p-2330af92.system.entry.js → p-037e2738.system.entry.js} +1 -1
- package/dist/ionic/p-0cbec498.system.entry.js +4 -0
- package/dist/ionic/p-469d6a98.entry.js +4 -0
- package/dist/ionic/p-4af11953.entry.js +4 -0
- package/dist/ionic/p-606fddbe.system.entry.js +4 -0
- package/dist/ionic/p-686a9d53.entry.js +4 -0
- package/dist/ionic/p-68b405cc.entry.js +4 -0
- package/dist/ionic/p-73eba881.system.js +1 -1
- package/dist/ionic/{p-0fc8a522.system.entry.js → p-8957b1de.system.entry.js} +1 -1
- package/dist/ionic/p-a0b19468.entry.js +4 -0
- package/dist/ionic/{p-7061fa75.system.entry.js → p-c381a9a9.system.entry.js} +1 -1
- package/hydrate/index.js +42 -33
- package/package.json +1 -1
- package/dist/ionic/p-6d5c54f2.system.entry.js +0 -4
- package/dist/ionic/p-775f3749.entry.js +0 -4
- package/dist/ionic/p-77872abc.entry.js +0 -4
- package/dist/ionic/p-7b15d413.entry.js +0 -4
- package/dist/ionic/p-8b33cfef.entry.js +0 -4
- package/dist/ionic/p-8f36cde3.system.entry.js +0 -4
- package/dist/ionic/p-c6f41736.entry.js +0 -4
package/components/checkbox.js
CHANGED
package/components/ion-footer.js
CHANGED
|
@@ -4,6 +4,7 @@
|
|
|
4
4
|
import { readTask, writeTask, proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
|
|
5
5
|
import { f as findIonContent, p as printIonContentErrorMsg, g as getScrollElement } from './index8.js';
|
|
6
6
|
import { c as createKeyboardController } from './keyboard-controller.js';
|
|
7
|
+
import { K as Keyboard, a as KeyboardResize } from './keyboard.js';
|
|
7
8
|
import { b as getIonMode } from './ionic-global.js';
|
|
8
9
|
import { m as clamp } from './helpers.js';
|
|
9
10
|
|
|
@@ -85,17 +86,26 @@ const Footer = /*@__PURE__*/ proxyCustomElement(class Footer extends HTMLElement
|
|
|
85
86
|
this.checkCollapsibleFooter();
|
|
86
87
|
}
|
|
87
88
|
async connectedCallback() {
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
89
|
+
const resizeMode = await Keyboard.getResizeMode();
|
|
90
|
+
/**
|
|
91
|
+
* If the resize mode is set to None then we don't want to
|
|
92
|
+
* hide the tab bar here since it will never sit on top
|
|
93
|
+
* of the keyboard. Hiding the tab bar will cause a layout shift
|
|
94
|
+
* in apps that have resize set to None.
|
|
95
|
+
*/
|
|
96
|
+
if (resizeMode === undefined || resizeMode.mode !== KeyboardResize.None) {
|
|
97
|
+
this.keyboardCtrl = await createKeyboardController(async (keyboardOpen, waitForResize) => {
|
|
98
|
+
/**
|
|
99
|
+
* If the keyboard is hiding, then we need to wait
|
|
100
|
+
* for the webview to resize. Otherwise, the footer
|
|
101
|
+
* will flicker before the webview resizes.
|
|
102
|
+
*/
|
|
103
|
+
if (keyboardOpen === false && waitForResize !== undefined) {
|
|
104
|
+
await waitForResize;
|
|
105
|
+
}
|
|
106
|
+
this.keyboardVisible = keyboardOpen; // trigger re-render by updating state
|
|
107
|
+
});
|
|
108
|
+
}
|
|
99
109
|
}
|
|
100
110
|
disconnectedCallback() {
|
|
101
111
|
if (this.keyboardCtrl) {
|
|
@@ -3,6 +3,7 @@
|
|
|
3
3
|
*/
|
|
4
4
|
import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
|
|
5
5
|
import { c as createKeyboardController } from './keyboard-controller.js';
|
|
6
|
+
import { K as Keyboard, a as KeyboardResize } from './keyboard.js';
|
|
6
7
|
import { c as createColorClasses } from './theme.js';
|
|
7
8
|
import { b as getIonMode } from './ionic-global.js';
|
|
8
9
|
|
|
@@ -34,17 +35,26 @@ const TabBar = /*@__PURE__*/ proxyCustomElement(class TabBar extends HTMLElement
|
|
|
34
35
|
this.selectedTabChanged();
|
|
35
36
|
}
|
|
36
37
|
async connectedCallback() {
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
38
|
+
const resizeMode = await Keyboard.getResizeMode();
|
|
39
|
+
/**
|
|
40
|
+
* If the resize mode is set to None then we don't want to
|
|
41
|
+
* hide the tab bar here since it will never sit on top
|
|
42
|
+
* of the keyboard. Hiding the tab bar will cause a layout shift
|
|
43
|
+
* in apps that have resize set to None.
|
|
44
|
+
*/
|
|
45
|
+
if (resizeMode === undefined || resizeMode.mode !== KeyboardResize.None) {
|
|
46
|
+
this.keyboardCtrl = await createKeyboardController(async (keyboardOpen, waitForResize) => {
|
|
47
|
+
/**
|
|
48
|
+
* If the keyboard is hiding, then we need to wait
|
|
49
|
+
* for the webview to resize. Otherwise, the tab bar
|
|
50
|
+
* will flicker before the webview resizes.
|
|
51
|
+
*/
|
|
52
|
+
if (keyboardOpen === false && waitForResize !== undefined) {
|
|
53
|
+
await waitForResize;
|
|
54
|
+
}
|
|
55
|
+
this.keyboardVisible = keyboardOpen; // trigger re-render by updating state
|
|
56
|
+
});
|
|
57
|
+
}
|
|
48
58
|
}
|
|
49
59
|
disconnectedCallback() {
|
|
50
60
|
if (this.keyboardCtrl) {
|
package/components/ion-toggle.js
CHANGED
|
@@ -38,7 +38,7 @@ const RadioGroup = /*@__PURE__*/ proxyCustomElement(class RadioGroup extends HTM
|
|
|
38
38
|
* using the `name` attribute.
|
|
39
39
|
*/
|
|
40
40
|
const selectedRadio = ev.target && ev.target.closest('ion-radio');
|
|
41
|
-
if (selectedRadio
|
|
41
|
+
if (selectedRadio) {
|
|
42
42
|
const currentValue = this.value;
|
|
43
43
|
const newValue = selectedRadio.value;
|
|
44
44
|
if (newValue !== currentValue) {
|
package/components/radio.js
CHANGED
|
@@ -30,10 +30,7 @@ const Radio = /*@__PURE__*/ proxyCustomElement(class Radio extends HTMLElement {
|
|
|
30
30
|
}
|
|
31
31
|
};
|
|
32
32
|
this.onClick = () => {
|
|
33
|
-
const { radioGroup, checked
|
|
34
|
-
if (disabled) {
|
|
35
|
-
return;
|
|
36
|
-
}
|
|
33
|
+
const { radioGroup, checked } = this;
|
|
37
34
|
/**
|
|
38
35
|
* The legacy control uses a native input inside
|
|
39
36
|
* of the radio host, so we can set this.checked
|
|
@@ -12,13 +12,13 @@ const dir = require('./dir-f1e0ca26.js');
|
|
|
12
12
|
const theme = require('./theme-fbc56b3b.js');
|
|
13
13
|
const index$1 = require('./index-10873539.js');
|
|
14
14
|
const keyboardController = require('./keyboard-controller-50beb83a.js');
|
|
15
|
+
const keyboard = require('./keyboard-fd7db491.js');
|
|
15
16
|
const cubicBezier = require('./cubic-bezier-6b9222ad.js');
|
|
16
17
|
const frameworkDelegate = require('./framework-delegate-c0873a6f.js');
|
|
17
18
|
const lockController = require('./lock-controller-4ae2eb59.js');
|
|
18
19
|
const index$2 = require('./index-acf6bdf0.js');
|
|
19
20
|
require('./index-cc7dfb7c.js');
|
|
20
21
|
require('./index-306a7476.js');
|
|
21
|
-
require('./keyboard-fd7db491.js');
|
|
22
22
|
require('./capacitor-2ffba62a.js');
|
|
23
23
|
|
|
24
24
|
const appCss = "html.plt-mobile ion-app{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}html.plt-mobile ion-app [contenteditable]{-webkit-user-select:text;-moz-user-select:text;-ms-user-select:text;user-select:text}ion-app.force-statusbar-padding{--ion-safe-area-top:20px}";
|
|
@@ -614,17 +614,26 @@ const Footer = class {
|
|
|
614
614
|
this.checkCollapsibleFooter();
|
|
615
615
|
}
|
|
616
616
|
async connectedCallback() {
|
|
617
|
-
|
|
618
|
-
|
|
619
|
-
|
|
620
|
-
|
|
621
|
-
|
|
622
|
-
|
|
623
|
-
|
|
624
|
-
|
|
625
|
-
|
|
626
|
-
|
|
627
|
-
|
|
617
|
+
const resizeMode = await keyboard.Keyboard.getResizeMode();
|
|
618
|
+
/**
|
|
619
|
+
* If the resize mode is set to None then we don't want to
|
|
620
|
+
* hide the tab bar here since it will never sit on top
|
|
621
|
+
* of the keyboard. Hiding the tab bar will cause a layout shift
|
|
622
|
+
* in apps that have resize set to None.
|
|
623
|
+
*/
|
|
624
|
+
if (resizeMode === undefined || resizeMode.mode !== keyboard.KeyboardResize.None) {
|
|
625
|
+
this.keyboardCtrl = await keyboardController.createKeyboardController(async (keyboardOpen, waitForResize) => {
|
|
626
|
+
/**
|
|
627
|
+
* If the keyboard is hiding, then we need to wait
|
|
628
|
+
* for the webview to resize. Otherwise, the footer
|
|
629
|
+
* will flicker before the webview resizes.
|
|
630
|
+
*/
|
|
631
|
+
if (keyboardOpen === false && waitForResize !== undefined) {
|
|
632
|
+
await waitForResize;
|
|
633
|
+
}
|
|
634
|
+
this.keyboardVisible = keyboardOpen; // trigger re-render by updating state
|
|
635
|
+
});
|
|
636
|
+
}
|
|
628
637
|
}
|
|
629
638
|
disconnectedCallback() {
|
|
630
639
|
if (this.keyboardCtrl) {
|
|
@@ -32,10 +32,7 @@ const Radio = class {
|
|
|
32
32
|
}
|
|
33
33
|
};
|
|
34
34
|
this.onClick = () => {
|
|
35
|
-
const { radioGroup, checked
|
|
36
|
-
if (disabled) {
|
|
37
|
-
return;
|
|
38
|
-
}
|
|
35
|
+
const { radioGroup, checked } = this;
|
|
39
36
|
/**
|
|
40
37
|
* The legacy control uses a native input inside
|
|
41
38
|
* of the radio host, so we can set this.checked
|
|
@@ -235,7 +232,7 @@ const RadioGroup = class {
|
|
|
235
232
|
* using the `name` attribute.
|
|
236
233
|
*/
|
|
237
234
|
const selectedRadio = ev.target && ev.target.closest('ion-radio');
|
|
238
|
-
if (selectedRadio
|
|
235
|
+
if (selectedRadio) {
|
|
239
236
|
const currentValue = this.value;
|
|
240
237
|
const newValue = selectedRadio.value;
|
|
241
238
|
if (newValue !== currentValue) {
|
|
@@ -7,11 +7,11 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
7
7
|
|
|
8
8
|
const index = require('./index-14a4821e.js');
|
|
9
9
|
const keyboardController = require('./keyboard-controller-50beb83a.js');
|
|
10
|
+
const keyboard = require('./keyboard-fd7db491.js');
|
|
10
11
|
const theme = require('./theme-fbc56b3b.js');
|
|
11
12
|
const ionicGlobal = require('./ionic-global-a71608df.js');
|
|
12
13
|
const helpers = require('./helpers-ea4ccbcb.js');
|
|
13
14
|
require('./index-306a7476.js');
|
|
14
|
-
require('./keyboard-fd7db491.js');
|
|
15
15
|
require('./capacitor-2ffba62a.js');
|
|
16
16
|
|
|
17
17
|
const tabBarIosCss = ":host{-webkit-padding-start:var(--ion-safe-area-left);padding-inline-start:var(--ion-safe-area-left);-webkit-padding-end:var(--ion-safe-area-right);padding-inline-end:var(--ion-safe-area-right);display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:auto;padding-bottom:var(--ion-safe-area-bottom, 0);border-top:var(--border);background:var(--background);color:var(--color);text-align:center;contain:strict;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:10;-webkit-box-sizing:content-box !important;box-sizing:content-box !important}:host(.ion-color) ::slotted(ion-tab-button){--background-focused:var(--ion-color-shade);--color-selected:var(--ion-color-contrast)}:host(.ion-color) ::slotted(.tab-selected){color:var(--ion-color-contrast)}:host(.ion-color),:host(.ion-color) ::slotted(ion-tab-button){color:rgba(var(--ion-color-contrast-rgb), 0.7)}:host(.ion-color),:host(.ion-color) ::slotted(ion-tab-button){background:var(--ion-color-base)}:host(.ion-color) ::slotted(ion-tab-button.ion-focused),:host(.tab-bar-translucent) ::slotted(ion-tab-button.ion-focused){background:var(--background-focused)}:host(.tab-bar-translucent) ::slotted(ion-tab-button){background:transparent}:host([slot=top]){padding-top:var(--ion-safe-area-top, 0);padding-bottom:0;border-top:0;border-bottom:var(--border)}:host(.tab-bar-hidden){display:none !important}:host{--background:var(--ion-tab-bar-background, var(--ion-color-step-50, #f7f7f7));--background-focused:var(--ion-tab-bar-background-focused, #e0e0e0);--border:0.55px solid var(--ion-tab-bar-border-color, var(--ion-border-color, var(--ion-color-step-150, rgba(0, 0, 0, 0.2))));--color:var(--ion-tab-bar-color, var(--ion-color-step-600, #666666));--color-selected:var(--ion-tab-bar-color-selected, var(--ion-color-primary, #3880ff));height:50px}@supports ((-webkit-backdrop-filter: blur(0)) or (backdrop-filter: blur(0))){:host(.tab-bar-translucent){--background:rgba(var(--ion-background-color-rgb, 255, 255, 255), 0.8);-webkit-backdrop-filter:saturate(210%) blur(20px);backdrop-filter:saturate(210%) blur(20px)}:host(.ion-color.tab-bar-translucent){background:rgba(var(--ion-color-base-rgb), 0.8)}:host(.tab-bar-translucent) ::slotted(ion-tab-button.ion-focused){background:rgba(var(--ion-background-color-rgb, 255, 255, 255), 0.6)}}";
|
|
@@ -40,17 +40,26 @@ const TabBar = class {
|
|
|
40
40
|
this.selectedTabChanged();
|
|
41
41
|
}
|
|
42
42
|
async connectedCallback() {
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
43
|
+
const resizeMode = await keyboard.Keyboard.getResizeMode();
|
|
44
|
+
/**
|
|
45
|
+
* If the resize mode is set to None then we don't want to
|
|
46
|
+
* hide the tab bar here since it will never sit on top
|
|
47
|
+
* of the keyboard. Hiding the tab bar will cause a layout shift
|
|
48
|
+
* in apps that have resize set to None.
|
|
49
|
+
*/
|
|
50
|
+
if (resizeMode === undefined || resizeMode.mode !== keyboard.KeyboardResize.None) {
|
|
51
|
+
this.keyboardCtrl = await keyboardController.createKeyboardController(async (keyboardOpen, waitForResize) => {
|
|
52
|
+
/**
|
|
53
|
+
* If the keyboard is hiding, then we need to wait
|
|
54
|
+
* for the webview to resize. Otherwise, the tab bar
|
|
55
|
+
* will flicker before the webview resizes.
|
|
56
|
+
*/
|
|
57
|
+
if (keyboardOpen === false && waitForResize !== undefined) {
|
|
58
|
+
await waitForResize;
|
|
59
|
+
}
|
|
60
|
+
this.keyboardVisible = keyboardOpen; // trigger re-render by updating state
|
|
61
|
+
});
|
|
62
|
+
}
|
|
54
63
|
}
|
|
55
64
|
disconnectedCallback() {
|
|
56
65
|
if (this.keyboardCtrl) {
|
|
@@ -4,6 +4,7 @@
|
|
|
4
4
|
import { Host, h } from "@stencil/core";
|
|
5
5
|
import { findIonContent, getScrollElement, printIonContentErrorMsg } from "../../utils/content/index";
|
|
6
6
|
import { createKeyboardController } from "../../utils/keyboard/keyboard-controller";
|
|
7
|
+
import { Keyboard, KeyboardResize } from "../../utils/native/keyboa";
|
|
7
8
|
import { getIonMode } from "../../global/ionic-global";
|
|
8
9
|
import { handleFooterFade } from "./footer.utils";
|
|
9
10
|
/**
|
|
@@ -52,17 +53,26 @@ export class Footer {
|
|
|
52
53
|
this.checkCollapsibleFooter();
|
|
53
54
|
}
|
|
54
55
|
async connectedCallback() {
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
56
|
+
const resizeMode = await Keyboard.getResizeMode();
|
|
57
|
+
/**
|
|
58
|
+
* If the resize mode is set to None then we don't want to
|
|
59
|
+
* hide the tab bar here since it will never sit on top
|
|
60
|
+
* of the keyboard. Hiding the tab bar will cause a layout shift
|
|
61
|
+
* in apps that have resize set to None.
|
|
62
|
+
*/
|
|
63
|
+
if (resizeMode === undefined || resizeMode.mode !== KeyboardResize.None) {
|
|
64
|
+
this.keyboardCtrl = await createKeyboardController(async (keyboardOpen, waitForResize) => {
|
|
65
|
+
/**
|
|
66
|
+
* If the keyboard is hiding, then we need to wait
|
|
67
|
+
* for the webview to resize. Otherwise, the footer
|
|
68
|
+
* will flicker before the webview resizes.
|
|
69
|
+
*/
|
|
70
|
+
if (keyboardOpen === false && waitForResize !== undefined) {
|
|
71
|
+
await waitForResize;
|
|
72
|
+
}
|
|
73
|
+
this.keyboardVisible = keyboardOpen; // trigger re-render by updating state
|
|
74
|
+
});
|
|
75
|
+
}
|
|
66
76
|
}
|
|
67
77
|
disconnectedCallback() {
|
|
68
78
|
if (this.keyboardCtrl) {
|
|
@@ -27,10 +27,7 @@ export class Radio {
|
|
|
27
27
|
}
|
|
28
28
|
};
|
|
29
29
|
this.onClick = () => {
|
|
30
|
-
const { radioGroup, checked
|
|
31
|
-
if (disabled) {
|
|
32
|
-
return;
|
|
33
|
-
}
|
|
30
|
+
const { radioGroup, checked } = this;
|
|
34
31
|
/**
|
|
35
32
|
* The legacy control uses a native input inside
|
|
36
33
|
* of the radio host, so we can set this.checked
|
|
@@ -33,7 +33,7 @@ export class RadioGroup {
|
|
|
33
33
|
* using the `name` attribute.
|
|
34
34
|
*/
|
|
35
35
|
const selectedRadio = ev.target && ev.target.closest('ion-radio');
|
|
36
|
-
if (selectedRadio
|
|
36
|
+
if (selectedRadio) {
|
|
37
37
|
const currentValue = this.value;
|
|
38
38
|
const newValue = selectedRadio.value;
|
|
39
39
|
if (newValue !== currentValue) {
|
|
@@ -3,6 +3,7 @@
|
|
|
3
3
|
*/
|
|
4
4
|
import { Host, h } from "@stencil/core";
|
|
5
5
|
import { createKeyboardController } from "../../utils/keyboard/keyboard-controller";
|
|
6
|
+
import { Keyboard, KeyboardResize } from "../../utils/native/keyboa";
|
|
6
7
|
import { createColorClasses } from "../../utils/theme";
|
|
7
8
|
import { getIonMode } from "../../global/ionic-global";
|
|
8
9
|
/**
|
|
@@ -27,17 +28,26 @@ export class TabBar {
|
|
|
27
28
|
this.selectedTabChanged();
|
|
28
29
|
}
|
|
29
30
|
async connectedCallback() {
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
31
|
+
const resizeMode = await Keyboard.getResizeMode();
|
|
32
|
+
/**
|
|
33
|
+
* If the resize mode is set to None then we don't want to
|
|
34
|
+
* hide the tab bar here since it will never sit on top
|
|
35
|
+
* of the keyboard. Hiding the tab bar will cause a layout shift
|
|
36
|
+
* in apps that have resize set to None.
|
|
37
|
+
*/
|
|
38
|
+
if (resizeMode === undefined || resizeMode.mode !== KeyboardResize.None) {
|
|
39
|
+
this.keyboardCtrl = await createKeyboardController(async (keyboardOpen, waitForResize) => {
|
|
40
|
+
/**
|
|
41
|
+
* If the keyboard is hiding, then we need to wait
|
|
42
|
+
* for the webview to resize. Otherwise, the tab bar
|
|
43
|
+
* will flicker before the webview resizes.
|
|
44
|
+
*/
|
|
45
|
+
if (keyboardOpen === false && waitForResize !== undefined) {
|
|
46
|
+
await waitForResize;
|
|
47
|
+
}
|
|
48
|
+
this.keyboardVisible = keyboardOpen; // trigger re-render by updating state
|
|
49
|
+
});
|
|
50
|
+
}
|
|
41
51
|
}
|
|
42
52
|
disconnectedCallback() {
|
|
43
53
|
if (this.keyboardCtrl) {
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
* (C) Ionic http://ionicframework.com - MIT License
|
|
3
3
|
*/
|
|
4
4
|
import { doc, win } from "../browser/index";
|
|
5
|
-
import { Keyboard, KeyboardResize } from "../native/
|
|
5
|
+
import { Keyboard, KeyboardResize } from "../native/keyboa";
|
|
6
6
|
/**
|
|
7
7
|
* The element that resizes when the keyboard opens
|
|
8
8
|
* is going to depend on the resize mode
|
package/dist/docs.json
CHANGED
|
@@ -8,13 +8,13 @@ import { i as isRTL } from './dir-912e3e13.js';
|
|
|
8
8
|
import { c as createColorClasses, h as hostContext } from './theme-17531cdf.js';
|
|
9
9
|
import { a as findIonContent, p as printIonContentErrorMsg, g as getScrollElement } from './index-746a238e.js';
|
|
10
10
|
import { c as createKeyboardController } from './keyboard-controller-0c2dce71.js';
|
|
11
|
+
import { K as Keyboard, a as KeyboardResize } from './keyboard-b063f012.js';
|
|
11
12
|
import { g as getTimeGivenProgression } from './cubic-bezier-66542bc5.js';
|
|
12
13
|
import { a as attachComponent, d as detachComponent } from './framework-delegate-aa433dea.js';
|
|
13
14
|
import { c as createLockController } from './lock-controller-e8c6c051.js';
|
|
14
15
|
import { t as transition } from './index-32c6828b.js';
|
|
15
16
|
import './index-595d62c9.js';
|
|
16
17
|
import './index-7a14ecec.js';
|
|
17
|
-
import './keyboard-b063f012.js';
|
|
18
18
|
import './capacitor-b4979570.js';
|
|
19
19
|
|
|
20
20
|
const appCss = "html.plt-mobile ion-app{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}html.plt-mobile ion-app [contenteditable]{-webkit-user-select:text;-moz-user-select:text;-ms-user-select:text;user-select:text}ion-app.force-statusbar-padding{--ion-safe-area-top:20px}";
|
|
@@ -610,17 +610,26 @@ const Footer = class {
|
|
|
610
610
|
this.checkCollapsibleFooter();
|
|
611
611
|
}
|
|
612
612
|
async connectedCallback() {
|
|
613
|
-
|
|
614
|
-
|
|
615
|
-
|
|
616
|
-
|
|
617
|
-
|
|
618
|
-
|
|
619
|
-
|
|
620
|
-
|
|
621
|
-
|
|
622
|
-
|
|
623
|
-
|
|
613
|
+
const resizeMode = await Keyboard.getResizeMode();
|
|
614
|
+
/**
|
|
615
|
+
* If the resize mode is set to None then we don't want to
|
|
616
|
+
* hide the tab bar here since it will never sit on top
|
|
617
|
+
* of the keyboard. Hiding the tab bar will cause a layout shift
|
|
618
|
+
* in apps that have resize set to None.
|
|
619
|
+
*/
|
|
620
|
+
if (resizeMode === undefined || resizeMode.mode !== KeyboardResize.None) {
|
|
621
|
+
this.keyboardCtrl = await createKeyboardController(async (keyboardOpen, waitForResize) => {
|
|
622
|
+
/**
|
|
623
|
+
* If the keyboard is hiding, then we need to wait
|
|
624
|
+
* for the webview to resize. Otherwise, the footer
|
|
625
|
+
* will flicker before the webview resizes.
|
|
626
|
+
*/
|
|
627
|
+
if (keyboardOpen === false && waitForResize !== undefined) {
|
|
628
|
+
await waitForResize;
|
|
629
|
+
}
|
|
630
|
+
this.keyboardVisible = keyboardOpen; // trigger re-render by updating state
|
|
631
|
+
});
|
|
632
|
+
}
|
|
624
633
|
}
|
|
625
634
|
disconnectedCallback() {
|
|
626
635
|
if (this.keyboardCtrl) {
|
|
@@ -28,10 +28,7 @@ const Radio = class {
|
|
|
28
28
|
}
|
|
29
29
|
};
|
|
30
30
|
this.onClick = () => {
|
|
31
|
-
const { radioGroup, checked
|
|
32
|
-
if (disabled) {
|
|
33
|
-
return;
|
|
34
|
-
}
|
|
31
|
+
const { radioGroup, checked } = this;
|
|
35
32
|
/**
|
|
36
33
|
* The legacy control uses a native input inside
|
|
37
34
|
* of the radio host, so we can set this.checked
|
|
@@ -231,7 +228,7 @@ const RadioGroup = class {
|
|
|
231
228
|
* using the `name` attribute.
|
|
232
229
|
*/
|
|
233
230
|
const selectedRadio = ev.target && ev.target.closest('ion-radio');
|
|
234
|
-
if (selectedRadio
|
|
231
|
+
if (selectedRadio) {
|
|
235
232
|
const currentValue = this.value;
|
|
236
233
|
const newValue = selectedRadio.value;
|
|
237
234
|
if (newValue !== currentValue) {
|
|
@@ -3,11 +3,11 @@
|
|
|
3
3
|
*/
|
|
4
4
|
import { r as registerInstance, d as createEvent, h, H as Host, f as getElement } from './index-cb894020.js';
|
|
5
5
|
import { c as createKeyboardController } from './keyboard-controller-0c2dce71.js';
|
|
6
|
+
import { K as Keyboard, a as KeyboardResize } from './keyboard-b063f012.js';
|
|
6
7
|
import { c as createColorClasses } from './theme-17531cdf.js';
|
|
7
8
|
import { b as getIonMode, c as config } from './ionic-global-63a8d8c9.js';
|
|
8
9
|
import { k as inheritAttributes } from './helpers-3379ba19.js';
|
|
9
10
|
import './index-7a14ecec.js';
|
|
10
|
-
import './keyboard-b063f012.js';
|
|
11
11
|
import './capacitor-b4979570.js';
|
|
12
12
|
|
|
13
13
|
const tabBarIosCss = ":host{-webkit-padding-start:var(--ion-safe-area-left);padding-inline-start:var(--ion-safe-area-left);-webkit-padding-end:var(--ion-safe-area-right);padding-inline-end:var(--ion-safe-area-right);display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:auto;padding-bottom:var(--ion-safe-area-bottom, 0);border-top:var(--border);background:var(--background);color:var(--color);text-align:center;contain:strict;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:10;-webkit-box-sizing:content-box !important;box-sizing:content-box !important}:host(.ion-color) ::slotted(ion-tab-button){--background-focused:var(--ion-color-shade);--color-selected:var(--ion-color-contrast)}:host(.ion-color) ::slotted(.tab-selected){color:var(--ion-color-contrast)}:host(.ion-color),:host(.ion-color) ::slotted(ion-tab-button){color:rgba(var(--ion-color-contrast-rgb), 0.7)}:host(.ion-color),:host(.ion-color) ::slotted(ion-tab-button){background:var(--ion-color-base)}:host(.ion-color) ::slotted(ion-tab-button.ion-focused),:host(.tab-bar-translucent) ::slotted(ion-tab-button.ion-focused){background:var(--background-focused)}:host(.tab-bar-translucent) ::slotted(ion-tab-button){background:transparent}:host([slot=top]){padding-top:var(--ion-safe-area-top, 0);padding-bottom:0;border-top:0;border-bottom:var(--border)}:host(.tab-bar-hidden){display:none !important}:host{--background:var(--ion-tab-bar-background, var(--ion-color-step-50, #f7f7f7));--background-focused:var(--ion-tab-bar-background-focused, #e0e0e0);--border:0.55px solid var(--ion-tab-bar-border-color, var(--ion-border-color, var(--ion-color-step-150, rgba(0, 0, 0, 0.2))));--color:var(--ion-tab-bar-color, var(--ion-color-step-600, #666666));--color-selected:var(--ion-tab-bar-color-selected, var(--ion-color-primary, #3880ff));height:50px}@supports ((-webkit-backdrop-filter: blur(0)) or (backdrop-filter: blur(0))){:host(.tab-bar-translucent){--background:rgba(var(--ion-background-color-rgb, 255, 255, 255), 0.8);-webkit-backdrop-filter:saturate(210%) blur(20px);backdrop-filter:saturate(210%) blur(20px)}:host(.ion-color.tab-bar-translucent){background:rgba(var(--ion-color-base-rgb), 0.8)}:host(.tab-bar-translucent) ::slotted(ion-tab-button.ion-focused){background:rgba(var(--ion-background-color-rgb, 255, 255, 255), 0.6)}}";
|
|
@@ -36,17 +36,26 @@ const TabBar = class {
|
|
|
36
36
|
this.selectedTabChanged();
|
|
37
37
|
}
|
|
38
38
|
async connectedCallback() {
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
39
|
+
const resizeMode = await Keyboard.getResizeMode();
|
|
40
|
+
/**
|
|
41
|
+
* If the resize mode is set to None then we don't want to
|
|
42
|
+
* hide the tab bar here since it will never sit on top
|
|
43
|
+
* of the keyboard. Hiding the tab bar will cause a layout shift
|
|
44
|
+
* in apps that have resize set to None.
|
|
45
|
+
*/
|
|
46
|
+
if (resizeMode === undefined || resizeMode.mode !== KeyboardResize.None) {
|
|
47
|
+
this.keyboardCtrl = await createKeyboardController(async (keyboardOpen, waitForResize) => {
|
|
48
|
+
/**
|
|
49
|
+
* If the keyboard is hiding, then we need to wait
|
|
50
|
+
* for the webview to resize. Otherwise, the tab bar
|
|
51
|
+
* will flicker before the webview resizes.
|
|
52
|
+
*/
|
|
53
|
+
if (keyboardOpen === false && waitForResize !== undefined) {
|
|
54
|
+
await waitForResize;
|
|
55
|
+
}
|
|
56
|
+
this.keyboardVisible = keyboardOpen; // trigger re-render by updating state
|
|
57
|
+
});
|
|
58
|
+
}
|
|
50
59
|
}
|
|
51
60
|
disconnectedCallback() {
|
|
52
61
|
if (this.keyboardCtrl) {
|