voyager-ionic-core 7.6.1 → 7.6.3
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/icon.js +15 -3
- package/components/index7.js +1 -1
- package/components/ion-datetime.js +1 -1
- package/components/ion-input.js +2 -2
- package/components/ion-refresher-content.js +10 -3
- package/components/ion-refresher.js +4 -183
- package/components/ion-select.js +2 -2
- package/components/ion-split-pane.js +2 -2
- package/components/ion-textarea.js +2 -2
- package/components/item.js +2 -2
- package/components/radio-group.js +9 -1
- package/components/refresher.utils.js +196 -0
- package/dist/cjs/{index-09471526.js → index-f52c6d38.js} +1 -1
- package/dist/cjs/ion-accordion_2.cjs.entry.js +1 -1
- package/dist/cjs/ion-back-button.cjs.entry.js +1 -1
- package/dist/cjs/ion-breadcrumb_2.cjs.entry.js +1 -1
- package/dist/cjs/ion-button_2.cjs.entry.js +15 -3
- package/dist/cjs/ion-datetime_3.cjs.entry.js +2 -2
- package/dist/cjs/ion-fab_3.cjs.entry.js +1 -1
- package/dist/cjs/ion-input.cjs.entry.js +3 -3
- package/dist/cjs/ion-item_8.cjs.entry.js +3 -3
- package/dist/cjs/ion-menu_3.cjs.entry.js +1 -1
- package/dist/cjs/ion-radio_2.cjs.entry.js +9 -1
- package/dist/cjs/ion-refresher_2.cjs.entry.js +28 -13
- package/dist/cjs/ion-reorder_2.cjs.entry.js +1 -1
- package/dist/cjs/ion-searchbar.cjs.entry.js +1 -1
- package/dist/cjs/ion-select_3.cjs.entry.js +3 -3
- package/dist/cjs/ion-split-pane.cjs.entry.js +2 -2
- package/dist/cjs/ion-textarea.cjs.entry.js +2 -2
- package/dist/cjs/ion-toggle.cjs.entry.js +1 -1
- package/dist/collection/components/datetime/datetime.ios.css +3 -1
- package/dist/collection/components/datetime/datetime.js +1 -1
- package/dist/collection/components/datetime/test/basic/datetime.e2e.js +29 -0
- package/dist/collection/components/input/input.ios.css +20 -0
- package/dist/collection/components/input/input.js +1 -1
- package/dist/collection/components/input/input.md.css +21 -0
- package/dist/collection/components/input/test/slot/input.e2e.js +6 -2
- package/dist/collection/components/item/item.ios.css +6 -0
- package/dist/collection/components/item/item.md.css +6 -0
- package/dist/collection/components/label/test/a11y/label.e2e.js +25 -0
- package/dist/collection/components/modal/modal.js +1 -1
- package/dist/collection/components/radio/test/a11y/radio.e2e.js +16 -3
- package/dist/collection/components/radio/test/legacy/a11y/radio.e2e.js +15 -2
- package/dist/collection/components/radio-group/radio-group.js +9 -1
- package/dist/collection/components/range/range.js +1 -1
- package/dist/collection/components/refresher/refresher.js +3 -0
- package/dist/collection/components/refresher/refresher.utils.js +19 -11
- package/dist/collection/components/refresher-content/refresher-content.js +9 -3
- package/dist/collection/components/select/select.ios.css +20 -0
- package/dist/collection/components/select/select.md.css +21 -0
- package/dist/collection/components/select/test/slot/select.e2e.js +6 -2
- package/dist/collection/components/split-pane/split-pane.ios.css +9 -0
- package/dist/collection/components/split-pane/split-pane.md.css +9 -0
- package/dist/collection/components/textarea/test/slot/textarea.e2e.js +6 -2
- package/dist/collection/components/textarea/textarea.ios.css +20 -0
- package/dist/collection/components/textarea/textarea.js +1 -1
- package/dist/collection/components/textarea/textarea.md.css +21 -0
- package/dist/docs.json +33 -7
- package/dist/esm/{index-c132c5f1.js → index-f7dc70ba.js} +1 -1
- package/dist/esm/ion-accordion_2.entry.js +1 -1
- package/dist/esm/ion-back-button.entry.js +1 -1
- package/dist/esm/ion-breadcrumb_2.entry.js +1 -1
- package/dist/esm/ion-button_2.entry.js +15 -3
- package/dist/esm/ion-datetime_3.entry.js +2 -2
- package/dist/esm/ion-fab_3.entry.js +1 -1
- package/dist/esm/ion-input.entry.js +3 -3
- package/dist/esm/ion-item_8.entry.js +3 -3
- package/dist/esm/ion-menu_3.entry.js +1 -1
- package/dist/esm/ion-radio_2.entry.js +9 -1
- package/dist/esm/ion-refresher_2.entry.js +29 -14
- package/dist/esm/ion-reorder_2.entry.js +1 -1
- package/dist/esm/ion-searchbar.entry.js +1 -1
- package/dist/esm/ion-select_3.entry.js +3 -3
- package/dist/esm/ion-split-pane.entry.js +2 -2
- package/dist/esm/ion-textarea.entry.js +2 -2
- package/dist/esm/ion-toggle.entry.js +1 -1
- package/dist/esm-es5/ion-accordion_2.entry.js +1 -1
- package/dist/esm-es5/ion-back-button.entry.js +1 -1
- package/dist/esm-es5/ion-breadcrumb_2.entry.js +1 -1
- package/dist/esm-es5/ion-button_2.entry.js +1 -1
- package/dist/esm-es5/ion-datetime_3.entry.js +1 -1
- package/dist/esm-es5/ion-fab_3.entry.js +1 -1
- package/dist/esm-es5/ion-input.entry.js +1 -1
- package/dist/esm-es5/ion-item_8.entry.js +1 -1
- package/dist/esm-es5/ion-menu_3.entry.js +1 -1
- package/dist/esm-es5/ion-radio_2.entry.js +1 -1
- package/dist/esm-es5/ion-refresher_2.entry.js +1 -1
- package/dist/esm-es5/ion-reorder_2.entry.js +1 -1
- package/dist/esm-es5/ion-searchbar.entry.js +1 -1
- package/dist/esm-es5/ion-select_3.entry.js +1 -1
- package/dist/esm-es5/ion-split-pane.entry.js +1 -1
- package/dist/esm-es5/ion-textarea.entry.js +1 -1
- package/dist/esm-es5/ion-toggle.entry.js +1 -1
- package/dist/html.html-data.json +13 -1
- package/dist/ionic/ionic.esm.js +1 -1
- package/dist/ionic/p-02cb0cf0.entry.js +4 -0
- package/dist/ionic/{p-a42ef163.system.entry.js → p-068ec6d3.system.entry.js} +1 -1
- package/dist/ionic/{p-19c379da.system.entry.js → p-149567b1.system.entry.js} +1 -1
- package/dist/ionic/{p-11786dc7.entry.js → p-154e5e06.entry.js} +1 -1
- package/dist/ionic/p-19d9ceb8.system.js +1 -1
- package/dist/ionic/p-213e377d.system.entry.js +4 -0
- package/dist/ionic/{p-0dfa4ab4.system.entry.js → p-254ec7c0.system.entry.js} +2 -2
- package/dist/ionic/{p-ebe8bd8a.entry.js → p-2b3debd5.entry.js} +1 -1
- package/dist/ionic/{p-f0504446.system.entry.js → p-328107a5.system.entry.js} +1 -1
- package/dist/ionic/p-328b49db.system.entry.js +4 -0
- package/dist/ionic/{p-aee39e06.entry.js → p-3381c3f4.entry.js} +1 -1
- package/dist/ionic/{p-4981ea0a.system.entry.js → p-39f96ff6.system.entry.js} +1 -1
- package/dist/ionic/{p-10ec9af7.system.entry.js → p-43f03cf4.system.entry.js} +1 -1
- package/dist/ionic/p-4a3218d4.system.entry.js +4 -0
- package/dist/ionic/{p-2a583966.entry.js → p-4f400544.entry.js} +1 -1
- package/dist/ionic/p-5e0c7fdc.entry.js +4 -0
- package/dist/ionic/{p-529b24fb.entry.js → p-5ff99b79.entry.js} +1 -1
- package/dist/ionic/{p-cb8dff22.system.entry.js → p-6337e56b.system.entry.js} +1 -1
- package/dist/ionic/{p-2df97906.system.entry.js → p-72cb0718.system.entry.js} +1 -1
- package/dist/ionic/{p-4685218a.system.entry.js → p-793a10e0.system.entry.js} +1 -1
- package/dist/ionic/p-799da666.entry.js +4 -0
- package/dist/ionic/p-8dae44aa.entry.js +4 -0
- package/dist/ionic/p-93419ece.system.entry.js +4 -0
- package/dist/ionic/p-a20bb802.entry.js +4 -0
- package/dist/ionic/p-a4461d1c.system.entry.js +4 -0
- package/dist/ionic/{p-ae4b7df8.entry.js → p-aed4931c.entry.js} +1 -1
- package/dist/ionic/{p-cf53213c.entry.js → p-bdf71399.entry.js} +1 -1
- package/dist/ionic/{p-806a9810.entry.js → p-c23eff76.entry.js} +1 -1
- package/dist/ionic/{p-803efb5d.entry.js → p-c68dd1e0.entry.js} +1 -1
- package/dist/ionic/p-c8aadc98.system.entry.js +4 -0
- package/dist/ionic/{p-11a3973f.entry.js → p-cad1126a.entry.js} +1 -1
- package/dist/ionic/{p-7dc892f8.entry.js → p-d0748f6d.entry.js} +1 -1
- package/dist/ionic/p-da666998.system.entry.js +4 -0
- package/dist/ionic/p-eb246b50.entry.js +4 -0
- package/dist/ionic/p-ee810056.system.entry.js +4 -0
- package/dist/types/components/datetime/datetime.d.ts +3 -0
- package/dist/types/components/input/input.d.ts +3 -0
- package/dist/types/components/modal/modal.d.ts +3 -0
- package/dist/types/components/range/range.d.ts +3 -0
- package/dist/types/components/refresher/refresher.d.ts +3 -0
- package/dist/types/components/refresher/refresher.utils.d.ts +16 -0
- package/dist/types/components/textarea/textarea.d.ts +3 -0
- package/dist/types/components.d.ts +18 -10
- package/hydrate/index.js +51 -25
- package/package.json +5 -5
- package/dist/ionic/p-164aa69c.entry.js +0 -4
- package/dist/ionic/p-22827063.system.entry.js +0 -4
- package/dist/ionic/p-2cf21a15.system.entry.js +0 -4
- package/dist/ionic/p-38531958.system.entry.js +0 -4
- package/dist/ionic/p-469dd571.system.entry.js +0 -4
- package/dist/ionic/p-932f2259.system.entry.js +0 -4
- package/dist/ionic/p-950c05ad.entry.js +0 -4
- package/dist/ionic/p-96d4814f.system.entry.js +0 -4
- package/dist/ionic/p-9ba72fdb.system.entry.js +0 -4
- package/dist/ionic/p-a06501e3.entry.js +0 -4
- package/dist/ionic/p-b78e6a44.entry.js +0 -4
- package/dist/ionic/p-c5acfeb1.entry.js +0 -4
- package/dist/ionic/p-dc6d8647.entry.js +0 -4
- package/dist/ionic/p-f434bcf3.system.entry.js +0 -4
- /package/dist/esm-es5/{index-c132c5f1.js → index-f7dc70ba.js} +0 -0
- /package/dist/ionic/{p-ea96fa73.js → p-831269de.js} +0 -0
- /package/dist/ionic/{p-8050b9b9.system.js → p-dfb6de03.system.js} +0 -0
|
@@ -4,7 +4,6 @@
|
|
|
4
4
|
import { writeTask } from "@stencil/core";
|
|
5
5
|
import { createAnimation } from "../../utils/animation/animation";
|
|
6
6
|
import { clamp, componentOnReady, transitionEndAsync } from "../../utils/helpers";
|
|
7
|
-
import { isPlatform } from "../../utils/platform";
|
|
8
7
|
export const getRefresherAnimationType = (contentEl) => {
|
|
9
8
|
const previousSibling = contentEl.previousElementSibling;
|
|
10
9
|
const hasHeader = previousSibling !== null && previousSibling.tagName === 'ION-HEADER';
|
|
@@ -162,6 +161,24 @@ export const translateElement = (el, value, duration = 200) => {
|
|
|
162
161
|
};
|
|
163
162
|
// Utils
|
|
164
163
|
// -----------------------------
|
|
164
|
+
/**
|
|
165
|
+
* In order to use the native iOS refresher the device must support rubber band scrolling.
|
|
166
|
+
* As part of this, we need to exclude Desktop Safari because it has a slightly different rubber band effect that is not compatible with the native refresher in Ionic.
|
|
167
|
+
*
|
|
168
|
+
* We also need to be careful not to include devices that spoof their user agent.
|
|
169
|
+
* For example, when using iOS emulation in Chrome the user agent will be spoofed such that
|
|
170
|
+
* navigator.maxTouchPointer > 0. To work around this,
|
|
171
|
+
* we check to see if the apple-pay-logo is supported as a named image which is only
|
|
172
|
+
* true on Apple devices.
|
|
173
|
+
*
|
|
174
|
+
* We previously checked referencEl.style.webkitOverflowScrolling to explicitly check
|
|
175
|
+
* for rubber band support. However, this property was removed on iPadOS and it's possible
|
|
176
|
+
* that this will be removed on iOS in the future too.
|
|
177
|
+
*
|
|
178
|
+
*/
|
|
179
|
+
export const supportsRubberBandScrolling = () => {
|
|
180
|
+
return navigator.maxTouchPoints > 0 && CSS.supports('background: -webkit-named-image(apple-pay-logo-black)');
|
|
181
|
+
};
|
|
165
182
|
export const shouldUseNativeRefresher = async (referenceEl, mode) => {
|
|
166
183
|
const refresherContent = referenceEl.querySelector('ion-refresher-content');
|
|
167
184
|
if (!refresherContent) {
|
|
@@ -172,14 +189,5 @@ export const shouldUseNativeRefresher = async (referenceEl, mode) => {
|
|
|
172
189
|
const refreshingSpinner = referenceEl.querySelector('ion-refresher-content .refresher-refreshing ion-spinner');
|
|
173
190
|
return (pullingSpinner !== null &&
|
|
174
191
|
refreshingSpinner !== null &&
|
|
175
|
-
|
|
176
|
-
* We use webkitOverflowScrolling for feature detection with rubber band scrolling
|
|
177
|
-
* on iOS. When doing referenceEl.style, webkitOverflowScrolling is undefined on non-iOS platforms.
|
|
178
|
-
* However, it will be the empty string on iOS.
|
|
179
|
-
* Note that we do not use getPropertyValue (and thus need to cast as any) because calling
|
|
180
|
-
* getPropertyValue('-webkit-overflow-scrolling') will return the empty string if it is not
|
|
181
|
-
* set on the element, even if the platform does not support that.
|
|
182
|
-
*/
|
|
183
|
-
((mode === 'ios' && isPlatform('mobile') && referenceEl.style.webkitOverflowScrolling !== undefined) ||
|
|
184
|
-
mode === 'md'));
|
|
192
|
+
((mode === 'ios' && supportsRubberBandScrolling()) || mode === 'md'));
|
|
185
193
|
};
|
|
@@ -3,11 +3,11 @@
|
|
|
3
3
|
*/
|
|
4
4
|
import { Host, h } from "@stencil/core";
|
|
5
5
|
import { ENABLE_HTML_CONTENT_DEFAULT } from "../../utils/config";
|
|
6
|
-
import { isPlatform } from "../../utils/platform";
|
|
7
6
|
import { sanitizeDOMString } from "../../utils/sanitization/index";
|
|
8
7
|
import { arrowDown, caretBackSharp } from "ionicons/icons";
|
|
9
8
|
import { config } from "../../global/config";
|
|
10
9
|
import { getIonMode } from "../../global/ionic-global";
|
|
10
|
+
import { supportsRubberBandScrolling } from "../refresher/refresher.utils";
|
|
11
11
|
import { SPINNERS } from "../spinner/spinner-configs";
|
|
12
12
|
export class RefresherContent {
|
|
13
13
|
constructor() {
|
|
@@ -19,9 +19,15 @@ export class RefresherContent {
|
|
|
19
19
|
}
|
|
20
20
|
componentWillLoad() {
|
|
21
21
|
if (this.pullingIcon === undefined) {
|
|
22
|
+
/**
|
|
23
|
+
* The native iOS refresher uses a spinner instead of
|
|
24
|
+
* an icon, so we need to see if this device supports
|
|
25
|
+
* the native iOS refresher.
|
|
26
|
+
*/
|
|
27
|
+
const hasRubberBandScrolling = supportsRubberBandScrolling();
|
|
22
28
|
const mode = getIonMode(this);
|
|
23
|
-
const overflowRefresher =
|
|
24
|
-
this.pullingIcon = config.get('refreshingIcon', mode === 'ios' &&
|
|
29
|
+
const overflowRefresher = hasRubberBandScrolling ? 'lines' : arrowDown;
|
|
30
|
+
this.pullingIcon = config.get('refreshingIcon', mode === 'ios' && hasRubberBandScrolling ? config.get('spinner', overflowRefresher) : 'circular');
|
|
25
31
|
}
|
|
26
32
|
if (this.refreshingSpinner === undefined) {
|
|
27
33
|
const mode = getIonMode(this);
|
|
@@ -628,10 +628,12 @@ button {
|
|
|
628
628
|
|
|
629
629
|
::slotted([slot=start]) {
|
|
630
630
|
margin-inline-end: 16px;
|
|
631
|
+
margin-inline-start: 0;
|
|
631
632
|
}
|
|
632
633
|
|
|
633
634
|
::slotted([slot=end]) {
|
|
634
635
|
margin-inline-start: 16px;
|
|
636
|
+
margin-inline-end: 0;
|
|
635
637
|
}
|
|
636
638
|
|
|
637
639
|
/**
|
|
@@ -764,4 +766,22 @@ button {
|
|
|
764
766
|
|
|
765
767
|
:host(.select-disabled) {
|
|
766
768
|
opacity: 0.3;
|
|
769
|
+
}
|
|
770
|
+
|
|
771
|
+
/**
|
|
772
|
+
* Slotted buttons have a lot of default padding that can
|
|
773
|
+
* cause them to look misaligned from other pieces such
|
|
774
|
+
* as the control's label, especially when using a clear
|
|
775
|
+
* fill. We also make them circular to ensure that non-
|
|
776
|
+
* clear buttons and the focus/hover state on clear ones
|
|
777
|
+
* don't look too crowded.
|
|
778
|
+
*/
|
|
779
|
+
::slotted(ion-button[slot=start].button-has-icon-only),
|
|
780
|
+
::slotted(ion-button[slot=end].button-has-icon-only) {
|
|
781
|
+
--border-radius: 50%;
|
|
782
|
+
--padding-start: 0;
|
|
783
|
+
--padding-end: 0;
|
|
784
|
+
--padding-top: 0;
|
|
785
|
+
--padding-bottom: 0;
|
|
786
|
+
aspect-ratio: 1;
|
|
767
787
|
}
|
|
@@ -628,10 +628,12 @@ button {
|
|
|
628
628
|
|
|
629
629
|
::slotted([slot=start]) {
|
|
630
630
|
margin-inline-end: 16px;
|
|
631
|
+
margin-inline-start: 0;
|
|
631
632
|
}
|
|
632
633
|
|
|
633
634
|
::slotted([slot=end]) {
|
|
634
635
|
margin-inline-start: 16px;
|
|
636
|
+
margin-inline-end: 0;
|
|
635
637
|
}
|
|
636
638
|
|
|
637
639
|
/**
|
|
@@ -1350,4 +1352,23 @@ button {
|
|
|
1350
1352
|
|
|
1351
1353
|
:host(.select-disabled) {
|
|
1352
1354
|
opacity: 0.38;
|
|
1355
|
+
}
|
|
1356
|
+
|
|
1357
|
+
/**
|
|
1358
|
+
* Slotted buttons have a lot of default padding that can
|
|
1359
|
+
* cause them to look misaligned from other pieces such
|
|
1360
|
+
* as the control's label, especially when using a clear
|
|
1361
|
+
* fill. We also make them circular to ensure that non-
|
|
1362
|
+
* clear buttons and the focus/hover state on clear ones
|
|
1363
|
+
* don't look too crowded.
|
|
1364
|
+
*/
|
|
1365
|
+
::slotted(ion-button[slot=start].button-has-icon-only),
|
|
1366
|
+
::slotted(ion-button[slot=end].button-has-icon-only) {
|
|
1367
|
+
--border-radius: 50%;
|
|
1368
|
+
--padding-start: 8px;
|
|
1369
|
+
--padding-end: 8px;
|
|
1370
|
+
--padding-top: 8px;
|
|
1371
|
+
--padding-bottom: 8px;
|
|
1372
|
+
aspect-ratio: 1;
|
|
1373
|
+
min-height: 40px;
|
|
1353
1374
|
}
|
|
@@ -9,7 +9,9 @@ configs().forEach(({ title, screenshot, config }) => {
|
|
|
9
9
|
await page.setContent(`
|
|
10
10
|
<ion-select label-placement="start" fill="solid" placeholder="Select weight" label="Weight">
|
|
11
11
|
<ion-icon slot="start" name="barbell" aria-hidden="true"></ion-icon>
|
|
12
|
-
<ion-
|
|
12
|
+
<ion-button slot="end" aria-label="Show/hide password">
|
|
13
|
+
<ion-icon slot="icon-only" name="lock-closed" aria-hidden="true"></ion-icon>
|
|
14
|
+
</ion-button>
|
|
13
15
|
</ion-select>
|
|
14
16
|
`, config);
|
|
15
17
|
const select = page.locator('ion-select');
|
|
@@ -19,7 +21,9 @@ configs().forEach(({ title, screenshot, config }) => {
|
|
|
19
21
|
await page.setContent(`
|
|
20
22
|
<ion-select label-placement="floating" fill="solid" placeholder="Select weight" label="Weight">
|
|
21
23
|
<ion-icon slot="start" name="barbell" aria-hidden="true"></ion-icon>
|
|
22
|
-
<ion-
|
|
24
|
+
<ion-button slot="end" aria-label="Show/hide password">
|
|
25
|
+
<ion-icon slot="icon-only" name="lock-closed" aria-hidden="true"></ion-icon>
|
|
26
|
+
</ion-button>
|
|
23
27
|
</ion-select>
|
|
24
28
|
`, config);
|
|
25
29
|
const select = page.locator('ion-select');
|
|
@@ -152,6 +152,15 @@
|
|
|
152
152
|
|
|
153
153
|
:host(.split-pane-visible) ::slotted(.split-pane-main) {
|
|
154
154
|
flex: 1;
|
|
155
|
+
/**
|
|
156
|
+
* Content can overflow outside of a router outlet
|
|
157
|
+
* or a nav container to allow for the translucent
|
|
158
|
+
* tab bar effect to work. However, this can cause
|
|
159
|
+
* iOS page transitions to flow outside of the container
|
|
160
|
+
* and overlap the menu on larger viewports. As a result,
|
|
161
|
+
* we disable the overflow when that is the case.
|
|
162
|
+
*/
|
|
163
|
+
overflow: hidden;
|
|
155
164
|
}
|
|
156
165
|
|
|
157
166
|
:host(.split-pane-visible) ::slotted(.split-pane-side:not(ion-menu)),
|
|
@@ -152,6 +152,15 @@
|
|
|
152
152
|
|
|
153
153
|
:host(.split-pane-visible) ::slotted(.split-pane-main) {
|
|
154
154
|
flex: 1;
|
|
155
|
+
/**
|
|
156
|
+
* Content can overflow outside of a router outlet
|
|
157
|
+
* or a nav container to allow for the translucent
|
|
158
|
+
* tab bar effect to work. However, this can cause
|
|
159
|
+
* iOS page transitions to flow outside of the container
|
|
160
|
+
* and overlap the menu on larger viewports. As a result,
|
|
161
|
+
* we disable the overflow when that is the case.
|
|
162
|
+
*/
|
|
163
|
+
overflow: hidden;
|
|
155
164
|
}
|
|
156
165
|
|
|
157
166
|
:host(.split-pane-visible) ::slotted(.split-pane-side:not(ion-menu)),
|
|
@@ -9,7 +9,9 @@ configs().forEach(({ title, screenshot, config }) => {
|
|
|
9
9
|
await page.setContent(`
|
|
10
10
|
<ion-textarea label-placement="start" fill="solid" value="100" label="Weight">
|
|
11
11
|
<ion-icon slot="start" name="barbell" aria-hidden="true"></ion-icon>
|
|
12
|
-
<ion-
|
|
12
|
+
<ion-button slot="end" aria-label="Show/hide password">
|
|
13
|
+
<ion-icon slot="icon-only" name="lock-closed" aria-hidden="true"></ion-icon>
|
|
14
|
+
</ion-button>
|
|
13
15
|
</ion-textarea>
|
|
14
16
|
`, config);
|
|
15
17
|
const textarea = page.locator('ion-textarea');
|
|
@@ -19,7 +21,9 @@ configs().forEach(({ title, screenshot, config }) => {
|
|
|
19
21
|
await page.setContent(`
|
|
20
22
|
<ion-textarea label-placement="floating" fill="solid" value="100" label="Weight">
|
|
21
23
|
<ion-icon slot="start" name="barbell" aria-hidden="true"></ion-icon>
|
|
22
|
-
<ion-
|
|
24
|
+
<ion-button slot="end" aria-label="Show/hide password">
|
|
25
|
+
<ion-icon slot="icon-only" name="lock-closed" aria-hidden="true"></ion-icon>
|
|
26
|
+
</ion-button>
|
|
23
27
|
</ion-textarea>
|
|
24
28
|
`, config);
|
|
25
29
|
const textarea = page.locator('ion-textarea');
|
|
@@ -766,10 +766,12 @@
|
|
|
766
766
|
|
|
767
767
|
::slotted([slot=start]) {
|
|
768
768
|
margin-inline-end: 16px;
|
|
769
|
+
margin-inline-start: 0;
|
|
769
770
|
}
|
|
770
771
|
|
|
771
772
|
::slotted([slot=end]) {
|
|
772
773
|
margin-inline-start: 16px;
|
|
774
|
+
margin-inline-end: 0;
|
|
773
775
|
}
|
|
774
776
|
|
|
775
777
|
/**
|
|
@@ -964,4 +966,22 @@
|
|
|
964
966
|
:host(.legacy-textarea) .native-textarea[disabled],
|
|
965
967
|
:host(.textarea-disabled) {
|
|
966
968
|
opacity: 0.3;
|
|
969
|
+
}
|
|
970
|
+
|
|
971
|
+
/**
|
|
972
|
+
* Slotted buttons have a lot of default padding that can
|
|
973
|
+
* cause them to look misaligned from other pieces such
|
|
974
|
+
* as the control's label, especially when using a clear
|
|
975
|
+
* fill. We also make them circular to ensure that non-
|
|
976
|
+
* clear buttons and the focus/hover state on clear ones
|
|
977
|
+
* don't look too crowded.
|
|
978
|
+
*/
|
|
979
|
+
::slotted(ion-button[slot=start].button-has-icon-only),
|
|
980
|
+
::slotted(ion-button[slot=end].button-has-icon-only) {
|
|
981
|
+
--border-radius: 50%;
|
|
982
|
+
--padding-start: 0;
|
|
983
|
+
--padding-end: 0;
|
|
984
|
+
--padding-top: 0;
|
|
985
|
+
--padding-bottom: 0;
|
|
986
|
+
aspect-ratio: 1;
|
|
967
987
|
}
|
|
@@ -848,7 +848,7 @@ Developers can use the "legacy" property to continue using the legacy form marku
|
|
|
848
848
|
"optional": true,
|
|
849
849
|
"docs": {
|
|
850
850
|
"tags": [],
|
|
851
|
-
"text": "A callback used to format the counter text.\nBy default the counter text is set to \"itemLength / maxLength\"."
|
|
851
|
+
"text": "A callback used to format the counter text.\nBy default the counter text is set to \"itemLength / maxLength\".\n\nSee https://ionicframework.com/docs/troubleshooting/runtime#accessing-this\nif you need to access `this` from within the callback."
|
|
852
852
|
}
|
|
853
853
|
},
|
|
854
854
|
"errorText": {
|
|
@@ -766,10 +766,12 @@
|
|
|
766
766
|
|
|
767
767
|
::slotted([slot=start]) {
|
|
768
768
|
margin-inline-end: 16px;
|
|
769
|
+
margin-inline-start: 0;
|
|
769
770
|
}
|
|
770
771
|
|
|
771
772
|
::slotted([slot=end]) {
|
|
772
773
|
margin-inline-start: 16px;
|
|
774
|
+
margin-inline-end: 0;
|
|
773
775
|
}
|
|
774
776
|
|
|
775
777
|
/**
|
|
@@ -1529,4 +1531,23 @@
|
|
|
1529
1531
|
|
|
1530
1532
|
:host(.textarea-shape-round) {
|
|
1531
1533
|
--border-radius: 16px;
|
|
1534
|
+
}
|
|
1535
|
+
|
|
1536
|
+
/**
|
|
1537
|
+
* Slotted buttons have a lot of default padding that can
|
|
1538
|
+
* cause them to look misaligned from other pieces such
|
|
1539
|
+
* as the control's label, especially when using a clear
|
|
1540
|
+
* fill. We also make them circular to ensure that non-
|
|
1541
|
+
* clear buttons and the focus/hover state on clear ones
|
|
1542
|
+
* don't look too crowded.
|
|
1543
|
+
*/
|
|
1544
|
+
::slotted(ion-button[slot=start].button-has-icon-only),
|
|
1545
|
+
::slotted(ion-button[slot=end].button-has-icon-only) {
|
|
1546
|
+
--border-radius: 50%;
|
|
1547
|
+
--padding-start: 8px;
|
|
1548
|
+
--padding-end: 8px;
|
|
1549
|
+
--padding-top: 8px;
|
|
1550
|
+
--padding-bottom: 8px;
|
|
1551
|
+
aspect-ratio: 1;
|
|
1552
|
+
min-height: 40px;
|
|
1532
1553
|
}
|
package/dist/docs.json
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
{
|
|
2
|
-
"timestamp": "
|
|
2
|
+
"timestamp": "2024-01-03T23:38:55",
|
|
3
3
|
"compiler": {
|
|
4
4
|
"name": "@stencil/core",
|
|
5
5
|
"version": "4.8.2",
|
|
@@ -7627,7 +7627,7 @@
|
|
|
7627
7627
|
},
|
|
7628
7628
|
"mutable": false,
|
|
7629
7629
|
"reflectToAttr": false,
|
|
7630
|
-
"docs": "A callback used to format the header text that shows how many\ndates are selected. Only used if there are 0 or more than 1\nselected (i.e. unused for exactly 1). By default, the header\ntext is set to \"numberOfDates days\".",
|
|
7630
|
+
"docs": "A callback used to format the header text that shows how many\ndates are selected. Only used if there are 0 or more than 1\nselected (i.e. unused for exactly 1). By default, the header\ntext is set to \"numberOfDates days\".\n\nSee https://ionicframework.com/docs/troubleshooting/runtime#accessing-this\nif you need to access `this` from within the callback.",
|
|
7631
7631
|
"docsTags": [],
|
|
7632
7632
|
"values": [
|
|
7633
7633
|
{
|
|
@@ -10162,7 +10162,7 @@
|
|
|
10162
10162
|
},
|
|
10163
10163
|
"mutable": false,
|
|
10164
10164
|
"reflectToAttr": false,
|
|
10165
|
-
"docs": "A callback used to format the counter text.\nBy default the counter text is set to \"itemLength / maxLength\".",
|
|
10165
|
+
"docs": "A callback used to format the counter text.\nBy default the counter text is set to \"itemLength / maxLength\".\n\nSee https://ionicframework.com/docs/troubleshooting/runtime#accessing-this\nif you need to access `this` from within the callback.",
|
|
10166
10166
|
"docsTags": [],
|
|
10167
10167
|
"values": [
|
|
10168
10168
|
{
|
|
@@ -15091,7 +15091,7 @@
|
|
|
15091
15091
|
"mutable": false,
|
|
15092
15092
|
"attr": "can-dismiss",
|
|
15093
15093
|
"reflectToAttr": false,
|
|
15094
|
-
"docs": "Determines whether or not a modal can dismiss\nwhen calling the `dismiss` method.\n\nIf the value is `true` or the value's function returns `true`, the modal will close when trying to dismiss.\nIf the value is `false` or the value's function returns `false`, the modal will not close when trying to dismiss.",
|
|
15094
|
+
"docs": "Determines whether or not a modal can dismiss\nwhen calling the `dismiss` method.\n\nIf the value is `true` or the value's function returns `true`, the modal will close when trying to dismiss.\nIf the value is `false` or the value's function returns `false`, the modal will not close when trying to dismiss.\n\nSee https://ionicframework.com/docs/troubleshooting/runtime#accessing-this\nif you need to access `this` from within the callback.",
|
|
15095
15095
|
"docsTags": [],
|
|
15096
15096
|
"default": "true",
|
|
15097
15097
|
"values": [
|
|
@@ -20286,7 +20286,7 @@
|
|
|
20286
20286
|
},
|
|
20287
20287
|
"mutable": false,
|
|
20288
20288
|
"reflectToAttr": false,
|
|
20289
|
-
"docs": "A callback used to format the pin text.\nBy default the pin text is set to `Math.round(value)
|
|
20289
|
+
"docs": "A callback used to format the pin text.\nBy default the pin text is set to `Math.round(value)`.\n\nSee https://ionicframework.com/docs/troubleshooting/runtime#accessing-this\nif you need to access `this` from within the callback.",
|
|
20290
20290
|
"docsTags": [],
|
|
20291
20291
|
"default": "(value: number): number => Math.round(value)",
|
|
20292
20292
|
"values": [
|
|
@@ -20620,7 +20620,12 @@
|
|
|
20620
20620
|
"encapsulation": "none",
|
|
20621
20621
|
"tag": "ion-refresher",
|
|
20622
20622
|
"docs": "",
|
|
20623
|
-
"docsTags": [
|
|
20623
|
+
"docsTags": [
|
|
20624
|
+
{
|
|
20625
|
+
"name": "virtualProp",
|
|
20626
|
+
"text": "{\"ios\" | \"md\"} mode - The mode determines which platform styles to use."
|
|
20627
|
+
}
|
|
20628
|
+
],
|
|
20624
20629
|
"usage": {},
|
|
20625
20630
|
"props": [
|
|
20626
20631
|
{
|
|
@@ -20667,6 +20672,27 @@
|
|
|
20667
20672
|
"optional": false,
|
|
20668
20673
|
"required": false
|
|
20669
20674
|
},
|
|
20675
|
+
{
|
|
20676
|
+
"name": "mode",
|
|
20677
|
+
"type": "\"ios\" | \"md\"",
|
|
20678
|
+
"mutable": false,
|
|
20679
|
+
"attr": "mode",
|
|
20680
|
+
"reflectToAttr": false,
|
|
20681
|
+
"docs": "The mode determines which platform styles to use.",
|
|
20682
|
+
"docsTags": [],
|
|
20683
|
+
"values": [
|
|
20684
|
+
{
|
|
20685
|
+
"value": "ios",
|
|
20686
|
+
"type": "string"
|
|
20687
|
+
},
|
|
20688
|
+
{
|
|
20689
|
+
"value": "md",
|
|
20690
|
+
"type": "string"
|
|
20691
|
+
}
|
|
20692
|
+
],
|
|
20693
|
+
"optional": true,
|
|
20694
|
+
"required": false
|
|
20695
|
+
},
|
|
20670
20696
|
{
|
|
20671
20697
|
"name": "pullFactor",
|
|
20672
20698
|
"type": "number",
|
|
@@ -26355,7 +26381,7 @@
|
|
|
26355
26381
|
},
|
|
26356
26382
|
"mutable": false,
|
|
26357
26383
|
"reflectToAttr": false,
|
|
26358
|
-
"docs": "A callback used to format the counter text.\nBy default the counter text is set to \"itemLength / maxLength\".",
|
|
26384
|
+
"docs": "A callback used to format the counter text.\nBy default the counter text is set to \"itemLength / maxLength\".\n\nSee https://ionicframework.com/docs/troubleshooting/runtime#accessing-this\nif you need to access `this` from within the callback.",
|
|
26359
26385
|
"docsTags": [],
|
|
26360
26386
|
"values": [
|
|
26361
26387
|
{
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
/*!
|
|
2
2
|
* (C) Ionic http://ionicframework.com - MIT License
|
|
3
3
|
*/
|
|
4
|
-
/* Ionicons v7.2.
|
|
4
|
+
/* Ionicons v7.2.2, ES Modules */
|
|
5
5
|
const arrowBackSharp = "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' class='ionicon' viewBox='0 0 512 512'><path stroke-linecap='square' stroke-miterlimit='10' stroke-width='48' d='M244 400L100 256l144-144M120 256h292' class='ionicon-fill-none'/></svg>";
|
|
6
6
|
const arrowDown = "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' class='ionicon' viewBox='0 0 512 512'><path stroke-linecap='round' stroke-linejoin='round' stroke-width='48' d='M112 268l144 144 144-144M256 392V100' class='ionicon-fill-none'/></svg>";
|
|
7
7
|
const caretBackSharp = "data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' class='ionicon' viewBox='0 0 512 512'><path d='M368 64L144 256l224 192V64z'/></svg>";
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
*/
|
|
4
4
|
import { r as registerInstance, h, H as Host, f as getElement, d as createEvent } from './index-b7d870cf.js';
|
|
5
5
|
import { r as raf, t as transitionEndAsync, a as addEventListener, b as removeEventListener, g as getElementRoot } from './helpers-ae653409.js';
|
|
6
|
-
import { l as chevronDown } from './index-
|
|
6
|
+
import { l as chevronDown } from './index-f7dc70ba.js';
|
|
7
7
|
import { c as config, b as getIonMode } from './ionic-global-1f99b929.js';
|
|
8
8
|
import { p as printIonWarning } from './index-9b0d46f4.js';
|
|
9
9
|
|
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
import { r as registerInstance, h, H as Host, f as getElement } from './index-b7d870cf.js';
|
|
5
5
|
import { i as inheritAriaAttributes } from './helpers-ae653409.js';
|
|
6
6
|
import { o as openURL, c as createColorClasses, h as hostContext } from './theme-01f3f29c.js';
|
|
7
|
-
import { c as chevronBack, a as arrowBackSharp } from './index-
|
|
7
|
+
import { c as chevronBack, a as arrowBackSharp } from './index-f7dc70ba.js';
|
|
8
8
|
import { c as config, b as getIonMode } from './ionic-global-1f99b929.js';
|
|
9
9
|
|
|
10
10
|
const backButtonIosCss = ":host{--background:transparent;--color-focused:currentColor;--color-hover:currentColor;--icon-margin-top:0;--icon-margin-bottom:0;--icon-padding-top:0;--icon-padding-end:0;--icon-padding-bottom:0;--icon-padding-start:0;--margin-top:0;--margin-end:0;--margin-bottom:0;--margin-start:0;--min-width:auto;--min-height:auto;--padding-top:0;--padding-end:0;--padding-bottom:0;--padding-start:0;--opacity:1;--ripple-color:currentColor;--transition:background-color, opacity 100ms linear;display:none;min-width:var(--min-width);min-height:var(--min-height);color:var(--color);font-family:var(--ion-font-family, inherit);text-align:center;text-decoration:none;text-overflow:ellipsis;text-transform:none;white-space:nowrap;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-font-kerning:none;font-kerning:none}ion-ripple-effect{color:var(--ripple-color)}:host(.ion-color) .button-native{color:var(--ion-color-base)}:host(.show-back-button){display:block}:host(.back-button-disabled){cursor:default;opacity:0.5;pointer-events:none}.button-native{border-radius:var(--border-radius);-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;-webkit-margin-start:var(--margin-start);margin-inline-start:var(--margin-start);-webkit-margin-end:var(--margin-end);margin-inline-end:var(--margin-end);margin-top:var(--margin-top);margin-bottom:var(--margin-bottom);-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit;display:block;position:relative;width:100%;height:100%;min-height:inherit;-webkit-transition:var(--transition);transition:var(--transition);border:0;outline:none;background:var(--background);line-height:1;cursor:pointer;opacity:var(--opacity);overflow:hidden;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:0;-webkit-appearance:none;-moz-appearance:none;appearance:none}.button-inner{display:-ms-flexbox;display:flex;position:relative;-ms-flex-flow:row nowrap;flex-flow:row nowrap;-ms-flex-negative:0;flex-shrink:0;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:100%;height:100%;z-index:1}ion-icon{-webkit-padding-start:var(--icon-padding-start);padding-inline-start:var(--icon-padding-start);-webkit-padding-end:var(--icon-padding-end);padding-inline-end:var(--icon-padding-end);padding-top:var(--icon-padding-top);padding-bottom:var(--icon-padding-bottom);-webkit-margin-start:var(--icon-margin-start);margin-inline-start:var(--icon-margin-start);-webkit-margin-end:var(--icon-margin-end);margin-inline-end:var(--icon-margin-end);margin-top:var(--icon-margin-top);margin-bottom:var(--icon-margin-bottom);display:inherit;font-size:var(--icon-font-size);font-weight:var(--icon-font-weight);pointer-events:none}:host(.ion-focused) .button-native{color:var(--color-focused)}:host(.ion-focused) .button-native::after{background:var(--background-focused);opacity:var(--background-focused-opacity)}.button-native::after{left:0;right:0;top:0;bottom:0;position:absolute;content:\"\";opacity:0}@media (any-hover: hover){:host(:hover) .button-native{color:var(--color-hover)}:host(:hover) .button-native::after{background:var(--background-hover);opacity:var(--background-hover-opacity)}}:host(.ion-color.ion-focused) .button-native{color:var(--ion-color-base)}@media (any-hover: hover){:host(.ion-color:hover) .button-native{color:var(--ion-color-base)}}:host(.in-toolbar:not(.in-toolbar-color)){color:var(--ion-toolbar-color, var(--color))}:host{--background-hover:transparent;--background-hover-opacity:1;--background-focused:currentColor;--background-focused-opacity:.1;--border-radius:4px;--color:var(--ion-color-primary, #3880ff);--icon-margin-end:1px;--icon-margin-start:-4px;--icon-font-size:1.6em;--min-height:32px;font-size:clamp(17px, 1.0625rem, 21.998px)}.button-native{-webkit-transform:translateZ(0);transform:translateZ(0);overflow:visible;z-index:99}:host(.ion-activated) .button-native{opacity:0.4}@media (any-hover: hover){:host(:hover){opacity:0.6}}";
|
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
import { r as registerInstance, d as createEvent, h, H as Host, f as getElement } from './index-b7d870cf.js';
|
|
5
5
|
import { i as inheritAriaAttributes } from './helpers-ae653409.js';
|
|
6
6
|
import { o as openURL, c as createColorClasses, h as hostContext } from './theme-01f3f29c.js';
|
|
7
|
-
import { m as chevronForwardOutline, n as ellipsisHorizontal } from './index-
|
|
7
|
+
import { m as chevronForwardOutline, n as ellipsisHorizontal } from './index-f7dc70ba.js';
|
|
8
8
|
import { b as getIonMode } from './ionic-global-1f99b929.js';
|
|
9
9
|
|
|
10
10
|
const breadcrumbIosCss = ":host{display:-ms-flexbox;display:flex;-ms-flex:0 0 auto;flex:0 0 auto;-ms-flex-align:center;align-items:center;color:var(--color);font-size:1rem;font-weight:400;line-height:1.5}.breadcrumb-native{font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit;padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;width:100%;outline:none;background:inherit}:host(.breadcrumb-disabled){cursor:default;opacity:0.5;pointer-events:none}:host(.breadcrumb-active){color:var(--color-active)}:host(.ion-focused){color:var(--color-focused)}:host(.ion-focused) .breadcrumb-native{background:var(--background-focused)}@media (any-hover: hover){:host(.ion-activatable:hover){color:var(--color-hover)}:host(.ion-activatable.in-breadcrumbs-color:hover),:host(.ion-activatable.ion-color:hover){color:var(--ion-color-shade)}}.breadcrumb-separator{display:-ms-inline-flexbox;display:inline-flex}:host(.breadcrumb-collapsed) .breadcrumb-native{display:none}:host(.in-breadcrumbs-color),:host(.in-breadcrumbs-color.breadcrumb-active){color:var(--ion-color-base)}:host(.in-breadcrumbs-color) .breadcrumb-separator{color:var(--ion-color-base)}:host(.ion-color){color:var(--ion-color-base)}:host(.in-toolbar-color),:host(.in-toolbar-color) .breadcrumb-separator{color:rgba(var(--ion-color-contrast-rgb), 0.8)}:host(.in-toolbar-color.breadcrumb-active){color:var(--ion-color-contrast)}.breadcrumbs-collapsed-indicator{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;-webkit-margin-start:14px;margin-inline-start:14px;-webkit-margin-end:14px;margin-inline-end:14px;margin-top:0;margin-bottom:0;display:-ms-flexbox;display:flex;-ms-flex:1 1 100%;flex:1 1 100%;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:32px;height:18px;border:0;outline:none;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none}.breadcrumbs-collapsed-indicator ion-icon{margin-top:1px;font-size:1.375rem}:host{--color:var(--ion-color-step-850, #2d4665);--color-active:var(--ion-text-color, #03060b);--color-hover:var(--ion-text-color, #03060b);--color-focused:var(--color-active);--background-focused:var(--ion-color-step-50, rgba(233, 237, 243, 0.7));font-size:clamp(16px, 1rem, 22px)}:host(.breadcrumb-active){font-weight:600}.breadcrumb-native{border-radius:4px;-webkit-padding-start:12px;padding-inline-start:12px;-webkit-padding-end:12px;padding-inline-end:12px;padding-top:5px;padding-bottom:5px;border:1px solid transparent}:host(.ion-focused) .breadcrumb-native{border-radius:8px}:host(.in-breadcrumbs-color.ion-focused) .breadcrumb-native,:host(.ion-color.ion-focused) .breadcrumb-native{background:rgba(var(--ion-color-base-rgb), 0.1);color:var(--ion-color-base)}:host(.ion-focused) ::slotted(ion-icon),:host(.in-breadcrumbs-color.ion-focused) ::slotted(ion-icon),:host(.ion-color.ion-focused) ::slotted(ion-icon){color:var(--ion-color-step-750, #445b78)}.breadcrumb-separator{color:var(--ion-color-step-550, #73849a)}::slotted(ion-icon){color:var(--ion-color-step-400, #92a0b3);font-size:min(1.125rem, 21.6px)}::slotted(ion-icon[slot=start]){-webkit-margin-end:8px;margin-inline-end:8px}::slotted(ion-icon[slot=end]){-webkit-margin-start:8px;margin-inline-start:8px}:host(.breadcrumb-active) ::slotted(ion-icon){color:var(--ion-color-step-850, #242d39)}.breadcrumbs-collapsed-indicator{border-radius:4px;background:var(--ion-color-step-100, #e9edf3);color:var(--ion-color-step-550, #73849a)}.breadcrumbs-collapsed-indicator:hover{opacity:0.45}.breadcrumbs-collapsed-indicator:focus{background:var(--ion-color-step-150, #d9e0ea)}.breadcrumbs-collapsed-indicator ion-icon{font-size:min(1.375rem, 22px)}";
|
|
@@ -28,7 +28,7 @@ const getUrl = (i) => {
|
|
|
28
28
|
}
|
|
29
29
|
url = getName(i.name, i.icon, i.mode, i.ios, i.md);
|
|
30
30
|
if (url) {
|
|
31
|
-
return getNamedUrl(url);
|
|
31
|
+
return getNamedUrl(url, i);
|
|
32
32
|
}
|
|
33
33
|
if (i.icon) {
|
|
34
34
|
url = getSrc(i.icon);
|
|
@@ -42,12 +42,24 @@ const getUrl = (i) => {
|
|
|
42
42
|
}
|
|
43
43
|
return null;
|
|
44
44
|
};
|
|
45
|
-
const getNamedUrl = (iconName) => {
|
|
45
|
+
const getNamedUrl = (iconName, iconEl) => {
|
|
46
46
|
const url = getIconMap().get(iconName);
|
|
47
47
|
if (url) {
|
|
48
48
|
return url;
|
|
49
49
|
}
|
|
50
|
-
|
|
50
|
+
try {
|
|
51
|
+
return getAssetPath(`svg/${iconName}.svg`);
|
|
52
|
+
}
|
|
53
|
+
catch (e) {
|
|
54
|
+
/**
|
|
55
|
+
* In the custom elements build version of ionicons, referencing an icon
|
|
56
|
+
* by name will throw an invalid URL error because the asset path is not defined.
|
|
57
|
+
* This catches that error and logs something that is more developer-friendly.
|
|
58
|
+
* We also include a reference to the ion-icon element so developers can
|
|
59
|
+
* figure out which instance of ion-icon needs to be updated.
|
|
60
|
+
*/
|
|
61
|
+
console.warn(`[Ionicons Warning]: Could not load icon with name "${iconName}". Ensure that the icon is registered using addIcons or that the icon SVG data is passed directly to the icon component.`, iconEl);
|
|
62
|
+
}
|
|
51
63
|
};
|
|
52
64
|
const getName = (iconName, icon, mode, ios, md) => {
|
|
53
65
|
// default to "md" if somehow the mode wasn't set
|
|
@@ -7,7 +7,7 @@ import { r as raf, d as renderHiddenInput, g as getElementRoot, l as clamp } fro
|
|
|
7
7
|
import { a as printIonError, p as printIonWarning } from './index-9b0d46f4.js';
|
|
8
8
|
import { i as isRTL } from './dir-babeabeb.js';
|
|
9
9
|
import { c as createColorClasses, g as getClassMap } from './theme-01f3f29c.js';
|
|
10
|
-
import { c as chevronBack, o as chevronForward, l as chevronDown, p as caretUpSharp, q as caretDownSharp } from './index-
|
|
10
|
+
import { c as chevronBack, o as chevronForward, l as chevronDown, p as caretUpSharp, q as caretDownSharp } from './index-f7dc70ba.js';
|
|
11
11
|
import { b as getIonMode } from './ionic-global-1f99b929.js';
|
|
12
12
|
import { g as generateDayAriaLabel, a as getDay, i as isBefore, b as isAfter, c as isSameDay, d as getPreviousMonth, e as getNextMonth, v as validateParts, f as getPartsFromCalendarDay, h as getEndOfWeek, j as getStartOfWeek, k as getPreviousDay, l as getNextDay, m as getPreviousWeek, n as getNextWeek, p as parseMinParts, o as parseMaxParts, q as parseDate, w as warnIfValueOutOfBounds, r as convertToArrayOfNumbers, s as convertDataToISO, t as getToday, u as getClosestValidDate, x as getNumDaysInMonth, y as getCombinedDateColumnData, z as getMonthColumnData, A as getDayColumnData, B as getYearColumnData, C as isMonthFirstLocale, D as getTimeColumnsData, E as isLocaleDayPeriodRTL, F as getDaysOfWeek, G as getMonthAndYear, H as getDaysOfMonth, I as generateMonths, J as getHourCycle, K as getLocalizedTime, L as getMonthAndDay, M as formatValue, N as getNextYear, O as getPreviousYear, P as clampDate, Q as parseAmPm, R as calculateHourFromAMPM } from './data-775093f5.js';
|
|
13
13
|
import { c as createLockController } from './lock-controller-316928be.js';
|
|
@@ -186,7 +186,7 @@ const getHighlightStyles = (highlightedDates, dateIsoString, el) => {
|
|
|
186
186
|
return undefined;
|
|
187
187
|
};
|
|
188
188
|
|
|
189
|
-
const datetimeIosCss = ":host{display:-ms-flexbox;display:flex;-ms-flex-flow:column;flex-flow:column;background:var(--background);overflow:hidden}ion-picker-column-internal{min-width:26px}:host(.datetime-size-fixed){width:auto;height:auto}:host(.datetime-size-fixed:not(.datetime-prefer-wheel)){max-width:350px}:host(.datetime-size-fixed.datetime-prefer-wheel){min-width:350px;max-width:-webkit-max-content;max-width:-moz-max-content;max-width:max-content}:host(.datetime-size-cover){width:100%}:host .calendar-body,:host .datetime-year{opacity:0}:host(:not(.datetime-ready)) .datetime-year{position:absolute;pointer-events:none}:host(.datetime-ready) .calendar-body{opacity:1}:host(.datetime-ready) .datetime-year{display:none;opacity:1}:host .wheel-order-year-first .day-column{-ms-flex-order:3;order:3;text-align:end}:host .wheel-order-year-first .month-column{-ms-flex-order:2;order:2;text-align:end}:host .wheel-order-year-first .year-column{-ms-flex-order:1;order:1;text-align:start}:host .datetime-calendar,:host .datetime-year{display:-ms-flexbox;display:flex;-ms-flex:1 1 auto;flex:1 1 auto;-ms-flex-flow:column;flex-flow:column}:host(.show-month-and-year) .datetime-year{display:-ms-flexbox;display:flex}@supports (background: -webkit-named-image(apple-pay-logo-black)) and (not (aspect-ratio: 1/1)){:host(.show-month-and-year) .calendar-next-prev,:host(.show-month-and-year) .calendar-days-of-week,:host(.show-month-and-year) .calendar-body,:host(.show-month-and-year) .datetime-time{position:absolute;visibility:hidden;pointer-events:none}@supports (inset-inline-start: 0){:host(.show-month-and-year) .calendar-next-prev,:host(.show-month-and-year) .calendar-days-of-week,:host(.show-month-and-year) .calendar-body,:host(.show-month-and-year) .datetime-time{inset-inline-start:-99999px}}@supports not (inset-inline-start: 0){:host(.show-month-and-year) .calendar-next-prev,:host(.show-month-and-year) .calendar-days-of-week,:host(.show-month-and-year) .calendar-body,:host(.show-month-and-year) .datetime-time{left:-99999px}:host-context([dir=rtl]):host(.show-month-and-year) .calendar-next-prev,:host-context([dir=rtl]).show-month-and-year .calendar-next-prev,:host-context([dir=rtl]):host(.show-month-and-year) .calendar-days-of-week,:host-context([dir=rtl]).show-month-and-year .calendar-days-of-week,:host-context([dir=rtl]):host(.show-month-and-year) .calendar-body,:host-context([dir=rtl]).show-month-and-year .calendar-body,:host-context([dir=rtl]):host(.show-month-and-year) .datetime-time,:host-context([dir=rtl]).show-month-and-year .datetime-time{left:unset;right:unset;right:-99999px}@supports selector(:dir(rtl)){:host(.show-month-and-year:dir(rtl)) .calendar-next-prev,:host(.show-month-and-year:dir(rtl)) .calendar-days-of-week,:host(.show-month-and-year:dir(rtl)) .calendar-body,:host(.show-month-and-year:dir(rtl)) .datetime-time{left:unset;right:unset;right:-99999px}}}}@supports (not (background: -webkit-named-image(apple-pay-logo-black))) or ((background: -webkit-named-image(apple-pay-logo-black)) and (aspect-ratio: 1/1)){:host(.show-month-and-year) .calendar-next-prev,:host(.show-month-and-year) .calendar-days-of-week,:host(.show-month-and-year) .calendar-body,:host(.show-month-and-year) .datetime-time{display:none}}:host(.month-year-picker-open) .datetime-footer{display:none}:host(.datetime-disabled){pointer-events:none}:host(.datetime-disabled) .calendar-days-of-week,:host(.datetime-disabled) .datetime-time{opacity:0.4}:host(.datetime-readonly){pointer-events:none;}:host(.datetime-readonly) .calendar-action-buttons,:host(.datetime-readonly) .calendar-body,:host(.datetime-readonly) .datetime-year{pointer-events:initial}:host(.datetime-readonly) .calendar-day[disabled]:not(.calendar-day-constrained),:host(.datetime-readonly) .datetime-action-buttons ion-button[disabled]{opacity:1}:host .datetime-header .datetime-title{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}:host .datetime-action-buttons.has-clear-button{width:100%}:host .datetime-action-buttons ion-buttons{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between}.datetime-action-buttons .datetime-action-buttons-container{display:-ms-flexbox;display:flex}:host .calendar-action-buttons{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between}:host .calendar-action-buttons ion-item,:host .calendar-action-buttons ion-button{--background:translucent}:host .calendar-action-buttons ion-item ion-label{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;width:auto}:host .calendar-action-buttons ion-item ion-icon{-webkit-padding-start:4px;padding-inline-start:4px;-webkit-padding-end:0;padding-inline-end:0;padding-top:0;padding-bottom:0}:host .calendar-days-of-week{display:grid;grid-template-columns:repeat(7, 1fr);text-align:center}.calendar-days-of-week .day-of-week{-webkit-margin-start:auto;margin-inline-start:auto;-webkit-margin-end:auto;margin-inline-end:auto;margin-top:0;margin-bottom:0}:host .calendar-body{display:-ms-flexbox;display:flex;-ms-flex-positive:1;flex-grow:1;-webkit-scroll-snap-type:x mandatory;-ms-scroll-snap-type:x mandatory;scroll-snap-type:x mandatory;overflow-x:scroll;overflow-y:hidden;scrollbar-width:none;outline:none}:host .calendar-body .calendar-month{display:-ms-flexbox;display:flex;-ms-flex-flow:column;flex-flow:column;scroll-snap-align:start;scroll-snap-stop:always;-ms-flex-negative:0;flex-shrink:0;width:100%}:host .calendar-body .calendar-month-disabled{scroll-snap-align:none}:host .calendar-body::-webkit-scrollbar{display:none}:host .calendar-body .calendar-month-grid{display:grid;grid-template-columns:repeat(7, 1fr)}:host .calendar-day-wrapper{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;min-width:0;min-height:0;overflow:visible}.calendar-day{border-radius:50%;-webkit-padding-start:0px;padding-inline-start:0px;-webkit-padding-end:0px;padding-inline-end:0px;padding-top:0px;padding-bottom:0px;-webkit-margin-start:0px;margin-inline-start:0px;-webkit-margin-end:0px;margin-inline-end:0px;margin-top:0px;margin-bottom:0px;display:-ms-flexbox;display:flex;position:relative;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;border:none;outline:none;background:none;color:currentColor;font-family:var(--ion-font-family, inherit);cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;z-index:0}:host .calendar-day[disabled]{pointer-events:none;opacity:0.4}.calendar-day:focus{background:rgba(var(--ion-color-base-rgb), 0.2);-webkit-box-shadow:0px 0px 0px 4px rgba(var(--ion-color-base-rgb), 0.2);box-shadow:0px 0px 0px 4px rgba(var(--ion-color-base-rgb), 0.2)}:host .datetime-time{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between}:host(.datetime-presentation-time) .datetime-time{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0}:host ion-popover{--height:200px}:host .time-header{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host .time-body{border-radius:8px;-webkit-padding-start:12px;padding-inline-start:12px;-webkit-padding-end:12px;padding-inline-end:12px;padding-top:6px;padding-bottom:6px;display:-ms-flexbox;display:flex;border:none;background:var(--ion-color-step-300, #edeef0);color:var(--ion-text-color, #000);font-family:inherit;font-size:inherit;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none}:host .time-body-active{color:var(--ion-color-base)}:host(.in-item){position:static}:host(.show-month-and-year) .calendar-action-buttons ion-item{--color:var(--ion-color-base)}:host{--background:var(--ion-color-light, #ffffff);--background-rgb:var(--ion-color-light-rgb);--title-color:var(--ion-color-step-600, #666666)}:host(.datetime-presentation-date-time:not(.datetime-prefer-wheel)),:host(.datetime-presentation-time-date:not(.datetime-prefer-wheel)),:host(.datetime-presentation-date:not(.datetime-prefer-wheel)){min-height:350px}:host .datetime-header{-webkit-padding-start:16px;padding-inline-start:16px;-webkit-padding-end:16px;padding-inline-end:16px;padding-top:16px;padding-bottom:16px;border-bottom:0.55px solid var(--ion-color-step-200, #cccccc);font-size:min(0.875rem, 22.4px)}:host .datetime-header .datetime-title{color:var(--title-color)}:host .datetime-header .datetime-selected-date{margin-top:10px}:host .calendar-action-buttons ion-item{--padding-start:16px;--background-hover:transparent;--background-activated:transparent;font-size:min(1rem, 25.6px);font-weight:600}:host .calendar-action-buttons ion-item ion-icon,:host .calendar-action-buttons ion-buttons ion-button{color:var(--ion-color-base)}:host .calendar-action-buttons ion-buttons{padding-left:0;padding-right:0;padding-top:8px;padding-bottom:0}:host .calendar-action-buttons ion-buttons ion-button{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}:host .calendar-days-of-week{-webkit-padding-start:8px;padding-inline-start:8px;-webkit-padding-end:8px;padding-inline-end:8px;padding-top:0;padding-bottom:0;color:var(--ion-color-step-300, #b3b3b3);font-size:min(0.75rem, 19.2px);font-weight:600;line-height:24px;text-transform:uppercase}@supports (border-radius: mod(1px, 1px)){.calendar-days-of-week .day-of-week{width:clamp(20px, calc(mod(min(1rem, 24px), 24px) * 10), 100%);height:24px;overflow:hidden}.calendar-day{border-radius:max(8px, mod(min(1rem, 24px), 24px) * 10)}}@supports ((border-radius: mod(1px, 1px)) and (background: -webkit-named-image(apple-pay-logo-black)) and (not (contain-intrinsic-size: none))) or (not (border-radius: mod(1px, 1px))){.calendar-days-of-week .day-of-week{width:auto;height:auto;overflow:initial}.calendar-day{border-radius:32px}}:host .calendar-body .calendar-month .calendar-month-grid{-webkit-padding-start:8px;padding-inline-start:8px;-webkit-padding-end:8px;padding-inline-end:8px;padding-top:8px;padding-bottom:8px;-ms-flex-align:center;align-items:center;height:calc(100% - 16px)}:host .calendar-day-wrapper{-webkit-padding-start:4px;padding-inline-start:4px;-webkit-padding-end:4px;padding-inline-end:4px;padding-top:4px;padding-bottom:4px;height:0;min-height:1rem}:host .calendar-day{width:40px;min-width:40px;height:40px;font-size:min(1.25rem, 32px)}.calendar-day.calendar-day-active{background:rgba(var(--ion-color-base-rgb), 0.2)}:host .calendar-day.calendar-day-today{color:var(--ion-color-base)}:host .calendar-day.calendar-day-active{color:var(--ion-color-base);font-weight:600}:host .calendar-day.calendar-day-today.calendar-day-active{color:var(--ion-color-contrast)}:host .datetime-time{-webkit-padding-start:16px;padding-inline-start:16px;-webkit-padding-end:16px;padding-inline-end:16px;padding-top:8px;padding-bottom:16px;font-size:min(1rem, 25.6px)}:host .datetime-time .time-header{font-weight:600}:host .datetime-buttons{-webkit-padding-start:8px;padding-inline-start:8px;-webkit-padding-end:8px;padding-inline-end:8px;padding-top:8px;padding-bottom:8px;border-top:0.55px solid var(--ion-color-step-200, #cccccc)}:host .datetime-buttons ::slotted(ion-buttons),:host .datetime-buttons ion-buttons{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between}:host .datetime-action-buttons{width:100%}";
|
|
189
|
+
const datetimeIosCss = ":host{display:-ms-flexbox;display:flex;-ms-flex-flow:column;flex-flow:column;background:var(--background);overflow:hidden}ion-picker-column-internal{min-width:26px}:host(.datetime-size-fixed){width:auto;height:auto}:host(.datetime-size-fixed:not(.datetime-prefer-wheel)){max-width:350px}:host(.datetime-size-fixed.datetime-prefer-wheel){min-width:350px;max-width:-webkit-max-content;max-width:-moz-max-content;max-width:max-content}:host(.datetime-size-cover){width:100%}:host .calendar-body,:host .datetime-year{opacity:0}:host(:not(.datetime-ready)) .datetime-year{position:absolute;pointer-events:none}:host(.datetime-ready) .calendar-body{opacity:1}:host(.datetime-ready) .datetime-year{display:none;opacity:1}:host .wheel-order-year-first .day-column{-ms-flex-order:3;order:3;text-align:end}:host .wheel-order-year-first .month-column{-ms-flex-order:2;order:2;text-align:end}:host .wheel-order-year-first .year-column{-ms-flex-order:1;order:1;text-align:start}:host .datetime-calendar,:host .datetime-year{display:-ms-flexbox;display:flex;-ms-flex:1 1 auto;flex:1 1 auto;-ms-flex-flow:column;flex-flow:column}:host(.show-month-and-year) .datetime-year{display:-ms-flexbox;display:flex}@supports (background: -webkit-named-image(apple-pay-logo-black)) and (not (aspect-ratio: 1/1)){:host(.show-month-and-year) .calendar-next-prev,:host(.show-month-and-year) .calendar-days-of-week,:host(.show-month-and-year) .calendar-body,:host(.show-month-and-year) .datetime-time{position:absolute;visibility:hidden;pointer-events:none}@supports (inset-inline-start: 0){:host(.show-month-and-year) .calendar-next-prev,:host(.show-month-and-year) .calendar-days-of-week,:host(.show-month-and-year) .calendar-body,:host(.show-month-and-year) .datetime-time{inset-inline-start:-99999px}}@supports not (inset-inline-start: 0){:host(.show-month-and-year) .calendar-next-prev,:host(.show-month-and-year) .calendar-days-of-week,:host(.show-month-and-year) .calendar-body,:host(.show-month-and-year) .datetime-time{left:-99999px}:host-context([dir=rtl]):host(.show-month-and-year) .calendar-next-prev,:host-context([dir=rtl]).show-month-and-year .calendar-next-prev,:host-context([dir=rtl]):host(.show-month-and-year) .calendar-days-of-week,:host-context([dir=rtl]).show-month-and-year .calendar-days-of-week,:host-context([dir=rtl]):host(.show-month-and-year) .calendar-body,:host-context([dir=rtl]).show-month-and-year .calendar-body,:host-context([dir=rtl]):host(.show-month-and-year) .datetime-time,:host-context([dir=rtl]).show-month-and-year .datetime-time{left:unset;right:unset;right:-99999px}@supports selector(:dir(rtl)){:host(.show-month-and-year:dir(rtl)) .calendar-next-prev,:host(.show-month-and-year:dir(rtl)) .calendar-days-of-week,:host(.show-month-and-year:dir(rtl)) .calendar-body,:host(.show-month-and-year:dir(rtl)) .datetime-time{left:unset;right:unset;right:-99999px}}}}@supports (not (background: -webkit-named-image(apple-pay-logo-black))) or ((background: -webkit-named-image(apple-pay-logo-black)) and (aspect-ratio: 1/1)){:host(.show-month-and-year) .calendar-next-prev,:host(.show-month-and-year) .calendar-days-of-week,:host(.show-month-and-year) .calendar-body,:host(.show-month-and-year) .datetime-time{display:none}}:host(.month-year-picker-open) .datetime-footer{display:none}:host(.datetime-disabled){pointer-events:none}:host(.datetime-disabled) .calendar-days-of-week,:host(.datetime-disabled) .datetime-time{opacity:0.4}:host(.datetime-readonly){pointer-events:none;}:host(.datetime-readonly) .calendar-action-buttons,:host(.datetime-readonly) .calendar-body,:host(.datetime-readonly) .datetime-year{pointer-events:initial}:host(.datetime-readonly) .calendar-day[disabled]:not(.calendar-day-constrained),:host(.datetime-readonly) .datetime-action-buttons ion-button[disabled]{opacity:1}:host .datetime-header .datetime-title{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}:host .datetime-action-buttons.has-clear-button{width:100%}:host .datetime-action-buttons ion-buttons{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between}.datetime-action-buttons .datetime-action-buttons-container{display:-ms-flexbox;display:flex}:host .calendar-action-buttons{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between}:host .calendar-action-buttons ion-item,:host .calendar-action-buttons ion-button{--background:translucent}:host .calendar-action-buttons ion-item ion-label{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;width:auto}:host .calendar-action-buttons ion-item ion-icon{-webkit-padding-start:4px;padding-inline-start:4px;-webkit-padding-end:0;padding-inline-end:0;padding-top:0;padding-bottom:0}:host .calendar-days-of-week{display:grid;grid-template-columns:repeat(7, 1fr);text-align:center}.calendar-days-of-week .day-of-week{-webkit-margin-start:auto;margin-inline-start:auto;-webkit-margin-end:auto;margin-inline-end:auto;margin-top:0;margin-bottom:0}:host .calendar-body{display:-ms-flexbox;display:flex;-ms-flex-positive:1;flex-grow:1;-webkit-scroll-snap-type:x mandatory;-ms-scroll-snap-type:x mandatory;scroll-snap-type:x mandatory;overflow-x:scroll;overflow-y:hidden;scrollbar-width:none;outline:none}:host .calendar-body .calendar-month{display:-ms-flexbox;display:flex;-ms-flex-flow:column;flex-flow:column;scroll-snap-align:start;scroll-snap-stop:always;-ms-flex-negative:0;flex-shrink:0;width:100%}:host .calendar-body .calendar-month-disabled{scroll-snap-align:none}:host .calendar-body::-webkit-scrollbar{display:none}:host .calendar-body .calendar-month-grid{display:grid;grid-template-columns:repeat(7, 1fr)}:host .calendar-day-wrapper{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;min-width:0;min-height:0;overflow:visible}.calendar-day{border-radius:50%;-webkit-padding-start:0px;padding-inline-start:0px;-webkit-padding-end:0px;padding-inline-end:0px;padding-top:0px;padding-bottom:0px;-webkit-margin-start:0px;margin-inline-start:0px;-webkit-margin-end:0px;margin-inline-end:0px;margin-top:0px;margin-bottom:0px;display:-ms-flexbox;display:flex;position:relative;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;border:none;outline:none;background:none;color:currentColor;font-family:var(--ion-font-family, inherit);cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;z-index:0}:host .calendar-day[disabled]{pointer-events:none;opacity:0.4}.calendar-day:focus{background:rgba(var(--ion-color-base-rgb), 0.2);-webkit-box-shadow:0px 0px 0px 4px rgba(var(--ion-color-base-rgb), 0.2);box-shadow:0px 0px 0px 4px rgba(var(--ion-color-base-rgb), 0.2)}:host .datetime-time{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between}:host(.datetime-presentation-time) .datetime-time{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0}:host ion-popover{--height:200px}:host .time-header{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host .time-body{border-radius:8px;-webkit-padding-start:12px;padding-inline-start:12px;-webkit-padding-end:12px;padding-inline-end:12px;padding-top:6px;padding-bottom:6px;display:-ms-flexbox;display:flex;border:none;background:var(--ion-color-step-300, #edeef0);color:var(--ion-text-color, #000);font-family:inherit;font-size:inherit;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none}:host .time-body-active{color:var(--ion-color-base)}:host(.in-item){position:static}:host(.show-month-and-year) .calendar-action-buttons ion-item{--color:var(--ion-color-base)}:host{--background:var(--ion-color-light, #ffffff);--background-rgb:var(--ion-color-light-rgb);--title-color:var(--ion-color-step-600, #666666)}:host(.datetime-presentation-date-time:not(.datetime-prefer-wheel)),:host(.datetime-presentation-time-date:not(.datetime-prefer-wheel)),:host(.datetime-presentation-date:not(.datetime-prefer-wheel)){min-height:350px}:host .datetime-header{-webkit-padding-start:16px;padding-inline-start:16px;-webkit-padding-end:16px;padding-inline-end:16px;padding-top:16px;padding-bottom:16px;border-bottom:0.55px solid var(--ion-color-step-200, #cccccc);font-size:min(0.875rem, 22.4px)}:host .datetime-header .datetime-title{color:var(--title-color)}:host .datetime-header .datetime-selected-date{margin-top:10px}:host .calendar-action-buttons ion-item{--padding-start:16px;--background-hover:transparent;--background-activated:transparent;font-size:min(1rem, 25.6px);font-weight:600}:host .calendar-action-buttons ion-item ion-icon,:host .calendar-action-buttons ion-buttons ion-button{color:var(--ion-color-base)}:host .calendar-action-buttons ion-buttons{padding-left:0;padding-right:0;padding-top:8px;padding-bottom:0}:host .calendar-action-buttons ion-buttons ion-button{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}:host .calendar-days-of-week{-webkit-padding-start:8px;padding-inline-start:8px;-webkit-padding-end:8px;padding-inline-end:8px;padding-top:0;padding-bottom:0;color:var(--ion-color-step-300, #b3b3b3);font-size:min(0.75rem, 19.2px);font-weight:600;line-height:24px;text-transform:uppercase}@supports (border-radius: mod(1px, 1px)){.calendar-days-of-week .day-of-week{width:clamp(20px, calc(mod(min(1rem, 24px), 24px) * 10), 100%);height:24px;overflow:hidden}.calendar-day{border-radius:max(8px, mod(min(1rem, 24px), 24px) * 10)}}@supports ((border-radius: mod(1px, 1px)) and (background: -webkit-named-image(apple-pay-logo-black)) and (not (contain-intrinsic-size: none))) or (not (border-radius: mod(1px, 1px))){.calendar-days-of-week .day-of-week{width:auto;height:auto;overflow:initial}.calendar-day{border-radius:32px}}:host .calendar-body .calendar-month .calendar-month-grid{-webkit-padding-start:8px;padding-inline-start:8px;-webkit-padding-end:8px;padding-inline-end:8px;padding-top:8px;padding-bottom:8px;-ms-flex-align:center;align-items:center;height:calc(100% - 16px)}:host .calendar-day-wrapper{-webkit-padding-start:4px;padding-inline-start:4px;-webkit-padding-end:4px;padding-inline-end:4px;padding-top:4px;padding-bottom:4px;height:0;min-height:1rem}:host .calendar-day{width:40px;min-width:40px;height:40px;font-size:min(1.25rem, 32px)}.calendar-day.calendar-day-active{background:rgba(var(--ion-color-base-rgb), 0.2)}:host .calendar-day.calendar-day-today{color:var(--ion-color-base)}:host .calendar-day.calendar-day-active{color:var(--ion-color-base);font-weight:600}:host .calendar-day.calendar-day-today.calendar-day-active{background:var(--ion-color-base);color:var(--ion-color-contrast)}:host .datetime-time{-webkit-padding-start:16px;padding-inline-start:16px;-webkit-padding-end:16px;padding-inline-end:16px;padding-top:8px;padding-bottom:16px;font-size:min(1rem, 25.6px)}:host .datetime-time .time-header{font-weight:600}:host .datetime-buttons{-webkit-padding-start:8px;padding-inline-start:8px;-webkit-padding-end:8px;padding-inline-end:8px;padding-top:8px;padding-bottom:8px;border-top:0.55px solid var(--ion-color-step-200, #cccccc)}:host .datetime-buttons ::slotted(ion-buttons),:host .datetime-buttons ion-buttons{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between}:host .datetime-action-buttons{width:100%}";
|
|
190
190
|
|
|
191
191
|
const datetimeMdCss = ":host{display:-ms-flexbox;display:flex;-ms-flex-flow:column;flex-flow:column;background:var(--background);overflow:hidden}ion-picker-column-internal{min-width:26px}:host(.datetime-size-fixed){width:auto;height:auto}:host(.datetime-size-fixed:not(.datetime-prefer-wheel)){max-width:350px}:host(.datetime-size-fixed.datetime-prefer-wheel){min-width:350px;max-width:-webkit-max-content;max-width:-moz-max-content;max-width:max-content}:host(.datetime-size-cover){width:100%}:host .calendar-body,:host .datetime-year{opacity:0}:host(:not(.datetime-ready)) .datetime-year{position:absolute;pointer-events:none}:host(.datetime-ready) .calendar-body{opacity:1}:host(.datetime-ready) .datetime-year{display:none;opacity:1}:host .wheel-order-year-first .day-column{-ms-flex-order:3;order:3;text-align:end}:host .wheel-order-year-first .month-column{-ms-flex-order:2;order:2;text-align:end}:host .wheel-order-year-first .year-column{-ms-flex-order:1;order:1;text-align:start}:host .datetime-calendar,:host .datetime-year{display:-ms-flexbox;display:flex;-ms-flex:1 1 auto;flex:1 1 auto;-ms-flex-flow:column;flex-flow:column}:host(.show-month-and-year) .datetime-year{display:-ms-flexbox;display:flex}@supports (background: -webkit-named-image(apple-pay-logo-black)) and (not (aspect-ratio: 1/1)){:host(.show-month-and-year) .calendar-next-prev,:host(.show-month-and-year) .calendar-days-of-week,:host(.show-month-and-year) .calendar-body,:host(.show-month-and-year) .datetime-time{position:absolute;visibility:hidden;pointer-events:none}@supports (inset-inline-start: 0){:host(.show-month-and-year) .calendar-next-prev,:host(.show-month-and-year) .calendar-days-of-week,:host(.show-month-and-year) .calendar-body,:host(.show-month-and-year) .datetime-time{inset-inline-start:-99999px}}@supports not (inset-inline-start: 0){:host(.show-month-and-year) .calendar-next-prev,:host(.show-month-and-year) .calendar-days-of-week,:host(.show-month-and-year) .calendar-body,:host(.show-month-and-year) .datetime-time{left:-99999px}:host-context([dir=rtl]):host(.show-month-and-year) .calendar-next-prev,:host-context([dir=rtl]).show-month-and-year .calendar-next-prev,:host-context([dir=rtl]):host(.show-month-and-year) .calendar-days-of-week,:host-context([dir=rtl]).show-month-and-year .calendar-days-of-week,:host-context([dir=rtl]):host(.show-month-and-year) .calendar-body,:host-context([dir=rtl]).show-month-and-year .calendar-body,:host-context([dir=rtl]):host(.show-month-and-year) .datetime-time,:host-context([dir=rtl]).show-month-and-year .datetime-time{left:unset;right:unset;right:-99999px}@supports selector(:dir(rtl)){:host(.show-month-and-year:dir(rtl)) .calendar-next-prev,:host(.show-month-and-year:dir(rtl)) .calendar-days-of-week,:host(.show-month-and-year:dir(rtl)) .calendar-body,:host(.show-month-and-year:dir(rtl)) .datetime-time{left:unset;right:unset;right:-99999px}}}}@supports (not (background: -webkit-named-image(apple-pay-logo-black))) or ((background: -webkit-named-image(apple-pay-logo-black)) and (aspect-ratio: 1/1)){:host(.show-month-and-year) .calendar-next-prev,:host(.show-month-and-year) .calendar-days-of-week,:host(.show-month-and-year) .calendar-body,:host(.show-month-and-year) .datetime-time{display:none}}:host(.month-year-picker-open) .datetime-footer{display:none}:host(.datetime-disabled){pointer-events:none}:host(.datetime-disabled) .calendar-days-of-week,:host(.datetime-disabled) .datetime-time{opacity:0.4}:host(.datetime-readonly){pointer-events:none;}:host(.datetime-readonly) .calendar-action-buttons,:host(.datetime-readonly) .calendar-body,:host(.datetime-readonly) .datetime-year{pointer-events:initial}:host(.datetime-readonly) .calendar-day[disabled]:not(.calendar-day-constrained),:host(.datetime-readonly) .datetime-action-buttons ion-button[disabled]{opacity:1}:host .datetime-header .datetime-title{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}:host .datetime-action-buttons.has-clear-button{width:100%}:host .datetime-action-buttons ion-buttons{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between}.datetime-action-buttons .datetime-action-buttons-container{display:-ms-flexbox;display:flex}:host .calendar-action-buttons{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between}:host .calendar-action-buttons ion-item,:host .calendar-action-buttons ion-button{--background:translucent}:host .calendar-action-buttons ion-item ion-label{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;width:auto}:host .calendar-action-buttons ion-item ion-icon{-webkit-padding-start:4px;padding-inline-start:4px;-webkit-padding-end:0;padding-inline-end:0;padding-top:0;padding-bottom:0}:host .calendar-days-of-week{display:grid;grid-template-columns:repeat(7, 1fr);text-align:center}.calendar-days-of-week .day-of-week{-webkit-margin-start:auto;margin-inline-start:auto;-webkit-margin-end:auto;margin-inline-end:auto;margin-top:0;margin-bottom:0}:host .calendar-body{display:-ms-flexbox;display:flex;-ms-flex-positive:1;flex-grow:1;-webkit-scroll-snap-type:x mandatory;-ms-scroll-snap-type:x mandatory;scroll-snap-type:x mandatory;overflow-x:scroll;overflow-y:hidden;scrollbar-width:none;outline:none}:host .calendar-body .calendar-month{display:-ms-flexbox;display:flex;-ms-flex-flow:column;flex-flow:column;scroll-snap-align:start;scroll-snap-stop:always;-ms-flex-negative:0;flex-shrink:0;width:100%}:host .calendar-body .calendar-month-disabled{scroll-snap-align:none}:host .calendar-body::-webkit-scrollbar{display:none}:host .calendar-body .calendar-month-grid{display:grid;grid-template-columns:repeat(7, 1fr)}:host .calendar-day-wrapper{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;min-width:0;min-height:0;overflow:visible}.calendar-day{border-radius:50%;-webkit-padding-start:0px;padding-inline-start:0px;-webkit-padding-end:0px;padding-inline-end:0px;padding-top:0px;padding-bottom:0px;-webkit-margin-start:0px;margin-inline-start:0px;-webkit-margin-end:0px;margin-inline-end:0px;margin-top:0px;margin-bottom:0px;display:-ms-flexbox;display:flex;position:relative;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;border:none;outline:none;background:none;color:currentColor;font-family:var(--ion-font-family, inherit);cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;z-index:0}:host .calendar-day[disabled]{pointer-events:none;opacity:0.4}.calendar-day:focus{background:rgba(var(--ion-color-base-rgb), 0.2);-webkit-box-shadow:0px 0px 0px 4px rgba(var(--ion-color-base-rgb), 0.2);box-shadow:0px 0px 0px 4px rgba(var(--ion-color-base-rgb), 0.2)}:host .datetime-time{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between}:host(.datetime-presentation-time) .datetime-time{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0}:host ion-popover{--height:200px}:host .time-header{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host .time-body{border-radius:8px;-webkit-padding-start:12px;padding-inline-start:12px;-webkit-padding-end:12px;padding-inline-end:12px;padding-top:6px;padding-bottom:6px;display:-ms-flexbox;display:flex;border:none;background:var(--ion-color-step-300, #edeef0);color:var(--ion-text-color, #000);font-family:inherit;font-size:inherit;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none}:host .time-body-active{color:var(--ion-color-base)}:host(.in-item){position:static}:host(.show-month-and-year) .calendar-action-buttons ion-item{--color:var(--ion-color-base)}:host{--background:var(--ion-color-step-100, #ffffff);--title-color:var(--ion-color-contrast)}:host .datetime-header{-webkit-padding-start:20px;padding-inline-start:20px;-webkit-padding-end:20px;padding-inline-end:20px;padding-top:20px;padding-bottom:20px;background:var(--ion-color-base);color:var(--title-color)}:host .datetime-header .datetime-title{font-size:0.75rem;text-transform:uppercase}:host .datetime-header .datetime-selected-date{margin-top:30px;font-size:2.125rem}:host .datetime-calendar .calendar-action-buttons ion-item{--padding-start:20px}:host .calendar-action-buttons ion-item,:host .calendar-action-buttons ion-button{--color:var(--ion-color-step-650, #595959)}:host .calendar-days-of-week{-webkit-padding-start:10px;padding-inline-start:10px;-webkit-padding-end:10px;padding-inline-end:10px;padding-top:0px;padding-bottom:0px;color:var(--ion-color-step-500, gray);font-size:0.875rem;line-height:36px}:host .calendar-body .calendar-month .calendar-month-grid{-webkit-padding-start:10px;padding-inline-start:10px;-webkit-padding-end:10px;padding-inline-end:10px;padding-top:4px;padding-bottom:4px;grid-template-rows:repeat(6, 1fr)}:host .calendar-day{width:42px;min-width:42px;height:42px;font-size:0.875rem}:host .calendar-day.calendar-day-today{border:1px solid var(--ion-color-base);color:var(--ion-color-base)}:host .calendar-day.calendar-day-active{color:var(--ion-color-contrast)}.calendar-day.calendar-day-active{border:1px solid var(--ion-color-base);background:var(--ion-color-base)}:host .datetime-time{-webkit-padding-start:16px;padding-inline-start:16px;-webkit-padding-end:16px;padding-inline-end:16px;padding-top:8px;padding-bottom:8px}:host .time-header{color:var(--ion-color-step-650, #595959)}:host(.datetime-presentation-month) .datetime-year,:host(.datetime-presentation-year) .datetime-year,:host(.datetime-presentation-month-year) .datetime-year{margin-top:20px;margin-bottom:20px}:host .datetime-buttons{-webkit-padding-start:10px;padding-inline-start:10px;-webkit-padding-end:10px;padding-inline-end:10px;padding-top:10px;padding-bottom:10px;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:end;justify-content:flex-end}";
|
|
192
192
|
|
|
@@ -5,7 +5,7 @@ import { r as registerInstance, h, H as Host, f as getElement, d as createEvent
|
|
|
5
5
|
import { b as getIonMode } from './ionic-global-1f99b929.js';
|
|
6
6
|
import { i as inheritAriaAttributes } from './helpers-ae653409.js';
|
|
7
7
|
import { h as hostContext, o as openURL, c as createColorClasses } from './theme-01f3f29c.js';
|
|
8
|
-
import { t as close } from './index-
|
|
8
|
+
import { t as close } from './index-f7dc70ba.js';
|
|
9
9
|
|
|
10
10
|
const fabCss = ":host{position:absolute;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;z-index:999}:host(.fab-horizontal-center){left:0px;right:0px;-webkit-margin-start:auto;margin-inline-start:auto;-webkit-margin-end:auto;margin-inline-end:auto}:host(.fab-horizontal-start){left:calc(10px + var(--ion-safe-area-left, 0px));}:host-context([dir=rtl]):host(.fab-horizontal-start),:host-context([dir=rtl]).fab-horizontal-start{right:calc(10px + var(--ion-safe-area-right, 0px));left:unset}@supports selector(:dir(rtl)){:host(.fab-horizontal-start:dir(rtl)){right:calc(10px + var(--ion-safe-area-right, 0px));left:unset}}:host(.fab-horizontal-end){right:calc(10px + var(--ion-safe-area-right, 0px));}:host-context([dir=rtl]):host(.fab-horizontal-end),:host-context([dir=rtl]).fab-horizontal-end{left:calc(10px + var(--ion-safe-area-left, 0px));right:unset}@supports selector(:dir(rtl)){:host(.fab-horizontal-end:dir(rtl)){left:calc(10px + var(--ion-safe-area-left, 0px));right:unset}}:host(.fab-vertical-top){top:10px}:host(.fab-vertical-top.fab-edge){top:0}:host(.fab-vertical-top.fab-edge) ::slotted(ion-fab-button){margin-top:-50%}:host(.fab-vertical-top.fab-edge) ::slotted(ion-fab-button.fab-button-small){margin-top:calc((-100% + 16px) / 2)}:host(.fab-vertical-top.fab-edge) ::slotted(ion-fab-list.fab-list-side-start),:host(.fab-vertical-top.fab-edge) ::slotted(ion-fab-list.fab-list-side-end){margin-top:-50%}:host(.fab-vertical-top.fab-edge) ::slotted(ion-fab-list.fab-list-side-top),:host(.fab-vertical-top.fab-edge) ::slotted(ion-fab-list.fab-list-side-bottom){margin-top:calc(50% + 10px)}:host(.fab-vertical-bottom){bottom:10px}:host(.fab-vertical-bottom.fab-edge){bottom:0}:host(.fab-vertical-bottom.fab-edge) ::slotted(ion-fab-button){margin-bottom:-50%}:host(.fab-vertical-bottom.fab-edge) ::slotted(ion-fab-button.fab-button-small){margin-bottom:calc((-100% + 16px) / 2)}:host(.fab-vertical-bottom.fab-edge) ::slotted(ion-fab-list.fab-list-side-start),:host(.fab-vertical-bottom.fab-edge) ::slotted(ion-fab-list.fab-list-side-end){margin-bottom:-50%}:host(.fab-vertical-bottom.fab-edge) ::slotted(ion-fab-list.fab-list-side-top),:host(.fab-vertical-bottom.fab-edge) ::slotted(ion-fab-list.fab-list-side-bottom){margin-bottom:calc(50% + 10px)}:host(.fab-vertical-center){top:0px;bottom:0px;margin-top:auto;margin-bottom:auto}";
|
|
11
11
|
|