@ionic/core/components/ion-segment-view.js

Base components for Ionic

/*!
 * (C) Ionic http://ionicframework.com - MIT License
 */
import{d as e,H as t,i as s,h as o,f as i,t as n}from"./p-Ct2aBEue.js";import{i as l}from"./p-Dojwmvde.js";const a=e(class extends t{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.ionSegmentViewScroll=s(this,"ionSegmentViewScroll",7),this.scrollEndTimeout=null,this.isTouching=!1,this.disabled=!1,this.swipeGesture=!0}handleScroll(e){const{scrollLeft:t,scrollWidth:s,clientWidth:o}=e.target,i=s-o,n=(l(this.el)?-1:1)*(t/i);this.ionSegmentViewScroll.emit({scrollRatio:n,isManualScroll:this.isManualScroll??!0}),this.resetScrollEndTimeout()}handleScrollStart(){this.scrollEndTimeout&&(clearTimeout(this.scrollEndTimeout),this.scrollEndTimeout=null),this.isTouching=!0}handleTouchEnd(){this.isTouching=!1}resetScrollEndTimeout(){this.scrollEndTimeout&&(clearTimeout(this.scrollEndTimeout),this.scrollEndTimeout=null),this.scrollEndTimeout=setTimeout((()=>{this.checkForScrollEnd()}),100)}checkForScrollEnd(){this.isTouching||(this.isManualScroll=void 0)}async setContent(e,t=!0){const s=this.getSegmentContents().findIndex((t=>t.id===e));if(-1===s)return;this.isManualScroll=!1,this.resetScrollEndTimeout();const o=s*this.el.offsetWidth;this.el.scrollTo({top:0,left:(l(this.el)?-1:1)*o,behavior:t?"smooth":"instant"})}getSegmentContents(){return Array.from(this.el.querySelectorAll("ion-segment-content"))}render(){const{disabled:e,isManualScroll:t,swipeGesture:s}=this;return o(i,{key:"b3cd48fead5d2877ead68cf6d81955fc31530c7a",class:{"segment-view-disabled":e,"segment-view-scroll-disabled":!1===t,"segment-view-swipe-disabled":!1===s}},o("slot",{key:"ad5aa8b79790c490e13438afa0cbb2c241eab0a1"}))}get el(){return this}static get style(){return{ios:":host{display:-ms-flexbox;display:flex;height:100%;overflow-x:scroll;-webkit-scroll-snap-type:x mandatory;-ms-scroll-snap-type:x mandatory;scroll-snap-type:x mandatory;scrollbar-width:none;-ms-overflow-style:none}:host::-webkit-scrollbar{display:none}:host(.segment-view-disabled),:host(.segment-view-swipe-disabled){-ms-touch-action:none;touch-action:none;overflow-x:hidden}:host(.segment-view-scroll-disabled){pointer-events:none}:host(.segment-view-disabled){opacity:0.3}",md:":host{display:-ms-flexbox;display:flex;height:100%;overflow-x:scroll;-webkit-scroll-snap-type:x mandatory;-ms-scroll-snap-type:x mandatory;scroll-snap-type:x mandatory;scrollbar-width:none;-ms-overflow-style:none}:host::-webkit-scrollbar{display:none}:host(.segment-view-disabled),:host(.segment-view-swipe-disabled){-ms-touch-action:none;touch-action:none;overflow-x:hidden}:host(.segment-view-scroll-disabled){pointer-events:none}:host(.segment-view-disabled){opacity:0.3}"}}},[289,"ion-segment-view",{disabled:[4],swipeGesture:[4,"swipe-gesture"],isManualScroll:[32],setContent:[64]},[[1,"scroll","handleScroll"],[1,"touchstart","handleScrollStart"],[1,"touchend","handleTouchEnd"]]]),r=a,h=function(){"undefined"!=typeof customElements&&["ion-segment-view"].forEach((e=>{"ion-segment-view"===e&&(customElements.get(n(e))||customElements.define(n(e),a))}))};export{r as IonSegmentView,h as defineCustomElement}