UNPKG

@ionic/core

Version:
4 lines • 10.3 kB
/*! * (C) Ionic http://ionicframework.com - MIT License */ import{d as t,H as o,i,k as s,j as e,h as n,f as r,t as l}from"./p-Ct2aBEue.js";import{i as a,l as c,c as h}from"./p-B4IBdPVJ.js";import{n as d}from"./p-B02CcbPD.js";import{b as f,a as p}from"./p-HthJZjZ6.js";import{i as u}from"./p-Dojwmvde.js";import{h as m,c as v}from"./p-byZM6qHV.js";const b=t(class extends o{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.ionScrollStart=i(this,"ionScrollStart",7),this.ionScroll=i(this,"ionScroll",7),this.ionScrollEnd=i(this,"ionScrollEnd",7),this.watchDog=null,this.isScrolling=!1,this.lastScroll=0,this.queued=!1,this.cTop=-1,this.cBottom=-1,this.isMainContent=!0,this.resizeTimeout=null,this.inheritedAttributes={},this.tabsElement=null,this.detail={scrollTop:0,scrollLeft:0,type:"scroll",event:void 0,startX:0,startY:0,startTime:0,currentX:0,currentY:0,velocityX:0,velocityY:0,deltaX:0,deltaY:0,currentTime:0,data:void 0,isScrolling:!0},this.sizeToContent=!1,this.fullscreen=!1,this.fixedSlotPlacement="after",this.scrollX=!1,this.scrollY=!0,this.scrollEvents=!1}fullscreenChanged(){this.setupFullscreenResizeObserver()}componentWillLoad(){this.inheritedAttributes=a(this.el),this.sizeToContent=this.readSizeToContent()}connectedCallback(){if(this.isMainContent=null===this.el.closest("ion-menu, ion-popover, ion-modal"),c(this.el)){const t=this.tabsElement=this.el.closest("ion-tabs");null!==t&&(this.tabsLoadCallback=()=>this.resize(),t.addEventListener("ionTabBarLoaded",this.tabsLoadCallback))}this.setupFullscreenResizeObserver(),this.updateSizeToContent()}componentDidLoad(){this.setupFullscreenResizeObserver()}disconnectedCallback(){if(this.onScrollEnd(),c(this.el)){const{tabsElement:t,tabsLoadCallback:o}=this;null!==t&&void 0!==o&&t.removeEventListener("ionTabBarLoaded",o),this.tabsElement=null,this.tabsLoadCallback=void 0}this.resizeTimeout&&(clearTimeout(this.resizeTimeout),this.resizeTimeout=null),this.destroyFullscreenResizeObserver()}setupFullscreenResizeObserver(){"undefined"!=typeof ResizeObserver&&(this.fullscreen&&!m("ion-popover",this.el)?void 0===this.fullscreenResizeObserver&&(this.fullscreenResizeObserver=new ResizeObserver((()=>{null!==this.el.offsetParent&&this.resize()})),this.fullscreenResizeObserver.observe(this.el)):this.destroyFullscreenResizeObserver())}updateSizeToContent(){s((()=>{this.sizeToContent=this.readSizeToContent()}))}destroyFullscreenResizeObserver(){void 0!==this.fullscreenResizeObserver&&(this.fullscreenResizeObserver.disconnect(),this.fullscreenResizeObserver=void 0)}onResize(){this.resizeTimeout&&(clearTimeout(this.resizeTimeout),this.resizeTimeout=null),this.resizeTimeout=setTimeout((()=>{null!==this.el.offsetParent&&this.resize()}),100)}shouldForceOverscroll(){const{forceOverscroll:t}=this,o=f(this);return void 0===t?"ios"===o&&p("ios"):t}readSizeToContent(){if(m("ion-popover",this.el))return!0;const t=this.el.closest("ion-modal");if(null===t)return!1;const o=getComputedStyle(t).getPropertyValue("--height");return"content"===d(o)}resize(){this.updateSizeToContent(),this.fullscreen?s((()=>this.readDimensions())):0===this.cTop&&0===this.cBottom||(this.cTop=this.cBottom=0,e(this))}async recalculateDimensions(){s((()=>this.readDimensions())),this.updateSizeToContent()}readDimensions(){const t=g(this.el),o=Math.max(this.el.offsetTop,0),i=Math.max(t.offsetHeight-o-this.el.offsetHeight,0);(o!==this.cTop||i!==this.cBottom)&&(this.cTop=o,this.cBottom=i,e(this))}onScroll(t){const o=Date.now(),i=!this.isScrolling;this.lastScroll=o,i&&this.onScrollStart(),!this.queued&&this.scrollEvents&&(this.queued=!0,s((o=>{this.queued=!1,this.detail.event=t,x(this.detail,this.scrollEl,o,i),this.ionScroll.emit(this.detail)})))}async getScrollElement(){return this.scrollEl||await new Promise((t=>h(this.el,t))),Promise.resolve(this.scrollEl)}async getBackgroundElement(){return this.backgroundContentEl||await new Promise((t=>h(this.el,t))),Promise.resolve(this.backgroundContentEl)}scrollToTop(t=0){return this.scrollToPoint(void 0,0,t)}async scrollToBottom(t=0){const o=await this.getScrollElement();return this.scrollToPoint(void 0,o.scrollHeight-o.clientHeight,t)}async scrollByPoint(t,o,i){const s=await this.getScrollElement();return this.scrollToPoint(t+s.scrollLeft,o+s.scrollTop,i)}async scrollToPoint(t,o,i=0){const s=await this.getScrollElement();if(i<32)return null!=o&&(s.scrollTop=o),void(null!=t&&(s.scrollLeft=t));let e,n=0;const r=new Promise((t=>e=t)),l=s.scrollTop,a=s.scrollLeft,c=null!=o?o-l:0,h=null!=t?t-a:0,d=t=>{const o=Math.min(1,(t-n)/i)-1,r=Math.pow(o,3)+1;0!==c&&(s.scrollTop=Math.floor(r*c+l)),0!==h&&(s.scrollLeft=Math.floor(r*h+a)),r<1?requestAnimationFrame(d):e()};return requestAnimationFrame((t=>{n=t,d(t)})),r}onScrollStart(){this.isScrolling=!0,this.ionScrollStart.emit({isScrolling:!0}),this.watchDog&&clearInterval(this.watchDog),this.watchDog=setInterval((()=>{this.lastScroll<Date.now()-120&&this.onScrollEnd()}),100)}onScrollEnd(){this.watchDog&&clearInterval(this.watchDog),this.watchDog=null,this.isScrolling&&(this.isScrolling=!1,this.ionScrollEnd.emit({isScrolling:!1}))}render(){const{fixedSlotPlacement:t,inheritedAttributes:o,isMainContent:i,scrollX:s,scrollY:e,el:l}=this,a=u(l)?"rtl":"ltr",c=f(this),h=this.shouldForceOverscroll(),d="ios"===c;return this.resize(),n(r,{key:"e1013621096729354ef92915af52dd823e69fdff",role:i?"main":void 0,class:v(this.color,{[c]:!0,"content-fullscreen":this.fullscreen,"content-sizing":this.sizeToContent,overscroll:h,[`content-${a}`]:!0}),style:{"--offset-top":`${this.cTop}px`,"--offset-bottom":`${this.cBottom}px`},...o},n("div",{key:"3d8649b164d6324beaa1bc50e1d204ad06c2ec1a",ref:t=>this.backgroundContentEl=t,id:"background-content",part:"background"}),"before"===t?n("slot",{name:"fixed"}):null,n("div",{key:"dd2d3bed8690b4f5027a43f5ec60e7e7df18106d",class:{"inner-scroll":!0,"scroll-x":s,"scroll-y":e,overscroll:(s||e)&&h},ref:t=>this.scrollEl=t,onScroll:this.scrollEvents?t=>this.onScroll(t):void 0,part:"scroll"},n("slot",{key:"dc3d4584d9e9afd43699525a619b8e873078fbbf"})),d?n("div",{class:"transition-effect"},n("div",{class:"transition-cover"}),n("div",{class:"transition-shadow"})):null,"after"===t?n("slot",{name:"fixed"}):null)}get el(){return this}static get watchers(){return{fullscreen:[{fullscreenChanged:0}]}}static get style(){return':host{--background:var(--ion-background-color, #fff);--color:var(--ion-text-color, #000);--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{left:0px;right:0px;top:calc(var(--offset-top) * -1);bottom:calc(var(--offset-bottom) * -1);position:absolute;background:var(--background)}.inner-scroll{left:0px;right: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)}'}},[257,"ion-content",{color:[513],fullscreen:[4],fixedSlotPlacement:[1,"fixed-slot-placement"],forceOverscroll:[1028,"force-overscroll"],scrollX:[4,"scroll-x"],scrollY:[4,"scroll-y"],scrollEvents:[4,"scroll-events"],sizeToContent:[32],recalculateDimensions:[64],getScrollElement:[64],getBackgroundElement:[64],scrollToTop:[64],scrollToBottom:[64],scrollByPoint:[64],scrollToPoint:[64]},[[9,"resize","onResize"]],{fullscreen:[{fullscreenChanged:0}]}]),g=t=>{const o=t.closest("ion-tabs");if(o)return o;return t.closest("ion-app, ion-page, .ion-page, page-inner, .popover-content")||(t=>t.parentElement?t.parentElement:t.parentNode?.host?t.parentNode.host:null)(t)},x=(t,o,i,s)=>{const e=t.currentX,n=t.currentY,r=o.scrollLeft,l=o.scrollTop,a=i-t.currentTime;if(s&&(t.startTime=i,t.startX=r,t.startY=l,t.velocityX=t.velocityY=0),t.currentTime=i,t.currentX=t.scrollLeft=r,t.currentY=t.scrollTop=l,t.deltaX=r-t.startX,t.deltaY=l-t.startY,a>0&&a<100){const o=(l-n)/a;t.velocityX=(r-e)/a*.7+.3*t.velocityX,t.velocityY=.7*o+.3*t.velocityY}};function y(){"undefined"!=typeof customElements&&["ion-content"].forEach((t=>{"ion-content"===t&&(customElements.get(l(t))||customElements.define(l(t),b))}))}export{b as C,y as d}