@ionic/core 9.0.11-dev.11793728481.1fc40367 → 9.0.11-dev.11793792571.1765ff65
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/ion-badge.js +1 -1
- package/components/ion-button.js +1 -1
- package/components/ion-content.js +1 -1
- package/components/ion-datetime-button.js +1 -1
- package/components/ion-datetime.js +1 -1
- package/components/ion-input-password-toggle.js +1 -1
- package/components/ion-item-option.js +1 -1
- package/components/ion-select-modal.js +1 -1
- package/components/ion-select.js +1 -1
- package/components/{p-B7ExaLVL.js → p-BCQSEpww.js} +1 -1
- package/components/p-Da8LCPwo.js +4 -0
- package/components/p-DirxxGzo.js +4 -0
- package/components/{p-BCYVFy50.js → p-py1vB-7U.js} +1 -1
- package/css/ionic/bundle.ionic.css +1 -1
- package/css/ionic/bundle.ionic.css.map +1 -1
- package/css/ionic/core.ionic.css +1 -1
- package/css/ionic/core.ionic.css.map +1 -1
- package/dist/cjs/ion-app_8.cjs.entry.js +13 -5
- package/dist/cjs/ion-avatar_3.cjs.entry.js +1 -1
- package/dist/cjs/ion-button_2.cjs.entry.js +1 -1
- package/dist/cjs/ion-datetime-button.cjs.entry.js +6 -33
- package/dist/cjs/ion-datetime.cjs.entry.js +36 -353
- package/dist/cjs/ion-item-option_3.cjs.entry.js +1 -1
- package/dist/cjs/ionic.cjs.js +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/collection/components/badge/badge.ionic.css +1 -1
- package/dist/collection/components/button/button.ionic.css +1 -1
- package/dist/collection/components/content/content.ionic.css +352 -0
- package/dist/collection/components/content/{content.css → content.ios.css} +65 -41
- package/dist/collection/components/content/content.js +9 -5
- package/dist/collection/components/content/content.md.css +347 -0
- package/dist/collection/components/datetime/datetime.ionic.css +5 -179
- package/dist/collection/components/datetime/datetime.ios.css +2 -134
- package/dist/collection/components/datetime/datetime.js +33 -406
- package/dist/collection/components/datetime/datetime.md.css +0 -120
- package/dist/collection/components/datetime/utils/state.js +1 -18
- package/dist/collection/components/datetime-button/datetime-button.js +6 -34
- package/dist/collection/components/item-option/item-option.ionic.css +1 -1
- package/dist/docs.json +127 -160
- package/dist/esm/{format-DUHrIiJq.js → format-NT7iHsbA.js} +1 -1
- package/dist/esm/ion-app_8.entry.js +13 -5
- package/dist/esm/ion-avatar_3.entry.js +1 -1
- package/dist/esm/ion-button_2.entry.js +1 -1
- package/dist/esm/ion-datetime-button.entry.js +7 -34
- package/dist/esm/ion-datetime.entry.js +37 -354
- package/dist/esm/ion-item-option_3.entry.js +1 -1
- package/dist/esm/ionic.js +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/html.html-data.json +0 -20
- package/dist/ionic/ionic.esm.js +1 -1
- package/dist/ionic/p-0743a26a.entry.js +4 -0
- package/dist/ionic/p-1d709b26.entry.js +4 -0
- package/dist/ionic/p-39e3be74.entry.js +4 -0
- package/dist/ionic/p-6e4ee264.entry.js +4 -0
- package/dist/ionic/{p-CaOPF8Xt.js → p-BtccSO5J.js} +1 -1
- package/dist/ionic/p-ad46d2fd.entry.js +4 -0
- package/dist/ionic/{p-8231e914.entry.js → p-b51eb274.entry.js} +1 -1
- package/dist/types/components/datetime/datetime-interface.d.ts +0 -4
- package/dist/types/components/datetime/datetime.d.ts +2 -71
- package/dist/types/components/datetime/utils/state.d.ts +2 -5
- package/dist/types/components.d.ts +0 -33
- package/hydrate/index.js +59 -403
- package/hydrate/index.mjs +59 -403
- package/package.json +1 -1
- package/components/p-ByE0slik.js +0 -4
- package/components/p-DktrWeJE.js +0 -4
- package/dist/ionic/p-41680415.entry.js +0 -4
- package/dist/ionic/p-56d77e95.entry.js +0 -4
- package/dist/ionic/p-a52cba2f.entry.js +0 -4
- package/dist/ionic/p-b30b468d.entry.js +0 -4
- package/dist/ionic/p-ceca04fb.entry.js +0 -4
package/hydrate/index.js
CHANGED
|
@@ -12894,7 +12894,7 @@ class Backdrop {
|
|
|
12894
12894
|
}; }
|
|
12895
12895
|
}
|
|
12896
12896
|
|
|
12897
|
-
const badgeIonicCss = () => `:host{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;-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);display:inline-block;background:var(--background);color:var(--color);text-align:center;white-space:nowrap;contain:content;vertical-align:baseline}:host([vertical]:not(.in-tab-button)){position:absolute}:host([vertical]:not(.in-tab-button)){inset-inline-end:0}:host(:not(.in-tab-button)[vertical].badge-vertical-top){top:0}:host(:not(.in-tab-button)[vertical].badge-vertical-bottom){bottom:0}:host{--padding-start:var(--token-space-200, var(--token-scale-200, 8px));--padding-end:var(--token-space-200, var(--token-scale-200, 8px));--padding-top:var(--token-space-0, var(--token-scale-0, 0px));--padding-bottom:var(--token-space-0, var(--token-scale-0, 0px));font-family:var(--token-font-family, -apple-system, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");font-size:var(--token-font-size-300, 0.75rem);font-weight:var(--token-font-weight-medium, 500);letter-spacing:var(--token-font-letter-spacing-0, 0);line-height:1.666667;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;min-width:var(--token-scale-250, 10px)}:host(.badge-bold){--background:var(--ion-color-primary, var(--token-bg-primary-base-default, var(--token-semantics-primary-base, var(--token-semantics-primary-700, var(--token-primitives-blue-700, #105cef)))));--color:var(--ion-color-primary-contrast, var(--token-text-
|
|
12897
|
+
const badgeIonicCss = () => `:host{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;-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);display:inline-block;background:var(--background);color:var(--color);text-align:center;white-space:nowrap;contain:content;vertical-align:baseline}:host([vertical]:not(.in-tab-button)){position:absolute}:host([vertical]:not(.in-tab-button)){inset-inline-end:0}:host(:not(.in-tab-button)[vertical].badge-vertical-top){top:0}:host(:not(.in-tab-button)[vertical].badge-vertical-bottom){bottom:0}:host{--padding-start:var(--token-space-200, var(--token-scale-200, 8px));--padding-end:var(--token-space-200, var(--token-scale-200, 8px));--padding-top:var(--token-space-0, var(--token-scale-0, 0px));--padding-bottom:var(--token-space-0, var(--token-scale-0, 0px));font-family:var(--token-font-family, -apple-system, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");font-size:var(--token-font-size-300, 0.75rem);font-weight:var(--token-font-weight-medium, 500);letter-spacing:var(--token-font-letter-spacing-0, 0);line-height:1.666667;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;min-width:var(--token-scale-250, 10px)}:host(.badge-bold){--background:var(--ion-color-primary, var(--token-bg-primary-base-default, var(--token-semantics-primary-base, var(--token-semantics-primary-700, var(--token-primitives-blue-700, #105cef)))));--color:var(--ion-color-primary-contrast, var(--token-text-light, var(--token-primitives-base-white, #ffffff)))}:host(.badge-bold.ion-color){background:var(--ion-color-base);color:var(--ion-color-contrast)}:host(.badge-subtle){--background:var(--ion-color-primary-subtle, var(--token-bg-primary-subtle-default, var(--token-semantics-primary-100, var(--token-primitives-blue-100, #f0f2ff))));--color:var(--ion-color-primary-subtle-contrast, var(--token-semantics-primary-900, var(--token-primitives-blue-900, #0d4bc3)))}:host(.badge-subtle.ion-color){background:var(--ion-color-subtle-base);color:var(--ion-color-subtle-contrast)}:host(.badge-soft){border-radius:var(--token-shape-soft-xs, 8px)}:host(.badge-small.badge-soft){border-radius:var(--token-shape-soft-2xs, 4px)}:host(.badge-round){border-radius:var(--token-shape-round-sm, 999px)}:host(.badge-rectangular){border-radius:var(--token-shape-rectangular-sm, 0px)}:host(.badge-small){--padding-start:var(--token-space-050, var(--token-scale-050, 2px));--padding-end:var(--token-space-050, var(--token-scale-050, 2px));min-width:var(--token-scale-400, 16px);height:var(--token-scale-400, 16px)}:host(.badge-small) ::slotted(ion-icon){font-size:var(--token-font-size-300, 0.75rem)}:host(.badge-medium),:host(.badge-large){--padding-start:var(--token-space-100, var(--token-scale-100, 4px));--padding-end:var(--token-space-100, var(--token-scale-100, 4px));font-family:var(--token-font-family, -apple-system, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");font-size:var(--token-font-size-350, 0.875rem);font-weight:var(--token-font-weight-medium, 500);letter-spacing:var(--token-font-letter-spacing-0, 0);line-height:1.714286;min-width:var(--token-scale-600, 24px);height:var(--token-scale-600, 24px)}:host(.badge-medium) ::slotted(ion-icon),:host(.badge-large) ::slotted(ion-icon){font-size:var(--token-font-size-400, 1rem)}:host(:empty){--padding-start:0;--padding-end:0}:host([vertical]:not(:empty)){--padding-start:var(--token-scale-100, 4px);--padding-end:var(--token-scale-100, 4px);--padding-top:var(--token-scale-100, 4px);--padding-bottom:var(--token-scale-100, 4px)}:host(.badge-small:empty){min-width:var(--token-scale-200, 8px);height:var(--token-scale-200, 8px)}:host(.badge-medium:empty){min-width:var(--token-scale-300, 12px);height:var(--token-scale-300, 12px)}:host(.badge-large:empty){min-width:var(--token-scale-400, 16px);height:var(--token-scale-400, 16px)}:host([vertical].in-tab-button){position:relative}:host([vertical]) ::slotted(ion-icon){top:50%;position:absolute;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%)}:host([vertical]) ::slotted(ion-icon){inset-inline-start:50%}:host(:not(:empty).in-button){--padding-start:var(--token-scale-050, 2px);--padding-end:var(--token-scale-050, 2px);font-family:var(--token-font-family, -apple-system, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");font-size:var(--token-font-size-300, 0.75rem);font-weight:var(--token-font-weight-medium, 500);letter-spacing:var(--token-font-letter-spacing-100, 0.01em);line-height:1.666667;min-width:var(--token-scale-400, 16px);height:var(--token-scale-400, 16px)}:host(:not(:empty).in-button) ::slotted(ion-icon){font-size:var(--token-font-size-300, 0.75rem)}`;
|
|
12898
12898
|
|
|
12899
12899
|
const badgeIosCss = () => `:host{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;-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);display:inline-block;background:var(--background);color:var(--color);text-align:center;white-space:nowrap;contain:content;vertical-align:baseline}:host([vertical]:not(.in-tab-button)){position:absolute}:host([vertical]:not(.in-tab-button)){inset-inline-end:0}:host(:not(.in-tab-button)[vertical].badge-vertical-top){top:0}:host(:not(.in-tab-button)[vertical].badge-vertical-bottom){bottom:0}:host{--padding-top:3px;--padding-end:8px;--padding-bottom:3px;--padding-start:8px;--background:var(--ion-color-primary, #0054e9);--color:var(--ion-color-primary-contrast, #fff);min-width:10px;font-family:var(--ion-font-family, inherit);font-size:0.8125rem;font-weight:bold;line-height:1}:host(.ion-color){background:var(--ion-color-base);color:var(--ion-color-contrast)}:host([vertical]:not(.in-button):not(.in-tab-button)),:host(:empty){--padding-start:0;--padding-end:0;--padding-bottom:0;--padding-top:0;border-radius:999px;width:10px;height:10px;font-size:0.5rem;line-height:10px}:host(:not(:empty).in-button){min-width:16px;height:16px;font-size:0.75rem;line-height:20px}:host(:not(:empty).in-button) ::slotted(ion-icon){font-size:12px}:host{border-radius:10px;font-size:max(13px, 0.8125rem)}:host([vertical].in-tab-button){position:relative;min-width:8px}:host([vertical].in-tab-button) ::slotted(ion-icon){top:50%;position:absolute;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);font-size:12px}:host([vertical].in-tab-button) ::slotted(ion-icon){inset-inline-start:50%}`;
|
|
12900
12900
|
|
|
@@ -13407,7 +13407,7 @@ const createAriaAttributeController = (el, onChange, hostOwnedAttributes = []) =
|
|
|
13407
13407
|
return createAttributeController(el, ariaAttributes, onChange, hostOwnedAttributes);
|
|
13408
13408
|
};
|
|
13409
13409
|
|
|
13410
|
-
const buttonIonicCss = () => `:host{--overflow:hidden;--ripple-color:currentColor;--border-width:initial;--border-color:initial;--border-style:initial;--color-activated:var(--color);--color-focused:var(--color);--color-hover:var(--color);--box-shadow:none;display:inline-block;width:auto;color:var(--color);text-align:center;text-decoration:none;white-space:normal;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;vertical-align:top;vertical-align:-webkit-baseline-middle;-webkit-font-kerning:none;font-kerning:none}:host(.button-disabled){cursor:default;opacity:0.5;pointer-events:none}:host(.button-outline){--background:transparent}:host(.button-clear){--border-width:0;--background:transparent}:host(.button-block){display:block}:host(.button-block) .button-native{margin-left:0;margin-right:0;width:100%;clear:both;contain:content}:host(.button-block) .button-native::after{clear:both}:host(.button-full){display:block}:host(.button-full) .button-native{margin-left:0;margin-right:0;width:100%;contain:content}:host(.button-full:not(.button-round)) .button-native{border-radius:0;border-right-width:0;border-left-width:0}.button-native{border-radius:var(--border-radius);-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;-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);color:inherit;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-align:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;white-space:inherit;display:-ms-flexbox;display:flex;position:relative;-ms-flex-align:center;align-items:center;width:100%;height:100%;min-height:inherit;-webkit-transition:var(--transition);transition:var(--transition);border-width:var(--border-width);border-style:var(--border-style);border-color:var(--border-color);outline:none;background:var(--background);line-height:1;-webkit-box-shadow:var(--box-shadow);box-shadow:var(--box-shadow);contain:layout style;cursor:pointer;opacity:var(--opacity);overflow:var(--overflow);z-index:0;-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-appearance:none;-moz-appearance:none;appearance:none}.button-native::-moz-focus-inner{border:0}.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}::slotted([slot=start]),::slotted([slot=end]){-ms-flex-negative:0;flex-shrink:0}::slotted(ion-icon),::slotted(ion-spinner){pointer-events:none}ion-ripple-effect{color:var(--ripple-color)}.button-native::after{right:0;left:0;top:0;bottom:0;position:absolute;content:"";opacity:0}:host(.ion-focused){color:var(--color-focused)}:host(.ion-focused) .button-native::after{background:var(--background-focused);opacity:var(--background-focused-opacity)}@media (any-hover: hover){:host(:hover){color:var(--color-hover)}:host(:hover) .button-native::after{background:var(--background-hover);opacity:var(--background-hover-opacity)}}:host(.ion-activated){color:var(--color-activated)}:host(.ion-activated) .button-native::after{background:var(--background-activated);opacity:var(--background-activated-opacity)}:host(.button-solid.ion-color) .button-native{background:var(--ion-color-base);color:var(--ion-color-contrast)}:host(.button-outline.ion-color) .button-native{border-color:var(--ion-color-base);background:transparent;color:var(--ion-color-base)}:host(.button-clear.ion-color) .button-native{background:transparent;color:var(--ion-color-foreground)}:host(.in-toolbar:not(.ion-color):not(.in-toolbar-color)) .button-native{color:var(--ion-toolbar-color, var(--color))}:host(.button-outline.in-toolbar:not(.ion-color):not(.in-toolbar-color)) .button-native{border-color:var(--ion-toolbar-color, var(--color, var(--border-color)))}:host(.button-solid.in-toolbar:not(.ion-color):not(.in-toolbar-color)) .button-native{background:var(--ion-toolbar-color, var(--background));color:var(--ion-toolbar-background, var(--color))}.button-native ion-ripple-effect,.button-native::after{border-radius:inherit}:host(.button-has-badge) .button-native{--overflow:visible}:host ::slotted(ion-badge[vertical]:not(:empty)){display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center}:host{--padding-top:var(--token-space-0, var(--token-scale-0, 0px));--padding-end:var(--token-space-0, var(--token-scale-0, 0px));--padding-bottom:var(--padding-top);--padding-start:var(--padding-end);--focus-ring-color:var(--token-border-focus-default, var(--token-semantics-primary-400, var(--token-primitives-blue-400, #b5c0f7)));--focus-ring-width:var(--token-border-size-050, var(--token-scale-050, 2px));position:relative}:host::after{right:0;left:0;top:50%;position:absolute;height:100%;min-height:inherit;-webkit-transform:translateY(-50%);transform:translateY(-50%);content:"";cursor:pointer;z-index:1}:host(.button-clear){--color:var(--ion-color-primary-foreground, var(--token-text-primary, var(--token-semantics-primary-800, var(--token-primitives-blue-800, #0f54da))))}:host(.button-solid){--background-activated:var(--ion-color-primary-shade, var(--token-bg-primary-base-press, var(--token-semantics-primary-900, var(--token-primitives-blue-900, #0d4bc3))));--background-hover:var(--ion-color-primary-shade, var(--token-bg-primary-base-press, var(--token-semantics-primary-900, var(--token-primitives-blue-900, #0d4bc3))));--background-focused:transparent;--background-hover-opacity:1;--background:var(--ion-color-primary, var(--token-bg-primary-base-default, var(--token-semantics-primary-base, var(--token-semantics-primary-700, var(--token-primitives-blue-700, #105cef)))));--color:var(--ion-color-primary-contrast, var(--token-text-inverse, var(--token-primitives-base-white, #ffffff)));--ripple-opacity:var(--background-activated-opacity, 1);--ripple-color:var(--background-activated)}:host(.button-outline){--border-width:var(--token-border-size-025, var(--token-scale-025, 1px));--border-style:solid;--background-activated:var(--ion-color-primary-subtle-shade, var(--token-bg-primary-subtle-press, var(--token-semantics-primary-300, var(--token-primitives-blue-300, #d0d7fa))));--background-focused:transparent;--background-hover:var(--ion-color-primary-subtle-shade, var(--token-bg-primary-subtle-press, var(--token-semantics-primary-300, var(--token-primitives-blue-300, #d0d7fa))));--background-hover-opacity:1;--border-color:var(--ion-color-primary, var(--token-bg-primary-base-default, var(--token-semantics-primary-base, var(--token-semantics-primary-700, var(--token-primitives-blue-700, #105cef)))));--color:var(--ion-color-primary, var(--token-bg-primary-base-default, var(--token-semantics-primary-base, var(--token-semantics-primary-700, var(--token-primitives-blue-700, #105cef)))));--ripple-opacity:var(--background-activated-opacity, 1);--ripple-color:var(--background-activated)}:host(.button-outline.ion-color-warning) .button-native{border-color:var(--ion-color-warning-foreground, var(--token-text-warning, var(--token-semantics-warning-1000, var(--token-primitives-yellow-1000, #925f00))));color:var(--ion-color-warning-foreground, var(--token-text-warning, var(--token-semantics-warning-1000, var(--token-primitives-yellow-1000, #925f00))))}:host(.button-clear){--background-activated:var(--ion-color-primary-subtle-shade, var(--token-bg-primary-subtle-press, var(--token-semantics-primary-300, var(--token-primitives-blue-300, #d0d7fa))));--background-focused:transparent;--background-hover:var(--ion-color-primary-subtle-shade, var(--token-bg-primary-subtle-press, var(--token-semantics-primary-300, var(--token-primitives-blue-300, #d0d7fa))));--background-hover-opacity:1;--color:var(--ion-color-primary-foreground, var(--token-text-primary, var(--token-semantics-primary-800, var(--token-primitives-blue-800, #0f54da))));--ripple-opacity:var(--background-activated-opacity, 1);--ripple-color:var(--background-activated)}:host(.button-solid.ion-color) ion-ripple-effect{color:var(--ion-color-shade)}:host(.button-outline.ion-color) ion-ripple-effect,:host(.button-clear.ion-color) ion-ripple-effect{color:var(--ion-color-subtle-shade)}:host(.button-small){--padding-end:var(--token-space-400, var(--token-scale-400, 16px));font-family:var(--token-font-family, -apple-system, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");font-size:var(--token-font-size-350, 0.875rem);font-weight:var(--token-font-weight-medium, 500);letter-spacing:var(--token-font-letter-spacing-100, 0.01em);line-height:1.428571;min-width:var(--token-scale-1600, 64px);min-height:var(--token-scale-1000, 40px)}:host(.button-medium){--padding-end:var(--token-space-500, var(--token-scale-500, 20px));font-family:var(--token-font-family, -apple-system, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");font-size:var(--token-font-size-400, 1rem);font-weight:var(--token-font-weight-medium, 500);letter-spacing:var(--token-font-letter-spacing-100, 0.01em);line-height:1.5;min-width:var(--token-scale-1800, 72px);min-height:var(--token-scale-1200, 48px)}:host(.button-large){--padding-end:var(--token-space-700, var(--token-scale-700, 28px));font-family:var(--token-font-family, -apple-system, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");font-size:var(--token-font-size-500, 1.25rem);font-weight:var(--token-font-weight-medium, 500);letter-spacing:var(--token-font-letter-spacing-100, 0.01em);line-height:1.2;min-width:var(--token-scale-2000, 80px);min-height:var(--token-scale-1400, 56px)}:host(.button-small) ::slotted(ion-icon[slot=start]),:host(.button-small) ::slotted(ion-icon[slot=end]),:host(.button-small) ::slotted(ion-icon[slot=icon-only]),:host(.button-medium) ::slotted(ion-icon[slot=start]),:host(.button-medium) ::slotted(ion-icon[slot=end]),:host(.button-medium) ::slotted(ion-icon[slot=icon-only]){font-size:var(--token-font-size-500, 1.25rem)}:host(.button-large) ::slotted(ion-icon[slot=start]),:host(.button-large) ::slotted(ion-icon[slot=end]),:host(.button-large) ::slotted(ion-icon[slot=icon-only]){font-size:var(--token-font-size-600, 1.5rem)}:host(.button-has-icon-only){--padding-end:var(--padding-top);min-width:unset;aspect-ratio:1/1}::slotted(ion-spinner){--color:currentColor}::slotted(ion-spinner[slot=start]),::slotted(ion-spinner[slot=end]),::slotted(ion-spinner[slot=icon-only]){width:var(--token-scale-500, 20px);height:var(--token-scale-500, 20px)}:host(.button-soft){--border-radius:var(--token-shape-soft-xs, 8px)}:host(.button-round){--border-radius:var(--token-shape-round-xs, 999px)}:host(.button-rectangular){--border-radius:var(--token-shape-rectangular-xs, 0px)}:host(.ion-focused) .button-native{outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:var(--token-border-size-050, var(--token-scale-050, 2px))}:host(.button-solid.ion-color.ion-activated) .button-native::after{background:var(--ion-color-shade)}:host(.button-outline.ion-color.ion-activated) .button-native::after,:host(.button-clear.ion-color.ion-activated) .button-native::after{background:var(--ion-color-subtle-shade)}:host(.ion-activated) .button-native:has(ion-ripple-effect)::after,:host(.button-solid.ion-color.ion-activated) .button-native:has(ion-ripple-effect)::after,:host(.button-outline.ion-color.ion-activated) .button-native:has(ion-ripple-effect)::after,:host(.button-clear.ion-color.ion-activated) .button-native:has(ion-ripple-effect)::after{background:transparent}@media (any-hover: hover){:host(.button-solid.ion-color:hover) .button-native::after{background:var(--ion-color-shade)}:host(.button-outline.ion-color:hover) .button-native::after,:host(.button-clear.ion-color:hover) .button-native::after{background:var(--ion-color-subtle-shade)}}:host(.button-disabled) .button-native::after{right:0;left:0;top:0;bottom:0;position:absolute;background-color:var(--token-state-disabled, rgba(255, 255, 255, 0.6));content:"";pointer-events:none;width:inherit;height:inherit}::slotted(ion-icon){font-size:var(--token-font-size-500, 1.25rem)}:host(.button-small) ::slotted(ion-icon[slot=start]),:host(.button-small) ::slotted(ion-spinner[slot=start]){-webkit-margin-end:var(--token-space-200, var(--token-scale-200, 8px));margin-inline-end:var(--token-space-200, var(--token-scale-200, 8px))}::slotted(ion-icon[slot=start]),::slotted(ion-spinner[slot=start]){-webkit-margin-end:var(--token-space-250, var(--token-scale-250, 10px));margin-inline-end:var(--token-space-250, var(--token-scale-250, 10px))}:host(.button-large) ::slotted(ion-icon[slot=start]),:host(.button-large) ::slotted(ion-spinner[slot=start]){-webkit-margin-end:var(--token-space-300, var(--token-scale-300, 12px));margin-inline-end:var(--token-space-300, var(--token-scale-300, 12px))}:host(.button-small) ::slotted(ion-icon[slot=end]),:host(.button-small) ::slotted(ion-spinner[slot=end]){-webkit-margin-start:var(--token-space-200, var(--token-scale-200, 8px));margin-inline-start:var(--token-space-200, var(--token-scale-200, 8px))}::slotted(ion-icon[slot=end]),::slotted(ion-spinner[slot=end]){-webkit-margin-start:var(--token-space-250, var(--token-scale-250, 10px));margin-inline-start:var(--token-space-250, var(--token-scale-250, 10px))}:host(.button-large) ::slotted(ion-icon[slot=end]),:host(.button-large) ::slotted(ion-spinner[slot=end]){-webkit-margin-start:var(--token-space-300, var(--token-scale-300, 12px));margin-inline-start:var(--token-space-300, var(--token-scale-300, 12px))}:host(.button-has-badge){--padding-top:var(--token-space-0, var(--token-scale-0, 0px));--padding-bottom:var(--token-space-0, var(--token-scale-0, 0px))}:host(.button-small) ::slotted(ion-badge){inset-inline-end:calc(-1 * var(--token-space-050, var(--token-scale-050, 2px)))}:host(.button-medium) ::slotted(ion-badge.long-badge.badge-vertical-top){top:var(--token-space-100, var(--token-scale-100, 4px))}:host(.button-medium) ::slotted(ion-badge.long-badge.badge-vertical-bottom){bottom:var(--token-space-100, var(--token-scale-100, 4px))}:host(.button-medium) ::slotted(ion-badge:not(.long-badge).badge-vertical-top){top:var(--token-space-100, var(--token-scale-100, 4px))}:host(.button-medium) ::slotted(ion-badge:not(.long-badge).badge-vertical-top){inset-inline-end:var(--token-space-150, var(--token-scale-150, 6px))}:host(.button-medium) ::slotted(ion-badge:not(.long-badge).badge-vertical-bottom){bottom:var(--token-space-100, var(--token-scale-100, 4px))}:host(.button-medium) ::slotted(ion-badge:not(.long-badge).badge-vertical-bottom){inset-inline-end:var(--token-space-150, var(--token-scale-150, 6px))}:host(.button-large) ::slotted(ion-badge.long-badge.badge-vertical-top){top:var(--token-space-200, var(--token-scale-200, 8px))}:host(.button-large) ::slotted(ion-badge.long-badge.badge-vertical-bottom){bottom:var(--token-space-200, var(--token-scale-200, 8px))}:host(.button-large) ::slotted(ion-badge:not(.long-badge).badge-vertical-top){top:var(--token-space-200, var(--token-scale-200, 8px))}:host(.button-large) ::slotted(ion-badge:not(.long-badge).badge-vertical-top){inset-inline-end:var(--token-space-200, var(--token-scale-200, 8px))}:host(.button-large) ::slotted(ion-badge:not(.long-badge).badge-vertical-bottom){bottom:var(--token-space-200, var(--token-scale-200, 8px))}:host(.button-large) ::slotted(ion-badge:not(.long-badge).badge-vertical-bottom){inset-inline-end:var(--token-space-200, var(--token-scale-200, 8px))}:host(.in-datetime){font-family:var(--token-font-family, -apple-system, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");font-size:var(--token-font-size-400, 1rem);font-weight:var(--token-font-weight-medium, 500);letter-spacing:var(--token-font-letter-spacing-100, 0.01em);line-height:1.5;min-height:var(--token-space-1200, var(--token-scale-1200, 48px))}`;
|
|
13410
|
+
const buttonIonicCss = () => `:host{--overflow:hidden;--ripple-color:currentColor;--border-width:initial;--border-color:initial;--border-style:initial;--color-activated:var(--color);--color-focused:var(--color);--color-hover:var(--color);--box-shadow:none;display:inline-block;width:auto;color:var(--color);text-align:center;text-decoration:none;white-space:normal;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;vertical-align:top;vertical-align:-webkit-baseline-middle;-webkit-font-kerning:none;font-kerning:none}:host(.button-disabled){cursor:default;opacity:0.5;pointer-events:none}:host(.button-outline){--background:transparent}:host(.button-clear){--border-width:0;--background:transparent}:host(.button-block){display:block}:host(.button-block) .button-native{margin-left:0;margin-right:0;width:100%;clear:both;contain:content}:host(.button-block) .button-native::after{clear:both}:host(.button-full){display:block}:host(.button-full) .button-native{margin-left:0;margin-right:0;width:100%;contain:content}:host(.button-full:not(.button-round)) .button-native{border-radius:0;border-right-width:0;border-left-width:0}.button-native{border-radius:var(--border-radius);-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;-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);color:inherit;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-align:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;white-space:inherit;display:-ms-flexbox;display:flex;position:relative;-ms-flex-align:center;align-items:center;width:100%;height:100%;min-height:inherit;-webkit-transition:var(--transition);transition:var(--transition);border-width:var(--border-width);border-style:var(--border-style);border-color:var(--border-color);outline:none;background:var(--background);line-height:1;-webkit-box-shadow:var(--box-shadow);box-shadow:var(--box-shadow);contain:layout style;cursor:pointer;opacity:var(--opacity);overflow:var(--overflow);z-index:0;-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-appearance:none;-moz-appearance:none;appearance:none}.button-native::-moz-focus-inner{border:0}.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}::slotted([slot=start]),::slotted([slot=end]){-ms-flex-negative:0;flex-shrink:0}::slotted(ion-icon),::slotted(ion-spinner){pointer-events:none}ion-ripple-effect{color:var(--ripple-color)}.button-native::after{right:0;left:0;top:0;bottom:0;position:absolute;content:"";opacity:0}:host(.ion-focused){color:var(--color-focused)}:host(.ion-focused) .button-native::after{background:var(--background-focused);opacity:var(--background-focused-opacity)}@media (any-hover: hover){:host(:hover){color:var(--color-hover)}:host(:hover) .button-native::after{background:var(--background-hover);opacity:var(--background-hover-opacity)}}:host(.ion-activated){color:var(--color-activated)}:host(.ion-activated) .button-native::after{background:var(--background-activated);opacity:var(--background-activated-opacity)}:host(.button-solid.ion-color) .button-native{background:var(--ion-color-base);color:var(--ion-color-contrast)}:host(.button-outline.ion-color) .button-native{border-color:var(--ion-color-base);background:transparent;color:var(--ion-color-base)}:host(.button-clear.ion-color) .button-native{background:transparent;color:var(--ion-color-foreground)}:host(.in-toolbar:not(.ion-color):not(.in-toolbar-color)) .button-native{color:var(--ion-toolbar-color, var(--color))}:host(.button-outline.in-toolbar:not(.ion-color):not(.in-toolbar-color)) .button-native{border-color:var(--ion-toolbar-color, var(--color, var(--border-color)))}:host(.button-solid.in-toolbar:not(.ion-color):not(.in-toolbar-color)) .button-native{background:var(--ion-toolbar-color, var(--background));color:var(--ion-toolbar-background, var(--color))}.button-native ion-ripple-effect,.button-native::after{border-radius:inherit}:host(.button-has-badge) .button-native{--overflow:visible}:host ::slotted(ion-badge[vertical]:not(:empty)){display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center}:host{--padding-top:var(--token-space-0, var(--token-scale-0, 0px));--padding-end:var(--token-space-0, var(--token-scale-0, 0px));--padding-bottom:var(--padding-top);--padding-start:var(--padding-end);--focus-ring-color:var(--token-border-focus-default, var(--token-semantics-primary-400, var(--token-primitives-blue-400, #b5c0f7)));--focus-ring-width:var(--token-border-size-050, var(--token-scale-050, 2px));position:relative}:host::after{right:0;left:0;top:50%;position:absolute;height:100%;min-height:inherit;-webkit-transform:translateY(-50%);transform:translateY(-50%);content:"";cursor:pointer;z-index:1}:host(.button-clear){--color:var(--ion-color-primary-foreground, var(--token-text-primary, var(--token-semantics-primary-800, var(--token-primitives-blue-800, #0f54da))))}:host(.button-solid){--background-activated:var(--ion-color-primary-shade, var(--token-bg-primary-base-press, var(--token-semantics-primary-900, var(--token-primitives-blue-900, #0d4bc3))));--background-hover:var(--ion-color-primary-shade, var(--token-bg-primary-base-press, var(--token-semantics-primary-900, var(--token-primitives-blue-900, #0d4bc3))));--background-focused:transparent;--background-hover-opacity:1;--background:var(--ion-color-primary, var(--token-bg-primary-base-default, var(--token-semantics-primary-base, var(--token-semantics-primary-700, var(--token-primitives-blue-700, #105cef)))));--color:var(--ion-color-primary-contrast, var(--token-text-light, var(--token-primitives-base-white, #ffffff)));--ripple-opacity:var(--background-activated-opacity, 1);--ripple-color:var(--background-activated)}:host(.button-outline){--border-width:var(--token-border-size-025, var(--token-scale-025, 1px));--border-style:solid;--background-activated:var(--ion-color-primary-subtle-shade, var(--token-bg-primary-subtle-press, var(--token-semantics-primary-300, var(--token-primitives-blue-300, #d0d7fa))));--background-focused:transparent;--background-hover:var(--ion-color-primary-subtle-shade, var(--token-bg-primary-subtle-press, var(--token-semantics-primary-300, var(--token-primitives-blue-300, #d0d7fa))));--background-hover-opacity:1;--border-color:var(--ion-color-primary, var(--token-bg-primary-base-default, var(--token-semantics-primary-base, var(--token-semantics-primary-700, var(--token-primitives-blue-700, #105cef)))));--color:var(--ion-color-primary, var(--token-bg-primary-base-default, var(--token-semantics-primary-base, var(--token-semantics-primary-700, var(--token-primitives-blue-700, #105cef)))));--ripple-opacity:var(--background-activated-opacity, 1);--ripple-color:var(--background-activated)}:host(.button-outline.ion-color-warning) .button-native{border-color:var(--ion-color-warning-foreground, var(--token-text-warning, var(--token-semantics-warning-1000, var(--token-primitives-yellow-1000, #925f00))));color:var(--ion-color-warning-foreground, var(--token-text-warning, var(--token-semantics-warning-1000, var(--token-primitives-yellow-1000, #925f00))))}:host(.button-clear){--background-activated:var(--ion-color-primary-subtle-shade, var(--token-bg-primary-subtle-press, var(--token-semantics-primary-300, var(--token-primitives-blue-300, #d0d7fa))));--background-focused:transparent;--background-hover:var(--ion-color-primary-subtle-shade, var(--token-bg-primary-subtle-press, var(--token-semantics-primary-300, var(--token-primitives-blue-300, #d0d7fa))));--background-hover-opacity:1;--color:var(--ion-color-primary-foreground, var(--token-text-primary, var(--token-semantics-primary-800, var(--token-primitives-blue-800, #0f54da))));--ripple-opacity:var(--background-activated-opacity, 1);--ripple-color:var(--background-activated)}:host(.button-solid.ion-color) ion-ripple-effect{color:var(--ion-color-shade)}:host(.button-outline.ion-color) ion-ripple-effect,:host(.button-clear.ion-color) ion-ripple-effect{color:var(--ion-color-subtle-shade)}:host(.button-small){--padding-end:var(--token-space-400, var(--token-scale-400, 16px));font-family:var(--token-font-family, -apple-system, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");font-size:var(--token-font-size-350, 0.875rem);font-weight:var(--token-font-weight-medium, 500);letter-spacing:var(--token-font-letter-spacing-100, 0.01em);line-height:1.428571;min-width:var(--token-scale-1600, 64px);min-height:var(--token-scale-1000, 40px)}:host(.button-medium){--padding-end:var(--token-space-500, var(--token-scale-500, 20px));font-family:var(--token-font-family, -apple-system, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");font-size:var(--token-font-size-400, 1rem);font-weight:var(--token-font-weight-medium, 500);letter-spacing:var(--token-font-letter-spacing-100, 0.01em);line-height:1.5;min-width:var(--token-scale-1800, 72px);min-height:var(--token-scale-1200, 48px)}:host(.button-large){--padding-end:var(--token-space-700, var(--token-scale-700, 28px));font-family:var(--token-font-family, -apple-system, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");font-size:var(--token-font-size-500, 1.25rem);font-weight:var(--token-font-weight-medium, 500);letter-spacing:var(--token-font-letter-spacing-100, 0.01em);line-height:1.2;min-width:var(--token-scale-2000, 80px);min-height:var(--token-scale-1400, 56px)}:host(.button-small) ::slotted(ion-icon[slot=start]),:host(.button-small) ::slotted(ion-icon[slot=end]),:host(.button-small) ::slotted(ion-icon[slot=icon-only]),:host(.button-medium) ::slotted(ion-icon[slot=start]),:host(.button-medium) ::slotted(ion-icon[slot=end]),:host(.button-medium) ::slotted(ion-icon[slot=icon-only]){font-size:var(--token-font-size-500, 1.25rem)}:host(.button-large) ::slotted(ion-icon[slot=start]),:host(.button-large) ::slotted(ion-icon[slot=end]),:host(.button-large) ::slotted(ion-icon[slot=icon-only]){font-size:var(--token-font-size-600, 1.5rem)}:host(.button-has-icon-only){--padding-end:var(--padding-top);min-width:unset;aspect-ratio:1/1}::slotted(ion-spinner){--color:currentColor}::slotted(ion-spinner[slot=start]),::slotted(ion-spinner[slot=end]),::slotted(ion-spinner[slot=icon-only]){width:var(--token-scale-500, 20px);height:var(--token-scale-500, 20px)}:host(.button-soft){--border-radius:var(--token-shape-soft-xs, 8px)}:host(.button-round){--border-radius:var(--token-shape-round-xs, 999px)}:host(.button-rectangular){--border-radius:var(--token-shape-rectangular-xs, 0px)}:host(.ion-focused) .button-native{outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:var(--token-border-size-050, var(--token-scale-050, 2px))}:host(.button-solid.ion-color.ion-activated) .button-native::after{background:var(--ion-color-shade)}:host(.button-outline.ion-color.ion-activated) .button-native::after,:host(.button-clear.ion-color.ion-activated) .button-native::after{background:var(--ion-color-subtle-shade)}:host(.ion-activated) .button-native:has(ion-ripple-effect)::after,:host(.button-solid.ion-color.ion-activated) .button-native:has(ion-ripple-effect)::after,:host(.button-outline.ion-color.ion-activated) .button-native:has(ion-ripple-effect)::after,:host(.button-clear.ion-color.ion-activated) .button-native:has(ion-ripple-effect)::after{background:transparent}@media (any-hover: hover){:host(.button-solid.ion-color:hover) .button-native::after{background:var(--ion-color-shade)}:host(.button-outline.ion-color:hover) .button-native::after,:host(.button-clear.ion-color:hover) .button-native::after{background:var(--ion-color-subtle-shade)}}:host(.button-disabled) .button-native::after{right:0;left:0;top:0;bottom:0;position:absolute;background-color:var(--token-state-disabled, rgba(255, 255, 255, 0.6));content:"";pointer-events:none;width:inherit;height:inherit}::slotted(ion-icon){font-size:var(--token-font-size-500, 1.25rem)}:host(.button-small) ::slotted(ion-icon[slot=start]),:host(.button-small) ::slotted(ion-spinner[slot=start]){-webkit-margin-end:var(--token-space-200, var(--token-scale-200, 8px));margin-inline-end:var(--token-space-200, var(--token-scale-200, 8px))}::slotted(ion-icon[slot=start]),::slotted(ion-spinner[slot=start]){-webkit-margin-end:var(--token-space-250, var(--token-scale-250, 10px));margin-inline-end:var(--token-space-250, var(--token-scale-250, 10px))}:host(.button-large) ::slotted(ion-icon[slot=start]),:host(.button-large) ::slotted(ion-spinner[slot=start]){-webkit-margin-end:var(--token-space-300, var(--token-scale-300, 12px));margin-inline-end:var(--token-space-300, var(--token-scale-300, 12px))}:host(.button-small) ::slotted(ion-icon[slot=end]),:host(.button-small) ::slotted(ion-spinner[slot=end]){-webkit-margin-start:var(--token-space-200, var(--token-scale-200, 8px));margin-inline-start:var(--token-space-200, var(--token-scale-200, 8px))}::slotted(ion-icon[slot=end]),::slotted(ion-spinner[slot=end]){-webkit-margin-start:var(--token-space-250, var(--token-scale-250, 10px));margin-inline-start:var(--token-space-250, var(--token-scale-250, 10px))}:host(.button-large) ::slotted(ion-icon[slot=end]),:host(.button-large) ::slotted(ion-spinner[slot=end]){-webkit-margin-start:var(--token-space-300, var(--token-scale-300, 12px));margin-inline-start:var(--token-space-300, var(--token-scale-300, 12px))}:host(.button-has-badge){--padding-top:var(--token-space-0, var(--token-scale-0, 0px));--padding-bottom:var(--token-space-0, var(--token-scale-0, 0px))}:host(.button-small) ::slotted(ion-badge){inset-inline-end:calc(-1 * var(--token-space-050, var(--token-scale-050, 2px)))}:host(.button-medium) ::slotted(ion-badge.long-badge.badge-vertical-top){top:var(--token-space-100, var(--token-scale-100, 4px))}:host(.button-medium) ::slotted(ion-badge.long-badge.badge-vertical-bottom){bottom:var(--token-space-100, var(--token-scale-100, 4px))}:host(.button-medium) ::slotted(ion-badge:not(.long-badge).badge-vertical-top){top:var(--token-space-100, var(--token-scale-100, 4px))}:host(.button-medium) ::slotted(ion-badge:not(.long-badge).badge-vertical-top){inset-inline-end:var(--token-space-150, var(--token-scale-150, 6px))}:host(.button-medium) ::slotted(ion-badge:not(.long-badge).badge-vertical-bottom){bottom:var(--token-space-100, var(--token-scale-100, 4px))}:host(.button-medium) ::slotted(ion-badge:not(.long-badge).badge-vertical-bottom){inset-inline-end:var(--token-space-150, var(--token-scale-150, 6px))}:host(.button-large) ::slotted(ion-badge.long-badge.badge-vertical-top){top:var(--token-space-200, var(--token-scale-200, 8px))}:host(.button-large) ::slotted(ion-badge.long-badge.badge-vertical-bottom){bottom:var(--token-space-200, var(--token-scale-200, 8px))}:host(.button-large) ::slotted(ion-badge:not(.long-badge).badge-vertical-top){top:var(--token-space-200, var(--token-scale-200, 8px))}:host(.button-large) ::slotted(ion-badge:not(.long-badge).badge-vertical-top){inset-inline-end:var(--token-space-200, var(--token-scale-200, 8px))}:host(.button-large) ::slotted(ion-badge:not(.long-badge).badge-vertical-bottom){bottom:var(--token-space-200, var(--token-scale-200, 8px))}:host(.button-large) ::slotted(ion-badge:not(.long-badge).badge-vertical-bottom){inset-inline-end:var(--token-space-200, var(--token-scale-200, 8px))}:host(.in-datetime){font-family:var(--token-font-family, -apple-system, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");font-size:var(--token-font-size-400, 1rem);font-weight:var(--token-font-weight-medium, 500);letter-spacing:var(--token-font-letter-spacing-100, 0.01em);line-height:1.5;min-height:var(--token-space-1200, var(--token-scale-1200, 48px))}`;
|
|
13411
13411
|
|
|
13412
13412
|
const buttonIosCss = () => `:host{--overflow:hidden;--ripple-color:currentColor;--border-width:initial;--border-color:initial;--border-style:initial;--color-activated:var(--color);--color-focused:var(--color);--color-hover:var(--color);--box-shadow:none;display:inline-block;width:auto;color:var(--color);text-align:center;text-decoration:none;white-space:normal;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;vertical-align:top;vertical-align:-webkit-baseline-middle;-webkit-font-kerning:none;font-kerning:none}:host(.button-disabled){cursor:default;opacity:0.5;pointer-events:none}:host(.button-outline){--background:transparent}:host(.button-clear){--border-width:0;--background:transparent}:host(.button-block){display:block}:host(.button-block) .button-native{margin-left:0;margin-right:0;width:100%;clear:both;contain:content}:host(.button-block) .button-native::after{clear:both}:host(.button-full){display:block}:host(.button-full) .button-native{margin-left:0;margin-right:0;width:100%;contain:content}:host(.button-full:not(.button-round)) .button-native{border-radius:0;border-right-width:0;border-left-width:0}.button-native{border-radius:var(--border-radius);-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;-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);color:inherit;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-align:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;white-space:inherit;display:-ms-flexbox;display:flex;position:relative;-ms-flex-align:center;align-items:center;width:100%;height:100%;min-height:inherit;-webkit-transition:var(--transition);transition:var(--transition);border-width:var(--border-width);border-style:var(--border-style);border-color:var(--border-color);outline:none;background:var(--background);line-height:1;-webkit-box-shadow:var(--box-shadow);box-shadow:var(--box-shadow);contain:layout style;cursor:pointer;opacity:var(--opacity);overflow:var(--overflow);z-index:0;-webkit-box-sizing:border-box;box-sizing:border-box;-webkit-appearance:none;-moz-appearance:none;appearance:none}.button-native::-moz-focus-inner{border:0}.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}::slotted([slot=start]),::slotted([slot=end]){-ms-flex-negative:0;flex-shrink:0}::slotted(ion-icon),::slotted(ion-spinner){pointer-events:none}ion-ripple-effect{color:var(--ripple-color)}.button-native::after{right:0;left:0;top:0;bottom:0;position:absolute;content:"";opacity:0}:host(.ion-focused){color:var(--color-focused)}:host(.ion-focused) .button-native::after{background:var(--background-focused);opacity:var(--background-focused-opacity)}@media (any-hover: hover){:host(:hover){color:var(--color-hover)}:host(:hover) .button-native::after{background:var(--background-hover);opacity:var(--background-hover-opacity)}}:host(.ion-activated){color:var(--color-activated)}:host(.ion-activated) .button-native::after{background:var(--background-activated);opacity:var(--background-activated-opacity)}:host(.button-solid.ion-color) .button-native{background:var(--ion-color-base);color:var(--ion-color-contrast)}:host(.button-outline.ion-color) .button-native{border-color:var(--ion-color-base);background:transparent;color:var(--ion-color-base)}:host(.button-clear.ion-color) .button-native{background:transparent;color:var(--ion-color-foreground)}:host(.in-toolbar:not(.ion-color):not(.in-toolbar-color)) .button-native{color:var(--ion-toolbar-color, var(--color))}:host(.button-outline.in-toolbar:not(.ion-color):not(.in-toolbar-color)) .button-native{border-color:var(--ion-toolbar-color, var(--color, var(--border-color)))}:host(.button-solid.in-toolbar:not(.ion-color):not(.in-toolbar-color)) .button-native{background:var(--ion-toolbar-color, var(--background));color:var(--ion-toolbar-background, var(--color))}.button-native ion-ripple-effect,.button-native::after{border-radius:inherit}:host(.button-has-badge) .button-native{--overflow:visible}:host ::slotted(ion-badge[vertical]:not(:empty)){display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center}:host{font-family:var(--ion-font-family, inherit)}:host(.button-solid){--background:var(--ion-color-primary, #0054e9);--color:var(--ion-color-primary-contrast, #fff)}:host(.button-outline){--border-color:var(--ion-color-primary, #0054e9);--color:var(--ion-color-primary, #0054e9)}:host(.button-clear){--color:var(--ion-color-primary, #0054e9)}::slotted(ion-icon){font-size:1.35em}::slotted(ion-icon[slot=start]){-webkit-margin-start:-0.3em;margin-inline-start:-0.3em;-webkit-margin-end:0.3em;margin-inline-end:0.3em;margin-top:0;margin-bottom:0}::slotted(ion-icon[slot=end]){-webkit-margin-start:0.3em;margin-inline-start:0.3em;-webkit-margin-end:-0.2em;margin-inline-end:-0.2em;margin-top:0;margin-bottom:0}.button-native ::slotted(ion-badge){position:fixed}:host ::slotted(ion-badge[vertical]:not(:empty)){-webkit-padding-start:2px;padding-inline-start:2px;-webkit-padding-end:2px;padding-inline-end:2px;padding-top:2px;padding-bottom:2px}:host(.in-datetime){-webkit-margin-start:2px;margin-inline-start:2px;-webkit-margin-end:2px;margin-inline-end:2px;margin-top:0px;margin-bottom:0px;min-height:32px}:host{--padding-top:13px;--padding-bottom:13px;--padding-start:1em;--padding-end:1em;--transition:background-color, opacity 100ms linear;-webkit-margin-start:2px;margin-inline-start:2px;-webkit-margin-end:2px;margin-inline-end:2px;margin-top:4px;margin-bottom:4px;min-height:3.1em;font-size:min(1rem, 48px);font-weight:500;letter-spacing:0}:host(.button-solid){--background-activated:var(--ion-color-primary-shade, #004acd);--background-focused:var(--ion-color-primary-shade, #004acd);--background-hover:var(--ion-color-primary-tint, #1a65eb);--background-activated-opacity:1;--background-focused-opacity:1;--background-hover-opacity:1}:host(.button-outline){--border-width:1px;--border-style:solid;--background-activated:var(--ion-color-primary, #0054e9);--background-focused:var(--ion-color-primary, #0054e9);--background-hover:transparent;--background-focused-opacity:0.1;--color-activated:var(--ion-color-primary-contrast, #fff)}:host(.button-clear){--background-activated:transparent;--background-activated-opacity:0;--background-focused:var(--ion-color-primary, #0054e9);--background-hover:transparent;--background-focused-opacity:0.1;font-size:min(1.0625rem, 51px);font-weight:normal}:host(.in-buttons){font-size:clamp(17px, 1.0625rem, 21.08px);font-weight:400}:host(.button-large){--padding-top:17px;--padding-start:1em;--padding-end:1em;--padding-bottom:17px;min-height:3.1em;font-size:min(1.25rem, 60px)}:host(.button-small){--padding-top:4px;--padding-start:0.9em;--padding-end:0.9em;--padding-bottom:4px;min-height:2.1em;font-size:min(0.8125rem, 39px)}:host(.button-soft){--border-radius:6px}:host(.button-soft.button-large){--border-radius:8px}:host(.button-soft.button-small){--border-radius:4px}:host(.button-round){--border-radius:999px}:host(.button-rectangular){--border-radius:0px}:host(.button-strong){font-weight:600}:host(.button-has-icon-only){--padding-top:0;--padding-bottom:var(--padding-top);--padding-end:var(--padding-top);--padding-start:var(--padding-end);min-width:clamp(30px, 2.125em, 60px);min-height:clamp(30px, 2.125em, 60px)}::slotted(ion-icon[slot=icon-only]){font-size:clamp(15.12px, 1.125em, 43.02px)}:host(.button-small.button-has-icon-only){min-width:clamp(23px, 2.16em, 54px);min-height:clamp(23px, 2.16em, 54px)}:host(.button-small) ::slotted(ion-icon[slot=icon-only]){font-size:clamp(12.1394px, 1.308125em, 40.1856px)}:host(.button-large.button-has-icon-only){min-width:clamp(46px, 2.5em, 78px);min-height:clamp(46px, 2.5em, 78px)}:host(.button-large) ::slotted(ion-icon[slot=icon-only]){font-size:clamp(15.12px, 0.9em, 43.056px)}:host(.button-outline.ion-focused.ion-color) .button-native,:host(.button-clear.ion-focused.ion-color) .button-native{color:var(--ion-color-base)}:host(.button-outline.ion-focused.ion-color) .button-native::after,:host(.button-clear.ion-focused.ion-color) .button-native::after{background:var(--ion-color-base)}:host(.button-solid.ion-color.ion-focused) .button-native::after{background:var(--ion-color-shade)}@media (any-hover: hover){:host(.button-clear:not(.ion-activated):hover),:host(.button-outline:not(.ion-activated):hover){opacity:0.6}:host(.button-clear.ion-color:hover) .button-native,:host(.button-outline.ion-color:hover) .button-native{color:var(--ion-color-base)}:host(.button-clear.ion-color:hover) .button-native::after,:host(.button-outline.ion-color:hover) .button-native::after{background:transparent}:host(.button-solid.ion-color:hover) .button-native::after{background:var(--ion-color-tint)}:host(:hover.button-solid.in-toolbar:not(.ion-color):not(.in-toolbar-color):not(.ion-activated)) .button-native::after{background:#fff;opacity:0.1}}:host(.button-clear.ion-activated){opacity:0.4}:host(.button-outline.ion-activated.ion-color) .button-native{color:var(--ion-color-contrast)}:host(.button-outline.ion-activated.ion-color) .button-native::after{background:var(--ion-color-base)}:host(.button-solid.ion-color.ion-activated) .button-native::after{background:var(--ion-color-shade)}:host(.button-outline.ion-activated.in-toolbar:not(.ion-color):not(.in-toolbar-color)) .button-native{background:var(--ion-toolbar-color, var(--color));color:var(--ion-toolbar-background, var(--background), var(--ion-color-primary-contrast, #fff))}:host(.in-datetime){--padding-top:3px;--padding-bottom:3px;--padding-start:5px;--padding-end:5px;font-size:clamp(17px, 1.0625rem, 21.08px);font-weight:400}`;
|
|
13413
13413
|
|
|
@@ -15157,7 +15157,11 @@ class Col {
|
|
|
15157
15157
|
}; }
|
|
15158
15158
|
}
|
|
15159
15159
|
|
|
15160
|
-
const
|
|
15160
|
+
const contentIonicCss = () => `:host{--padding-top:0px;--padding-bottom:0px;--padding-start:0px;--padding-end:0px;--keyboard-offset:0px;--offset-top:0px;--offset-bottom:0px;--overflow:auto;display:block;position:relative;-ms-flex:1;flex:1;width:100%;height:100%;margin:0 !important;padding:0 !important;font-family:var(--ion-font-family, inherit);contain:size style}:host(.ion-color) .inner-scroll{background:var(--ion-color-base);color:var(--ion-color-contrast)}#background-content{right:0px;left:0px;top:calc(var(--offset-top) * -1);bottom:calc(var(--offset-bottom) * -1);position:absolute;background:var(--background)}.inner-scroll{right:0px;left:0px;top:calc(var(--offset-top) * -1);bottom:calc(var(--offset-bottom) * -1);-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:calc(var(--padding-top) + var(--offset-top));padding-bottom:calc(var(--padding-bottom) + var(--keyboard-offset) + var(--offset-bottom) + var(--internal-content-safe-area-padding-bottom, 0px));position:absolute;color:var(--color);-webkit-box-sizing:border-box;box-sizing:border-box;overflow:hidden;-ms-touch-action:pan-x pan-y pinch-zoom;touch-action:pan-x pan-y pinch-zoom}.scroll-y,.scroll-x{-webkit-overflow-scrolling:touch;z-index:0;will-change:scroll-position}.scroll-y{overflow-y:var(--overflow);overscroll-behavior-y:contain}.scroll-x{overflow-x:var(--overflow);overscroll-behavior-x:contain}.overscroll::before,.overscroll::after{position:absolute;width:1px;height:1px;content:""}.overscroll::before{bottom:-1px}.overscroll::after{top:-1px}:host(.content-sizing){display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;min-height:0;contain:none}:host(.content-sizing) .inner-scroll{position:relative;top:0;bottom:0;margin-top:calc(var(--offset-top) * -1);margin-bottom:calc(var(--offset-bottom) * -1)}.transition-effect{display:none;position:absolute;width:100%;height:100vh;opacity:0;pointer-events:none}:host(.content-ltr) .transition-effect{left:-100%;}:host(.content-rtl) .transition-effect{right:-100%;}.transition-cover{position:absolute;right:0;width:100%;height:100%;background:black;opacity:0.1}.transition-shadow{display:block;position:absolute;width:100%;height:100%;-webkit-box-shadow:inset -9px 0 9px 0 rgba(0, 0, 100, 0.03);box-shadow:inset -9px 0 9px 0 rgba(0, 0, 100, 0.03)}:host(.content-ltr) .transition-shadow{right:0;}:host(.content-rtl) .transition-shadow{left:0;-webkit-transform:scaleX(-1);transform:scaleX(-1)}::slotted([slot=fixed]){position:absolute;-webkit-transform:translateZ(0);transform:translateZ(0)}:host(.content-header-hide-scroll-partner:not(.content-fullscreen)) .inner-scroll{-webkit-transition:height 300ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 300ms cubic-bezier(0, 0, 0.2, 1);transition:height 300ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 300ms cubic-bezier(0, 0, 0.2, 1);transition:transform 300ms cubic-bezier(0, 0, 0.2, 1), height 300ms cubic-bezier(0, 0, 0.2, 1);transition:transform 300ms cubic-bezier(0, 0, 0.2, 1), height 300ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 300ms cubic-bezier(0, 0, 0.2, 1)}:host(.content-header-hide-scroll-partner:not(.content-fullscreen).content-header-hide-scroll-hidden) .inner-scroll{height:calc(100% + var(--internal-header-hide-height, 0px));-webkit-transform:translateY(calc(-1 * var(--internal-header-hide-height, 0px)));transform:translateY(calc(-1 * var(--internal-header-hide-height, 0px)));-webkit-transition:height 200ms cubic-bezier(0.4, 0, 1, 1), -webkit-transform 200ms cubic-bezier(0.4, 0, 1, 1);transition:height 200ms cubic-bezier(0.4, 0, 1, 1), -webkit-transform 200ms cubic-bezier(0.4, 0, 1, 1);transition:transform 200ms cubic-bezier(0.4, 0, 1, 1), height 200ms cubic-bezier(0.4, 0, 1, 1);transition:transform 200ms cubic-bezier(0.4, 0, 1, 1), height 200ms cubic-bezier(0.4, 0, 1, 1), -webkit-transform 200ms cubic-bezier(0.4, 0, 1, 1)}:host(.content-footer-hide-scroll-partner:not(.content-fullscreen)) .inner-scroll{-webkit-transition:height 200ms cubic-bezier(0.16, 1, 0.3, 1);transition:height 200ms cubic-bezier(0.16, 1, 0.3, 1)}:host(.content-footer-hide-scroll-partner:not(.content-fullscreen).content-footer-hide-scroll-hidden) .inner-scroll{height:calc(100% + var(--internal-footer-hide-height, 0px));-webkit-transition:height 350ms cubic-bezier(0.4, 0, 1, 1);transition:height 350ms cubic-bezier(0.4, 0, 1, 1)}:host(.content-tab-bar-hide-scroll-partner:not(.content-fullscreen)) .inner-scroll{-webkit-transition:height 200ms cubic-bezier(0.16, 1, 0.3, 1);transition:height 200ms cubic-bezier(0.16, 1, 0.3, 1)}:host(.content-tab-bar-hide-scroll-partner:not(.content-fullscreen).content-tab-bar-hide-scroll-hidden) .inner-scroll{height:calc(100% + var(--internal-tab-bar-hide-height, 0px));-webkit-transition:height 350ms cubic-bezier(0.4, 0, 1, 1);transition:height 350ms cubic-bezier(0.4, 0, 1, 1)}@media (prefers-reduced-motion: reduce){:host(.content-header-hide-scroll-partner:not(.content-fullscreen)) .inner-scroll,:host(.content-header-hide-scroll-partner:not(.content-fullscreen).content-header-hide-scroll-hidden) .inner-scroll,:host(.content-footer-hide-scroll-partner:not(.content-fullscreen)) .inner-scroll,:host(.content-footer-hide-scroll-partner:not(.content-fullscreen).content-footer-hide-scroll-hidden) .inner-scroll,:host(.content-tab-bar-hide-scroll-partner:not(.content-fullscreen)) .inner-scroll,:host(.content-tab-bar-hide-scroll-partner:not(.content-fullscreen).content-tab-bar-hide-scroll-hidden) .inner-scroll{-webkit-transition:none;transition:none}}:host{--background:var(--ion-background-color, var(--token-bg-body, var(--token-primitives-base-white, #ffffff)));--color:currentColor}`;
|
|
15161
|
+
|
|
15162
|
+
const contentIosCss = () => `:host{--padding-top:0px;--padding-bottom:0px;--padding-start:0px;--padding-end:0px;--keyboard-offset:0px;--offset-top:0px;--offset-bottom:0px;--overflow:auto;display:block;position:relative;-ms-flex:1;flex:1;width:100%;height:100%;margin:0 !important;padding:0 !important;font-family:var(--ion-font-family, inherit);contain:size style}:host(.ion-color) .inner-scroll{background:var(--ion-color-base);color:var(--ion-color-contrast)}#background-content{right:0px;left:0px;top:calc(var(--offset-top) * -1);bottom:calc(var(--offset-bottom) * -1);position:absolute;background:var(--background)}.inner-scroll{right:0px;left:0px;top:calc(var(--offset-top) * -1);bottom:calc(var(--offset-bottom) * -1);-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:calc(var(--padding-top) + var(--offset-top));padding-bottom:calc(var(--padding-bottom) + var(--keyboard-offset) + var(--offset-bottom) + var(--internal-content-safe-area-padding-bottom, 0px));position:absolute;color:var(--color);-webkit-box-sizing:border-box;box-sizing:border-box;overflow:hidden;-ms-touch-action:pan-x pan-y pinch-zoom;touch-action:pan-x pan-y pinch-zoom}.scroll-y,.scroll-x{-webkit-overflow-scrolling:touch;z-index:0;will-change:scroll-position}.scroll-y{overflow-y:var(--overflow);overscroll-behavior-y:contain}.scroll-x{overflow-x:var(--overflow);overscroll-behavior-x:contain}.overscroll::before,.overscroll::after{position:absolute;width:1px;height:1px;content:""}.overscroll::before{bottom:-1px}.overscroll::after{top:-1px}:host(.content-sizing){display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;min-height:0;contain:none}:host(.content-sizing) .inner-scroll{position:relative;top:0;bottom:0;margin-top:calc(var(--offset-top) * -1);margin-bottom:calc(var(--offset-bottom) * -1)}.transition-effect{display:none;position:absolute;width:100%;height:100vh;opacity:0;pointer-events:none}:host(.content-ltr) .transition-effect{left:-100%;}:host(.content-rtl) .transition-effect{right:-100%;}.transition-cover{position:absolute;right:0;width:100%;height:100%;background:black;opacity:0.1}.transition-shadow{display:block;position:absolute;width:100%;height:100%;-webkit-box-shadow:inset -9px 0 9px 0 rgba(0, 0, 100, 0.03);box-shadow:inset -9px 0 9px 0 rgba(0, 0, 100, 0.03)}:host(.content-ltr) .transition-shadow{right:0;}:host(.content-rtl) .transition-shadow{left:0;-webkit-transform:scaleX(-1);transform:scaleX(-1)}::slotted([slot=fixed]){position:absolute;-webkit-transform:translateZ(0);transform:translateZ(0)}:host(.content-header-hide-scroll-partner:not(.content-fullscreen)) .inner-scroll{-webkit-transition:height 300ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 300ms cubic-bezier(0, 0, 0.2, 1);transition:height 300ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 300ms cubic-bezier(0, 0, 0.2, 1);transition:transform 300ms cubic-bezier(0, 0, 0.2, 1), height 300ms cubic-bezier(0, 0, 0.2, 1);transition:transform 300ms cubic-bezier(0, 0, 0.2, 1), height 300ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 300ms cubic-bezier(0, 0, 0.2, 1)}:host(.content-header-hide-scroll-partner:not(.content-fullscreen).content-header-hide-scroll-hidden) .inner-scroll{height:calc(100% + var(--internal-header-hide-height, 0px));-webkit-transform:translateY(calc(-1 * var(--internal-header-hide-height, 0px)));transform:translateY(calc(-1 * var(--internal-header-hide-height, 0px)));-webkit-transition:height 200ms cubic-bezier(0.4, 0, 1, 1), -webkit-transform 200ms cubic-bezier(0.4, 0, 1, 1);transition:height 200ms cubic-bezier(0.4, 0, 1, 1), -webkit-transform 200ms cubic-bezier(0.4, 0, 1, 1);transition:transform 200ms cubic-bezier(0.4, 0, 1, 1), height 200ms cubic-bezier(0.4, 0, 1, 1);transition:transform 200ms cubic-bezier(0.4, 0, 1, 1), height 200ms cubic-bezier(0.4, 0, 1, 1), -webkit-transform 200ms cubic-bezier(0.4, 0, 1, 1)}:host(.content-footer-hide-scroll-partner:not(.content-fullscreen)) .inner-scroll{-webkit-transition:height 200ms cubic-bezier(0.16, 1, 0.3, 1);transition:height 200ms cubic-bezier(0.16, 1, 0.3, 1)}:host(.content-footer-hide-scroll-partner:not(.content-fullscreen).content-footer-hide-scroll-hidden) .inner-scroll{height:calc(100% + var(--internal-footer-hide-height, 0px));-webkit-transition:height 350ms cubic-bezier(0.4, 0, 1, 1);transition:height 350ms cubic-bezier(0.4, 0, 1, 1)}:host(.content-tab-bar-hide-scroll-partner:not(.content-fullscreen)) .inner-scroll{-webkit-transition:height 200ms cubic-bezier(0.16, 1, 0.3, 1);transition:height 200ms cubic-bezier(0.16, 1, 0.3, 1)}:host(.content-tab-bar-hide-scroll-partner:not(.content-fullscreen).content-tab-bar-hide-scroll-hidden) .inner-scroll{height:calc(100% + var(--internal-tab-bar-hide-height, 0px));-webkit-transition:height 350ms cubic-bezier(0.4, 0, 1, 1);transition:height 350ms cubic-bezier(0.4, 0, 1, 1)}@media (prefers-reduced-motion: reduce){:host(.content-header-hide-scroll-partner:not(.content-fullscreen)) .inner-scroll,:host(.content-header-hide-scroll-partner:not(.content-fullscreen).content-header-hide-scroll-hidden) .inner-scroll,:host(.content-footer-hide-scroll-partner:not(.content-fullscreen)) .inner-scroll,:host(.content-footer-hide-scroll-partner:not(.content-fullscreen).content-footer-hide-scroll-hidden) .inner-scroll,:host(.content-tab-bar-hide-scroll-partner:not(.content-fullscreen)) .inner-scroll,:host(.content-tab-bar-hide-scroll-partner:not(.content-fullscreen).content-tab-bar-hide-scroll-hidden) .inner-scroll{-webkit-transition:none;transition:none}}:host{--background:var(--ion-background-color, #fff);--color:var(--ion-text-color, #000)}`;
|
|
15163
|
+
|
|
15164
|
+
const contentMdCss = () => `:host{--padding-top:0px;--padding-bottom:0px;--padding-start:0px;--padding-end:0px;--keyboard-offset:0px;--offset-top:0px;--offset-bottom:0px;--overflow:auto;display:block;position:relative;-ms-flex:1;flex:1;width:100%;height:100%;margin:0 !important;padding:0 !important;font-family:var(--ion-font-family, inherit);contain:size style}:host(.ion-color) .inner-scroll{background:var(--ion-color-base);color:var(--ion-color-contrast)}#background-content{right:0px;left:0px;top:calc(var(--offset-top) * -1);bottom:calc(var(--offset-bottom) * -1);position:absolute;background:var(--background)}.inner-scroll{right:0px;left:0px;top:calc(var(--offset-top) * -1);bottom:calc(var(--offset-bottom) * -1);-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:calc(var(--padding-top) + var(--offset-top));padding-bottom:calc(var(--padding-bottom) + var(--keyboard-offset) + var(--offset-bottom) + var(--internal-content-safe-area-padding-bottom, 0px));position:absolute;color:var(--color);-webkit-box-sizing:border-box;box-sizing:border-box;overflow:hidden;-ms-touch-action:pan-x pan-y pinch-zoom;touch-action:pan-x pan-y pinch-zoom}.scroll-y,.scroll-x{-webkit-overflow-scrolling:touch;z-index:0;will-change:scroll-position}.scroll-y{overflow-y:var(--overflow);overscroll-behavior-y:contain}.scroll-x{overflow-x:var(--overflow);overscroll-behavior-x:contain}.overscroll::before,.overscroll::after{position:absolute;width:1px;height:1px;content:""}.overscroll::before{bottom:-1px}.overscroll::after{top:-1px}:host(.content-sizing){display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;min-height:0;contain:none}:host(.content-sizing) .inner-scroll{position:relative;top:0;bottom:0;margin-top:calc(var(--offset-top) * -1);margin-bottom:calc(var(--offset-bottom) * -1)}.transition-effect{display:none;position:absolute;width:100%;height:100vh;opacity:0;pointer-events:none}:host(.content-ltr) .transition-effect{left:-100%;}:host(.content-rtl) .transition-effect{right:-100%;}.transition-cover{position:absolute;right:0;width:100%;height:100%;background:black;opacity:0.1}.transition-shadow{display:block;position:absolute;width:100%;height:100%;-webkit-box-shadow:inset -9px 0 9px 0 rgba(0, 0, 100, 0.03);box-shadow:inset -9px 0 9px 0 rgba(0, 0, 100, 0.03)}:host(.content-ltr) .transition-shadow{right:0;}:host(.content-rtl) .transition-shadow{left:0;-webkit-transform:scaleX(-1);transform:scaleX(-1)}::slotted([slot=fixed]){position:absolute;-webkit-transform:translateZ(0);transform:translateZ(0)}:host(.content-header-hide-scroll-partner:not(.content-fullscreen)) .inner-scroll{-webkit-transition:height 300ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 300ms cubic-bezier(0, 0, 0.2, 1);transition:height 300ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 300ms cubic-bezier(0, 0, 0.2, 1);transition:transform 300ms cubic-bezier(0, 0, 0.2, 1), height 300ms cubic-bezier(0, 0, 0.2, 1);transition:transform 300ms cubic-bezier(0, 0, 0.2, 1), height 300ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 300ms cubic-bezier(0, 0, 0.2, 1)}:host(.content-header-hide-scroll-partner:not(.content-fullscreen).content-header-hide-scroll-hidden) .inner-scroll{height:calc(100% + var(--internal-header-hide-height, 0px));-webkit-transform:translateY(calc(-1 * var(--internal-header-hide-height, 0px)));transform:translateY(calc(-1 * var(--internal-header-hide-height, 0px)));-webkit-transition:height 200ms cubic-bezier(0.4, 0, 1, 1), -webkit-transform 200ms cubic-bezier(0.4, 0, 1, 1);transition:height 200ms cubic-bezier(0.4, 0, 1, 1), -webkit-transform 200ms cubic-bezier(0.4, 0, 1, 1);transition:transform 200ms cubic-bezier(0.4, 0, 1, 1), height 200ms cubic-bezier(0.4, 0, 1, 1);transition:transform 200ms cubic-bezier(0.4, 0, 1, 1), height 200ms cubic-bezier(0.4, 0, 1, 1), -webkit-transform 200ms cubic-bezier(0.4, 0, 1, 1)}:host(.content-footer-hide-scroll-partner:not(.content-fullscreen)) .inner-scroll{-webkit-transition:height 200ms cubic-bezier(0.16, 1, 0.3, 1);transition:height 200ms cubic-bezier(0.16, 1, 0.3, 1)}:host(.content-footer-hide-scroll-partner:not(.content-fullscreen).content-footer-hide-scroll-hidden) .inner-scroll{height:calc(100% + var(--internal-footer-hide-height, 0px));-webkit-transition:height 350ms cubic-bezier(0.4, 0, 1, 1);transition:height 350ms cubic-bezier(0.4, 0, 1, 1)}:host(.content-tab-bar-hide-scroll-partner:not(.content-fullscreen)) .inner-scroll{-webkit-transition:height 200ms cubic-bezier(0.16, 1, 0.3, 1);transition:height 200ms cubic-bezier(0.16, 1, 0.3, 1)}:host(.content-tab-bar-hide-scroll-partner:not(.content-fullscreen).content-tab-bar-hide-scroll-hidden) .inner-scroll{height:calc(100% + var(--internal-tab-bar-hide-height, 0px));-webkit-transition:height 350ms cubic-bezier(0.4, 0, 1, 1);transition:height 350ms cubic-bezier(0.4, 0, 1, 1)}@media (prefers-reduced-motion: reduce){:host(.content-header-hide-scroll-partner:not(.content-fullscreen)) .inner-scroll,:host(.content-header-hide-scroll-partner:not(.content-fullscreen).content-header-hide-scroll-hidden) .inner-scroll,:host(.content-footer-hide-scroll-partner:not(.content-fullscreen)) .inner-scroll,:host(.content-footer-hide-scroll-partner:not(.content-fullscreen).content-footer-hide-scroll-hidden) .inner-scroll,:host(.content-tab-bar-hide-scroll-partner:not(.content-fullscreen)) .inner-scroll,:host(.content-tab-bar-hide-scroll-partner:not(.content-fullscreen).content-tab-bar-hide-scroll-hidden) .inner-scroll{-webkit-transition:none;transition:none}}:host{--background:var(--ion-background-color, #fff);--color:var(--ion-text-color, #000)}`;
|
|
15161
15165
|
|
|
15162
15166
|
/**
|
|
15163
15167
|
* @virtualProp {"ios" | "md"} mode - The mode determines the platform behaviors of the component.
|
|
@@ -15584,7 +15588,7 @@ class Content {
|
|
|
15584
15588
|
const forceOverscroll = this.shouldForceOverscroll(mode);
|
|
15585
15589
|
const transitionShadow = theme === 'ios';
|
|
15586
15590
|
this.resize();
|
|
15587
|
-
return (hAsync(Host, { key: '
|
|
15591
|
+
return (hAsync(Host, { key: '6cdef99e2396f9b451240ee739800b6d4a0df9fa', role: isMainContent ? 'main' : undefined, class: createColorClasses$1(this.color, {
|
|
15588
15592
|
[theme]: true,
|
|
15589
15593
|
'content-fullscreen': this.fullscreen,
|
|
15590
15594
|
'content-sizing': this.sizeToContent,
|
|
@@ -15593,12 +15597,12 @@ class Content {
|
|
|
15593
15597
|
}), style: {
|
|
15594
15598
|
'--offset-top': `${this.cTop}px`,
|
|
15595
15599
|
'--offset-bottom': `${this.cBottom}px`,
|
|
15596
|
-
}, ...inheritedAttributes }, hAsync("div", { key: '
|
|
15600
|
+
}, ...inheritedAttributes }, hAsync("div", { key: 'bbd9b4bf3fc97404cd42bb7824fc20e031f77922', ref: (el) => (this.backgroundContentEl = el), id: "background-content", part: "background" }), fixedSlotPlacement === 'before' ? hAsync("slot", { name: "fixed" }) : null, hAsync("div", { key: '4d4747e2495645da20a0718275a77f44fdbdd82d', class: {
|
|
15597
15601
|
'inner-scroll': true,
|
|
15598
15602
|
'scroll-x': scrollX,
|
|
15599
15603
|
'scroll-y': scrollY,
|
|
15600
15604
|
overscroll: (scrollX || scrollY) && forceOverscroll,
|
|
15601
|
-
}, ref: (scrollEl) => (this.scrollEl = scrollEl), onScroll: this.scrollEvents ? (ev) => this.onScroll(ev) : undefined, part: "scroll" }, hAsync("slot", { key: '
|
|
15605
|
+
}, ref: (scrollEl) => (this.scrollEl = scrollEl), onScroll: this.scrollEvents ? (ev) => this.onScroll(ev) : undefined, part: "scroll" }, hAsync("slot", { key: 'fbafdcfd579732945a3f375fb6cc9777651f41f5' })), transitionShadow ? (hAsync("div", { class: "transition-effect" }, hAsync("div", { class: "transition-cover" }), hAsync("div", { class: "transition-shadow" }))) : null, fixedSlotPlacement === 'after' ? hAsync("slot", { name: "fixed" }) : null));
|
|
15602
15606
|
}
|
|
15603
15607
|
get el() { return getElement(this); }
|
|
15604
15608
|
static get watchers() { return {
|
|
@@ -15606,9 +15610,13 @@ class Content {
|
|
|
15606
15610
|
"fullscreenChanged": 0
|
|
15607
15611
|
}]
|
|
15608
15612
|
}; }
|
|
15609
|
-
static get style() { return
|
|
15613
|
+
static get style() { return {
|
|
15614
|
+
ionic: contentIonicCss(),
|
|
15615
|
+
ios: contentIosCss(),
|
|
15616
|
+
md: contentMdCss()
|
|
15617
|
+
}; }
|
|
15610
15618
|
static get cmpMeta() { return {
|
|
15611
|
-
"$flags$":
|
|
15619
|
+
"$flags$": 297,
|
|
15612
15620
|
"$tagName$": "ion-content",
|
|
15613
15621
|
"$members$": {
|
|
15614
15622
|
"color": [513],
|
|
@@ -17398,7 +17406,7 @@ const isDayDisabled = (refParts, minParts, maxParts, dayValues) => {
|
|
|
17398
17406
|
* Given a locale, a date, the selected date(s), and today's date,
|
|
17399
17407
|
* generate the state for a given calendar day button.
|
|
17400
17408
|
*/
|
|
17401
|
-
const getCalendarDayState = (locale, refParts, activeParts, todayParts, minParts, maxParts, dayValues
|
|
17409
|
+
const getCalendarDayState = (locale, refParts, activeParts, todayParts, minParts, maxParts, dayValues) => {
|
|
17402
17410
|
/**
|
|
17403
17411
|
* activeParts signals what day(s) are currently selected in the datetime.
|
|
17404
17412
|
* If multiple="true", this will be an array, but the logic in this util
|
|
@@ -17414,20 +17422,6 @@ const getCalendarDayState = (locale, refParts, activeParts, todayParts, minParts
|
|
|
17414
17422
|
const isActive = activePartsArray.find((parts) => isSameDay(refParts, parts)) !== undefined;
|
|
17415
17423
|
const isToday = isSameDay(refParts, todayParts);
|
|
17416
17424
|
const disabled = isDayDisabled(refParts, minParts, maxParts, dayValues);
|
|
17417
|
-
/**
|
|
17418
|
-
* Range state: determine if this day is the range start, end, or in between.
|
|
17419
|
-
*/
|
|
17420
|
-
let isRangeStart = false;
|
|
17421
|
-
let isRangeEnd = false;
|
|
17422
|
-
let isInRange = false;
|
|
17423
|
-
if (rangeParts) {
|
|
17424
|
-
const { start, end } = rangeParts;
|
|
17425
|
-
isRangeStart = isSameDay(refParts, start);
|
|
17426
|
-
if (end) {
|
|
17427
|
-
isRangeEnd = isSameDay(refParts, end);
|
|
17428
|
-
isInRange = !disabled && !isRangeStart && !isRangeEnd && isAfter(refParts, start) && isBefore(refParts, end);
|
|
17429
|
-
}
|
|
17430
|
-
}
|
|
17431
17425
|
/**
|
|
17432
17426
|
* Note that we always return one object regardless of whether activeParts
|
|
17433
17427
|
* was an array, since we pare down to one value for isActive.
|
|
@@ -17436,9 +17430,6 @@ const getCalendarDayState = (locale, refParts, activeParts, todayParts, minParts
|
|
|
17436
17430
|
disabled,
|
|
17437
17431
|
isActive,
|
|
17438
17432
|
isToday,
|
|
17439
|
-
isRangeStart,
|
|
17440
|
-
isRangeEnd,
|
|
17441
|
-
isInRange,
|
|
17442
17433
|
ariaSelected: isActive ? 'true' : null,
|
|
17443
17434
|
ariaLabel: generateDayAriaLabel(locale, isToday, refParts),
|
|
17444
17435
|
text: refParts.day != null ? getDay(locale, refParts) : null,
|
|
@@ -17561,11 +17552,11 @@ const checkForPresentationFormatMismatch = (el, presentation, formatOptions) =>
|
|
|
17561
17552
|
}
|
|
17562
17553
|
};
|
|
17563
17554
|
|
|
17564
|
-
const datetimeIonicCss = () => `:host{display:-ms-flexbox;display:flex;-ms-flex-flow:column;flex-flow:column;background:var(--background);overflow:hidden}:host(.datetime-size-fixed){width:auto;height:auto}:host(.datetime-size-cover){width:100%}:host(:not(.datetime-ready)) .datetime-year{position:absolute;pointer-events:none}:host(.datetime-ready) .datetime-year{display:none}: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}: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,::slotted([slot=buttons]),.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-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;position:relative;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;min-width:0;min-height:0;overflow:visible;z-index:0}:host .calendar-day-wrapper-in-range::before,:host .calendar-day-wrapper-range-start::before,:host .calendar-day-wrapper-range-end::before{position:absolute;top:50%;inset-inline-start:0;inset-inline-end:0;height:var(--range-track-height);-webkit-transform:translateY(-50%);transform:translateY(-50%);background:-webkit-gradient(linear, left top, left bottom, from(var(--range-background)), to(var(--range-background))), -webkit-gradient(linear, left top, left bottom, from(var(--background)), to(var(--background)));background:linear-gradient(var(--range-background), var(--range-background)), linear-gradient(var(--background), var(--background));content:"";z-index:-1}:host .calendar-day-wrapper-range-start::before{inset-inline-start:50%}:host .calendar-day-wrapper-range-end::before{inset-inline-end:50%}:host .calendar-day-wrapper-in-range:not(:nth-child(7n)):has(+.calendar-day-wrapper-in-range)::before,:host .calendar-day-wrapper-in-range:not(:nth-child(7n)):has(+.calendar-day-wrapper-range-end)::before,:host .calendar-day-wrapper-range-start:not(:nth-child(7n)):has(+.calendar-day-wrapper-in-range)::before,:host .calendar-day-wrapper-range-start:not(:nth-child(7n)):has(+.calendar-day-wrapper-range-end)::before{inset-inline-end:-1px}:host .calendar-day-wrapper-in-range:nth-child(7n)::before,:host .calendar-day-wrapper-range-start:nth-child(7n)::before{inset-inline-end:calc(var(--range-track-edge-overflow, 0px) * -1)}:host .calendar-day-wrapper-in-range:nth-child(7n+1)::before,:host .calendar-day-wrapper-range-end:nth-child(7n+1)::before{inset-inline-start:calc(var(--range-track-edge-overflow, 0px) * -1)}:host .calendar-day-wrapper-range-start.calendar-day-wrapper-range-end::before{display:none}:host(.datetime-disabled.datetime-range) .calendar-month-grid{opacity:0.4}:host(.datetime-disabled.datetime-range) .calendar-month-grid .calendar-day[disabled]{opacity:1}.calendar-day{-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;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;z-index:0}.calendar-day[disabled]{pointer-events:none}:host .datetime-time{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between}:host .time-header{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host .time-body{display:-ms-flexbox;display:flex;border:none;font-family:inherit;font-size:inherit;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none}:host(.in-item){position:static}.calendar-month-year{min-width:0}.calendar-month-year-toggle{color:inherit;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-align:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;white-space:inherit;position:relative;border:0;outline:none;background:transparent;cursor:pointer;z-index:1}.calendar-month-year-toggle ion-icon{-ms-flex-negative:0;flex-shrink:0}.calendar-month-year-toggle #toggle-wrapper{display:-ms-inline-flexbox;display:inline-flex;-ms-flex-align:center;align-items:center}:host{--background:var(--token-bg-surface-default, var(--token-primitives-base-white, #ffffff));--focus-ring-color:var(--token-border-focus-default, var(--token-semantics-primary-400, var(--token-primitives-blue-400, #b5c0f7)));--focus-ring-width:var(--token-border-size-050, var(--token-scale-050, 2px));--body-opacity:0;--year-opacity:0}:host .calendar-body{opacity:var(--body-opacity)}:host .datetime-year{opacity:var(--year-opacity)}:host(.datetime-ready) .calendar-body{--body-opacity:1}:host(.datetime-ready) .datetime-year{--year-opacity:1}:host .datetime-header{-webkit-padding-start:var(--token-space-400, var(--token-scale-400, 16px));padding-inline-start:var(--token-space-400, var(--token-scale-400, 16px));-webkit-padding-end:var(--token-space-400, var(--token-scale-400, 16px));padding-inline-end:var(--token-space-400, var(--token-scale-400, 16px));padding-top:var(--token-space-200, var(--token-scale-200, 8px));padding-bottom:var(--token-space-400, var(--token-scale-400, 16px));display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:start;align-items:start;-ms-flex-pack:justify;justify-content:space-between;height:var(--token-scale-1400, 56px);margin-bottom:var(--token-space-200, var(--token-scale-200, 8px));border-bottom:solid var(--token-border-size-025, var(--token-scale-025, 1px)) var(--token-primitives-neutral-400, #d0d7df)}:host .datetime-header .datetime-title{font-family:var(--token-font-family, -apple-system, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");font-size:var(--token-font-size-450, 1.125rem);font-weight:var(--token-font-weight-medium, 500);letter-spacing:var(--token-font-letter-spacing-0, 0);line-height:1.555556;color:var(--token-primitives-neutral-800, #6c727a)}:host .datetime-header .datetime-selected-date{font-family:var(--token-font-family, -apple-system, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");font-size:var(--token-font-size-350, 0.875rem);font-weight:var(--token-font-weight-regular, 400);letter-spacing:var(--token-font-letter-spacing-0, 0);line-height:1.714286;color:var(--token-primitives-neutral-1000, #383e45)}.calendar-action-buttons{padding-top:var(--token-space-200, var(--token-scale-200, 8px));padding-bottom:var(--token-space-200, var(--token-scale-200, 8px));-ms-flex-align:center;align-items:center;height:var(--token-scale-1400, 56px);-webkit-box-sizing:border-box;box-sizing:border-box}.calendar-month-year{-ms-flex:1 0 0px;flex:1 0 0}.calendar-month-year-toggle{border-radius:var(--token-border-radius-full, 999px);font-family:var(--token-font-family, -apple-system, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");font-size:var(--token-font-size-400, 1rem);font-weight:var(--token-font-weight-medium, 500);letter-spacing:var(--token-font-letter-spacing-100, 0.01em);line-height:1.5;-webkit-padding-start:var(--token-space-400, var(--token-scale-400, 16px));padding-inline-start:var(--token-space-400, var(--token-scale-400, 16px));-webkit-padding-end:var(--token-space-400, var(--token-scale-400, 16px));padding-inline-end:var(--token-space-400, var(--token-scale-400, 16px));padding-top:var(--token-space-200, var(--token-scale-200, 8px));padding-bottom:var(--token-space-200, var(--token-scale-200, 8px));min-width:var(--token-scale-1600, 64px);min-height:var(--token-scale-1000, 40px);border:var(--focus-ring-width) solid transparent;color:var(--token-semantics-primary-base, var(--token-semantics-primary-700, var(--token-primitives-blue-700, #105cef)))}@media (any-hover: hover){.calendar-month-year-toggle:hover{background:var(--token-primitives-neutral-200, #ebeef2)}}.calendar-month-year-toggle.ion-focused{border-color:var(--focus-ring-color)}.calendar-month-year-toggle.ion-activated{background:var(--token-primitives-neutral-200, #ebeef2)}.calendar-next-prev ion-button.button-has-icon-only{--color:var(--token-primitives-neutral-1000, #383e45);--background-activated:var(--token-primitives-neutral-200, #ebeef2);--background-hover:var(--token-primitives-neutral-200, #ebeef2);--background-hover-opacity:1;min-height:var(--token-scale-1000, 40px)}.calendar-next-prev ion-button.button-has-icon-only.ion-focused::part(native){border:var(--token-border-size-050, var(--token-scale-050, 2px)) solid var(--token-border-focus-default, var(--token-semantics-primary-400, var(--token-primitives-blue-400, #b5c0f7)));outline:none}.calendar-days-of-week{font-family:var(--token-font-family, -apple-system, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");font-size:var(--token-font-size-300, 0.75rem);font-weight:var(--token-font-weight-medium, 500);letter-spacing:var(--token-font-letter-spacing-150, 0.015em);line-height:1.666667;text-transform:uppercase;-ms-flex-line-pack:center;align-content:center;height:var(--token-scale-1200, 48px);color:var(--token-primitives-neutral-800, #6c727a)}.calendar-day{border-radius:var(--token-border-radius-full, 999px);-webkit-padding-start:var(--token-space-100, var(--token-scale-100, 4px));padding-inline-start:var(--token-space-100, var(--token-scale-100, 4px));-webkit-padding-end:var(--token-space-100, var(--token-scale-100, 4px));padding-inline-end:var(--token-space-100, var(--token-scale-100, 4px));padding-top:var(--token-space-100, var(--token-scale-100, 4px));padding-bottom:var(--token-space-100, var(--token-scale-100, 4px));font-family:var(--token-font-family, -apple-system, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");font-size:var(--token-font-size-350, 0.875rem);font-weight:var(--token-font-weight-medium, 500);letter-spacing:var(--token-font-letter-spacing-100, 0.01em);line-height:1.428571;width:var(--token-scale-1200, 48px);min-width:var(--token-scale-1200, 48px);height:var(--token-scale-1200, 48px);color:var(--token-text-default, var(--token-primitives-neutral-1200, #242528))}.calendar-day[disabled]:not(.calendar-day-constrained){color:var(--token-text-disabled, var(--token-primitives-neutral-500, #9fa5ad))}.calendar-day.calendar-day-today{color:var(--token-text-select, var(--token-semantics-primary-700, var(--token-primitives-blue-700, #105cef)))}.calendar-day.calendar-day-active,.calendar-day.calendar-day-active.calendar-day-adjacent-day{background:var(--token-bg-primary-subtle-default, var(--token-semantics-primary-100, var(--token-primitives-blue-100, #f0f2ff)))}.calendar-day:focus-visible{border:var(--focus-ring-width) solid var(--focus-ring-color)}@media (any-hover: hover){.calendar-day:not([disabled]):not(:active):not(.calendar-day-in-range):hover{background:var(--token-semantics-primary-200, var(--token-primitives-blue-200, #e4e8ff))}}.calendar-day:active,.calendar-day.calendar-day-adjacent-day:active{background:var(--token-bg-primary-subtle-press, var(--token-semantics-primary-300, var(--token-primitives-blue-300, #d0d7fa)))}.calendar-day.calendar-day-adjacent-day{color:var(--token-text-subtlest, var(--token-primitives-neutral-800, #6c727a))}.calendar-day.calendar-day-active.calendar-day-adjacent-day{color:var(--token-text-default, var(--token-primitives-neutral-1200, #242528))}:host{--range-background:var(--token-bg-primary-subtle-default, var(--token-semantics-primary-100, var(--token-primitives-blue-100, #f0f2ff)));--range-track-height:var(--token-scale-1200, 48px)}:host .calendar-day.calendar-day-range-start,:host .calendar-day.calendar-day-range-end{border-radius:var(--token-border-radius-full, 999px);background:var(--token-bg-primary-base-default, var(--token-semantics-primary-base, var(--token-semantics-primary-700, var(--token-primitives-blue-700, #105cef))));color:var(--token-text-inverse, var(--token-primitives-base-white, #ffffff))}.calendar-day.calendar-day-in-range{border-radius:0;background:none;color:var(--token-text-default, var(--token-primitives-neutral-1200, #242528))}.calendar-day.calendar-day-today.calendar-day-in-range{color:var(--token-text-select, var(--token-semantics-primary-700, var(--token-primitives-blue-700, #105cef)))}:host .calendar-day.calendar-day-today.calendar-day-range-start,:host .calendar-day.calendar-day-today.calendar-day-range-end{color:var(--token-text-inverse, var(--token-primitives-base-white, #ffffff))}@media (any-hover: hover){.calendar-day.calendar-day-range-start:not([disabled]):not(:active):hover,.calendar-day.calendar-day-range-end:not([disabled]):not(:active):hover{background:var(--token-bg-primary-base-press, var(--token-semantics-primary-900, var(--token-primitives-blue-900, #0d4bc3)))}}.calendar-day.calendar-day-range-start:active,.calendar-day.calendar-day-range-end:active{background:var(--token-bg-primary-base-press, var(--token-semantics-primary-900, var(--token-primitives-blue-900, #0d4bc3)))}.calendar-day.calendar-day-in-range:active{background:var(--token-bg-primary-subtle-press, var(--token-semantics-primary-300, var(--token-primitives-blue-300, #d0d7fa)))}:host(.datetime-disabled.datetime-range) .calendar-day[disabled]:not(.calendar-day-constrained){color:var(--token-text-default, var(--token-primitives-neutral-1200, #242528))}:host(.datetime-disabled.datetime-range) .calendar-day.calendar-day-adjacent-day[disabled]{color:var(--token-text-subtlest, var(--token-primitives-neutral-800, #6c727a))}:host(.datetime-disabled.datetime-range) .calendar-day.calendar-day-today[disabled]{color:var(--token-text-select, var(--token-semantics-primary-700, var(--token-primitives-blue-700, #105cef)))}:host(.datetime-disabled.datetime-range) .calendar-day.calendar-day-range-start[disabled],:host(.datetime-disabled.datetime-range) .calendar-day.calendar-day-range-end[disabled]{color:var(--token-text-inverse, var(--token-primitives-base-white, #ffffff))}:host(.datetime-readonly) .calendar-day.calendar-day-range-start[disabled],:host(.datetime-readonly) .calendar-day.calendar-day-range-end[disabled]{color:var(--token-text-inverse, var(--token-primitives-base-white, #ffffff))}:host(.datetime-readonly) .calendar-day.calendar-day-in-range[disabled]{color:var(--token-text-default, var(--token-primitives-neutral-1200, #242528))}:host(.datetime-readonly) .calendar-day.calendar-day-today.calendar-day-in-range[disabled]{color:var(--token-text-select, var(--token-semantics-primary-700, var(--token-primitives-blue-700, #105cef)))}:host(.datetime-readonly) .calendar-day.calendar-day-today.calendar-day-range-start[disabled],:host(.datetime-readonly) .calendar-day.calendar-day-today.calendar-day-range-end[disabled]{color:var(--token-text-inverse, var(--token-primitives-base-white, #ffffff))}:host .datetime-time{-webkit-padding-start:var(--token-space-400, var(--token-scale-400, 16px));padding-inline-start:var(--token-space-400, var(--token-scale-400, 16px));-webkit-padding-end:var(--token-space-400, var(--token-scale-400, 16px));padding-inline-end:var(--token-space-400, var(--token-scale-400, 16px));padding-top:var(--token-space-100, var(--token-scale-100, 4px));padding-bottom:var(--token-space-100, var(--token-scale-100, 4px))}:host .datetime-time .time-header{font-family:var(--token-font-family, -apple-system, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");font-size:var(--token-font-size-400, 1rem);font-weight:var(--token-font-weight-medium, 500);letter-spacing:var(--token-font-letter-spacing-100, 0.01em);line-height:1.5;color:var(--token-primitives-neutral-800, #6c727a)}:host .datetime-time button{-webkit-padding-start:var(--token-space-200, var(--token-scale-200, 8px));padding-inline-start:var(--token-space-200, var(--token-scale-200, 8px));-webkit-padding-end:var(--token-space-200, var(--token-scale-200, 8px));padding-inline-end:var(--token-space-200, var(--token-scale-200, 8px));padding-top:var(--token-space-0, var(--token-scale-0, 0px));padding-bottom:var(--token-space-0, var(--token-scale-0, 0px));font-family:var(--token-font-family, -apple-system, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");font-size:var(--token-font-size-350, 0.875rem);font-weight:var(--token-font-weight-medium, 500);letter-spacing:var(--token-font-letter-spacing-0, 0);line-height:1.714286;border-radius:var(--token-border-radius-full, 999px);display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;height:var(--token-scale-800, 32px);background-color:var(--token-primitives-neutral-100, #f6f7fa);color:var(--token-text-default, var(--token-primitives-neutral-1200, #242528))}:host .datetime-footer{padding-left:0;padding-right:0;padding-top:var(--token-space-200, var(--token-scale-200, 8px));padding-bottom:0;margin-left:0;margin-right:0;margin-top:var(--token-space-200, var(--token-scale-200, 8px));margin-bottom:0;border-left:0;border-right:0;border-top:solid var(--token-border-size-025, var(--token-scale-025, 1px)) var(--token-primitives-neutral-400, #d0d7df);border-bottom:0}:host .datetime-buttons .datetime-action-buttons,.datetime-action-buttons .datetime-action-buttons-container,::slotted([slot=buttons]){-ms-flex-flow:column;flex-flow:column;-ms-flex-align:stretch;align-items:stretch;gap:var(--token-space-200, var(--token-scale-200, 8px))}`;
|
|
17555
|
+
const datetimeIonicCss = () => `:host{display:-ms-flexbox;display:flex;-ms-flex-flow:column;flex-flow:column;background:var(--background);overflow:hidden}:host(.datetime-size-fixed){width:auto;height:auto}:host(.datetime-size-cover){width:100%}:host(:not(.datetime-ready)) .datetime-year{position:absolute;pointer-events:none}:host(.datetime-ready) .datetime-year{display:none}: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}: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,::slotted([slot=buttons]),.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-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{-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;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;z-index:0}.calendar-day[disabled]{pointer-events:none}:host .datetime-time{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between}:host .time-header{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host .time-body{display:-ms-flexbox;display:flex;border:none;font-family:inherit;font-size:inherit;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none}:host(.in-item){position:static}.calendar-month-year{min-width:0}.calendar-month-year-toggle{color:inherit;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-align:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;white-space:inherit;position:relative;border:0;outline:none;background:transparent;cursor:pointer;z-index:1}.calendar-month-year-toggle ion-icon{-ms-flex-negative:0;flex-shrink:0}.calendar-month-year-toggle #toggle-wrapper{display:-ms-inline-flexbox;display:inline-flex;-ms-flex-align:center;align-items:center}:host{--background:var(--token-bg-surface-default, var(--token-primitives-base-white, #ffffff));--focus-ring-color:var(--token-border-focus-default, var(--token-semantics-primary-400, var(--token-primitives-blue-400, #b5c0f7)));--focus-ring-width:var(--token-border-radius-025, var(--token-scale-050, 2px));--body-opacity:0;--year-opacity:0}:host .calendar-body{opacity:var(--body-opacity)}:host .datetime-year{opacity:var(--year-opacity)}:host(.datetime-ready) .calendar-body{--body-opacity:1}:host(.datetime-ready) .datetime-year{--year-opacity:1}:host .datetime-header{-webkit-padding-start:var(--token-space-400, var(--token-scale-400, 16px));padding-inline-start:var(--token-space-400, var(--token-scale-400, 16px));-webkit-padding-end:var(--token-space-400, var(--token-scale-400, 16px));padding-inline-end:var(--token-space-400, var(--token-scale-400, 16px));padding-top:var(--token-space-200, var(--token-scale-200, 8px));padding-bottom:var(--token-space-400, var(--token-scale-400, 16px));display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:start;align-items:start;-ms-flex-pack:justify;justify-content:space-between;height:var(--token-scale-1400, 56px);margin-bottom:var(--token-space-200, var(--token-scale-200, 8px));border-bottom:solid var(--token-border-size-025, var(--token-scale-025, 1px)) var(--token-primitives-neutral-400, #d0d7df)}:host .datetime-header .datetime-title{font-family:var(--token-font-family, -apple-system, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");font-size:var(--token-font-size-450, 1.125rem);font-weight:var(--token-font-weight-medium, 500);letter-spacing:var(--token-font-letter-spacing-0, 0);line-height:1.555556;color:var(--token-primitives-neutral-800, #6c727a)}:host .datetime-header .datetime-selected-date{font-family:var(--token-font-family, -apple-system, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");font-size:var(--token-font-size-350, 0.875rem);font-weight:var(--token-font-weight-regular, 400);letter-spacing:var(--token-font-letter-spacing-0, 0);line-height:1.714286;color:var(--token-primitives-neutral-1000, #383e45)}.calendar-action-buttons{padding-top:var(--token-space-200, var(--token-scale-200, 8px));padding-bottom:var(--token-space-200, var(--token-scale-200, 8px));-ms-flex-align:center;align-items:center;height:var(--token-scale-1400, 56px);-webkit-box-sizing:border-box;box-sizing:border-box}.calendar-month-year{-ms-flex:1 0 0px;flex:1 0 0}.calendar-month-year-toggle{border-radius:var(--token-border-radius-full, 999px);font-family:var(--token-font-family, -apple-system, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");font-size:var(--token-font-size-400, 1rem);font-weight:var(--token-font-weight-medium, 500);letter-spacing:var(--token-font-letter-spacing-100, 0.01em);line-height:1.5;-webkit-padding-start:var(--token-space-400, var(--token-scale-400, 16px));padding-inline-start:var(--token-space-400, var(--token-scale-400, 16px));-webkit-padding-end:var(--token-space-400, var(--token-scale-400, 16px));padding-inline-end:var(--token-space-400, var(--token-scale-400, 16px));padding-top:var(--token-space-200, var(--token-scale-200, 8px));padding-bottom:var(--token-space-200, var(--token-scale-200, 8px));min-width:var(--token-scale-1600, 64px);min-height:var(--token-scale-1000, 40px);border:var(--focus-ring-width) solid transparent;color:var(--token-semantics-primary-base, var(--token-semantics-primary-700, var(--token-primitives-blue-700, #105cef)))}@media (any-hover: hover){.calendar-month-year-toggle:hover{background:var(--token-primitives-neutral-200, #ebeef2)}}.calendar-month-year-toggle.ion-focused{border-color:var(--focus-ring-color)}.calendar-month-year-toggle.ion-activated{background:var(--token-primitives-neutral-200, #ebeef2)}.calendar-next-prev ion-button.button-has-icon-only{--color:var(--token-primitives-neutral-1000, #383e45);--background-activated:var(--token-primitives-neutral-200, #ebeef2);--background-hover:var(--token-primitives-neutral-200, #ebeef2);--background-hover-opacity:1;min-height:var(--token-scale-1000, 40px)}.calendar-next-prev ion-button.button-has-icon-only.ion-focused::part(native){border:var(--token-border-size-050, var(--token-scale-050, 2px)) solid var(--token-border-focus-default, var(--token-semantics-primary-400, var(--token-primitives-blue-400, #b5c0f7)));outline:none}.calendar-days-of-week{font-family:var(--token-font-family, -apple-system, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");font-size:var(--token-font-size-300, 0.75rem);font-weight:var(--token-font-weight-medium, 500);letter-spacing:var(--token-font-letter-spacing-150, 0.015em);line-height:1.666667;text-transform:uppercase;-ms-flex-line-pack:center;align-content:center;height:var(--token-scale-1200, 48px);color:var(--token-primitives-neutral-800, #6c727a)}.calendar-day{border-radius:var(--token-border-radius-full, 999px);-webkit-padding-start:var(--token-space-100, var(--token-scale-100, 4px));padding-inline-start:var(--token-space-100, var(--token-scale-100, 4px));-webkit-padding-end:var(--token-space-100, var(--token-scale-100, 4px));padding-inline-end:var(--token-space-100, var(--token-scale-100, 4px));padding-top:var(--token-space-100, var(--token-scale-100, 4px));padding-bottom:var(--token-space-100, var(--token-scale-100, 4px));font-family:var(--token-font-family, -apple-system, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");font-size:var(--token-font-size-350, 0.875rem);font-weight:var(--token-font-weight-medium, 500);letter-spacing:var(--token-font-letter-spacing-100, 0.01em);line-height:1.428571;width:var(--token-scale-1200, 48px);min-width:var(--token-scale-1200, 48px);height:var(--token-scale-1200, 48px);color:var(--token-text-default, var(--token-primitives-neutral-1200, #242528))}.calendar-day[disabled]:not(.calendar-day-constrained){color:var(--token-primitives-neutral-500, #9fa5ad)}.calendar-day.calendar-day-today{color:var(--token-semantics-primary-base, var(--token-semantics-primary-700, var(--token-primitives-blue-700, #105cef)))}.calendar-day.calendar-day-active,.calendar-day.calendar-day-active.calendar-day-adjacent-day{background:var(--token-semantics-primary-100, var(--token-primitives-blue-100, #f0f2ff))}.calendar-day:focus-visible{border:var(--focus-ring-width) solid var(--focus-ring-color)}@media (any-hover: hover){.calendar-day:not([disabled]):not(:active):hover{background:var(--token-semantics-primary-200, var(--token-primitives-blue-200, #e4e8ff))}}.calendar-day:active,.calendar-day.calendar-day-adjacent-day:active{background:var(--token-bg-primary-subtle-press, var(--token-semantics-primary-300, var(--token-primitives-blue-300, #d0d7fa)))}.calendar-day.calendar-day-adjacent-day{color:var(--token-text-subtlest, var(--token-primitives-neutral-800, #6c727a))}.calendar-day.calendar-day-active.calendar-day-adjacent-day{color:var(--token-text-default, var(--token-primitives-neutral-1200, #242528))}:host .datetime-time{-webkit-padding-start:var(--token-space-400, var(--token-scale-400, 16px));padding-inline-start:var(--token-space-400, var(--token-scale-400, 16px));-webkit-padding-end:var(--token-space-400, var(--token-scale-400, 16px));padding-inline-end:var(--token-space-400, var(--token-scale-400, 16px));padding-top:var(--token-space-100, var(--token-scale-100, 4px));padding-bottom:var(--token-space-100, var(--token-scale-100, 4px))}:host .datetime-time .time-header{font-family:var(--token-font-family, -apple-system, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");font-size:var(--token-font-size-400, 1rem);font-weight:var(--token-font-weight-medium, 500);letter-spacing:var(--token-font-letter-spacing-100, 0.01em);line-height:1.5;color:var(--token-primitives-neutral-800, #6c727a)}:host .datetime-time button{-webkit-padding-start:var(--token-space-200, var(--token-scale-200, 8px));padding-inline-start:var(--token-space-200, var(--token-scale-200, 8px));-webkit-padding-end:var(--token-space-200, var(--token-scale-200, 8px));padding-inline-end:var(--token-space-200, var(--token-scale-200, 8px));padding-top:var(--token-space-0, var(--token-scale-0, 0px));padding-bottom:var(--token-space-0, var(--token-scale-0, 0px));font-family:var(--token-font-family, -apple-system, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");font-size:var(--token-font-size-350, 0.875rem);font-weight:var(--token-font-weight-medium, 500);letter-spacing:var(--token-font-letter-spacing-0, 0);line-height:1.714286;border-radius:var(--token-border-radius-full, 999px);display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;height:var(--token-scale-800, 32px);background-color:var(--token-primitives-neutral-100, #f6f7fa);color:var(--token-text-default, var(--token-primitives-neutral-1200, #242528))}:host .datetime-footer{padding-left:0;padding-right:0;padding-top:var(--token-space-200, var(--token-scale-200, 8px));padding-bottom:0;margin-left:0;margin-right:0;margin-top:var(--token-space-200, var(--token-scale-200, 8px));margin-bottom:0;border-left:0;border-right:0;border-top:solid var(--token-border-size-025, var(--token-scale-025, 1px)) var(--token-primitives-neutral-400, #d0d7df);border-bottom:0}:host .datetime-buttons .datetime-action-buttons,.datetime-action-buttons .datetime-action-buttons-container,::slotted([slot=buttons]){-ms-flex-flow:column;flex-flow:column;-ms-flex-align:stretch;align-items:stretch;gap:var(--token-space-200, var(--token-scale-200, 8px))}`;
|
|
17565
17556
|
|
|
17566
|
-
const datetimeIosCss = () => `:host{display:-ms-flexbox;display:flex;-ms-flex-flow:column;flex-flow:column;background:var(--background);overflow:hidden}:host(.datetime-size-fixed){width:auto;height:auto}:host(.datetime-size-cover){width:100%}:host(:not(.datetime-ready)) .datetime-year{position:absolute;pointer-events:none}:host(.datetime-ready) .datetime-year{display:none}: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}: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,::slotted([slot=buttons]),.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-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;position:relative;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;min-width:0;min-height:0;overflow:visible;z-index:0}:host .calendar-day-wrapper-in-range::before,:host .calendar-day-wrapper-range-start::before,:host .calendar-day-wrapper-range-end::before{position:absolute;top:50%;inset-inline-start:0;inset-inline-end:0;height:var(--range-track-height);-webkit-transform:translateY(-50%);transform:translateY(-50%);background:-webkit-gradient(linear, left top, left bottom, from(var(--range-background)), to(var(--range-background))), -webkit-gradient(linear, left top, left bottom, from(var(--background)), to(var(--background)));background:linear-gradient(var(--range-background), var(--range-background)), linear-gradient(var(--background), var(--background));content:"";z-index:-1}:host .calendar-day-wrapper-range-start::before{inset-inline-start:50%}:host .calendar-day-wrapper-range-end::before{inset-inline-end:50%}:host .calendar-day-wrapper-in-range:not(:nth-child(7n)):has(+.calendar-day-wrapper-in-range)::before,:host .calendar-day-wrapper-in-range:not(:nth-child(7n)):has(+.calendar-day-wrapper-range-end)::before,:host .calendar-day-wrapper-range-start:not(:nth-child(7n)):has(+.calendar-day-wrapper-in-range)::before,:host .calendar-day-wrapper-range-start:not(:nth-child(7n)):has(+.calendar-day-wrapper-range-end)::before{inset-inline-end:-1px}:host .calendar-day-wrapper-in-range:nth-child(7n)::before,:host .calendar-day-wrapper-range-start:nth-child(7n)::before{inset-inline-end:calc(var(--range-track-edge-overflow, 0px) * -1)}:host .calendar-day-wrapper-in-range:nth-child(7n+1)::before,:host .calendar-day-wrapper-range-end:nth-child(7n+1)::before{inset-inline-start:calc(var(--range-track-edge-overflow, 0px) * -1)}:host .calendar-day-wrapper-range-start.calendar-day-wrapper-range-end::before{display:none}:host(.datetime-disabled.datetime-range) .calendar-month-grid{opacity:0.4}:host(.datetime-disabled.datetime-range) .calendar-month-grid .calendar-day[disabled]{opacity:1}.calendar-day{-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;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;z-index:0}.calendar-day[disabled]{pointer-events:none}:host .datetime-time{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between}:host .time-header{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host .time-body{display:-ms-flexbox;display:flex;border:none;font-family:inherit;font-size:inherit;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none}:host(.in-item){position:static}.calendar-month-year{min-width:0}.calendar-month-year-toggle{color:inherit;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-align:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;white-space:inherit;position:relative;border:0;outline:none;background:transparent;cursor:pointer;z-index:1}.calendar-month-year-toggle ion-icon{-ms-flex-negative:0;flex-shrink:0}.calendar-month-year-toggle #toggle-wrapper{display:-ms-inline-flexbox;display:inline-flex;-ms-flex-align:center;align-items:center}:host{}:host(.datetime-size-fixed:not(.datetime-prefer-wheel)){max-width:350px}:host .calendar-body,:host .datetime-year{opacity:0}:host(.datetime-ready) .calendar-body,:host(.datetime-ready) .datetime-year{opacity:1}: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 .calendar-action-buttons ion-button{--background:transparent}.calendar-day{border-radius:50%;font-family:var(--ion-font-family, inherit)}:host .calendar-day[disabled]{opacity:0.4}.calendar-day:not(.calendar-day-adjacent-day):focus{background:rgba(var(--ion-color-primary-rgb, 0, 84, 233), 0.2);-webkit-box-shadow:0px 0px 0px 4px rgba(var(--ion-color-primary-rgb, 0, 84, 233), 0.2);box-shadow:0px 0px 0px 4px rgba(var(--ion-color-primary-rgb, 0, 84, 233), 0.2)}:host(.ion-color) .calendar-day:not(.calendar-day-adjacent-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 .calendar-next-prev{display:-ms-flexbox;display:flex;-ms-flex-align:start;align-items:start}.calendar-next-prev ion-button ion-icon[slot=icon-only]{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}: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-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;background:var(--ion-color-step-300, var(--ion-background-color-step-300, #edeef0));color:var(--ion-text-color, #000)}:host .time-body-active{color:var(--ion-color-primary, #0054e9)}:host(.ion-color) .time-body-active{color:var(--ion-color-base)}:host(.show-month-and-year) .calendar-action-buttons .calendar-month-year-toggle{color:var(--ion-color-primary, #0054e9)}:host(.ion-color.show-month-and-year) .calendar-action-buttons .calendar-month-year-toggle{color:var(--ion-color-base)}:host .datetime-action-buttons ion-button{--color:var(--ion-color-primary, #0054e9)}.calendar-month-year-toggle::after{right:0;left:0;top:0;bottom:0;position:absolute;content:"";opacity:0;-webkit-transition:opacity 15ms linear, background-color 15ms linear;transition:opacity 15ms linear, background-color 15ms linear;z-index:-1}.calendar-month-year-toggle.ion-focused::after{background:currentColor}.calendar-month-year-toggle:disabled{opacity:0.3;pointer-events:none}.calendar-month-year-toggle ion-icon{-webkit-padding-start:4px;padding-inline-start:4px;-webkit-padding-end:0;padding-inline-end:0;padding-top:0;padding-bottom:0}ion-picker{--highlight-background:var(--wheel-highlight-background);--highlight-border-radius:var(--wheel-highlight-border-radius);--fade-background-rgb:var(--wheel-fade-background-rgb)}:host .datetime-action-buttons{-ms-flex-pack:justify;justify-content:space-between}:host{--background:var(--ion-color-light, #f4f5f8);--background-rgb:var(--ion-color-light-rgb, 244, 245, 248);--title-color:var(--ion-color-step-600, var(--ion-text-color-step-400, #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, var(--ion-background-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}.calendar-month-year-toggle{-webkit-padding-start:16px;padding-inline-start:16px;-webkit-padding-end:16px;padding-inline-end:16px;padding-top:0px;padding-bottom:0px;min-height:44px;font-size:min(1rem, 25.6px);font-weight:600}.calendar-month-year-toggle.ion-focused::after{opacity:0.15}.calendar-month-year-toggle #toggle-wrapper{-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:8px;margin-inline-end:8px;margin-top:10px;margin-bottom:10px}:host .calendar-action-buttons .calendar-month-year-toggle ion-icon,:host .calendar-action-buttons ion-button{color:var(--ion-color-primary, #0054e9)}:host(.ion-color) .calendar-action-buttons .calendar-month-year-toggle ion-icon,:host(.ion-color) .calendar-action-buttons ion-button{color:var(--ion-color-base)}:host .calendar-action-buttons ion-button{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}:host .calendar-action-buttons .calendar-next-prev{-ms-flex-align:stretch;align-items:stretch}.calendar-next-prev ion-button{--padding-top:0;--padding-bottom:0;--padding-start:5px;--padding-end:5px;-webkit-margin-start:2px;margin-inline-start:2px;-webkit-margin-end:2px;margin-inline-end:2px;min-height:32px}.calendar-next-prev ion-button ion-icon[slot=icon-only]{font-size:1.65em;line-height:0.67}: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, var(--ion-text-color-step-700, #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-primary-rgb, 0, 84, 233), 0.12);font-size:min(1.375rem, 35.2px)}:host(.ion-color) .calendar-day.calendar-day-active{background:rgba(var(--ion-color-base-rgb), 0.12)}:host .calendar-day.calendar-day-today{color:var(--ion-color-primary, #0054e9)}:host(.ion-color) .calendar-day.calendar-day-today{color:var(--ion-color-base)}:host .calendar-day.calendar-day-active,:host .calendar-day.calendar-day-adjacent-day.calendar-day-active{color:var(--ion-color-primary, #0054e9);font-weight:600}:host(.ion-color) .calendar-day.calendar-day-active,:host(.ion-color) .calendar-day.calendar-day-adjacent-day.calendar-day-active{color:var(--ion-color-base)}:host .calendar-day.calendar-day-today.calendar-day-active{background:var(--ion-color-primary, #0054e9);color:var(--ion-color-primary-contrast, #fff)}:host(.ion-color) .calendar-day.calendar-day-today.calendar-day-active{background:var(--ion-color-base);color:var(--ion-color-contrast)}:host .calendar-day.calendar-day-adjacent-day{color:var(--ion-color-step-300, var(--ion-text-color-step-700, #b3b3b3))}:host{--range-background:rgba(var(--ion-color-primary-rgb, 0, 84, 233), 0.12);--range-track-height:40px;--range-track-edge-overflow:8px}:host(.ion-color){--range-background:rgba(var(--ion-color-base-rgb), 0.12)}:host(.datetime-range) .calendar-day-wrapper{height:auto}:host .calendar-day.calendar-day-range-start,:host .calendar-day.calendar-day-range-end{border-radius:50%;background:var(--ion-color-primary, #0054e9);color:var(--ion-color-primary-contrast, #fff);font-weight:600}:host(.ion-color) .calendar-day.calendar-day-range-start,:host(.ion-color) .calendar-day.calendar-day-range-end{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, var(--ion-background-color-step-200, #cccccc))}:host .datetime-buttons,::slotted([slot=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,::slotted([slot=buttons]){width:100%}`;
|
|
17557
|
+
const datetimeIosCss = () => `:host{display:-ms-flexbox;display:flex;-ms-flex-flow:column;flex-flow:column;background:var(--background);overflow:hidden}:host(.datetime-size-fixed){width:auto;height:auto}:host(.datetime-size-cover){width:100%}:host(:not(.datetime-ready)) .datetime-year{position:absolute;pointer-events:none}:host(.datetime-ready) .datetime-year{display:none}: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}: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,::slotted([slot=buttons]),.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-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{-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;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;z-index:0}.calendar-day[disabled]{pointer-events:none}:host .datetime-time{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between}:host .time-header{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host .time-body{display:-ms-flexbox;display:flex;border:none;font-family:inherit;font-size:inherit;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none}:host(.in-item){position:static}.calendar-month-year{min-width:0}.calendar-month-year-toggle{color:inherit;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-align:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;white-space:inherit;position:relative;border:0;outline:none;background:transparent;cursor:pointer;z-index:1}.calendar-month-year-toggle ion-icon{-ms-flex-negative:0;flex-shrink:0}.calendar-month-year-toggle #toggle-wrapper{display:-ms-inline-flexbox;display:inline-flex;-ms-flex-align:center;align-items:center}:host{}:host(.datetime-size-fixed:not(.datetime-prefer-wheel)){max-width:350px}:host .calendar-body,:host .datetime-year{opacity:0}:host(.datetime-ready) .calendar-body,:host(.datetime-ready) .datetime-year{opacity:1}: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 .calendar-action-buttons ion-button{--background:transparent}.calendar-day{border-radius:50%;font-family:var(--ion-font-family, inherit)}:host .calendar-day[disabled]{opacity:0.4}.calendar-day:not(.calendar-day-adjacent-day):focus{background:rgba(var(--ion-color-primary-rgb, 0, 84, 233), 0.2);-webkit-box-shadow:0px 0px 0px 4px rgba(var(--ion-color-primary-rgb, 0, 84, 233), 0.2);box-shadow:0px 0px 0px 4px rgba(var(--ion-color-primary-rgb, 0, 84, 233), 0.2)}:host(.ion-color) .calendar-day:not(.calendar-day-adjacent-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 .calendar-next-prev{display:-ms-flexbox;display:flex;-ms-flex-align:start;align-items:start}.calendar-next-prev ion-button ion-icon[slot=icon-only]{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}: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-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;background:var(--ion-color-step-300, var(--ion-background-color-step-300, #edeef0));color:var(--ion-text-color, #000)}:host .time-body-active{color:var(--ion-color-primary, #0054e9)}:host(.ion-color) .time-body-active{color:var(--ion-color-base)}:host(.show-month-and-year) .calendar-action-buttons .calendar-month-year-toggle{color:var(--ion-color-primary, #0054e9)}:host(.ion-color.show-month-and-year) .calendar-action-buttons .calendar-month-year-toggle{color:var(--ion-color-base)}:host .datetime-action-buttons ion-button{--color:var(--ion-color-primary, #0054e9)}.calendar-month-year-toggle::after{right:0;left:0;top:0;bottom:0;position:absolute;content:"";opacity:0;-webkit-transition:opacity 15ms linear, background-color 15ms linear;transition:opacity 15ms linear, background-color 15ms linear;z-index:-1}.calendar-month-year-toggle.ion-focused::after{background:currentColor}.calendar-month-year-toggle:disabled{opacity:0.3;pointer-events:none}.calendar-month-year-toggle ion-icon{-webkit-padding-start:4px;padding-inline-start:4px;-webkit-padding-end:0;padding-inline-end:0;padding-top:0;padding-bottom:0}ion-picker{--highlight-background:var(--wheel-highlight-background);--highlight-border-radius:var(--wheel-highlight-border-radius);--fade-background-rgb:var(--wheel-fade-background-rgb)}:host .datetime-action-buttons{-ms-flex-pack:justify;justify-content:space-between}:host{--background:var(--ion-color-light, #f4f5f8);--background-rgb:var(--ion-color-light-rgb, 244, 245, 248);--title-color:var(--ion-color-step-600, var(--ion-text-color-step-400, #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, var(--ion-background-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}.calendar-month-year-toggle{-webkit-padding-start:16px;padding-inline-start:16px;-webkit-padding-end:16px;padding-inline-end:16px;padding-top:0px;padding-bottom:0px;min-height:44px;font-size:min(1rem, 25.6px);font-weight:600}.calendar-month-year-toggle.ion-focused::after{opacity:0.15}.calendar-month-year-toggle #toggle-wrapper{-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:8px;margin-inline-end:8px;margin-top:10px;margin-bottom:10px}:host .calendar-action-buttons .calendar-month-year-toggle ion-icon,:host .calendar-action-buttons ion-button{color:var(--ion-color-primary, #0054e9)}:host(.ion-color) .calendar-action-buttons .calendar-month-year-toggle ion-icon,:host(.ion-color) .calendar-action-buttons ion-button{color:var(--ion-color-base)}:host .calendar-action-buttons ion-button{margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}:host .calendar-action-buttons .calendar-next-prev{-ms-flex-align:stretch;align-items:stretch}.calendar-next-prev ion-button{--padding-top:0;--padding-bottom:0;--padding-start:5px;--padding-end:5px;-webkit-margin-start:2px;margin-inline-start:2px;-webkit-margin-end:2px;margin-inline-end:2px;min-height:32px}.calendar-next-prev ion-button ion-icon[slot=icon-only]{font-size:1.65em;line-height:0.67}: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, var(--ion-text-color-step-700, #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-primary-rgb, 0, 84, 233), 0.2);font-size:min(1.375rem, 35.2px)}:host(.ion-color) .calendar-day.calendar-day-active{background:rgba(var(--ion-color-base-rgb), 0.2)}:host .calendar-day.calendar-day-today{color:var(--ion-color-primary, #0054e9)}:host(.ion-color) .calendar-day.calendar-day-today{color:var(--ion-color-base)}:host .calendar-day.calendar-day-active,:host .calendar-day.calendar-day-adjacent-day.calendar-day-active{color:var(--ion-color-primary, #0054e9);font-weight:600}:host(.ion-color) .calendar-day.calendar-day-active,:host(.ion-color) .calendar-day.calendar-day-adjacent-day.calendar-day-active{color:var(--ion-color-base)}:host .calendar-day.calendar-day-today.calendar-day-active{background:var(--ion-color-primary, #0054e9);color:var(--ion-color-primary-contrast, #fff)}:host(.ion-color) .calendar-day.calendar-day-today.calendar-day-active{background:var(--ion-color-base);color:var(--ion-color-contrast)}:host .calendar-day.calendar-day-adjacent-day{color:var(--ion-color-step-300, var(--ion-text-color-step-700, #b3b3b3))}: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, var(--ion-background-color-step-200, #cccccc))}:host .datetime-buttons,::slotted([slot=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,::slotted([slot=buttons]){width:100%}`;
|
|
17567
17558
|
|
|
17568
|
-
const datetimeMdCss = () => `:host{display:-ms-flexbox;display:flex;-ms-flex-flow:column;flex-flow:column;background:var(--background);overflow:hidden}:host(.datetime-size-fixed){width:auto;height:auto}:host(.datetime-size-cover){width:100%}:host(:not(.datetime-ready)) .datetime-year{position:absolute;pointer-events:none}:host(.datetime-ready) .datetime-year{display:none}: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}: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,::slotted([slot=buttons]),.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-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;position:relative;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;min-width:0;min-height:0;overflow:visible;z-index:0}:host .calendar-day-wrapper-in-range::before,:host .calendar-day-wrapper-range-start::before,:host .calendar-day-wrapper-range-end::before{position:absolute;top:50%;inset-inline-start:0;inset-inline-end:0;height:var(--range-track-height);-webkit-transform:translateY(-50%);transform:translateY(-50%);background:-webkit-gradient(linear, left top, left bottom, from(var(--range-background)), to(var(--range-background))), -webkit-gradient(linear, left top, left bottom, from(var(--background)), to(var(--background)));background:linear-gradient(var(--range-background), var(--range-background)), linear-gradient(var(--background), var(--background));content:"";z-index:-1}:host .calendar-day-wrapper-range-start::before{inset-inline-start:50%}:host .calendar-day-wrapper-range-end::before{inset-inline-end:50%}:host .calendar-day-wrapper-in-range:not(:nth-child(7n)):has(+.calendar-day-wrapper-in-range)::before,:host .calendar-day-wrapper-in-range:not(:nth-child(7n)):has(+.calendar-day-wrapper-range-end)::before,:host .calendar-day-wrapper-range-start:not(:nth-child(7n)):has(+.calendar-day-wrapper-in-range)::before,:host .calendar-day-wrapper-range-start:not(:nth-child(7n)):has(+.calendar-day-wrapper-range-end)::before{inset-inline-end:-1px}:host .calendar-day-wrapper-in-range:nth-child(7n)::before,:host .calendar-day-wrapper-range-start:nth-child(7n)::before{inset-inline-end:calc(var(--range-track-edge-overflow, 0px) * -1)}:host .calendar-day-wrapper-in-range:nth-child(7n+1)::before,:host .calendar-day-wrapper-range-end:nth-child(7n+1)::before{inset-inline-start:calc(var(--range-track-edge-overflow, 0px) * -1)}:host .calendar-day-wrapper-range-start.calendar-day-wrapper-range-end::before{display:none}:host(.datetime-disabled.datetime-range) .calendar-month-grid{opacity:0.4}:host(.datetime-disabled.datetime-range) .calendar-month-grid .calendar-day[disabled]{opacity:1}.calendar-day{-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;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;z-index:0}.calendar-day[disabled]{pointer-events:none}:host .datetime-time{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between}:host .time-header{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host .time-body{display:-ms-flexbox;display:flex;border:none;font-family:inherit;font-size:inherit;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none}:host(.in-item){position:static}.calendar-month-year{min-width:0}.calendar-month-year-toggle{color:inherit;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-align:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;white-space:inherit;position:relative;border:0;outline:none;background:transparent;cursor:pointer;z-index:1}.calendar-month-year-toggle ion-icon{-ms-flex-negative:0;flex-shrink:0}.calendar-month-year-toggle #toggle-wrapper{display:-ms-inline-flexbox;display:inline-flex;-ms-flex-align:center;align-items:center}:host{}:host(.datetime-size-fixed:not(.datetime-prefer-wheel)){max-width:350px}:host .calendar-body,:host .datetime-year{opacity:0}:host(.datetime-ready) .calendar-body,:host(.datetime-ready) .datetime-year{opacity:1}: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 .calendar-action-buttons ion-button{--background:transparent}.calendar-day{border-radius:50%;font-family:var(--ion-font-family, inherit)}:host .calendar-day[disabled]{opacity:0.4}.calendar-day:not(.calendar-day-adjacent-day):focus{background:rgba(var(--ion-color-primary-rgb, 0, 84, 233), 0.2);-webkit-box-shadow:0px 0px 0px 4px rgba(var(--ion-color-primary-rgb, 0, 84, 233), 0.2);box-shadow:0px 0px 0px 4px rgba(var(--ion-color-primary-rgb, 0, 84, 233), 0.2)}:host(.ion-color) .calendar-day:not(.calendar-day-adjacent-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 .calendar-next-prev{display:-ms-flexbox;display:flex;-ms-flex-align:start;align-items:start}.calendar-next-prev ion-button ion-icon[slot=icon-only]{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}: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-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;background:var(--ion-color-step-300, var(--ion-background-color-step-300, #edeef0));color:var(--ion-text-color, #000)}:host .time-body-active{color:var(--ion-color-primary, #0054e9)}:host(.ion-color) .time-body-active{color:var(--ion-color-base)}:host(.show-month-and-year) .calendar-action-buttons .calendar-month-year-toggle{color:var(--ion-color-primary, #0054e9)}:host(.ion-color.show-month-and-year) .calendar-action-buttons .calendar-month-year-toggle{color:var(--ion-color-base)}:host .datetime-action-buttons ion-button{--color:var(--ion-color-primary, #0054e9)}.calendar-month-year-toggle::after{right:0;left:0;top:0;bottom:0;position:absolute;content:"";opacity:0;-webkit-transition:opacity 15ms linear, background-color 15ms linear;transition:opacity 15ms linear, background-color 15ms linear;z-index:-1}.calendar-month-year-toggle.ion-focused::after{background:currentColor}.calendar-month-year-toggle:disabled{opacity:0.3;pointer-events:none}.calendar-month-year-toggle ion-icon{-webkit-padding-start:4px;padding-inline-start:4px;-webkit-padding-end:0;padding-inline-end:0;padding-top:0;padding-bottom:0}ion-picker{--highlight-background:var(--wheel-highlight-background);--highlight-border-radius:var(--wheel-highlight-border-radius);--fade-background-rgb:var(--wheel-fade-background-rgb)}:host .datetime-action-buttons{-ms-flex-pack:justify;justify-content:space-between}:host{--background:var(--ion-color-step-100, var(--ion-background-color-step-100, #ffffff));--title-color:var(--ion-color-primary-contrast, #fff)}:host(.ion-color){--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-primary, #0054e9);color:var(--title-color)}:host(.ion-color) .datetime-header{background:var(--ion-color-base)}: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 .calendar-action-buttons ion-button{--color:var(--ion-color-step-650, var(--ion-text-color-step-350, #595959))}.calendar-next-prev ion-button{--padding-top:12px;--padding-end:12px;--padding-bottom:12px;--padding-start:12px;--border-radius:50%;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;width:3rem;height:3rem}.calendar-next-prev ion-button ion-icon[slot=icon-only]{font-size:1.8em}.calendar-month-year-toggle{-webkit-padding-start:20px;padding-inline-start:20px;-webkit-padding-end:16px;padding-inline-end:16px;padding-top:12px;padding-bottom:12px;min-height:48px;background:transparent;color:var(--ion-color-step-650, var(--ion-text-color-step-350, #595959));z-index:1}.calendar-month-year-toggle.ion-focused::after{opacity:0.04}.calendar-month-year-toggle ion-ripple-effect{color:currentColor}@media (any-hover: hover){.calendar-month-year-toggle.ion-activatable:not(.ion-focused):hover::after{background:currentColor;opacity:0.04}}: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, var(--ion-text-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-primary, #0054e9);color:var(--ion-color-primary, #0054e9)}:host(.ion-color) .calendar-day.calendar-day-today{border:1px solid var(--ion-color-base);color:var(--ion-color-base)}:host .calendar-day.calendar-day-active,:host .calendar-day.calendar-day-adjacent-day.calendar-day-active{color:var(--ion-color-primary-contrast, #fff)}:host(.ion-color) .calendar-day.calendar-day-active,:host(.ion-color) .calendar-day.calendar-day-adjacent-day.calendar-day-active{color:var(--ion-color-contrast)}.calendar-day.calendar-day-active,.calendar-day.calendar-day-active:focus{border:1px solid var(--ion-color-primary, #0054e9);background:var(--ion-color-primary, #0054e9)}:host(.ion-color) .calendar-day.calendar-day-active,:host(.ion-color) .calendar-day.calendar-day-active:focus{border:1px solid var(--ion-color-base);background:var(--ion-color-base)}:host .calendar-day.calendar-day-adjacent-day{color:var(--ion-color-step-500, var(--ion-text-color-step-500, gray))}:host{--range-background:rgba(var(--ion-color-primary-rgb, 0, 84, 233), 0.12);--range-track-height:42px;--range-track-edge-overflow:10px}:host(.ion-color){--range-background:rgba(var(--ion-color-base-rgb), 0.12)}:host .calendar-day.calendar-day-range-start,:host .calendar-day.calendar-day-range-end{border-radius:50%;background:var(--ion-color-primary, #0054e9);color:var(--ion-color-primary-contrast, #fff)}:host(.ion-color) .calendar-day.calendar-day-range-start,:host(.ion-color) .calendar-day.calendar-day-range-end{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:8px}:host .time-header{color:var(--ion-color-step-650, var(--ion-text-color-step-350, #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}`;
|
|
17559
|
+
const datetimeMdCss = () => `:host{display:-ms-flexbox;display:flex;-ms-flex-flow:column;flex-flow:column;background:var(--background);overflow:hidden}:host(.datetime-size-fixed){width:auto;height:auto}:host(.datetime-size-cover){width:100%}:host(:not(.datetime-ready)) .datetime-year{position:absolute;pointer-events:none}:host(.datetime-ready) .datetime-year{display:none}: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}: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,::slotted([slot=buttons]),.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-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{-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;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;z-index:0}.calendar-day[disabled]{pointer-events:none}:host .datetime-time{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between}:host .time-header{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host .time-body{display:-ms-flexbox;display:flex;border:none;font-family:inherit;font-size:inherit;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none}:host(.in-item){position:static}.calendar-month-year{min-width:0}.calendar-month-year-toggle{color:inherit;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-align:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;white-space:inherit;position:relative;border:0;outline:none;background:transparent;cursor:pointer;z-index:1}.calendar-month-year-toggle ion-icon{-ms-flex-negative:0;flex-shrink:0}.calendar-month-year-toggle #toggle-wrapper{display:-ms-inline-flexbox;display:inline-flex;-ms-flex-align:center;align-items:center}:host{}:host(.datetime-size-fixed:not(.datetime-prefer-wheel)){max-width:350px}:host .calendar-body,:host .datetime-year{opacity:0}:host(.datetime-ready) .calendar-body,:host(.datetime-ready) .datetime-year{opacity:1}: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 .calendar-action-buttons ion-button{--background:transparent}.calendar-day{border-radius:50%;font-family:var(--ion-font-family, inherit)}:host .calendar-day[disabled]{opacity:0.4}.calendar-day:not(.calendar-day-adjacent-day):focus{background:rgba(var(--ion-color-primary-rgb, 0, 84, 233), 0.2);-webkit-box-shadow:0px 0px 0px 4px rgba(var(--ion-color-primary-rgb, 0, 84, 233), 0.2);box-shadow:0px 0px 0px 4px rgba(var(--ion-color-primary-rgb, 0, 84, 233), 0.2)}:host(.ion-color) .calendar-day:not(.calendar-day-adjacent-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 .calendar-next-prev{display:-ms-flexbox;display:flex;-ms-flex-align:start;align-items:start}.calendar-next-prev ion-button ion-icon[slot=icon-only]{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0}: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-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;background:var(--ion-color-step-300, var(--ion-background-color-step-300, #edeef0));color:var(--ion-text-color, #000)}:host .time-body-active{color:var(--ion-color-primary, #0054e9)}:host(.ion-color) .time-body-active{color:var(--ion-color-base)}:host(.show-month-and-year) .calendar-action-buttons .calendar-month-year-toggle{color:var(--ion-color-primary, #0054e9)}:host(.ion-color.show-month-and-year) .calendar-action-buttons .calendar-month-year-toggle{color:var(--ion-color-base)}:host .datetime-action-buttons ion-button{--color:var(--ion-color-primary, #0054e9)}.calendar-month-year-toggle::after{right:0;left:0;top:0;bottom:0;position:absolute;content:"";opacity:0;-webkit-transition:opacity 15ms linear, background-color 15ms linear;transition:opacity 15ms linear, background-color 15ms linear;z-index:-1}.calendar-month-year-toggle.ion-focused::after{background:currentColor}.calendar-month-year-toggle:disabled{opacity:0.3;pointer-events:none}.calendar-month-year-toggle ion-icon{-webkit-padding-start:4px;padding-inline-start:4px;-webkit-padding-end:0;padding-inline-end:0;padding-top:0;padding-bottom:0}ion-picker{--highlight-background:var(--wheel-highlight-background);--highlight-border-radius:var(--wheel-highlight-border-radius);--fade-background-rgb:var(--wheel-fade-background-rgb)}:host .datetime-action-buttons{-ms-flex-pack:justify;justify-content:space-between}:host{--background:var(--ion-color-step-100, var(--ion-background-color-step-100, #ffffff));--title-color:var(--ion-color-primary-contrast, #fff)}:host(.ion-color){--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-primary, #0054e9);color:var(--title-color)}:host(.ion-color) .datetime-header{background:var(--ion-color-base)}: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 .calendar-action-buttons ion-button{--color:var(--ion-color-step-650, var(--ion-text-color-step-350, #595959))}.calendar-next-prev ion-button{--padding-top:12px;--padding-end:12px;--padding-bottom:12px;--padding-start:12px;--border-radius:50%;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;width:3rem;height:3rem}.calendar-next-prev ion-button ion-icon[slot=icon-only]{font-size:1.8em}.calendar-month-year-toggle{-webkit-padding-start:20px;padding-inline-start:20px;-webkit-padding-end:16px;padding-inline-end:16px;padding-top:12px;padding-bottom:12px;min-height:48px;background:transparent;color:var(--ion-color-step-650, var(--ion-text-color-step-350, #595959));z-index:1}.calendar-month-year-toggle.ion-focused::after{opacity:0.04}.calendar-month-year-toggle ion-ripple-effect{color:currentColor}@media (any-hover: hover){.calendar-month-year-toggle.ion-activatable:not(.ion-focused):hover::after{background:currentColor;opacity:0.04}}: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, var(--ion-text-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-primary, #0054e9);color:var(--ion-color-primary, #0054e9)}:host(.ion-color) .calendar-day.calendar-day-today{border:1px solid var(--ion-color-base);color:var(--ion-color-base)}:host .calendar-day.calendar-day-active,:host .calendar-day.calendar-day-adjacent-day.calendar-day-active{color:var(--ion-color-primary-contrast, #fff)}:host(.ion-color) .calendar-day.calendar-day-active,:host(.ion-color) .calendar-day.calendar-day-adjacent-day.calendar-day-active{color:var(--ion-color-contrast)}.calendar-day.calendar-day-active,.calendar-day.calendar-day-active:focus{border:1px solid var(--ion-color-primary, #0054e9);background:var(--ion-color-primary, #0054e9)}:host(.ion-color) .calendar-day.calendar-day-active,:host(.ion-color) .calendar-day.calendar-day-active:focus{border:1px solid var(--ion-color-base);background:var(--ion-color-base)}:host .calendar-day.calendar-day-adjacent-day{color:var(--ion-color-step-500, var(--ion-text-color-step-500, gray))}: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, var(--ion-text-color-step-350, #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}`;
|
|
17569
17560
|
|
|
17570
17561
|
/**
|
|
17571
17562
|
* @virtualProp {"ios" | "md"} mode - The mode determines the platform behaviors of the component.
|
|
@@ -17598,11 +17589,6 @@ const datetimeMdCss = () => `:host{display:-ms-flexbox;display:flex;-ms-flex-flo
|
|
|
17598
17589
|
* @part calendar-day today - The calendar day that contains the current day.
|
|
17599
17590
|
* @part calendar-day disabled - The calendar day that is disabled.
|
|
17600
17591
|
*
|
|
17601
|
-
* @part range-start - The calendar day button that is the start of a range selection.
|
|
17602
|
-
* @part range-end - The calendar day button that is the end of a range selection.
|
|
17603
|
-
* @part range-selection - The calendar day button that is part of a range selection (includes start and end).
|
|
17604
|
-
* @part range-track - The track that connects the start and end days of a range selection.
|
|
17605
|
-
*
|
|
17606
17592
|
* @part datetime-header - The datetime header contains the content for the `title` slot and the selected date.
|
|
17607
17593
|
* @part datetime-title - The element that contains the `title` slot content.
|
|
17608
17594
|
* @part datetime-selected-date - The element that contains the selected date.
|
|
@@ -17618,11 +17604,6 @@ class Datetime {
|
|
|
17618
17604
|
this.ionStyle = createEvent(this, "ionStyle", 7);
|
|
17619
17605
|
this.ionRender = createEvent(this, "ionRender", 7);
|
|
17620
17606
|
this.inputId = `ion-dt-${datetimeIds++}`;
|
|
17621
|
-
/**
|
|
17622
|
-
* Set when the user completes a range interactively, so processValue
|
|
17623
|
-
* can skip navigation and keep the calendar on the current month.
|
|
17624
|
-
*/
|
|
17625
|
-
this.rangeCompletedInteractively = false;
|
|
17626
17607
|
/**
|
|
17627
17608
|
* Set when the user selects a value, cleared when it's confirmed
|
|
17628
17609
|
* or `processValue` runs (`reset()`, or `value` being set to a
|
|
@@ -17696,22 +17677,8 @@ class Datetime {
|
|
|
17696
17677
|
/**
|
|
17697
17678
|
* If `true`, multiple dates can be selected at once. Only
|
|
17698
17679
|
* applies to `presentation="date"` and `preferWheel="false"`.
|
|
17699
|
-
*
|
|
17700
|
-
* @deprecated Use `selectionMode="multiple"` instead.
|
|
17701
17680
|
*/
|
|
17702
17681
|
this.multiple = false;
|
|
17703
|
-
/**
|
|
17704
|
-
* The text shown in the datetime header when the start of the range
|
|
17705
|
-
* is empty, also used by screen readers to announce the start date.
|
|
17706
|
-
* Only applies when `selectionMode="range"`.
|
|
17707
|
-
*/
|
|
17708
|
-
this.startDateLabel = 'Start date';
|
|
17709
|
-
/**
|
|
17710
|
-
* The text shown in the datetime header when the end of the range
|
|
17711
|
-
* is empty, also used by screen readers to announce the end date.
|
|
17712
|
-
* Only applies when `selectionMode="range"`.
|
|
17713
|
-
*/
|
|
17714
|
-
this.endDateLabel = 'End date';
|
|
17715
17682
|
/**
|
|
17716
17683
|
* If `true`, a header will be shown above the calendar
|
|
17717
17684
|
* picker. This will include both the slotted title, and
|
|
@@ -17764,8 +17731,8 @@ class Datetime {
|
|
|
17764
17731
|
*/
|
|
17765
17732
|
this.preferWheel = false;
|
|
17766
17733
|
this.warnIfIncorrectValueUsage = () => {
|
|
17767
|
-
const { value } = this;
|
|
17768
|
-
if (!
|
|
17734
|
+
const { multiple, value } = this;
|
|
17735
|
+
if (!multiple && Array.isArray(value)) {
|
|
17769
17736
|
/**
|
|
17770
17737
|
* We do some processing on the `value` array so
|
|
17771
17738
|
* that it looks more like an array when logged to
|
|
@@ -17774,13 +17741,7 @@ class Datetime {
|
|
|
17774
17741
|
* Default toString() behavior: a,b
|
|
17775
17742
|
* Custom behavior: ['a', 'b']
|
|
17776
17743
|
*/
|
|
17777
|
-
printIonWarning(`[ion-datetime] - An array of values was passed, but
|
|
17778
|
-
|
|
17779
|
-
Value Passed: [${value.map((v) => `'${v}'`).join(', ')}]
|
|
17780
|
-
`, this.el);
|
|
17781
|
-
}
|
|
17782
|
-
if (this.isRangeMode && Array.isArray(value) && value.length > 2) {
|
|
17783
|
-
printIonWarning(`[ion-datetime] - More than 2 values were passed with selectionMode="range". Only the first and last values will be used.
|
|
17744
|
+
printIonWarning(`[ion-datetime] - An array of values was passed, but multiple is "false". This is incorrect usage and may result in unexpected behaviors. To dismiss this warning, pass a string to the "value" property when multiple="false".
|
|
17784
17745
|
|
|
17785
17746
|
Value Passed: [${value.map((v) => `'${v}'`).join(', ')}]
|
|
17786
17747
|
`, this.el);
|
|
@@ -17806,9 +17767,6 @@ class Datetime {
|
|
|
17806
17767
|
};
|
|
17807
17768
|
this.getActivePart = () => {
|
|
17808
17769
|
const { activeParts } = this;
|
|
17809
|
-
if (this.isRangeParts(activeParts)) {
|
|
17810
|
-
return activeParts.start;
|
|
17811
|
-
}
|
|
17812
17770
|
return Array.isArray(activeParts) ? activeParts[0] : activeParts;
|
|
17813
17771
|
};
|
|
17814
17772
|
this.closeParentOverlay = (role) => {
|
|
@@ -17823,33 +17781,6 @@ class Datetime {
|
|
|
17823
17781
|
...parts,
|
|
17824
17782
|
};
|
|
17825
17783
|
};
|
|
17826
|
-
/**
|
|
17827
|
-
* Checks whether the span from start to end contains any disabled day.
|
|
17828
|
-
* Used by range mode to prevent selecting across disabled dates.
|
|
17829
|
-
*/
|
|
17830
|
-
this.rangeContainsDisabledDate = (start, end) => {
|
|
17831
|
-
const { minParts, maxParts, parsedDayValues, parsedMonthValues, parsedYearValues, isDateEnabled } = this;
|
|
17832
|
-
let cursor = getNextDay(start);
|
|
17833
|
-
while (isBefore(cursor, end)) {
|
|
17834
|
-
if (isDayDisabled(cursor, minParts, maxParts, parsedDayValues) ||
|
|
17835
|
-
(parsedMonthValues !== undefined && !parsedMonthValues.includes(cursor.month)) ||
|
|
17836
|
-
(parsedYearValues !== undefined && !parsedYearValues.includes(cursor.year))) {
|
|
17837
|
-
return true;
|
|
17838
|
-
}
|
|
17839
|
-
if (isDateEnabled) {
|
|
17840
|
-
try {
|
|
17841
|
-
if (!isDateEnabled(convertDataToISO(cursor))) {
|
|
17842
|
-
return true;
|
|
17843
|
-
}
|
|
17844
|
-
}
|
|
17845
|
-
catch {
|
|
17846
|
-
// Swallow user callback exceptions during validation
|
|
17847
|
-
}
|
|
17848
|
-
}
|
|
17849
|
-
cursor = getNextDay(cursor);
|
|
17850
|
-
}
|
|
17851
|
-
return false;
|
|
17852
|
-
};
|
|
17853
17784
|
this.setActiveParts = (parts, removeDate = false) => {
|
|
17854
17785
|
/** if the datetime component is in readonly mode,
|
|
17855
17786
|
* allow browsing of the calendar without changing
|
|
@@ -17859,7 +17790,7 @@ class Datetime {
|
|
|
17859
17790
|
return;
|
|
17860
17791
|
}
|
|
17861
17792
|
this.hasUnconfirmedSelection = true;
|
|
17862
|
-
const { minParts, maxParts, activeParts } = this;
|
|
17793
|
+
const { multiple, minParts, maxParts, activeParts } = this;
|
|
17863
17794
|
/**
|
|
17864
17795
|
* When setting the active parts, it is possible
|
|
17865
17796
|
* to set invalid data. For example,
|
|
@@ -17872,10 +17803,7 @@ class Datetime {
|
|
|
17872
17803
|
*/
|
|
17873
17804
|
const validatedParts = validateParts(parts, minParts, maxParts);
|
|
17874
17805
|
this.setWorkingParts(validatedParts);
|
|
17875
|
-
if (
|
|
17876
|
-
this.setActivePartsRange(validatedParts);
|
|
17877
|
-
}
|
|
17878
|
-
else if (this.isMultipleMode) {
|
|
17806
|
+
if (multiple) {
|
|
17879
17807
|
const activePartsArray = Array.isArray(activeParts) ? activeParts : [activeParts];
|
|
17880
17808
|
if (removeDate) {
|
|
17881
17809
|
this.activeParts = activePartsArray.filter((p) => !isSameDay(p, validatedParts));
|
|
@@ -17895,26 +17823,6 @@ class Datetime {
|
|
|
17895
17823
|
}
|
|
17896
17824
|
this.confirm();
|
|
17897
17825
|
};
|
|
17898
|
-
/**
|
|
17899
|
-
* Handles range selection logic when a day is clicked.
|
|
17900
|
-
*
|
|
17901
|
-
* Creating a new range: first click sets start, second sets end.
|
|
17902
|
-
* Modifying an existing range:
|
|
17903
|
-
* - Before range → new start
|
|
17904
|
-
* - Within range → new end
|
|
17905
|
-
* - After range → new end
|
|
17906
|
-
* If the resulting span contains a disabled date, start a new range instead.
|
|
17907
|
-
*/
|
|
17908
|
-
this.setActivePartsRange = (parts) => {
|
|
17909
|
-
const current = this.rangeParts;
|
|
17910
|
-
if (!current || isBefore(parts, current.start) || this.rangeContainsDisabledDate(current.start, parts)) {
|
|
17911
|
-
this.activeParts = { start: parts };
|
|
17912
|
-
}
|
|
17913
|
-
else {
|
|
17914
|
-
this.rangeCompletedInteractively = true;
|
|
17915
|
-
this.activeParts = { start: current.start, end: parts };
|
|
17916
|
-
}
|
|
17917
|
-
};
|
|
17918
17826
|
this.initializeKeyboardListeners = () => {
|
|
17919
17827
|
const calendarBodyRef = this.calendarBodyRef;
|
|
17920
17828
|
if (!calendarBodyRef) {
|
|
@@ -18326,59 +18234,6 @@ class Datetime {
|
|
|
18326
18234
|
if (hasValue) {
|
|
18327
18235
|
warnIfValueOutOfBounds(valueToProcess, minParts, maxParts);
|
|
18328
18236
|
}
|
|
18329
|
-
/**
|
|
18330
|
-
* Range mode: convert the value array into DatetimeRangeParts.
|
|
18331
|
-
*/
|
|
18332
|
-
if (this.isRangeMode) {
|
|
18333
|
-
/**
|
|
18334
|
-
* The calendar navigates to the start of the range, or to the default
|
|
18335
|
-
* date when there is nothing selected, so that an empty range mode
|
|
18336
|
-
* opens on the same month as the other selection modes.
|
|
18337
|
-
*/
|
|
18338
|
-
let navigateTo;
|
|
18339
|
-
if (hasValue && Array.isArray(valueToProcess)) {
|
|
18340
|
-
let rangeValues = valueToProcess;
|
|
18341
|
-
// If more than 2 entries, use first and last
|
|
18342
|
-
if (rangeValues.length > 2) {
|
|
18343
|
-
rangeValues = [rangeValues[0], rangeValues[rangeValues.length - 1]];
|
|
18344
|
-
}
|
|
18345
|
-
let startParts = rangeValues[0];
|
|
18346
|
-
let endParts = rangeValues.length > 1 ? rangeValues[1] : undefined;
|
|
18347
|
-
// Normalize reversed pairs so earlier date is start
|
|
18348
|
-
if (endParts && isAfter(startParts, endParts)) {
|
|
18349
|
-
const temp = startParts;
|
|
18350
|
-
startParts = endParts;
|
|
18351
|
-
endParts = temp;
|
|
18352
|
-
}
|
|
18353
|
-
this.activeParts = endParts ? { start: startParts, end: endParts } : { start: startParts };
|
|
18354
|
-
/**
|
|
18355
|
-
* When the user just completed the range interactively, stay on the
|
|
18356
|
-
* current month instead of jumping back to the start. The flag is
|
|
18357
|
-
* set in setActivePartsRange and consumed here.
|
|
18358
|
-
*/
|
|
18359
|
-
if (endParts && this.rangeCompletedInteractively) {
|
|
18360
|
-
this.rangeCompletedInteractively = false;
|
|
18361
|
-
return;
|
|
18362
|
-
}
|
|
18363
|
-
navigateTo = startParts;
|
|
18364
|
-
}
|
|
18365
|
-
else {
|
|
18366
|
-
this.activeParts = [];
|
|
18367
|
-
navigateTo = Array.isArray(valueToProcess) ? valueToProcess[0] : valueToProcess;
|
|
18368
|
-
}
|
|
18369
|
-
const targetValue = clampDate(navigateTo, minParts, maxParts);
|
|
18370
|
-
const { month, day, year } = targetValue;
|
|
18371
|
-
const didChangeMonth = (month !== undefined && month !== workingParts.month) || (year !== undefined && year !== workingParts.year);
|
|
18372
|
-
const bodyIsVisible = el.classList.contains('datetime-ready');
|
|
18373
|
-
const { isGridStyle, showMonthAndYear } = this;
|
|
18374
|
-
if (isGridStyle && didChangeMonth && bodyIsVisible && !showMonthAndYear) {
|
|
18375
|
-
this.animateToDate(targetValue);
|
|
18376
|
-
}
|
|
18377
|
-
else {
|
|
18378
|
-
this.setWorkingParts({ month, day, year, hour: 0, minute: 0, ampm: 'am' });
|
|
18379
|
-
}
|
|
18380
|
-
return;
|
|
18381
|
-
}
|
|
18382
18237
|
/**
|
|
18383
18238
|
* If there are multiple values, clamp to the last one.
|
|
18384
18239
|
* This is because the last value is the one that the user
|
|
@@ -18540,27 +18395,6 @@ class Datetime {
|
|
|
18540
18395
|
const hasDatePresentation = presentation === 'date' || presentation === 'date-time' || presentation === 'time-date';
|
|
18541
18396
|
return hasDatePresentation && !preferWheel;
|
|
18542
18397
|
}
|
|
18543
|
-
get isMultipleMode() {
|
|
18544
|
-
return this.selectionMode === 'multiple' || (this.selectionMode === undefined && this.multiple);
|
|
18545
|
-
}
|
|
18546
|
-
get isRangeMode() {
|
|
18547
|
-
return this.selectionMode === 'range';
|
|
18548
|
-
}
|
|
18549
|
-
/**
|
|
18550
|
-
* Type guard: returns true if the given activeParts is a DatetimeRangeParts object.
|
|
18551
|
-
*/
|
|
18552
|
-
isRangeParts(parts) {
|
|
18553
|
-
return this.isRangeMode && parts !== null && typeof parts === 'object' && !Array.isArray(parts) && 'start' in parts;
|
|
18554
|
-
}
|
|
18555
|
-
/**
|
|
18556
|
-
* Returns the current range parts if in range mode, or undefined otherwise.
|
|
18557
|
-
*/
|
|
18558
|
-
get rangeParts() {
|
|
18559
|
-
if (this.isRangeParts(this.activeParts)) {
|
|
18560
|
-
return this.activeParts;
|
|
18561
|
-
}
|
|
18562
|
-
return undefined;
|
|
18563
|
-
}
|
|
18564
18398
|
yearValuesChanged() {
|
|
18565
18399
|
this.parsedYearValues = convertToArrayOfNumbers(this.yearValues);
|
|
18566
18400
|
}
|
|
@@ -18596,19 +18430,6 @@ class Datetime {
|
|
|
18596
18430
|
*/
|
|
18597
18431
|
async confirm(closeOverlay = false) {
|
|
18598
18432
|
const { isCalendarPicker, activeParts, preferWheel, workingParts } = this;
|
|
18599
|
-
/**
|
|
18600
|
-
* In range mode, only confirm when both start and end are selected.
|
|
18601
|
-
*/
|
|
18602
|
-
if (this.isRangeMode) {
|
|
18603
|
-
if (!this.isRangeParts(activeParts) || !activeParts.end) {
|
|
18604
|
-
return;
|
|
18605
|
-
}
|
|
18606
|
-
this.setValue([convertDataToISO(activeParts.start), convertDataToISO(activeParts.end)]);
|
|
18607
|
-
if (closeOverlay) {
|
|
18608
|
-
this.closeParentOverlay(CONFIRM_ROLE);
|
|
18609
|
-
}
|
|
18610
|
-
return;
|
|
18611
|
-
}
|
|
18612
18433
|
/**
|
|
18613
18434
|
* We only update the value if the presentation is not a calendar picker.
|
|
18614
18435
|
*/
|
|
@@ -18644,22 +18465,6 @@ class Datetime {
|
|
|
18644
18465
|
* @param startDate A valid [ISO-8601 string](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date#date_time_string_format) to reset the datetime state to.
|
|
18645
18466
|
*/
|
|
18646
18467
|
async reset(startDate) {
|
|
18647
|
-
if (this.isRangeMode) {
|
|
18648
|
-
/**
|
|
18649
|
-
* In range mode, reset clears the full range. If a startDate
|
|
18650
|
-
* is provided, the calendar navigates to that month without
|
|
18651
|
-
* selecting anything so the user begins a fresh selection.
|
|
18652
|
-
*/
|
|
18653
|
-
this.activeParts = [];
|
|
18654
|
-
if (startDate) {
|
|
18655
|
-
const parsed = parseDate(startDate);
|
|
18656
|
-
if (parsed) {
|
|
18657
|
-
const target = Array.isArray(parsed) ? parsed[0] : parsed;
|
|
18658
|
-
this.setWorkingParts(target);
|
|
18659
|
-
}
|
|
18660
|
-
}
|
|
18661
|
-
return;
|
|
18662
|
-
}
|
|
18663
18468
|
this.processValue(startDate);
|
|
18664
18469
|
}
|
|
18665
18470
|
/**
|
|
@@ -18895,11 +18700,8 @@ class Datetime {
|
|
|
18895
18700
|
});
|
|
18896
18701
|
}
|
|
18897
18702
|
componentWillLoad() {
|
|
18898
|
-
const { el, formatOptions, highlightedDates, multiple,
|
|
18899
|
-
if (
|
|
18900
|
-
printIonWarning('[ion-datetime] - The "multiple" property is deprecated. Use selectionMode="multiple" instead.', el);
|
|
18901
|
-
}
|
|
18902
|
-
if (this.isMultipleMode) {
|
|
18703
|
+
const { el, formatOptions, highlightedDates, multiple, presentation, preferWheel } = this;
|
|
18704
|
+
if (multiple) {
|
|
18903
18705
|
if (presentation !== 'date') {
|
|
18904
18706
|
printIonWarning('[ion-datetime] - Multiple date selection is only supported for presentation="date".', el);
|
|
18905
18707
|
}
|
|
@@ -18907,17 +18709,6 @@ class Datetime {
|
|
|
18907
18709
|
printIonWarning('[ion-datetime] - Multiple date selection is not supported with preferWheel="true".', el);
|
|
18908
18710
|
}
|
|
18909
18711
|
}
|
|
18910
|
-
if (this.isRangeMode) {
|
|
18911
|
-
if (presentation !== 'date') {
|
|
18912
|
-
printIonWarning('[ion-datetime] - Range selection is only supported for presentation="date".', el);
|
|
18913
|
-
}
|
|
18914
|
-
if (preferWheel) {
|
|
18915
|
-
printIonWarning('[ion-datetime] - Range selection is not supported with preferWheel="true".', el);
|
|
18916
|
-
}
|
|
18917
|
-
}
|
|
18918
|
-
if (selectionMode !== undefined && multiple) {
|
|
18919
|
-
printIonWarning('[ion-datetime] - Both "selectionMode" and "multiple" are set. "selectionMode" takes precedence.', el);
|
|
18920
|
-
}
|
|
18921
18712
|
if (highlightedDates !== undefined) {
|
|
18922
18713
|
if (presentation !== 'date' && presentation !== 'date-time' && presentation !== 'time-date') {
|
|
18923
18714
|
printIonWarning('[ion-datetime] - The highlightedDates property is only supported with the date, date-time, and time-date presentations.', el);
|
|
@@ -18972,12 +18763,6 @@ class Datetime {
|
|
|
18972
18763
|
* is disabled or readonly.
|
|
18973
18764
|
*/
|
|
18974
18765
|
const isButtonDisabled = disabled || readonly;
|
|
18975
|
-
/**
|
|
18976
|
-
* In range mode, the confirm button should be disabled until
|
|
18977
|
-
* both a start and end date have been selected.
|
|
18978
|
-
*/
|
|
18979
|
-
const isRangeIncomplete = this.isRangeMode && (!this.isRangeParts(this.activeParts) || !this.activeParts.end);
|
|
18980
|
-
const isConfirmDisabled = isButtonDisabled || isRangeIncomplete;
|
|
18981
18766
|
const confirmFill = theme === 'ionic' ? 'solid' : undefined;
|
|
18982
18767
|
const hasSlottedButtons = this.el.querySelector('[slot="buttons"]') !== null;
|
|
18983
18768
|
if (!hasSlottedButtons && !showDefaultButtons && !showClearButton) {
|
|
@@ -18997,7 +18782,7 @@ class Datetime {
|
|
|
18997
18782
|
return (hAsync("div", { class: "datetime-footer" }, hAsync("div", { class: "datetime-buttons" }, hAsync("div", { class: {
|
|
18998
18783
|
['datetime-action-buttons']: true,
|
|
18999
18784
|
['has-clear-button']: this.showClearButton,
|
|
19000
|
-
} }, hAsync("slot", { name: "buttons" }, showDefaultButtons && (hAsync("ion-button", { id: "cancel-button", color: this.color, onClick: () => this.cancel(true), disabled: isButtonDisabled }, this.cancelText)), hAsync("div", { class: "datetime-action-buttons-container" }, showClearButton && (hAsync("ion-button", { id: "clear-button", color: this.color, onClick: () => clearButtonClick(), disabled: isButtonDisabled }, this.clearText)), showDefaultButtons && (hAsync("ion-button", { id: "confirm-button", fill: confirmFill, color: this.color, onClick: () => this.confirm(true), disabled:
|
|
18785
|
+
} }, hAsync("slot", { name: "buttons" }, showDefaultButtons && (hAsync("ion-button", { id: "cancel-button", color: this.color, onClick: () => this.cancel(true), disabled: isButtonDisabled }, this.cancelText)), hAsync("div", { class: "datetime-action-buttons-container" }, showClearButton && (hAsync("ion-button", { id: "clear-button", color: this.color, onClick: () => clearButtonClick(), disabled: isButtonDisabled }, this.clearText)), showDefaultButtons && (hAsync("ion-button", { id: "confirm-button", fill: confirmFill, color: this.color, onClick: () => this.confirm(true), disabled: isButtonDisabled }, this.doneText))))))));
|
|
19001
18786
|
}
|
|
19002
18787
|
/**
|
|
19003
18788
|
* Wheel picker render methods
|
|
@@ -19186,8 +18971,8 @@ class Datetime {
|
|
|
19186
18971
|
...this.workingParts,
|
|
19187
18972
|
month: ev.detail.value,
|
|
19188
18973
|
});
|
|
19189
|
-
// Month wheel is navigation-only in multi-select
|
|
19190
|
-
if (!this.
|
|
18974
|
+
// Month wheel is navigation-only in multi-select mode as a fix for https://github.com/ionic-team/ionic-framework/issues/29673
|
|
18975
|
+
if (!this.multiple) {
|
|
19191
18976
|
this.setActiveParts({
|
|
19192
18977
|
...activePart,
|
|
19193
18978
|
month: ev.detail.value,
|
|
@@ -19208,8 +18993,8 @@ class Datetime {
|
|
|
19208
18993
|
...this.workingParts,
|
|
19209
18994
|
year: ev.detail.value,
|
|
19210
18995
|
});
|
|
19211
|
-
// Year wheel is navigation-only in multi-select
|
|
19212
|
-
if (!this.
|
|
18996
|
+
// Year wheel is navigation-only in multi-select mode as a fix for https://github.com/ionic-team/ionic-framework/issues/29673
|
|
18997
|
+
if (!this.multiple) {
|
|
19213
18998
|
this.setActiveParts({
|
|
19214
18999
|
...activePart,
|
|
19215
19000
|
year: ev.detail.value,
|
|
@@ -19353,7 +19138,7 @@ class Datetime {
|
|
|
19353
19138
|
'calendar-month-disabled': !isWorkingMonth && swipeDisabled,
|
|
19354
19139
|
} }, hAsync("div", { class: "calendar-month-grid" }, getDaysOfMonth(month, year, this.firstDayOfWeek % 7, this.showAdjacentDays).map((dateObject, index) => {
|
|
19355
19140
|
const { day, dayOfWeek, isAdjacentDay } = dateObject;
|
|
19356
|
-
const { el, highlightedDates, isDateEnabled, showAdjacentDays } = this;
|
|
19141
|
+
const { el, highlightedDates, isDateEnabled, multiple, showAdjacentDays } = this;
|
|
19357
19142
|
let _month = month;
|
|
19358
19143
|
let _year = year;
|
|
19359
19144
|
if (showAdjacentDays && isAdjacentDay && day !== null) {
|
|
@@ -19382,7 +19167,7 @@ class Datetime {
|
|
|
19382
19167
|
}
|
|
19383
19168
|
const referenceParts = { month: _month, day, year: _year, isAdjacentDay };
|
|
19384
19169
|
const isCalendarPadding = day === null;
|
|
19385
|
-
const { isActive, isToday, ariaLabel, ariaSelected, disabled: isDayDisabled,
|
|
19170
|
+
const { isActive, isToday, ariaLabel, ariaSelected, disabled: isDayDisabled, text, } = getCalendarDayState(this.locale, referenceParts, this.activeParts, this.todayParts, this.minParts, this.maxParts, this.parsedDayValues);
|
|
19386
19171
|
const dateIsoString = convertDataToISO(referenceParts);
|
|
19387
19172
|
let isCalDayDisabled = isCalMonthDisabled || isDayDisabled;
|
|
19388
19173
|
if (!isCalDayDisabled && isDateEnabled !== undefined) {
|
|
@@ -19405,60 +19190,24 @@ class Datetime {
|
|
|
19405
19190
|
*/
|
|
19406
19191
|
const isCalDayConstrained = isCalDayDisabled && isDatetimeDisabled;
|
|
19407
19192
|
const isButtonDisabled = isCalDayDisabled || isDatetimeDisabled;
|
|
19408
|
-
/**
|
|
19409
|
-
* Determine if this day is part of the range selection.
|
|
19410
|
-
* Range styling takes priority over highlightedDates.
|
|
19411
|
-
*/
|
|
19412
|
-
const isPartOfRange = isRangeStart || isRangeEnd || isInRange;
|
|
19413
19193
|
let dateStyle = undefined;
|
|
19414
19194
|
/**
|
|
19415
|
-
* Custom highlight styles should not override the style for selected dates
|
|
19416
|
-
*
|
|
19195
|
+
* Custom highlight styles should not override the style for selected dates,
|
|
19196
|
+
* nor apply to "filler days" at the start of the grid.
|
|
19417
19197
|
*/
|
|
19418
|
-
if (highlightedDates !== undefined && !isActive &&
|
|
19198
|
+
if (highlightedDates !== undefined && !isActive && day !== null && !isAdjacentDay) {
|
|
19419
19199
|
dateStyle = getHighlightStyles(highlightedDates, dateIsoString, el);
|
|
19420
19200
|
}
|
|
19421
19201
|
let dateParts = undefined;
|
|
19422
19202
|
// "Filler days" at the beginning of the grid should not get the calendar day
|
|
19423
19203
|
// CSS parts added to them
|
|
19424
19204
|
if (!isCalendarPadding && !isAdjacentDay) {
|
|
19425
|
-
dateParts = `calendar-day${isActive
|
|
19205
|
+
dateParts = `calendar-day${isActive ? ' active' : ''}${isToday ? ' today' : ''}${isCalDayDisabled ? ' disabled' : ''}`;
|
|
19426
19206
|
}
|
|
19427
19207
|
else if (isAdjacentDay) {
|
|
19428
|
-
|
|
19429
|
-
* Adjacent days skip 'active' and 'today' parts but still
|
|
19430
|
-
* include range parts so ::part() styling is consistent
|
|
19431
|
-
* with the visual range track rendering.
|
|
19432
|
-
*/
|
|
19433
|
-
dateParts = `calendar-day${isCalDayDisabled ? ' disabled' : ''}${isRangeStart ? ' range-start range-selection' : ''}${isRangeEnd ? ' range-end range-selection' : ''}${isInRange ? ' range-selection' : ''}`;
|
|
19434
|
-
}
|
|
19435
|
-
/**
|
|
19436
|
-
* Build the wrapper's shadow part attribute for range track styling.
|
|
19437
|
-
*/
|
|
19438
|
-
const hasCompleteRange = this.rangeParts?.end !== undefined;
|
|
19439
|
-
const wrapperParts = isPartOfRange && hasCompleteRange && !isCalendarPadding ? 'range-track' : undefined;
|
|
19440
|
-
/**
|
|
19441
|
-
* Build the aria-label for range mode accessibility.
|
|
19442
|
-
*/
|
|
19443
|
-
let rangeAriaLabel = ariaLabel;
|
|
19444
|
-
if (this.isRangeMode && ariaLabel) {
|
|
19445
|
-
if (isRangeStart) {
|
|
19446
|
-
rangeAriaLabel += `, ${this.startDateLabel}`;
|
|
19447
|
-
}
|
|
19448
|
-
if (isRangeEnd) {
|
|
19449
|
-
rangeAriaLabel += `, ${this.endDateLabel}`;
|
|
19450
|
-
}
|
|
19451
|
-
if (isInRange) {
|
|
19452
|
-
rangeAriaLabel += ', in range';
|
|
19453
|
-
}
|
|
19208
|
+
dateParts = `calendar-day${isCalDayDisabled ? ' disabled' : ''}`;
|
|
19454
19209
|
}
|
|
19455
|
-
return (hAsync("div", { class: {
|
|
19456
|
-
'calendar-day-wrapper': true,
|
|
19457
|
-
// A start without an end is only the circle until the range is complete
|
|
19458
|
-
'calendar-day-wrapper-range-start': isRangeStart && this.rangeParts?.end !== undefined,
|
|
19459
|
-
'calendar-day-wrapper-in-range': isInRange,
|
|
19460
|
-
'calendar-day-wrapper-range-end': isRangeEnd,
|
|
19461
|
-
}, part: wrapperParts }, hAsync("button", {
|
|
19210
|
+
return (hAsync("div", { class: "calendar-day-wrapper" }, hAsync("button", {
|
|
19462
19211
|
// We need to use !important for the inline styles here because
|
|
19463
19212
|
// otherwise the CSS shadow parts will override these styles.
|
|
19464
19213
|
// See https://github.com/WICG/webcomponents/issues/847
|
|
@@ -19474,40 +19223,28 @@ class Datetime {
|
|
|
19474
19223
|
}, tabindex: "-1", "data-day": day, "data-month": _month, "data-year": _year, "data-index": index, "data-day-of-week": dayOfWeek, disabled: isButtonDisabled, class: {
|
|
19475
19224
|
'calendar-day-padding': isCalendarPadding,
|
|
19476
19225
|
'calendar-day': true,
|
|
19477
|
-
'calendar-day-active': isActive
|
|
19226
|
+
'calendar-day-active': isActive,
|
|
19478
19227
|
'calendar-day-constrained': isCalDayConstrained,
|
|
19479
19228
|
'calendar-day-today': isToday,
|
|
19480
19229
|
'calendar-day-adjacent-day': isAdjacentDay,
|
|
19481
|
-
|
|
19482
|
-
'calendar-day-range-end': isRangeEnd,
|
|
19483
|
-
'calendar-day-in-range': isInRange,
|
|
19484
|
-
}, part: dateParts, "aria-hidden": isCalendarPadding ? 'true' : null, "aria-selected": isActive || isRangeStart || isRangeEnd ? 'true' : ariaSelected, "aria-label": rangeAriaLabel, onClick: () => {
|
|
19230
|
+
}, part: dateParts, "aria-hidden": isCalendarPadding ? 'true' : null, "aria-selected": ariaSelected, "aria-label": ariaLabel, onClick: () => {
|
|
19485
19231
|
if (isCalendarPadding) {
|
|
19486
19232
|
return;
|
|
19487
19233
|
}
|
|
19488
19234
|
if (isAdjacentDay) {
|
|
19489
19235
|
// The user selected a day outside the current month. Ignore this button, as the month will be re-rendered.
|
|
19490
19236
|
this.el.blur();
|
|
19491
|
-
|
|
19492
|
-
this.activeParts = { ...activePart, ...referenceParts };
|
|
19493
|
-
}
|
|
19237
|
+
this.activeParts = { ...activePart, ...referenceParts };
|
|
19494
19238
|
this.animateToDate(referenceParts);
|
|
19495
|
-
|
|
19496
|
-
this.setActiveParts(referenceParts);
|
|
19497
|
-
}
|
|
19498
|
-
else {
|
|
19499
|
-
this.confirm();
|
|
19500
|
-
}
|
|
19239
|
+
this.confirm();
|
|
19501
19240
|
}
|
|
19502
19241
|
else {
|
|
19503
19242
|
this.setWorkingParts({
|
|
19504
19243
|
...this.workingParts,
|
|
19505
19244
|
...referenceParts,
|
|
19506
19245
|
});
|
|
19507
|
-
|
|
19508
|
-
|
|
19509
|
-
}
|
|
19510
|
-
else if (this.isMultipleMode) {
|
|
19246
|
+
// Multiple only needs date info so we can wipe out other fields like time.
|
|
19247
|
+
if (multiple) {
|
|
19511
19248
|
this.setActiveParts(referenceParts, isActive);
|
|
19512
19249
|
}
|
|
19513
19250
|
else {
|
|
@@ -19527,17 +19264,7 @@ class Datetime {
|
|
|
19527
19264
|
})));
|
|
19528
19265
|
}
|
|
19529
19266
|
renderCalendar(theme) {
|
|
19530
|
-
return (hAsync("div", { class: "datetime-calendar", key: "datetime-calendar" }, this.renderCalendarHeader(theme), this.renderCalendarBody()
|
|
19531
|
-
position: 'absolute',
|
|
19532
|
-
width: '1px',
|
|
19533
|
-
height: '1px',
|
|
19534
|
-
padding: '0',
|
|
19535
|
-
margin: '-1px',
|
|
19536
|
-
overflow: 'hidden',
|
|
19537
|
-
clip: 'rect(0, 0, 0, 0)',
|
|
19538
|
-
whiteSpace: 'nowrap',
|
|
19539
|
-
border: '0',
|
|
19540
|
-
} }, `${this.startDateLabel} selected, select ${this.endDateLabel.toLowerCase()}`))));
|
|
19267
|
+
return (hAsync("div", { class: "datetime-calendar", key: "datetime-calendar" }, this.renderCalendarHeader(theme), this.renderCalendarBody()));
|
|
19541
19268
|
}
|
|
19542
19269
|
renderTimeLabel() {
|
|
19543
19270
|
const hasSlottedTimeLabel = this.el.querySelector('[slot="time-label"]') !== null;
|
|
@@ -19590,23 +19317,10 @@ class Datetime {
|
|
|
19590
19317
|
];
|
|
19591
19318
|
}
|
|
19592
19319
|
getHeaderSelectedDateText() {
|
|
19593
|
-
const { activeParts, formatOptions, titleSelectedDatesFormatter } = this;
|
|
19320
|
+
const { activeParts, formatOptions, multiple, titleSelectedDatesFormatter } = this;
|
|
19594
19321
|
const isArray = Array.isArray(activeParts);
|
|
19595
|
-
const dateFormatOptions = formatOptions?.date ?? { weekday: 'short', month: 'short', day: 'numeric' };
|
|
19596
19322
|
let headerText;
|
|
19597
|
-
if (
|
|
19598
|
-
headerText = this.getRangeHeaderText(formatOptions?.date ?? { month: 'short', day: 'numeric' });
|
|
19599
|
-
if (titleSelectedDatesFormatter !== undefined) {
|
|
19600
|
-
try {
|
|
19601
|
-
const rangeValues = this.getRangeValueArray();
|
|
19602
|
-
headerText = titleSelectedDatesFormatter(rangeValues);
|
|
19603
|
-
}
|
|
19604
|
-
catch (e) {
|
|
19605
|
-
printIonError('[ion-datetime] - Exception in provided `titleSelectedDatesFormatter`:', e);
|
|
19606
|
-
}
|
|
19607
|
-
}
|
|
19608
|
-
}
|
|
19609
|
-
else if (this.isMultipleMode && isArray && activeParts.length !== 1) {
|
|
19323
|
+
if (multiple && isArray && activeParts.length !== 1) {
|
|
19610
19324
|
headerText = `${activeParts.length} days`; // default/fallback for multiple selection
|
|
19611
19325
|
if (titleSelectedDatesFormatter !== undefined) {
|
|
19612
19326
|
try {
|
|
@@ -19619,37 +19333,10 @@ class Datetime {
|
|
|
19619
19333
|
}
|
|
19620
19334
|
else {
|
|
19621
19335
|
// for exactly 1 day selected (multiple set or not), show a formatted version of that
|
|
19622
|
-
headerText = getLocalizedDateTime(this.locale, this.getActivePartsWithFallback(),
|
|
19336
|
+
headerText = getLocalizedDateTime(this.locale, this.getActivePartsWithFallback(), formatOptions?.date ?? { weekday: 'short', month: 'short', day: 'numeric' });
|
|
19623
19337
|
}
|
|
19624
19338
|
return headerText;
|
|
19625
19339
|
}
|
|
19626
|
-
/**
|
|
19627
|
-
* Returns the formatted range header text.
|
|
19628
|
-
* Shows "Start date - End date" with placeholders from startDateLabel/endDateLabel.
|
|
19629
|
-
*/
|
|
19630
|
-
getRangeHeaderText(dateFormatOptions) {
|
|
19631
|
-
const range = this.rangeParts;
|
|
19632
|
-
if (!range) {
|
|
19633
|
-
return `${this.startDateLabel} - ${this.endDateLabel}`;
|
|
19634
|
-
}
|
|
19635
|
-
const startText = getLocalizedDateTime(this.locale, range.start, dateFormatOptions);
|
|
19636
|
-
const endText = range.end ? getLocalizedDateTime(this.locale, range.end, dateFormatOptions) : this.endDateLabel;
|
|
19637
|
-
return `${startText} - ${endText}`;
|
|
19638
|
-
}
|
|
19639
|
-
/**
|
|
19640
|
-
* Returns the current range value as an ISO string array for
|
|
19641
|
-
* titleSelectedDatesFormatter and ionChange.
|
|
19642
|
-
*/
|
|
19643
|
-
getRangeValueArray() {
|
|
19644
|
-
const range = this.rangeParts;
|
|
19645
|
-
if (!range) {
|
|
19646
|
-
return [];
|
|
19647
|
-
}
|
|
19648
|
-
if (!range.end) {
|
|
19649
|
-
return [convertDataToISO(range.start)];
|
|
19650
|
-
}
|
|
19651
|
-
return [convertDataToISO(range.start), convertDataToISO(range.end)];
|
|
19652
|
-
}
|
|
19653
19340
|
renderHeader(showExpandedHeader = true) {
|
|
19654
19341
|
const hasSlottedTitle = this.el.querySelector('[slot="title"]') !== null;
|
|
19655
19342
|
if (!hasSlottedTitle && !this.showDefaultTitle) {
|
|
@@ -19773,7 +19460,7 @@ class Datetime {
|
|
|
19773
19460
|
const hasDatePresentation = presentation === 'date' || presentation === 'date-time' || presentation === 'time-date';
|
|
19774
19461
|
const hasWheelVariant = hasDatePresentation && preferWheel;
|
|
19775
19462
|
renderHiddenInput(true, el, name, formatValue(value), disabled);
|
|
19776
|
-
return (hAsync(Host, { key: '
|
|
19463
|
+
return (hAsync(Host, { key: '6ee2389238b42b0d10c5f5254a8ba61bfc53c677', "aria-disabled": disabled ? 'true' : null, onFocus: this.onFocus, onBlur: this.onBlur, class: {
|
|
19777
19464
|
...createColorClasses$1(color, {
|
|
19778
19465
|
[theme]: true,
|
|
19779
19466
|
['datetime-readonly']: readonly,
|
|
@@ -19784,9 +19471,8 @@ class Datetime {
|
|
|
19784
19471
|
[`datetime-size-${size}`]: true,
|
|
19785
19472
|
[`datetime-prefer-wheel`]: hasWheelVariant,
|
|
19786
19473
|
[`datetime-grid`]: isGridStyle,
|
|
19787
|
-
[`datetime-range`]: this.isRangeMode,
|
|
19788
19474
|
}),
|
|
19789
|
-
} }, hAsync("div", { key: '
|
|
19475
|
+
} }, hAsync("div", { key: '531803dfb77fa3d694c90b6fc45e71e304876fa8', class: "intersection-tracker", ref: (el) => (this.intersectionTrackerRef = el) }), this.renderDatetime(theme)));
|
|
19790
19476
|
}
|
|
19791
19477
|
get el() { return getElement(this); }
|
|
19792
19478
|
static get watchers() { return {
|
|
@@ -19855,9 +19541,6 @@ class Datetime {
|
|
|
19855
19541
|
"firstDayOfWeek": [2, "first-day-of-week"],
|
|
19856
19542
|
"titleSelectedDatesFormatter": [16],
|
|
19857
19543
|
"multiple": [4],
|
|
19858
|
-
"selectionMode": [1, "selection-mode"],
|
|
19859
|
-
"startDateLabel": [1, "start-date-label"],
|
|
19860
|
-
"endDateLabel": [1, "end-date-label"],
|
|
19861
19544
|
"highlightedDates": [16],
|
|
19862
19545
|
"value": [1025],
|
|
19863
19546
|
"showDefaultTitle": [4, "show-default-title"],
|
|
@@ -19940,7 +19623,7 @@ class DatetimeButton {
|
|
|
19940
19623
|
if (!datetimeEl) {
|
|
19941
19624
|
return;
|
|
19942
19625
|
}
|
|
19943
|
-
const { value, locale, formatOptions, hourCycle, preferWheel, multiple,
|
|
19626
|
+
const { value, locale, formatOptions, hourCycle, preferWheel, multiple, titleSelectedDatesFormatter } = datetimeEl;
|
|
19944
19627
|
const parsedValues = this.getParsedDateValues(value);
|
|
19945
19628
|
/**
|
|
19946
19629
|
* Both ion-datetime and ion-datetime-button default to today's date and
|
|
@@ -19952,8 +19635,6 @@ class DatetimeButton {
|
|
|
19952
19635
|
if (!parsedDatetimes) {
|
|
19953
19636
|
return;
|
|
19954
19637
|
}
|
|
19955
|
-
const isRangeMode = selectionMode === 'range';
|
|
19956
|
-
const isMultipleMode = selectionMode === 'multiple' || (selectionMode === undefined && multiple);
|
|
19957
19638
|
/**
|
|
19958
19639
|
* If developers incorrectly use multiple="true"
|
|
19959
19640
|
* with non "date" datetimes, then just select
|
|
@@ -19963,12 +19644,11 @@ class DatetimeButton {
|
|
|
19963
19644
|
*/
|
|
19964
19645
|
const firstParsedDatetime = parsedDatetimes[0];
|
|
19965
19646
|
const computedHourCycle = getHourCycle(locale, hourCycle);
|
|
19966
|
-
const dateFormatOptions = formatOptions?.date ?? { month: 'short', day: 'numeric', year: 'numeric' };
|
|
19967
19647
|
this.dateText = this.timeText = undefined;
|
|
19968
19648
|
switch (datetimePresentation) {
|
|
19969
19649
|
case 'date-time':
|
|
19970
19650
|
case 'time-date':
|
|
19971
|
-
const dateText = getLocalizedDateTime(locale, firstParsedDatetime,
|
|
19651
|
+
const dateText = getLocalizedDateTime(locale, firstParsedDatetime, formatOptions?.date ?? { month: 'short', day: 'numeric', year: 'numeric' });
|
|
19972
19652
|
const timeText = getLocalizedTime(locale, firstParsedDatetime, computedHourCycle, formatOptions?.time);
|
|
19973
19653
|
if (preferWheel) {
|
|
19974
19654
|
this.dateText = `${dateText} ${timeText}`;
|
|
@@ -19979,31 +19659,7 @@ class DatetimeButton {
|
|
|
19979
19659
|
}
|
|
19980
19660
|
break;
|
|
19981
19661
|
case 'date':
|
|
19982
|
-
if (
|
|
19983
|
-
/**
|
|
19984
|
-
* Use the first and last entries in date order, matching
|
|
19985
|
-
* how ion-datetime reads a range value.
|
|
19986
|
-
*/
|
|
19987
|
-
let startIndex = 0;
|
|
19988
|
-
let endIndex = parsedValues.length - 1;
|
|
19989
|
-
if (isAfter(parsedDatetimes[startIndex], parsedDatetimes[endIndex])) {
|
|
19990
|
-
[startIndex, endIndex] = [endIndex, startIndex];
|
|
19991
|
-
}
|
|
19992
|
-
const rangeValues = [parsedValues[startIndex], parsedValues[endIndex]];
|
|
19993
|
-
const startDate = getLocalizedDateTime(locale, parsedDatetimes[startIndex], dateFormatOptions);
|
|
19994
|
-
const endDate = getLocalizedDateTime(locale, parsedDatetimes[endIndex], dateFormatOptions);
|
|
19995
|
-
let rangeText = `${startDate} - ${endDate}`;
|
|
19996
|
-
if (titleSelectedDatesFormatter !== undefined) {
|
|
19997
|
-
try {
|
|
19998
|
-
rangeText = titleSelectedDatesFormatter(rangeValues);
|
|
19999
|
-
}
|
|
20000
|
-
catch (e) {
|
|
20001
|
-
printIonError('[ion-datetime-button] - Exception in provided `titleSelectedDatesFormatter`:', e);
|
|
20002
|
-
}
|
|
20003
|
-
}
|
|
20004
|
-
this.dateText = rangeText;
|
|
20005
|
-
}
|
|
20006
|
-
else if (isMultipleMode && parsedValues.length !== 1) {
|
|
19662
|
+
if (multiple && parsedValues.length !== 1) {
|
|
20007
19663
|
let headerText = `${parsedValues.length} days`; // default/fallback for multiple selection
|
|
20008
19664
|
if (titleSelectedDatesFormatter !== undefined) {
|
|
20009
19665
|
try {
|
|
@@ -20016,7 +19672,7 @@ class DatetimeButton {
|
|
|
20016
19672
|
this.dateText = headerText;
|
|
20017
19673
|
}
|
|
20018
19674
|
else {
|
|
20019
|
-
this.dateText = getLocalizedDateTime(locale, firstParsedDatetime,
|
|
19675
|
+
this.dateText = getLocalizedDateTime(locale, firstParsedDatetime, formatOptions?.date ?? { month: 'short', day: 'numeric', year: 'numeric' });
|
|
20020
19676
|
}
|
|
20021
19677
|
break;
|
|
20022
19678
|
case 'time':
|
|
@@ -20253,11 +19909,11 @@ class DatetimeButton {
|
|
|
20253
19909
|
render() {
|
|
20254
19910
|
const { color, dateText, timeText, selectedButton, datetimeActive, disabled } = this;
|
|
20255
19911
|
const theme = getIonTheme(this);
|
|
20256
|
-
return (hAsync(Host, { key: '
|
|
19912
|
+
return (hAsync(Host, { key: '73ba9456313d46e63db37c48b23b38e8e1f88ec6', class: createColorClasses$1(color, {
|
|
20257
19913
|
[theme]: true,
|
|
20258
19914
|
[`${selectedButton}-active`]: datetimeActive,
|
|
20259
19915
|
['datetime-button-disabled']: disabled,
|
|
20260
|
-
}) }, dateText && (hAsync("button", { key: '
|
|
19916
|
+
}) }, dateText && (hAsync("button", { key: '51f70f2d08823ccd399976c09152c278e0ef108e', class: "ion-activatable", id: "date-button", "aria-expanded": datetimeActive ? 'true' : 'false', onClick: this.handleDateClick, disabled: disabled, part: "native", ref: (el) => (this.dateTargetEl = el) }, hAsync("slot", { key: '8422d6ca39d3bdecbefe6686afb9c2bcdb271a54', name: "date-target" }, dateText), theme === 'md' && hAsync("ion-ripple-effect", { key: 'f4c1c9c6bcdf772eb326371b9ab3795f7fbc0848' }))), timeText && (hAsync("button", { key: '709a8bc9d0231bfc3c580bcca9065ccc66f4b7da', class: "ion-activatable", id: "time-button", "aria-expanded": datetimeActive ? 'true' : 'false', onClick: this.handleTimeClick, disabled: disabled, part: "native", ref: (el) => (this.timeTargetEl = el) }, hAsync("slot", { key: '2860f54f5a73aa3a42397a1a72619d6369a79025', name: "time-target" }, timeText), theme === 'md' && hAsync("ion-ripple-effect", { key: '306f594bffa84fea1f5e2528cab5ee56c0364e34' })))));
|
|
20261
19917
|
}
|
|
20262
19918
|
get el() { return getElement(this); }
|
|
20263
19919
|
static get style() { return {
|
|
@@ -25592,7 +25248,7 @@ class ItemGroup {
|
|
|
25592
25248
|
}; }
|
|
25593
25249
|
}
|
|
25594
25250
|
|
|
25595
|
-
const itemOptionIonicCss = () => `:host{background:var(--background);color:var(--color)}.button-native{color:inherit;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-align:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;white-space:inherit;display:inline-block;position:relative;width:100%;height:100%;border:0;outline:none;background:transparent;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-box-sizing:border-box;box-sizing:border-box}.button-inner{display:-ms-flexbox;display:flex;-ms-flex-flow:column nowrap;flex-flow:column 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%}.horizontal-wrapper{display:-ms-flexbox;display:flex;-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%}::slotted(*){-ms-flex-negative:0;flex-shrink:0}:host(.item-option-expandable){-ms-flex-negative:0;flex-shrink:0;-webkit-transition-duration:0;transition-duration:0;-webkit-transition-property:none;transition-property:none}:host(.item-option-disabled){pointer-events:none}:host(.item-option-disabled) .button-native{cursor:default;pointer-events:none}:host{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;font-family:var(--token-font-family, -apple-system, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");font-size:var(--token-font-size-350, 0.875rem);font-weight:var(--token-font-weight-medium, 500);letter-spacing:var(--token-font-letter-spacing-100, 0.01em);line-height:1.428571}.button-native{-webkit-padding-start:var(--token-space-200, var(--token-scale-200, 8px));padding-inline-start:var(--token-space-200, var(--token-scale-200, 8px));-webkit-padding-end:var(--token-space-200, var(--token-scale-200, 8px));padding-inline-end:var(--token-space-200, var(--token-scale-200, 8px));padding-top:var(--token-space-200, var(--token-scale-200, 8px));padding-bottom:var(--token-space-200, var(--token-scale-200, 8px));min-width:var(--token-scale-1600, 64px);height:var(--token-scale-1600, 64px)}::slotted([slot=top]){margin-left:0;margin-right:0;margin-top:0;margin-bottom:var(--token-space-100, var(--token-scale-100, 4px))}::slotted([slot=bottom]){margin-left:0;margin-right:0;margin-top:var(--token-space-100, var(--token-scale-100, 4px));margin-bottom:0}::slotted([slot=start]){-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:var(--token-space-100, var(--token-scale-100, 4px));margin-inline-end:var(--token-space-100, var(--token-scale-100, 4px));margin-top:0;margin-bottom:0}::slotted([slot=end]){-webkit-margin-start:var(--token-space-100, var(--token-scale-100, 4px));margin-inline-start:var(--token-space-100, var(--token-scale-100, 4px));-webkit-margin-end:0;margin-inline-end:0;margin-top:0;margin-bottom:0}::slotted(ion-icon),::slotted([slot=icon-only]){margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;min-width:initial;font-size:var(--token-font-size-500, 1.25rem)}:host(.item-option-round){border-radius:var(--token-border-radius-300, var(--token-scale-300, 12px))}:host(.item-option-soft){border-radius:var(--token-border-radius-200, var(--token-scale-200, 8px))}:host(.item-option-rectangular){border-radius:var(--token-border-radius-0, var(--token-scale-0, 0px))}:host(.item-option-disabled)::after{right:0;left:0;top:0;bottom:0;position:absolute;background-color:var(--token-state-disabled, rgba(255, 255, 255, 0.6));content:"";pointer-events:none}:host(.item-option-disabled) .button-native{opacity:1}:host(.item-option-subtle){--background:var(--ion-color-primary-subtle, var(--token-bg-primary-subtle-default, var(--token-semantics-primary-100, var(--token-primitives-blue-100, #f0f2ff))));--background-activated:var(--ion-color-primary-subtle-shade, var(--token-bg-primary-subtle-press, var(--token-semantics-primary-300, var(--token-primitives-blue-300, #d0d7fa))));--color:var(--ion-color-primary-subtle-contrast, var(--token-semantics-primary-900, var(--token-primitives-blue-900, #0d4bc3)))}:host(.item-option-subtle.ion-color){background:var(--ion-color-subtle-base);color:var(--ion-color-subtle-contrast)}:host(.item-option-bold){--background:var(--ion-color-primary, var(--token-bg-primary-base-default, var(--token-semantics-primary-base, var(--token-semantics-primary-700, var(--token-primitives-blue-700, #105cef)))));--background-activated:var(--ion-color-primary-shade, var(--token-bg-primary-base-press, var(--token-semantics-primary-900, var(--token-primitives-blue-900, #0d4bc3))));--color:var(--ion-color-primary-contrast, var(--token-text-
|
|
25251
|
+
const itemOptionIonicCss = () => `:host{background:var(--background);color:var(--color)}.button-native{color:inherit;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-align:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;white-space:inherit;display:inline-block;position:relative;width:100%;height:100%;border:0;outline:none;background:transparent;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-box-sizing:border-box;box-sizing:border-box}.button-inner{display:-ms-flexbox;display:flex;-ms-flex-flow:column nowrap;flex-flow:column 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%}.horizontal-wrapper{display:-ms-flexbox;display:flex;-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%}::slotted(*){-ms-flex-negative:0;flex-shrink:0}:host(.item-option-expandable){-ms-flex-negative:0;flex-shrink:0;-webkit-transition-duration:0;transition-duration:0;-webkit-transition-property:none;transition-property:none}:host(.item-option-disabled){pointer-events:none}:host(.item-option-disabled) .button-native{cursor:default;pointer-events:none}:host{padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;font-family:var(--token-font-family, -apple-system, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol");font-size:var(--token-font-size-350, 0.875rem);font-weight:var(--token-font-weight-medium, 500);letter-spacing:var(--token-font-letter-spacing-100, 0.01em);line-height:1.428571}.button-native{-webkit-padding-start:var(--token-space-200, var(--token-scale-200, 8px));padding-inline-start:var(--token-space-200, var(--token-scale-200, 8px));-webkit-padding-end:var(--token-space-200, var(--token-scale-200, 8px));padding-inline-end:var(--token-space-200, var(--token-scale-200, 8px));padding-top:var(--token-space-200, var(--token-scale-200, 8px));padding-bottom:var(--token-space-200, var(--token-scale-200, 8px));min-width:var(--token-scale-1600, 64px);height:var(--token-scale-1600, 64px)}::slotted([slot=top]){margin-left:0;margin-right:0;margin-top:0;margin-bottom:var(--token-space-100, var(--token-scale-100, 4px))}::slotted([slot=bottom]){margin-left:0;margin-right:0;margin-top:var(--token-space-100, var(--token-scale-100, 4px));margin-bottom:0}::slotted([slot=start]){-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:var(--token-space-100, var(--token-scale-100, 4px));margin-inline-end:var(--token-space-100, var(--token-scale-100, 4px));margin-top:0;margin-bottom:0}::slotted([slot=end]){-webkit-margin-start:var(--token-space-100, var(--token-scale-100, 4px));margin-inline-start:var(--token-space-100, var(--token-scale-100, 4px));-webkit-margin-end:0;margin-inline-end:0;margin-top:0;margin-bottom:0}::slotted(ion-icon),::slotted([slot=icon-only]){margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;min-width:initial;font-size:var(--token-font-size-500, 1.25rem)}:host(.item-option-round){border-radius:var(--token-border-radius-300, var(--token-scale-300, 12px))}:host(.item-option-soft){border-radius:var(--token-border-radius-200, var(--token-scale-200, 8px))}:host(.item-option-rectangular){border-radius:var(--token-border-radius-0, var(--token-scale-0, 0px))}:host(.item-option-disabled)::after{right:0;left:0;top:0;bottom:0;position:absolute;background-color:var(--token-state-disabled, rgba(255, 255, 255, 0.6));content:"";pointer-events:none}:host(.item-option-disabled) .button-native{opacity:1}:host(.item-option-subtle){--background:var(--ion-color-primary-subtle, var(--token-bg-primary-subtle-default, var(--token-semantics-primary-100, var(--token-primitives-blue-100, #f0f2ff))));--background-activated:var(--ion-color-primary-subtle-shade, var(--token-bg-primary-subtle-press, var(--token-semantics-primary-300, var(--token-primitives-blue-300, #d0d7fa))));--color:var(--ion-color-primary-subtle-contrast, var(--token-semantics-primary-900, var(--token-primitives-blue-900, #0d4bc3)))}:host(.item-option-subtle.ion-color){background:var(--ion-color-subtle-base);color:var(--ion-color-subtle-contrast)}:host(.item-option-bold){--background:var(--ion-color-primary, var(--token-bg-primary-base-default, var(--token-semantics-primary-base, var(--token-semantics-primary-700, var(--token-primitives-blue-700, #105cef)))));--background-activated:var(--ion-color-primary-shade, var(--token-bg-primary-base-press, var(--token-semantics-primary-900, var(--token-primitives-blue-900, #0d4bc3))));--color:var(--ion-color-primary-contrast, var(--token-text-light, var(--token-primitives-base-white, #ffffff)))}:host(.item-option-bold.ion-color){background:var(--ion-color-base);color:var(--ion-color-contrast)}:host(.item-option-expand-threshold){-webkit-filter:brightness(0.92);filter:brightness(0.92)}`;
|
|
25596
25252
|
|
|
25597
25253
|
const itemOptionIosCss = () => `:host{background:var(--background);color:var(--color)}.button-native{color:inherit;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-align:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;white-space:inherit;display:inline-block;position:relative;width:100%;height:100%;border:0;outline:none;background:transparent;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-box-sizing:border-box;box-sizing:border-box}.button-inner{display:-ms-flexbox;display:flex;-ms-flex-flow:column nowrap;flex-flow:column 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%}.horizontal-wrapper{display:-ms-flexbox;display:flex;-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%}::slotted(*){-ms-flex-negative:0;flex-shrink:0}:host(.item-option-expandable){-ms-flex-negative:0;flex-shrink:0;-webkit-transition-duration:0;transition-duration:0;-webkit-transition-property:none;transition-property:none}:host(.item-option-disabled){pointer-events:none}:host(.item-option-disabled) .button-native{cursor:default;pointer-events:none}:host{--background:var(--ion-color-primary, #0054e9);--color:var(--ion-color-primary-contrast, #fff);font-family:var(--ion-font-family, inherit)}:host(.ion-color){background:var(--ion-color-base);color:var(--ion-color-contrast)}.button-native{-webkit-padding-start:0.7em;padding-inline-start:0.7em;-webkit-padding-end:0.7em;padding-inline-end:0.7em;padding-top:0;padding-bottom:0}::slotted([slot=start]){-webkit-margin-start:0;margin-inline-start:0;-webkit-margin-end:5px;margin-inline-end:5px;margin-top:0;margin-bottom:0}::slotted([slot=end]){-webkit-margin-start:5px;margin-inline-start:5px;-webkit-margin-end:0;margin-inline-end:0;margin-top:0;margin-bottom:0}::slotted([slot=icon-only]){padding-left:0;padding-right:0;padding-top:0;padding-bottom:0;-webkit-margin-start:10px;margin-inline-start:10px;-webkit-margin-end:10px;margin-inline-end:10px;margin-top:0;margin-bottom:0;min-width:0.9em;font-size:1.8em}:host(.item-option-disabled) .button-native{opacity:0.5}:host(.item-option-expandable){-webkit-transition-timing-function:cubic-bezier(0.65, 0.05, 0.36, 1);transition-timing-function:cubic-bezier(0.65, 0.05, 0.36, 1)}:host{font-size:clamp(16px, 1rem, 35.2px)}:host(.ion-activated){background:var(--ion-color-primary-shade, #004acd)}:host(.ion-color.ion-activated){background:var(--ion-color-shade)}`;
|
|
25598
25254
|
|