@ionic/core 8.7.18-dev.11771365900.125bf49c → 8.7.18-dev.11772217280.122eed89
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-app.js +17 -12
- package/components/ion-checkbox.js +1 -1
- package/components/ion-content.js +1 -1
- package/components/ion-datetime.js +7 -4
- package/components/ion-fab-list.js +10 -3
- package/components/ion-img.js +11 -2
- package/components/ion-label.js +1 -1
- package/components/ion-modal.js +1 -1
- package/components/ion-popover.js +1 -1
- package/components/ion-radio-group.js +1 -1
- package/components/ion-searchbar.js +17 -6
- package/components/ion-select-modal.js +1 -1
- package/components/ion-select-popover.js +1 -1
- package/components/ion-select.js +8 -8
- package/components/{p-CJrGvZ1Z.js → p-51c2oSfC.js} +3 -3
- package/components/{p-BnpDIASH.js → p-BANeLH_G.js} +2 -2
- package/components/{p-D3KEyQ8e.js → p-BRLve2EP.js} +3 -3
- package/components/{p-DRHwNkVo.js → p-C6dkQWq2.js} +152 -30
- package/components/{p-CUfY9DTD.js → p-Cdm3dKWf.js} +8 -3
- package/components/{p-DyFBFrV7.js → p-D--b4514.js} +4 -4
- package/components/{p-DPm73mCi.js → p-DGOrLIyS.js} +7 -3
- package/components/{p-IHgAGzvW.js → p-iyo0Toaz.js} +326 -17
- package/dist/cjs/ion-app_8.cjs.entry.js +22 -13
- package/dist/cjs/ion-checkbox.cjs.entry.js +3 -3
- package/dist/cjs/ion-datetime_3.cjs.entry.js +6 -3
- package/dist/cjs/ion-fab_3.cjs.entry.js +10 -3
- package/dist/cjs/ion-img.cjs.entry.js +11 -2
- package/dist/cjs/ion-item_8.cjs.entry.js +8 -3
- package/dist/cjs/ion-modal.cjs.entry.js +326 -17
- package/dist/cjs/ion-popover.cjs.entry.js +152 -30
- package/dist/cjs/ion-radio_2.cjs.entry.js +2 -2
- package/dist/cjs/ion-searchbar.cjs.entry.js +17 -6
- package/dist/collection/components/app/app.js +15 -10
- package/dist/collection/components/checkbox/checkbox.js +4 -4
- package/dist/collection/components/content/content.js +7 -3
- package/dist/collection/components/datetime/datetime.js +6 -3
- package/dist/collection/components/fab-list/fab-list.js +10 -3
- package/dist/collection/components/img/img.js +11 -2
- package/dist/collection/components/label/label.js +8 -3
- package/dist/collection/components/modal/modal.ios.css +6 -5
- package/dist/collection/components/modal/modal.js +164 -15
- package/dist/collection/components/modal/modal.md.css +6 -5
- package/dist/collection/components/modal/safe-area-utils.js +165 -0
- package/dist/collection/components/popover/animations/ios.enter.js +33 -8
- package/dist/collection/components/popover/animations/md.enter.js +26 -6
- package/dist/collection/components/popover/utils.js +96 -19
- package/dist/collection/components/radio-group/radio-group.ios.css +0 -4
- package/dist/collection/components/radio-group/radio-group.md.css +0 -4
- package/dist/collection/components/searchbar/searchbar.js +17 -6
- package/dist/docs.json +1 -1
- package/dist/esm/ion-app_8.entry.js +24 -15
- package/dist/esm/ion-checkbox.entry.js +4 -4
- package/dist/esm/ion-datetime_3.entry.js +6 -3
- package/dist/esm/ion-fab_3.entry.js +10 -3
- package/dist/esm/ion-img.entry.js +11 -2
- package/dist/esm/ion-item_8.entry.js +8 -3
- package/dist/esm/ion-modal.entry.js +326 -17
- package/dist/esm/ion-popover.entry.js +152 -30
- package/dist/esm/ion-radio_2.entry.js +2 -2
- package/dist/esm/ion-searchbar.entry.js +17 -6
- package/dist/ionic/ionic.esm.js +1 -1
- package/dist/ionic/{p-72af946b.entry.js → p-2ac254dc.entry.js} +1 -1
- package/dist/ionic/p-7cad388a.entry.js +4 -0
- package/dist/ionic/p-7d218555.entry.js +4 -0
- package/dist/ionic/p-8303e3fc.entry.js +4 -0
- package/dist/ionic/p-915b3e3d.entry.js +4 -0
- package/dist/ionic/{p-eaf3f5ff.entry.js → p-b0ebf9f8.entry.js} +1 -1
- package/dist/ionic/p-e4c57008.entry.js +4 -0
- package/dist/ionic/p-e5d6d0f0.entry.js +4 -0
- package/dist/ionic/p-f1dfee25.entry.js +4 -0
- package/dist/ionic/{p-6444c606.entry.js → p-f9f7b9db.entry.js} +1 -1
- package/dist/types/components/app/app.d.ts +3 -0
- package/dist/types/components/datetime/datetime.d.ts +1 -0
- package/dist/types/components/fab-list/fab-list.d.ts +2 -0
- package/dist/types/components/img/img.d.ts +2 -0
- package/dist/types/components/label/label.d.ts +2 -0
- package/dist/types/components/modal/modal.d.ts +35 -0
- package/dist/types/components/modal/safe-area-utils.d.ts +66 -0
- package/dist/types/components/popover/utils.d.ts +23 -1
- package/dist/types/components/searchbar/searchbar.d.ts +3 -0
- package/hydrate/index.js +556 -73
- package/hydrate/index.mjs +556 -73
- package/package.json +1 -1
- package/dist/ionic/p-01e27965.entry.js +0 -4
- package/dist/ionic/p-3ec563c1.entry.js +0 -4
- package/dist/ionic/p-42db6404.entry.js +0 -4
- package/dist/ionic/p-46d74291.entry.js +0 -4
- package/dist/ionic/p-bc293244.entry.js +0 -4
- package/dist/ionic/p-d1f54e28.entry.js +0 -4
- package/dist/ionic/p-e338f669.entry.js +0 -4
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
/*!
|
|
2
2
|
* (C) Ionic http://ionicframework.com - MIT License
|
|
3
3
|
*/
|
|
4
|
-
import{r as t,h as o,d as a,g as r,c as i}from"./p-C8IsBmNU.js";import{b as n}from"./p-BFvmZNyx.js";import{i as e}from"./p-CTfR9YZG.js";import{h as s,o as c,c as l}from"./p-DiVJyqlX.js";import{t as b}from"./p-DV3sJJW8.js";const d=class{constructor(o){t(this,o),this.edge=!1,this.activated=!1}activatedChanged(){const t=this.activated,o=this.getFab();o&&(o.activated=t),Array.from(this.el.querySelectorAll("ion-fab-list")).forEach((o=>{o.activated=t}))}componentDidLoad(){this.activated&&this.activatedChanged()}async close(){this.activated=!1}getFab(){return this.el.querySelector("ion-fab-button")}async toggle(){this.el.querySelector("ion-fab-list")&&(this.activated=!this.activated)}render(){const{horizontal:t,vertical:r,edge:i}=this,e=n(this);return o(a,{key:"8a310806d0e748d7ebb0ed3d9a2652038e0f2960",class:{[e]:!0,[`fab-horizontal-${t}`]:void 0!==t,[`fab-vertical-${r}`]:void 0!==r,"fab-edge":i}},o("slot",{key:"9394ef6d6e5b0410fa6ba212171f687fb178ce2d"}))}get el(){return r(this)}static get watchers(){return{activated:["activatedChanged"]}}};d.style=":host{position:absolute;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;z-index:999}:host(.fab-horizontal-center){left:0px;right:0px;-webkit-margin-start:auto;margin-inline-start:auto;-webkit-margin-end:auto;margin-inline-end:auto}:host(.fab-horizontal-start){left:calc(10px + var(--ion-safe-area-left, 0px));}:host-context([dir=rtl]):host(.fab-horizontal-start),:host-context([dir=rtl]).fab-horizontal-start{right:calc(10px + var(--ion-safe-area-right, 0px));left:unset}@supports selector(:dir(rtl)){:host(.fab-horizontal-start:dir(rtl)){right:calc(10px + var(--ion-safe-area-right, 0px));left:unset}}:host(.fab-horizontal-end){right:calc(10px + var(--ion-safe-area-right, 0px));}:host-context([dir=rtl]):host(.fab-horizontal-end),:host-context([dir=rtl]).fab-horizontal-end{left:calc(10px + var(--ion-safe-area-left, 0px));right:unset}@supports selector(:dir(rtl)){:host(.fab-horizontal-end:dir(rtl)){left:calc(10px + var(--ion-safe-area-left, 0px));right:unset}}:host(.fab-vertical-top){top:10px}:host(.fab-vertical-top.fab-edge){top:0}:host(.fab-vertical-top.fab-edge) ::slotted(ion-fab-button){margin-top:-50%}:host(.fab-vertical-top.fab-edge) ::slotted(ion-fab-button.fab-button-small){margin-top:calc((-100% + 16px) / 2)}:host(.fab-vertical-top.fab-edge) ::slotted(ion-fab-list.fab-list-side-start),:host(.fab-vertical-top.fab-edge) ::slotted(ion-fab-list.fab-list-side-end){margin-top:-50%}:host(.fab-vertical-top.fab-edge) ::slotted(ion-fab-list.fab-list-side-top),:host(.fab-vertical-top.fab-edge) ::slotted(ion-fab-list.fab-list-side-bottom){margin-top:calc(50% + 10px)}:host(.fab-vertical-bottom){bottom:10px}:host(.fab-vertical-bottom.fab-edge){bottom:0}:host(.fab-vertical-bottom.fab-edge) ::slotted(ion-fab-button){margin-bottom:-50%}:host(.fab-vertical-bottom.fab-edge) ::slotted(ion-fab-button.fab-button-small){margin-bottom:calc((-100% + 16px) / 2)}:host(.fab-vertical-bottom.fab-edge) ::slotted(ion-fab-list.fab-list-side-start),:host(.fab-vertical-bottom.fab-edge) ::slotted(ion-fab-list.fab-list-side-end){margin-bottom:-50%}:host(.fab-vertical-bottom.fab-edge) ::slotted(ion-fab-list.fab-list-side-top),:host(.fab-vertical-bottom.fab-edge) ::slotted(ion-fab-list.fab-list-side-bottom){margin-bottom:calc(50% + 10px)}:host(.fab-vertical-center){top:0px;bottom:0px;margin-top:auto;margin-bottom:auto}";const f=class{constructor(o){t(this,o),this.ionFocus=i(this,"ionFocus",7),this.ionBlur=i(this,"ionBlur",7),this.fab=null,this.inheritedAttributes={},this.activated=!1,this.disabled=!1,this.routerDirection="forward",this.show=!1,this.translucent=!1,this.type="button",this.closeIcon=b,this.onFocus=()=>{this.ionFocus.emit()},this.onBlur=()=>{this.ionBlur.emit()},this.onClick=()=>{const{fab:t}=this;t&&t.toggle()}}connectedCallback(){this.fab=this.el.closest("ion-fab")}componentWillLoad(){this.inheritedAttributes=e(this.el)}render(){const{el:t,disabled:r,color:i,href:e,activated:b,show:d,translucent:f,size:p,inheritedAttributes:h}=this,g=s("ion-fab-list",t),u=n(this),v=void 0===e?"button":"a",m="button"===v?{type:this.type}:{download:this.download,href:e,rel:this.rel,target:this.target};return o(a,{key:"4eee204d20b0e2ffed49a88f6cb3e04b6697965c",onClick:this.onClick,"aria-disabled":r?"true":null,class:l(i,{[u]:!0,"fab-button-in-list":g,"fab-button-translucent-in-list":g&&f,"fab-button-close-active":b,"fab-button-show":d,"fab-button-disabled":r,"fab-button-translucent":f,"ion-activatable":!0,"ion-focusable":!0,[`fab-button-${p}`]:void 0!==p})},o(v,Object.assign({key:"914561622c0c6bd41453e828a7d8a39f924875ac"},m,{class:"button-native",part:"native",disabled:r,onFocus:this.onFocus,onBlur:this.onBlur,onClick:t=>c(e,t,this.routerDirection,this.routerAnimation)},h),o("ion-icon",{key:"2c8090742a64c62a79243667027a195cca9d5912","aria-hidden":"true",icon:this.closeIcon,part:"close-icon",class:"close-icon",lazy:!1}),o("span",{key:"c3e55291e4c4d306d34a4b95dd2e727e87bdf39c",class:"button-inner"},o("slot",{key:"f8e57f71d8f8878d9746cfece82f57f19ef9e988"})),"md"===u&&o("ion-ripple-effect",{key:"a5e94fa0bb9836072300617245ed0c1b4887bac6"})))}get el(){return r(this)}};f.style={ios:':host{--color-activated:var(--color);--color-focused:var(--color);--color-hover:var(--color);--background-hover:var(--ion-color-primary-contrast, #fff);--background-hover-opacity:.08;--transition:background-color, opacity 100ms linear;--ripple-color:currentColor;--border-radius:50%;--border-width:0;--border-style:none;--border-color:initial;--padding-top:0;--padding-end:0;--padding-bottom:0;--padding-start:0;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;display:block;width:56px;height:56px;font-size:14px;text-align:center;text-overflow:ellipsis;text-transform:none;white-space:nowrap;-webkit-font-kerning:none;font-kerning:none}.button-native{border-radius:var(--border-radius);-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit;display:block;position:relative;width:100%;height:100%;-webkit-transform:var(--transform);transform:var(--transform);-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);background-clip:padding-box;color:var(--color);-webkit-box-shadow:var(--box-shadow);box-shadow:var(--box-shadow);contain:strict;cursor:pointer;overflow:hidden;z-index:0;-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-box-sizing:border-box;box-sizing:border-box}::slotted(ion-icon){line-height:1}.button-native::after{left:0;right:0;top:0;bottom:0;position:absolute;content:"";opacity:0}.button-inner{left:0;right:0;top:0;display:-ms-flexbox;display:flex;position:absolute;-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;height:100%;-webkit-transition:all ease-in-out 300ms;transition:all ease-in-out 300ms;-webkit-transition-property:opacity, -webkit-transform;transition-property:opacity, -webkit-transform;transition-property:transform, opacity;transition-property:transform, opacity, -webkit-transform;z-index:1}:host(.fab-button-disabled){cursor:default;opacity:0.5;pointer-events:none}@media (any-hover: hover){:host(:hover) .button-native{color:var(--color-hover)}:host(:hover) .button-native::after{background:var(--background-hover);opacity:var(--background-hover-opacity)}}:host(.ion-focused) .button-native{color:var(--color-focused)}:host(.ion-focused) .button-native::after{background:var(--background-focused);opacity:var(--background-focused-opacity)}:host(.ion-activated) .button-native{color:var(--color-activated)}:host(.ion-activated) .button-native::after{background:var(--background-activated);opacity:var(--background-activated-opacity)}::slotted(ion-icon){line-height:1}:host(.fab-button-small){-webkit-margin-start:8px;margin-inline-start:8px;-webkit-margin-end:8px;margin-inline-end:8px;margin-top:8px;margin-bottom:8px;width:40px;height:40px}.close-icon{-webkit-margin-start:auto;margin-inline-start:auto;-webkit-margin-end:auto;margin-inline-end:auto;margin-top:0;margin-bottom:0;left:0;right:0;top:0;position:absolute;height:100%;-webkit-transform:scale(0.4) rotateZ(-45deg);transform:scale(0.4) rotateZ(-45deg);-webkit-transition:all ease-in-out 300ms;transition:all ease-in-out 300ms;-webkit-transition-property:opacity, -webkit-transform;transition-property:opacity, -webkit-transform;transition-property:transform, opacity;transition-property:transform, opacity, -webkit-transform;font-size:var(--close-icon-font-size);opacity:0;z-index:1}:host(.fab-button-close-active) .close-icon{-webkit-transform:scale(1) rotateZ(0deg);transform:scale(1) rotateZ(0deg);opacity:1}:host(.fab-button-close-active) .button-inner{-webkit-transform:scale(0.4) rotateZ(45deg);transform:scale(0.4) rotateZ(45deg);opacity:0}ion-ripple-effect{color:var(--ripple-color)}@supports ((-webkit-backdrop-filter: blur(0)) or (backdrop-filter: blur(0))){:host(.fab-button-translucent) .button-native{-webkit-backdrop-filter:var(--backdrop-filter);backdrop-filter:var(--backdrop-filter)}}:host(.ion-color) .button-native{background:var(--ion-color-base);color:var(--ion-color-contrast)}:host{--background:var(--ion-color-primary, #0054e9);--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;--color:var(--ion-color-primary-contrast, #fff);--box-shadow:0 4px 16px rgba(0, 0, 0, 0.12);--transition:0.2s transform cubic-bezier(0.25, 1.11, 0.78, 1.59);--close-icon-font-size:28px}:host(.ion-activated){--box-shadow:0 4px 16px rgba(0, 0, 0, 0.12);--transform:scale(1.1);--transition:0.2s transform ease-out}::slotted(ion-icon){font-size:28px}:host(.fab-button-in-list){--background:var(--ion-color-light, #f4f5f8);--background-activated:var(--ion-color-light-shade, #d7d8da);--background-focused:var(--background-activated);--background-hover:var(--ion-color-light-tint, #f5f6f9);--color:var(--ion-color-light-contrast, #000);--color-activated:var(--ion-color-light-contrast, #000);--color-focused:var(--color-activated);--transition:transform 200ms ease 10ms, opacity 200ms ease 10ms}:host(.fab-button-in-list) ::slotted(ion-icon){font-size:18px}:host(.ion-color.ion-focused) .button-native::after{background:var(--ion-color-shade)}:host(.ion-color.ion-focused) .button-native,:host(.ion-color.ion-activated) .button-native{color:var(--ion-color-contrast)}:host(.ion-color.ion-focused) .button-native::after,:host(.ion-color.ion-activated) .button-native::after{background:var(--ion-color-shade)}@media (any-hover: hover){:host(.ion-color:hover) .button-native{color:var(--ion-color-contrast)}:host(.ion-color:hover) .button-native::after{background:var(--ion-color-tint)}}@supports ((-webkit-backdrop-filter: blur(0)) or (backdrop-filter: blur(0))){:host(.fab-button-translucent){--background:rgba(var(--ion-color-primary-rgb, 0, 84, 233), 0.9);--background-hover:rgba(var(--ion-color-primary-rgb, 0, 84, 233), 0.8);--background-focused:rgba(var(--ion-color-primary-rgb, 0, 84, 233), 0.82);--backdrop-filter:saturate(180%) blur(20px)}:host(.fab-button-translucent-in-list){--background:rgba(var(--ion-color-light-rgb, 244, 245, 248), 0.9);--background-hover:rgba(var(--ion-color-light-rgb, 244, 245, 248), 0.8);--background-focused:rgba(var(--ion-color-light-rgb, 244, 245, 248), 0.82)}}@supports ((-webkit-backdrop-filter: blur(0)) or (backdrop-filter: blur(0))){@media (any-hover: hover){:host(.fab-button-translucent.ion-color:hover) .button-native{background:rgba(var(--ion-color-base-rgb), 0.8)}}:host(.ion-color.fab-button-translucent) .button-native{background:rgba(var(--ion-color-base-rgb), 0.9)}:host(.ion-color.ion-focused.fab-button-translucent) .button-native,:host(.ion-color.ion-activated.fab-button-translucent) .button-native{background:var(--ion-color-base)}}',md:':host{--color-activated:var(--color);--color-focused:var(--color);--color-hover:var(--color);--background-hover:var(--ion-color-primary-contrast, #fff);--background-hover-opacity:.08;--transition:background-color, opacity 100ms linear;--ripple-color:currentColor;--border-radius:50%;--border-width:0;--border-style:none;--border-color:initial;--padding-top:0;--padding-end:0;--padding-bottom:0;--padding-start:0;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;display:block;width:56px;height:56px;font-size:14px;text-align:center;text-overflow:ellipsis;text-transform:none;white-space:nowrap;-webkit-font-kerning:none;font-kerning:none}.button-native{border-radius:var(--border-radius);-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit;display:block;position:relative;width:100%;height:100%;-webkit-transform:var(--transform);transform:var(--transform);-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);background-clip:padding-box;color:var(--color);-webkit-box-shadow:var(--box-shadow);box-shadow:var(--box-shadow);contain:strict;cursor:pointer;overflow:hidden;z-index:0;-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-box-sizing:border-box;box-sizing:border-box}::slotted(ion-icon){line-height:1}.button-native::after{left:0;right:0;top:0;bottom:0;position:absolute;content:"";opacity:0}.button-inner{left:0;right:0;top:0;display:-ms-flexbox;display:flex;position:absolute;-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;height:100%;-webkit-transition:all ease-in-out 300ms;transition:all ease-in-out 300ms;-webkit-transition-property:opacity, -webkit-transform;transition-property:opacity, -webkit-transform;transition-property:transform, opacity;transition-property:transform, opacity, -webkit-transform;z-index:1}:host(.fab-button-disabled){cursor:default;opacity:0.5;pointer-events:none}@media (any-hover: hover){:host(:hover) .button-native{color:var(--color-hover)}:host(:hover) .button-native::after{background:var(--background-hover);opacity:var(--background-hover-opacity)}}:host(.ion-focused) .button-native{color:var(--color-focused)}:host(.ion-focused) .button-native::after{background:var(--background-focused);opacity:var(--background-focused-opacity)}:host(.ion-activated) .button-native{color:var(--color-activated)}:host(.ion-activated) .button-native::after{background:var(--background-activated);opacity:var(--background-activated-opacity)}::slotted(ion-icon){line-height:1}:host(.fab-button-small){-webkit-margin-start:8px;margin-inline-start:8px;-webkit-margin-end:8px;margin-inline-end:8px;margin-top:8px;margin-bottom:8px;width:40px;height:40px}.close-icon{-webkit-margin-start:auto;margin-inline-start:auto;-webkit-margin-end:auto;margin-inline-end:auto;margin-top:0;margin-bottom:0;left:0;right:0;top:0;position:absolute;height:100%;-webkit-transform:scale(0.4) rotateZ(-45deg);transform:scale(0.4) rotateZ(-45deg);-webkit-transition:all ease-in-out 300ms;transition:all ease-in-out 300ms;-webkit-transition-property:opacity, -webkit-transform;transition-property:opacity, -webkit-transform;transition-property:transform, opacity;transition-property:transform, opacity, -webkit-transform;font-size:var(--close-icon-font-size);opacity:0;z-index:1}:host(.fab-button-close-active) .close-icon{-webkit-transform:scale(1) rotateZ(0deg);transform:scale(1) rotateZ(0deg);opacity:1}:host(.fab-button-close-active) .button-inner{-webkit-transform:scale(0.4) rotateZ(45deg);transform:scale(0.4) rotateZ(45deg);opacity:0}ion-ripple-effect{color:var(--ripple-color)}@supports ((-webkit-backdrop-filter: blur(0)) or (backdrop-filter: blur(0))){:host(.fab-button-translucent) .button-native{-webkit-backdrop-filter:var(--backdrop-filter);backdrop-filter:var(--backdrop-filter)}}:host(.ion-color) .button-native{background:var(--ion-color-base);color:var(--ion-color-contrast)}:host{--background:var(--ion-color-primary, #0054e9);--background-activated:transparent;--background-focused:currentColor;--background-hover:currentColor;--background-activated-opacity:0;--background-focused-opacity:.24;--background-hover-opacity:.08;--color:var(--ion-color-primary-contrast, #fff);--box-shadow:0 3px 5px -1px rgba(0, 0, 0, 0.2), 0 6px 10px 0 rgba(0, 0, 0, 0.14), 0 1px 18px 0 rgba(0, 0, 0, 0.12);--transition:box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1), background-color 280ms cubic-bezier(0.4, 0, 0.2, 1), color 280ms cubic-bezier(0.4, 0, 0.2, 1), opacity 15ms linear 30ms, transform 270ms cubic-bezier(0, 0, 0.2, 1) 0ms;--close-icon-font-size:24px}:host(.ion-activated){--box-shadow:0 7px 8px -4px rgba(0, 0, 0, 0.2), 0 12px 17px 2px rgba(0, 0, 0, 0.14), 0 5px 22px 4px rgba(0, 0, 0, 0.12)}::slotted(ion-icon){font-size:24px}:host(.fab-button-in-list){--color:rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.54);--color-activated:rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.54);--color-focused:var(--color-activated);--background:var(--ion-color-light, #f4f5f8);--background-activated:transparent;--background-focused:var(--ion-color-light-shade, #d7d8da);--background-hover:var(--ion-color-light-tint, #f5f6f9)}:host(.fab-button-in-list) ::slotted(ion-icon){font-size:18px}:host(.ion-color.ion-focused) .button-native{color:var(--ion-color-contrast)}:host(.ion-color.ion-focused) .button-native::after{background:var(--ion-color-contrast)}:host(.ion-color.ion-activated) .button-native{color:var(--ion-color-contrast)}:host(.ion-color.ion-activated) .button-native::after{background:transparent}@media (any-hover: hover){:host(.ion-color:hover) .button-native{color:var(--ion-color-contrast)}:host(.ion-color:hover) .button-native::after{background:var(--ion-color-contrast)}}'};const p=class{constructor(o){t(this,o),this.activated=!1,this.side="bottom"}activatedChanged(t){const o=Array.from(this.el.querySelectorAll("ion-fab-button")),a=t?30:0;o.forEach(((o,r)=>{setTimeout((()=>o.show=t),r*a)}))}render(){const t=n(this);return o(a,{key:"64b33366447f66c7f979cfac56307fbb1a6fac1c",class:{[t]:!0,"fab-list-active":this.activated,[`fab-list-side-${this.side}`]:!0}},o("slot",{key:"d9f474f7f20fd7e813db358fddc720534ca05bb6"}))}get el(){return r(this)}static get watchers(){return{activated:["activatedChanged"]}}};p.style=":host{margin-left:0;margin-right:0;margin-top:calc(100% + 10px);margin-bottom:calc(100% + 10px);display:none;position:absolute;top:0;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center;min-width:56px;min-height:56px}:host(.fab-list-active){display:-ms-flexbox;display:flex}::slotted(.fab-button-in-list){margin-left:0;margin-right:0;margin-top:8px;margin-bottom:8px;width:40px;height:40px;-webkit-transform:scale(0);transform:scale(0);opacity:0;visibility:hidden}:host(.fab-list-side-top) ::slotted(.fab-button-in-list),:host(.fab-list-side-bottom) ::slotted(.fab-button-in-list){margin-left:0;margin-right:0;margin-top:5px;margin-bottom:5px}:host(.fab-list-side-start) ::slotted(.fab-button-in-list),:host(.fab-list-side-end) ::slotted(.fab-button-in-list){-webkit-margin-start:5px;margin-inline-start:5px;-webkit-margin-end:5px;margin-inline-end:5px;margin-top:0;margin-bottom:0}::slotted(.fab-button-in-list.fab-button-show){-webkit-transform:scale(1);transform:scale(1);opacity:1;visibility:visible}:host(.fab-list-side-top){top:auto;bottom:0;-ms-flex-direction:column-reverse;flex-direction:column-reverse}:host(.fab-list-side-start){-webkit-margin-start:calc(100% + 10px);margin-inline-start:calc(100% + 10px);-webkit-margin-end:calc(100% + 10px);margin-inline-end:calc(100% + 10px);margin-top:0;margin-bottom:0;-ms-flex-direction:row-reverse;flex-direction:row-reverse}:host(.fab-list-side-start){inset-inline-end:0}:host(.fab-list-side-end){-webkit-margin-start:calc(100% + 10px);margin-inline-start:calc(100% + 10px);-webkit-margin-end:calc(100% + 10px);margin-inline-end:calc(100% + 10px);margin-top:0;margin-bottom:0;-ms-flex-direction:row;flex-direction:row}:host(.fab-list-side-end){inset-inline-start:0}";export{d as ion_fab,f as ion_fab_button,p as ion_fab_list}
|
|
4
|
+
import{r as t,h as o,d as a,g as i,c as r}from"./p-C8IsBmNU.js";import{b as n}from"./p-BFvmZNyx.js";import{i as e}from"./p-CTfR9YZG.js";import{h as s,o as c,c as l}from"./p-DiVJyqlX.js";import{t as b}from"./p-DV3sJJW8.js";const d=class{constructor(o){t(this,o),this.edge=!1,this.activated=!1}activatedChanged(){const t=this.activated,o=this.getFab();o&&(o.activated=t),Array.from(this.el.querySelectorAll("ion-fab-list")).forEach((o=>{o.activated=t}))}componentDidLoad(){this.activated&&this.activatedChanged()}async close(){this.activated=!1}getFab(){return this.el.querySelector("ion-fab-button")}async toggle(){this.el.querySelector("ion-fab-list")&&(this.activated=!this.activated)}render(){const{horizontal:t,vertical:i,edge:r}=this,e=n(this);return o(a,{key:"8a310806d0e748d7ebb0ed3d9a2652038e0f2960",class:{[e]:!0,[`fab-horizontal-${t}`]:void 0!==t,[`fab-vertical-${i}`]:void 0!==i,"fab-edge":r}},o("slot",{key:"9394ef6d6e5b0410fa6ba212171f687fb178ce2d"}))}get el(){return i(this)}static get watchers(){return{activated:["activatedChanged"]}}};d.style=":host{position:absolute;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;z-index:999}:host(.fab-horizontal-center){left:0px;right:0px;-webkit-margin-start:auto;margin-inline-start:auto;-webkit-margin-end:auto;margin-inline-end:auto}:host(.fab-horizontal-start){left:calc(10px + var(--ion-safe-area-left, 0px));}:host-context([dir=rtl]):host(.fab-horizontal-start),:host-context([dir=rtl]).fab-horizontal-start{right:calc(10px + var(--ion-safe-area-right, 0px));left:unset}@supports selector(:dir(rtl)){:host(.fab-horizontal-start:dir(rtl)){right:calc(10px + var(--ion-safe-area-right, 0px));left:unset}}:host(.fab-horizontal-end){right:calc(10px + var(--ion-safe-area-right, 0px));}:host-context([dir=rtl]):host(.fab-horizontal-end),:host-context([dir=rtl]).fab-horizontal-end{left:calc(10px + var(--ion-safe-area-left, 0px));right:unset}@supports selector(:dir(rtl)){:host(.fab-horizontal-end:dir(rtl)){left:calc(10px + var(--ion-safe-area-left, 0px));right:unset}}:host(.fab-vertical-top){top:10px}:host(.fab-vertical-top.fab-edge){top:0}:host(.fab-vertical-top.fab-edge) ::slotted(ion-fab-button){margin-top:-50%}:host(.fab-vertical-top.fab-edge) ::slotted(ion-fab-button.fab-button-small){margin-top:calc((-100% + 16px) / 2)}:host(.fab-vertical-top.fab-edge) ::slotted(ion-fab-list.fab-list-side-start),:host(.fab-vertical-top.fab-edge) ::slotted(ion-fab-list.fab-list-side-end){margin-top:-50%}:host(.fab-vertical-top.fab-edge) ::slotted(ion-fab-list.fab-list-side-top),:host(.fab-vertical-top.fab-edge) ::slotted(ion-fab-list.fab-list-side-bottom){margin-top:calc(50% + 10px)}:host(.fab-vertical-bottom){bottom:10px}:host(.fab-vertical-bottom.fab-edge){bottom:0}:host(.fab-vertical-bottom.fab-edge) ::slotted(ion-fab-button){margin-bottom:-50%}:host(.fab-vertical-bottom.fab-edge) ::slotted(ion-fab-button.fab-button-small){margin-bottom:calc((-100% + 16px) / 2)}:host(.fab-vertical-bottom.fab-edge) ::slotted(ion-fab-list.fab-list-side-start),:host(.fab-vertical-bottom.fab-edge) ::slotted(ion-fab-list.fab-list-side-end){margin-bottom:-50%}:host(.fab-vertical-bottom.fab-edge) ::slotted(ion-fab-list.fab-list-side-top),:host(.fab-vertical-bottom.fab-edge) ::slotted(ion-fab-list.fab-list-side-bottom){margin-bottom:calc(50% + 10px)}:host(.fab-vertical-center){top:0px;bottom:0px;margin-top:auto;margin-bottom:auto}";const f=class{constructor(o){t(this,o),this.ionFocus=r(this,"ionFocus",7),this.ionBlur=r(this,"ionBlur",7),this.fab=null,this.inheritedAttributes={},this.activated=!1,this.disabled=!1,this.routerDirection="forward",this.show=!1,this.translucent=!1,this.type="button",this.closeIcon=b,this.onFocus=()=>{this.ionFocus.emit()},this.onBlur=()=>{this.ionBlur.emit()},this.onClick=()=>{const{fab:t}=this;t&&t.toggle()}}connectedCallback(){this.fab=this.el.closest("ion-fab")}componentWillLoad(){this.inheritedAttributes=e(this.el)}render(){const{el:t,disabled:i,color:r,href:e,activated:b,show:d,translucent:f,size:p,inheritedAttributes:h}=this,g=s("ion-fab-list",t),u=n(this),v=void 0===e?"button":"a",m="button"===v?{type:this.type}:{download:this.download,href:e,rel:this.rel,target:this.target};return o(a,{key:"4eee204d20b0e2ffed49a88f6cb3e04b6697965c",onClick:this.onClick,"aria-disabled":i?"true":null,class:l(r,{[u]:!0,"fab-button-in-list":g,"fab-button-translucent-in-list":g&&f,"fab-button-close-active":b,"fab-button-show":d,"fab-button-disabled":i,"fab-button-translucent":f,"ion-activatable":!0,"ion-focusable":!0,[`fab-button-${p}`]:void 0!==p})},o(v,Object.assign({key:"914561622c0c6bd41453e828a7d8a39f924875ac"},m,{class:"button-native",part:"native",disabled:i,onFocus:this.onFocus,onBlur:this.onBlur,onClick:t=>c(e,t,this.routerDirection,this.routerAnimation)},h),o("ion-icon",{key:"2c8090742a64c62a79243667027a195cca9d5912","aria-hidden":"true",icon:this.closeIcon,part:"close-icon",class:"close-icon",lazy:!1}),o("span",{key:"c3e55291e4c4d306d34a4b95dd2e727e87bdf39c",class:"button-inner"},o("slot",{key:"f8e57f71d8f8878d9746cfece82f57f19ef9e988"})),"md"===u&&o("ion-ripple-effect",{key:"a5e94fa0bb9836072300617245ed0c1b4887bac6"})))}get el(){return i(this)}};f.style={ios:':host{--color-activated:var(--color);--color-focused:var(--color);--color-hover:var(--color);--background-hover:var(--ion-color-primary-contrast, #fff);--background-hover-opacity:.08;--transition:background-color, opacity 100ms linear;--ripple-color:currentColor;--border-radius:50%;--border-width:0;--border-style:none;--border-color:initial;--padding-top:0;--padding-end:0;--padding-bottom:0;--padding-start:0;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;display:block;width:56px;height:56px;font-size:14px;text-align:center;text-overflow:ellipsis;text-transform:none;white-space:nowrap;-webkit-font-kerning:none;font-kerning:none}.button-native{border-radius:var(--border-radius);-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit;display:block;position:relative;width:100%;height:100%;-webkit-transform:var(--transform);transform:var(--transform);-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);background-clip:padding-box;color:var(--color);-webkit-box-shadow:var(--box-shadow);box-shadow:var(--box-shadow);contain:strict;cursor:pointer;overflow:hidden;z-index:0;-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-box-sizing:border-box;box-sizing:border-box}::slotted(ion-icon){line-height:1}.button-native::after{left:0;right:0;top:0;bottom:0;position:absolute;content:"";opacity:0}.button-inner{left:0;right:0;top:0;display:-ms-flexbox;display:flex;position:absolute;-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;height:100%;-webkit-transition:all ease-in-out 300ms;transition:all ease-in-out 300ms;-webkit-transition-property:opacity, -webkit-transform;transition-property:opacity, -webkit-transform;transition-property:transform, opacity;transition-property:transform, opacity, -webkit-transform;z-index:1}:host(.fab-button-disabled){cursor:default;opacity:0.5;pointer-events:none}@media (any-hover: hover){:host(:hover) .button-native{color:var(--color-hover)}:host(:hover) .button-native::after{background:var(--background-hover);opacity:var(--background-hover-opacity)}}:host(.ion-focused) .button-native{color:var(--color-focused)}:host(.ion-focused) .button-native::after{background:var(--background-focused);opacity:var(--background-focused-opacity)}:host(.ion-activated) .button-native{color:var(--color-activated)}:host(.ion-activated) .button-native::after{background:var(--background-activated);opacity:var(--background-activated-opacity)}::slotted(ion-icon){line-height:1}:host(.fab-button-small){-webkit-margin-start:8px;margin-inline-start:8px;-webkit-margin-end:8px;margin-inline-end:8px;margin-top:8px;margin-bottom:8px;width:40px;height:40px}.close-icon{-webkit-margin-start:auto;margin-inline-start:auto;-webkit-margin-end:auto;margin-inline-end:auto;margin-top:0;margin-bottom:0;left:0;right:0;top:0;position:absolute;height:100%;-webkit-transform:scale(0.4) rotateZ(-45deg);transform:scale(0.4) rotateZ(-45deg);-webkit-transition:all ease-in-out 300ms;transition:all ease-in-out 300ms;-webkit-transition-property:opacity, -webkit-transform;transition-property:opacity, -webkit-transform;transition-property:transform, opacity;transition-property:transform, opacity, -webkit-transform;font-size:var(--close-icon-font-size);opacity:0;z-index:1}:host(.fab-button-close-active) .close-icon{-webkit-transform:scale(1) rotateZ(0deg);transform:scale(1) rotateZ(0deg);opacity:1}:host(.fab-button-close-active) .button-inner{-webkit-transform:scale(0.4) rotateZ(45deg);transform:scale(0.4) rotateZ(45deg);opacity:0}ion-ripple-effect{color:var(--ripple-color)}@supports ((-webkit-backdrop-filter: blur(0)) or (backdrop-filter: blur(0))){:host(.fab-button-translucent) .button-native{-webkit-backdrop-filter:var(--backdrop-filter);backdrop-filter:var(--backdrop-filter)}}:host(.ion-color) .button-native{background:var(--ion-color-base);color:var(--ion-color-contrast)}:host{--background:var(--ion-color-primary, #0054e9);--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;--color:var(--ion-color-primary-contrast, #fff);--box-shadow:0 4px 16px rgba(0, 0, 0, 0.12);--transition:0.2s transform cubic-bezier(0.25, 1.11, 0.78, 1.59);--close-icon-font-size:28px}:host(.ion-activated){--box-shadow:0 4px 16px rgba(0, 0, 0, 0.12);--transform:scale(1.1);--transition:0.2s transform ease-out}::slotted(ion-icon){font-size:28px}:host(.fab-button-in-list){--background:var(--ion-color-light, #f4f5f8);--background-activated:var(--ion-color-light-shade, #d7d8da);--background-focused:var(--background-activated);--background-hover:var(--ion-color-light-tint, #f5f6f9);--color:var(--ion-color-light-contrast, #000);--color-activated:var(--ion-color-light-contrast, #000);--color-focused:var(--color-activated);--transition:transform 200ms ease 10ms, opacity 200ms ease 10ms}:host(.fab-button-in-list) ::slotted(ion-icon){font-size:18px}:host(.ion-color.ion-focused) .button-native::after{background:var(--ion-color-shade)}:host(.ion-color.ion-focused) .button-native,:host(.ion-color.ion-activated) .button-native{color:var(--ion-color-contrast)}:host(.ion-color.ion-focused) .button-native::after,:host(.ion-color.ion-activated) .button-native::after{background:var(--ion-color-shade)}@media (any-hover: hover){:host(.ion-color:hover) .button-native{color:var(--ion-color-contrast)}:host(.ion-color:hover) .button-native::after{background:var(--ion-color-tint)}}@supports ((-webkit-backdrop-filter: blur(0)) or (backdrop-filter: blur(0))){:host(.fab-button-translucent){--background:rgba(var(--ion-color-primary-rgb, 0, 84, 233), 0.9);--background-hover:rgba(var(--ion-color-primary-rgb, 0, 84, 233), 0.8);--background-focused:rgba(var(--ion-color-primary-rgb, 0, 84, 233), 0.82);--backdrop-filter:saturate(180%) blur(20px)}:host(.fab-button-translucent-in-list){--background:rgba(var(--ion-color-light-rgb, 244, 245, 248), 0.9);--background-hover:rgba(var(--ion-color-light-rgb, 244, 245, 248), 0.8);--background-focused:rgba(var(--ion-color-light-rgb, 244, 245, 248), 0.82)}}@supports ((-webkit-backdrop-filter: blur(0)) or (backdrop-filter: blur(0))){@media (any-hover: hover){:host(.fab-button-translucent.ion-color:hover) .button-native{background:rgba(var(--ion-color-base-rgb), 0.8)}}:host(.ion-color.fab-button-translucent) .button-native{background:rgba(var(--ion-color-base-rgb), 0.9)}:host(.ion-color.ion-focused.fab-button-translucent) .button-native,:host(.ion-color.ion-activated.fab-button-translucent) .button-native{background:var(--ion-color-base)}}',md:':host{--color-activated:var(--color);--color-focused:var(--color);--color-hover:var(--color);--background-hover:var(--ion-color-primary-contrast, #fff);--background-hover-opacity:.08;--transition:background-color, opacity 100ms linear;--ripple-color:currentColor;--border-radius:50%;--border-width:0;--border-style:none;--border-color:initial;--padding-top:0;--padding-end:0;--padding-bottom:0;--padding-start:0;margin-left:0;margin-right:0;margin-top:0;margin-bottom:0;display:block;width:56px;height:56px;font-size:14px;text-align:center;text-overflow:ellipsis;text-transform:none;white-space:nowrap;-webkit-font-kerning:none;font-kerning:none}.button-native{border-radius:var(--border-radius);-webkit-padding-start:var(--padding-start);padding-inline-start:var(--padding-start);-webkit-padding-end:var(--padding-end);padding-inline-end:var(--padding-end);padding-top:var(--padding-top);padding-bottom:var(--padding-bottom);font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;letter-spacing:inherit;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;text-align:inherit;white-space:inherit;color:inherit;display:block;position:relative;width:100%;height:100%;-webkit-transform:var(--transform);transform:var(--transform);-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);background-clip:padding-box;color:var(--color);-webkit-box-shadow:var(--box-shadow);box-shadow:var(--box-shadow);contain:strict;cursor:pointer;overflow:hidden;z-index:0;-webkit-appearance:none;-moz-appearance:none;appearance:none;-webkit-box-sizing:border-box;box-sizing:border-box}::slotted(ion-icon){line-height:1}.button-native::after{left:0;right:0;top:0;bottom:0;position:absolute;content:"";opacity:0}.button-inner{left:0;right:0;top:0;display:-ms-flexbox;display:flex;position:absolute;-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;height:100%;-webkit-transition:all ease-in-out 300ms;transition:all ease-in-out 300ms;-webkit-transition-property:opacity, -webkit-transform;transition-property:opacity, -webkit-transform;transition-property:transform, opacity;transition-property:transform, opacity, -webkit-transform;z-index:1}:host(.fab-button-disabled){cursor:default;opacity:0.5;pointer-events:none}@media (any-hover: hover){:host(:hover) .button-native{color:var(--color-hover)}:host(:hover) .button-native::after{background:var(--background-hover);opacity:var(--background-hover-opacity)}}:host(.ion-focused) .button-native{color:var(--color-focused)}:host(.ion-focused) .button-native::after{background:var(--background-focused);opacity:var(--background-focused-opacity)}:host(.ion-activated) .button-native{color:var(--color-activated)}:host(.ion-activated) .button-native::after{background:var(--background-activated);opacity:var(--background-activated-opacity)}::slotted(ion-icon){line-height:1}:host(.fab-button-small){-webkit-margin-start:8px;margin-inline-start:8px;-webkit-margin-end:8px;margin-inline-end:8px;margin-top:8px;margin-bottom:8px;width:40px;height:40px}.close-icon{-webkit-margin-start:auto;margin-inline-start:auto;-webkit-margin-end:auto;margin-inline-end:auto;margin-top:0;margin-bottom:0;left:0;right:0;top:0;position:absolute;height:100%;-webkit-transform:scale(0.4) rotateZ(-45deg);transform:scale(0.4) rotateZ(-45deg);-webkit-transition:all ease-in-out 300ms;transition:all ease-in-out 300ms;-webkit-transition-property:opacity, -webkit-transform;transition-property:opacity, -webkit-transform;transition-property:transform, opacity;transition-property:transform, opacity, -webkit-transform;font-size:var(--close-icon-font-size);opacity:0;z-index:1}:host(.fab-button-close-active) .close-icon{-webkit-transform:scale(1) rotateZ(0deg);transform:scale(1) rotateZ(0deg);opacity:1}:host(.fab-button-close-active) .button-inner{-webkit-transform:scale(0.4) rotateZ(45deg);transform:scale(0.4) rotateZ(45deg);opacity:0}ion-ripple-effect{color:var(--ripple-color)}@supports ((-webkit-backdrop-filter: blur(0)) or (backdrop-filter: blur(0))){:host(.fab-button-translucent) .button-native{-webkit-backdrop-filter:var(--backdrop-filter);backdrop-filter:var(--backdrop-filter)}}:host(.ion-color) .button-native{background:var(--ion-color-base);color:var(--ion-color-contrast)}:host{--background:var(--ion-color-primary, #0054e9);--background-activated:transparent;--background-focused:currentColor;--background-hover:currentColor;--background-activated-opacity:0;--background-focused-opacity:.24;--background-hover-opacity:.08;--color:var(--ion-color-primary-contrast, #fff);--box-shadow:0 3px 5px -1px rgba(0, 0, 0, 0.2), 0 6px 10px 0 rgba(0, 0, 0, 0.14), 0 1px 18px 0 rgba(0, 0, 0, 0.12);--transition:box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1), background-color 280ms cubic-bezier(0.4, 0, 0.2, 1), color 280ms cubic-bezier(0.4, 0, 0.2, 1), opacity 15ms linear 30ms, transform 270ms cubic-bezier(0, 0, 0.2, 1) 0ms;--close-icon-font-size:24px}:host(.ion-activated){--box-shadow:0 7px 8px -4px rgba(0, 0, 0, 0.2), 0 12px 17px 2px rgba(0, 0, 0, 0.14), 0 5px 22px 4px rgba(0, 0, 0, 0.12)}::slotted(ion-icon){font-size:24px}:host(.fab-button-in-list){--color:rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.54);--color-activated:rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.54);--color-focused:var(--color-activated);--background:var(--ion-color-light, #f4f5f8);--background-activated:transparent;--background-focused:var(--ion-color-light-shade, #d7d8da);--background-hover:var(--ion-color-light-tint, #f5f6f9)}:host(.fab-button-in-list) ::slotted(ion-icon){font-size:18px}:host(.ion-color.ion-focused) .button-native{color:var(--ion-color-contrast)}:host(.ion-color.ion-focused) .button-native::after{background:var(--ion-color-contrast)}:host(.ion-color.ion-activated) .button-native{color:var(--ion-color-contrast)}:host(.ion-color.ion-activated) .button-native::after{background:transparent}@media (any-hover: hover){:host(.ion-color:hover) .button-native{color:var(--ion-color-contrast)}:host(.ion-color:hover) .button-native::after{background:var(--ion-color-contrast)}}'};const p=class{constructor(o){t(this,o),this.activateTimeouts=[],this.activated=!1,this.side="bottom"}activatedChanged(t){this.activateTimeouts.forEach(clearTimeout),this.activateTimeouts=[];const o=Array.from(this.el.querySelectorAll("ion-fab-button")),a=t?30:0;o.forEach(((o,i)=>{this.activateTimeouts.push(setTimeout((()=>o.show=t),i*a))}))}disconnectedCallback(){this.activateTimeouts.forEach(clearTimeout),this.activateTimeouts=[]}render(){const t=n(this);return o(a,{key:"03a8920c29a93c6df4bab14753a78a8a30722ce8",class:{[t]:!0,"fab-list-active":this.activated,[`fab-list-side-${this.side}`]:!0}},o("slot",{key:"d9e1541cb044e209bc2dff14080f3b938a2b84ae"}))}get el(){return i(this)}static get watchers(){return{activated:["activatedChanged"]}}};p.style=":host{margin-left:0;margin-right:0;margin-top:calc(100% + 10px);margin-bottom:calc(100% + 10px);display:none;position:absolute;top:0;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center;min-width:56px;min-height:56px}:host(.fab-list-active){display:-ms-flexbox;display:flex}::slotted(.fab-button-in-list){margin-left:0;margin-right:0;margin-top:8px;margin-bottom:8px;width:40px;height:40px;-webkit-transform:scale(0);transform:scale(0);opacity:0;visibility:hidden}:host(.fab-list-side-top) ::slotted(.fab-button-in-list),:host(.fab-list-side-bottom) ::slotted(.fab-button-in-list){margin-left:0;margin-right:0;margin-top:5px;margin-bottom:5px}:host(.fab-list-side-start) ::slotted(.fab-button-in-list),:host(.fab-list-side-end) ::slotted(.fab-button-in-list){-webkit-margin-start:5px;margin-inline-start:5px;-webkit-margin-end:5px;margin-inline-end:5px;margin-top:0;margin-bottom:0}::slotted(.fab-button-in-list.fab-button-show){-webkit-transform:scale(1);transform:scale(1);opacity:1;visibility:visible}:host(.fab-list-side-top){top:auto;bottom:0;-ms-flex-direction:column-reverse;flex-direction:column-reverse}:host(.fab-list-side-start){-webkit-margin-start:calc(100% + 10px);margin-inline-start:calc(100% + 10px);-webkit-margin-end:calc(100% + 10px);margin-inline-end:calc(100% + 10px);margin-top:0;margin-bottom:0;-ms-flex-direction:row-reverse;flex-direction:row-reverse}:host(.fab-list-side-start){inset-inline-end:0}:host(.fab-list-side-end){-webkit-margin-start:calc(100% + 10px);margin-inline-start:calc(100% + 10px);-webkit-margin-end:calc(100% + 10px);margin-inline-end:calc(100% + 10px);margin-top:0;margin-bottom:0;-ms-flex-direction:row;flex-direction:row}:host(.fab-list-side-end){inset-inline-start:0}";export{d as ion_fab,f as ion_fab_button,p as ion_fab_list}
|
|
@@ -1,8 +1,10 @@
|
|
|
1
1
|
import type { ComponentInterface } from '../../stencil-public-runtime';
|
|
2
2
|
export declare class App implements ComponentInterface {
|
|
3
3
|
private focusVisible?;
|
|
4
|
+
private loadTimeout?;
|
|
4
5
|
el: HTMLElement;
|
|
5
6
|
componentDidLoad(): void;
|
|
7
|
+
disconnectedCallback(): void;
|
|
6
8
|
/**
|
|
7
9
|
* Used to set focus on an element that uses `ion-focusable`.
|
|
8
10
|
* Do not use this if focusing the element as a result of a keyboard
|
|
@@ -15,5 +17,6 @@ export declare class App implements ComponentInterface {
|
|
|
15
17
|
* @param elements An array of HTML elements to set focus on.
|
|
16
18
|
*/
|
|
17
19
|
setFocus(elements: HTMLElement[]): Promise<void>;
|
|
20
|
+
private rIC;
|
|
18
21
|
render(): any;
|
|
19
22
|
}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import type { ComponentInterface } from '../../stencil-public-runtime';
|
|
2
2
|
export declare class FabList implements ComponentInterface {
|
|
3
3
|
el: HTMLIonFabElement;
|
|
4
|
+
private activateTimeouts;
|
|
4
5
|
/**
|
|
5
6
|
* If `true`, the fab list will show all fab buttons in the list.
|
|
6
7
|
*/
|
|
@@ -10,5 +11,6 @@ export declare class FabList implements ComponentInterface {
|
|
|
10
11
|
* The side the fab list will show on relative to the main fab button.
|
|
11
12
|
*/
|
|
12
13
|
side: 'start' | 'end' | 'top' | 'bottom';
|
|
14
|
+
disconnectedCallback(): void;
|
|
13
15
|
render(): any;
|
|
14
16
|
}
|
|
@@ -5,6 +5,7 @@ import type { ComponentInterface, EventEmitter } from '../../stencil-public-runt
|
|
|
5
5
|
export declare class Img implements ComponentInterface {
|
|
6
6
|
private io?;
|
|
7
7
|
private inheritedAttributes;
|
|
8
|
+
private loadTimeout;
|
|
8
9
|
el: HTMLElement;
|
|
9
10
|
loadSrc?: string;
|
|
10
11
|
loadError?: () => void;
|
|
@@ -27,6 +28,7 @@ export declare class Img implements ComponentInterface {
|
|
|
27
28
|
ionError: EventEmitter<void>;
|
|
28
29
|
componentWillLoad(): void;
|
|
29
30
|
componentDidLoad(): void;
|
|
31
|
+
disconnectedCallback(): void;
|
|
30
32
|
private addIO;
|
|
31
33
|
private load;
|
|
32
34
|
private onLoad;
|
|
@@ -5,6 +5,7 @@ import type { Color, StyleEventDetail } from '../../interface';
|
|
|
5
5
|
*/
|
|
6
6
|
export declare class Label implements ComponentInterface {
|
|
7
7
|
private inRange;
|
|
8
|
+
private loadTimeout;
|
|
8
9
|
el: HTMLElement;
|
|
9
10
|
/**
|
|
10
11
|
* The color to use from your application's color palette.
|
|
@@ -29,6 +30,7 @@ export declare class Label implements ComponentInterface {
|
|
|
29
30
|
noAnimate: boolean;
|
|
30
31
|
componentWillLoad(): void;
|
|
31
32
|
componentDidLoad(): void;
|
|
33
|
+
disconnectedCallback(): void;
|
|
32
34
|
colorChanged(): void;
|
|
33
35
|
positionChanged(): void;
|
|
34
36
|
private emitColor;
|
|
@@ -359,5 +359,40 @@ export declare class Modal implements ComponentInterface, OverlayInterface {
|
|
|
359
359
|
private dismissNestedModals;
|
|
360
360
|
private initParentRemovalObserver;
|
|
361
361
|
private cleanupParentRemovalObserver;
|
|
362
|
+
/**
|
|
363
|
+
* Creates the context object for safe-area utilities.
|
|
364
|
+
*/
|
|
365
|
+
private getSafeAreaContext;
|
|
366
|
+
/**
|
|
367
|
+
* Sets initial safe-area overrides before modal animation.
|
|
368
|
+
* Called in present() before animation starts.
|
|
369
|
+
*
|
|
370
|
+
* For sheet modals, the SCSS --height formula uses --ion-modal-offset-top
|
|
371
|
+
* (an internal property) instead of --ion-safe-area-top. We resolve the
|
|
372
|
+
* root safe-area-top to pixels and set --ion-modal-offset-top, decoupling
|
|
373
|
+
* the height calculation from --ion-safe-area-top (which is zeroed for
|
|
374
|
+
* sheets to prevent header content from getting double-offset padding).
|
|
375
|
+
*/
|
|
376
|
+
private setInitialSafeAreaOverrides;
|
|
377
|
+
/**
|
|
378
|
+
* Resolves the current root --ion-safe-area-top value and sets the
|
|
379
|
+
* internal --ion-modal-offset-top property on the host element.
|
|
380
|
+
* Called on present and on resize (e.g., device rotation changes safe-area).
|
|
381
|
+
*/
|
|
382
|
+
private updateSheetOffsetTop;
|
|
383
|
+
/**
|
|
384
|
+
* Updates safe-area overrides during dynamic state changes.
|
|
385
|
+
* Called after animations, during gestures, and on orientation changes.
|
|
386
|
+
*/
|
|
387
|
+
private updateSafeAreaOverrides;
|
|
388
|
+
/**
|
|
389
|
+
* Applies padding-bottom to fullscreen modal wrapper to prevent
|
|
390
|
+
* content from overlapping system navigation bar.
|
|
391
|
+
*/
|
|
392
|
+
private applyFullscreenSafeArea;
|
|
393
|
+
/**
|
|
394
|
+
* Clears all safe-area overrides and padding from wrapper.
|
|
395
|
+
*/
|
|
396
|
+
private cleanupSafeAreaOverrides;
|
|
362
397
|
render(): any;
|
|
363
398
|
}
|
|
@@ -0,0 +1,66 @@
|
|
|
1
|
+
type SafeAreaValue = '0px' | 'inherit';
|
|
2
|
+
/**
|
|
3
|
+
* Configuration for safe-area CSS custom properties.
|
|
4
|
+
* Each direction can inherit the root safe-area value or be zeroed out.
|
|
5
|
+
*/
|
|
6
|
+
export interface SafeAreaConfig {
|
|
7
|
+
top: SafeAreaValue;
|
|
8
|
+
bottom: SafeAreaValue;
|
|
9
|
+
left: SafeAreaValue;
|
|
10
|
+
right: SafeAreaValue;
|
|
11
|
+
}
|
|
12
|
+
/**
|
|
13
|
+
* Context information about the modal used to determine safe-area behavior.
|
|
14
|
+
*/
|
|
15
|
+
export interface ModalSafeAreaContext {
|
|
16
|
+
isSheetModal: boolean;
|
|
17
|
+
isCardModal: boolean;
|
|
18
|
+
presentingElement?: HTMLElement;
|
|
19
|
+
breakpoints?: number[];
|
|
20
|
+
currentBreakpoint?: number;
|
|
21
|
+
}
|
|
22
|
+
/**
|
|
23
|
+
* Resolves the current root --ion-safe-area-top value to pixels.
|
|
24
|
+
* Uses a temporary element because getComputedStyle on :root returns
|
|
25
|
+
* the declared value of custom properties (e.g. "env(safe-area-inset-top)")
|
|
26
|
+
* rather than a resolved number.
|
|
27
|
+
*
|
|
28
|
+
* Results are cached for the current frame to avoid repeated reflows.
|
|
29
|
+
*/
|
|
30
|
+
export declare const getRootSafeAreaTop: () => number;
|
|
31
|
+
/**
|
|
32
|
+
* Returns the initial safe-area configuration based on modal type.
|
|
33
|
+
* This is called before animation starts and uses configuration-based prediction.
|
|
34
|
+
*
|
|
35
|
+
* @param context - Modal context information
|
|
36
|
+
* @returns SafeAreaConfig with initial safe-area values
|
|
37
|
+
*/
|
|
38
|
+
export declare const getInitialSafeAreaConfig: (context: ModalSafeAreaContext) => SafeAreaConfig;
|
|
39
|
+
/**
|
|
40
|
+
* Returns safe-area configuration based on actual modal position.
|
|
41
|
+
* Detects which edges the modal overlaps with and only applies safe-area to those edges.
|
|
42
|
+
*
|
|
43
|
+
* Note: On Android edge-to-edge (API 36+), getBoundingClientRect() may report
|
|
44
|
+
* inconsistent values. Sheet and card modals avoid this by using configuration-based
|
|
45
|
+
* prediction instead. Regular modals use coordinate detection which works reliably
|
|
46
|
+
* on web and iOS; Android edge-to-edge may need a configuration-based fallback
|
|
47
|
+
* once a reliable detection mechanism is available.
|
|
48
|
+
*
|
|
49
|
+
* @param wrapperEl - The modal wrapper element to measure
|
|
50
|
+
* @returns SafeAreaConfig based on position
|
|
51
|
+
*/
|
|
52
|
+
export declare const getPositionBasedSafeAreaConfig: (wrapperEl: HTMLElement) => SafeAreaConfig;
|
|
53
|
+
/**
|
|
54
|
+
* Applies safe-area CSS custom property overrides to the modal host element.
|
|
55
|
+
*
|
|
56
|
+
* @param hostEl - The modal host element (ion-modal)
|
|
57
|
+
* @param config - Safe-area configuration to apply
|
|
58
|
+
*/
|
|
59
|
+
export declare const applySafeAreaOverrides: (hostEl: HTMLElement, config: SafeAreaConfig) => void;
|
|
60
|
+
/**
|
|
61
|
+
* Clears safe-area CSS custom property overrides from the modal host element.
|
|
62
|
+
*
|
|
63
|
+
* @param hostEl - The modal host element (ion-modal)
|
|
64
|
+
*/
|
|
65
|
+
export declare const clearSafeAreaOverrides: (hostEl: HTMLElement) => void;
|
|
66
|
+
export {};
|
|
@@ -22,10 +22,30 @@ export interface PopoverStyles {
|
|
|
22
22
|
originY: string;
|
|
23
23
|
checkSafeAreaLeft: boolean;
|
|
24
24
|
checkSafeAreaRight: boolean;
|
|
25
|
+
checkSafeAreaTop: boolean;
|
|
26
|
+
checkSafeAreaBottom: boolean;
|
|
25
27
|
arrowTop: number;
|
|
26
28
|
arrowLeft: number;
|
|
27
29
|
addPopoverBottomClass: boolean;
|
|
30
|
+
hideArrow: boolean;
|
|
28
31
|
}
|
|
32
|
+
export interface SafeAreaInsets {
|
|
33
|
+
top: number;
|
|
34
|
+
bottom: number;
|
|
35
|
+
left: number;
|
|
36
|
+
right: number;
|
|
37
|
+
}
|
|
38
|
+
/**
|
|
39
|
+
* Resolves the current --ion-safe-area-* CSS custom property values
|
|
40
|
+
* to actual pixel numbers. A temporary element is needed because
|
|
41
|
+
* getComputedStyle on :root returns the declared value of custom
|
|
42
|
+
* properties (e.g. "env(safe-area-inset-top)") rather than a
|
|
43
|
+
* resolved number. By assigning them to standard padding properties,
|
|
44
|
+
* the browser resolves the value.
|
|
45
|
+
*
|
|
46
|
+
* Results are cached for the current frame to avoid repeated reflows.
|
|
47
|
+
*/
|
|
48
|
+
export declare const getSafeAreaInsets: (doc: Document) => SafeAreaInsets;
|
|
29
49
|
/**
|
|
30
50
|
* Returns the dimensions of the popover
|
|
31
51
|
* arrow on `ios` mode. If arrow is disabled
|
|
@@ -83,7 +103,9 @@ export declare const getPopoverPosition: (isRTL: boolean, contentWidth: number,
|
|
|
83
103
|
* Adjusts popover positioning coordinates
|
|
84
104
|
* such that popover does not appear offscreen
|
|
85
105
|
* or overlapping safe area bounds.
|
|
106
|
+
*
|
|
107
|
+
* @internal - This is not part of the public API.
|
|
86
108
|
*/
|
|
87
|
-
export declare const calculateWindowAdjustment: (side: PositionSide, coordTop: number, coordLeft: number, bodyPadding: number, bodyWidth: number, bodyHeight: number, contentWidth: number, contentHeight: number,
|
|
109
|
+
export declare const calculateWindowAdjustment: (side: PositionSide, coordTop: number, coordLeft: number, bodyPadding: number, bodyWidth: number, bodyHeight: number, contentWidth: number, contentHeight: number, safeArea: SafeAreaInsets, contentOriginX: string, contentOriginY: string, triggerCoordinates?: ReferenceCoordinates, coordArrowTop?: number, coordArrowLeft?: number, arrowHeight?: number) => PopoverStyles;
|
|
88
110
|
export declare const shouldShowArrow: (side: PositionSide, didAdjustBounds?: boolean, ev?: Event, trigger?: HTMLElement) => boolean;
|
|
89
111
|
export {};
|
|
@@ -11,6 +11,8 @@ export declare class Searchbar implements ComponentInterface {
|
|
|
11
11
|
private originalIonInput?;
|
|
12
12
|
private inputId;
|
|
13
13
|
private inheritedAttributes;
|
|
14
|
+
private loadTimeout;
|
|
15
|
+
private clearTimeout;
|
|
14
16
|
/**
|
|
15
17
|
* The value of the input when the textarea is focused.
|
|
16
18
|
*/
|
|
@@ -183,6 +185,7 @@ export declare class Searchbar implements ComponentInterface {
|
|
|
183
185
|
connectedCallback(): void;
|
|
184
186
|
componentWillLoad(): void;
|
|
185
187
|
componentDidLoad(): void;
|
|
188
|
+
disconnectedCallback(): void;
|
|
186
189
|
private emitStyle;
|
|
187
190
|
/**
|
|
188
191
|
* Sets focus on the native `input` in `ion-searchbar`. Use this method instead of the global
|