@zoff-tech/zt-bottom-drawer/dist/zt-bottom-drawer/p-a5911c63.entry.js

Bottom Drawer / Web Component

import{r as t,d as s,w as i,h as e,H as n,e as o}from"./p-f6c816ce.js";import{isRTL as r}from"@utils/rtl";import{createColorClasses as a,hostContext as h}from"@utils/theme";import{g as c}from"./p-0b9b2444.js";const l=":host{--ripple-color:currentColor;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:grid;grid-auto-columns:1fr;position:relative;align-items:stretch;justify-content:center;width:100%;background:var(--background);font-family:var(--ion-font-family, inherit);text-align:center;contain:paint;user-select:none}:host(.segment-scrollable){justify-content:start;width:auto;overflow-x:auto;grid-auto-columns:minmax(min-content, 1fr)}:host(.segment-scrollable::-webkit-scrollbar){display:none}:host{--background:rgba(var(--ion-text-color-rgb, 0, 0, 0), 0.065);border-radius:8px;overflow:hidden;z-index:0}:host(.ion-color){background:rgba(var(--ion-color-base-rgb), 0.065)}:host(.in-toolbar){-webkit-margin-start:auto;margin-inline-start:auto;-webkit-margin-end:auto;margin-inline-end:auto;margin-top:0;margin-bottom:0;width:auto}:host(.in-toolbar:not(.ion-color)){background:var(--ion-toolbar-segment-background, var(--background))}:host(.in-toolbar-color:not(.ion-color)){background:rgba(var(--ion-color-contrast-rgb), 0.11)}";const u=":host{--ripple-color:currentColor;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:grid;grid-auto-columns:1fr;position:relative;align-items:stretch;justify-content:center;width:100%;background:var(--background);font-family:var(--ion-font-family, inherit);text-align:center;contain:paint;user-select:none}:host(.segment-scrollable){justify-content:start;width:auto;overflow-x:auto;grid-auto-columns:minmax(min-content, 1fr)}:host(.segment-scrollable::-webkit-scrollbar){display:none}:host{--background:transparent;grid-auto-columns:minmax(auto, 360px)}:host(.in-toolbar){min-height:var(--min-height)}:host(.segment-scrollable) ::slotted(ion-segment-button){min-width:auto}";const d=class{constructor(i){t(this,i);this.ionChange=s(this,"ionChange",7);this.ionSelect=s(this,"ionSelect",7);this.ionStyle=s(this,"ionStyle",7);this.onClick=t=>{const s=t.target;const i=this.checked;if(s.tagName==="ION-SEGMENT"){return}this.value=s.value;if(s!==i){this.emitValueChange()}if(this.scrollable||!this.swipeGesture){if(i){this.checkButton(i,s)}else{this.setCheckedClasses()}}};this.getSegmentButton=t=>{var s,i;const e=this.getButtons().filter((t=>!t.disabled));const n=e.findIndex((t=>t===document.activeElement));switch(t){case"first":return e[0];case"last":return e[e.length-1];case"next":return(s=e[n+1])!==null&&s!==void 0?s:e[0];case"previous":return(i=e[n-1])!==null&&i!==void 0?i:e[e.length-1];default:return null}};this.activated=false;this.color=undefined;this.disabled=false;this.scrollable=false;this.swipeGesture=true;this.value=undefined;this.selectOnFocus=false}colorChanged(t,s){if(s===undefined&&t!==undefined||s!==undefined&&t===undefined){this.emitStyle()}}swipeGestureChanged(){this.gestureChanged()}valueChanged(t){this.ionSelect.emit({value:t});if(this.scrollable){const s=this.getButtons();const i=s.find((s=>s.value===t));if(i!==undefined){i.scrollIntoView({behavior:"smooth",inline:"center",block:"nearest"})}}}disabledChanged(){this.gestureChanged();const t=this.getButtons();for(const s of t){s.disabled=this.disabled}}gestureChanged(){if(this.gesture){this.gesture.enable(!this.scrollable&&!this.disabled&&this.swipeGesture)}}connectedCallback(){this.emitStyle()}componentWillLoad(){this.emitStyle()}async componentDidLoad(){this.setCheckedClasses();this.gesture=(await import("./p-0c0b0519.js")).createGesture({el:this.el,gestureName:"segment",gesturePriority:100,threshold:0,passive:false,onStart:t=>this.onStart(t),onMove:t=>this.onMove(t),onEnd:t=>this.onEnd(t)});this.gestureChanged();if(this.disabled){this.disabledChanged()}}onStart(t){this.valueBeforeGesture=this.value;this.activate(t)}onMove(t){this.setNextIndex(t)}onEnd(t){this.setActivated(false);this.setNextIndex(t,true);t.event.stopImmediatePropagation();const s=this.value;if(s!==undefined){if(this.valueBeforeGesture!==s){this.emitValueChange()}}this.valueBeforeGesture=undefined}emitValueChange(){const{value:t}=this;this.ionChange.emit({value:t})}getButtons(){return Array.from(this.el.querySelectorAll("ion-segment-button"))}get checked(){return this.getButtons().find((t=>t.value===this.value))}setActivated(t){const s=this.getButtons();s.forEach((s=>{if(t){s.classList.add("segment-button-activated")}else{s.classList.remove("segment-button-activated")}}));this.activated=t}activate(t){const s=t.event.target;const i=this.getButtons();const e=i.find((t=>t.value===this.value));if(s.tagName!=="ION-SEGMENT-BUTTON"){return}if(!e){this.value=s.value;this.setCheckedClasses()}if(this.value===s.value){this.setActivated(true)}}getIndicator(t){const s=t.shadowRoot||t;return s.querySelector(".segment-button-indicator")}checkButton(t,s){const e=this.getIndicator(t);const n=this.getIndicator(s);if(e===null||n===null){return}const o=e.getBoundingClientRect();const r=n.getBoundingClientRect();const a=o.width/r.width;const h=o.left-r.left;const c=`translate3d(${h}px, 0, 0) scaleX(${a})`;i((()=>{n.classList.remove("segment-button-indicator-animated");n.style.setProperty("transform",c);n.getBoundingClientRect();n.classList.add("segment-button-indicator-animated");n.style.setProperty("transform","")}));this.value=s.value;this.setCheckedClasses()}setCheckedClasses(){const t=this.getButtons();const s=t.findIndex((t=>t.value===this.value));const i=s+1;for(const s of t){s.classList.remove("segment-button-after-checked")}if(i<t.length){t[i].classList.add("segment-button-after-checked")}}setNextIndex(t,s=false){const i=r(this.el);const e=this.activated;const n=this.getButtons();const o=n.findIndex((t=>t.value===this.value));const a=n[o];let h;let c;if(o===-1){return}const l=a.getBoundingClientRect();const u=l.left;const d=l.width;const f=t.currentX;const g=l.top+l.height/2;const m=this.el.getRootNode();const b=m.elementFromPoint(f,g);const v=i?f>u+d:f<u;const p=i?f<u:f>u+d;if(e&&!s){if(v){const t=o-1;if(t>=0){c=t}}else if(p){if(e&&!s){const t=o+1;if(t<n.length){c=t}}}if(c!==undefined&&!n[c].disabled){h=n[c]}}if(!e&&s){h=b}if(h!=null){if(h.tagName==="ION-SEGMENT"){return false}if(a!==h){this.checkButton(a,h)}}return true}emitStyle(){this.ionStyle.emit({segment:true})}onKeyDown(t){const s=r(this.el);let i=this.selectOnFocus;let e;switch(t.key){case"ArrowRight":t.preventDefault();e=s?this.getSegmentButton("previous"):this.getSegmentButton("next");break;case"ArrowLeft":t.preventDefault();e=s?this.getSegmentButton("next"):this.getSegmentButton("previous");break;case"Home":t.preventDefault();e=this.getSegmentButton("first");break;case"End":t.preventDefault();e=this.getSegmentButton("last");break;case" ":case"Enter":t.preventDefault();e=document.activeElement;i=true}if(!e){return}if(i){const t=this.checked;this.checkButton(t||e,e);if(e!==t){this.emitValueChange()}}e.setFocus()}render(){const t=c(this);return e(n,{role:"tablist",onClick:this.onClick,class:a(this.color,{[t]:true,"in-toolbar":h("ion-toolbar",this.el),"in-toolbar-color":h("ion-toolbar[color]",this.el),"segment-activated":this.activated,"segment-disabled":this.disabled,"segment-scrollable":this.scrollable})},e("slot",null))}get el(){return o(this)}static get watchers(){return{color:["colorChanged"],swipeGesture:["swipeGestureChanged"],value:["valueChanged"],disabled:["disabledChanged"]}}};d.style={ios:l,md:u};export{d as ion_segment};
//# sourceMappingURL=p-a5911c63.entry.js.map