xtendui
Version:
Xtend UI is a powerful frontend library of Tailwind CSS components enhanced by vanilla js. It helps you build interfaces with advanced interactions and animations.
3 lines • 4.05 kB
JavaScript
/*! For license information please see 747.min.js.LICENSE.txt */
;(globalThis.webpackChunkxtendui=globalThis.webpackChunkxtendui||[]).push([[747],{8747:(t,e,o)=>{o.r(e),o.d(e,{StickyflowInit:()=>s});var n=o(5498);class s{_init(){this._initVars(),this._initLogic()}_initVars(){const t=this;t._optionsDefault=n.Xt.merge([t.constructor.optionsDefault,n.Xt.options[t.componentName]]),t._optionsInitial=t.options=n.Xt.merge([t._optionsDefault,t._optionsCustom])}_initLogic(){const t=this,e=t.options;t.ns=t.ns??n.Xt.uniqueId(),t.enable(),n.Xt._initMatches({self:t,optionsInitial:t._optionsInitial}),t.initial=!0,t.element=t.container.querySelector(e.element),t.filler=t.container.querySelector(e.filler),t.scrollers=[document.scrollingElement,...document.querySelectorAll(e.scrollers)].reverse();for(const e of t.scrollers)if(e&&e.contains(t.element)){t.scroller=e;break}if(t._scrollTopOld=0,t.scroller===document.scrollingElement){const e=n.Xt.dataStorage.put(window,`scroll/${t.ns}`,t._eventChange.bind(t));addEventListener("scroll",e)}else{const e=n.Xt.dataStorage.put(t.scroller,`scroll/${t.ns}`,t._eventChange.bind(t));t.scroller.addEventListener("scroll",e)}const o=n.Xt.dataStorage.put(window,`resize/${t.ns}`,t._eventChange.bind(t));addEventListener("resize",o),t._initStart(),t.container.dispatchEvent(new CustomEvent(`setup.${t._componentNs}`)),n.Xt.frameDouble({el:t.container,ns:`${t.ns}Init`,func:()=>{t.container.setAttribute(`data-${t.componentName}-init`,""),t.container.dispatchEvent(new CustomEvent(`init.${t._componentNs}`)),t.initial=!1,e.debug&&console.debug(`${t.componentName} init`,t)}}),t.options.disabled&&t.disable()}_initStart(){const t=this;if(t.disabled)return;const e=getComputedStyle(t.element);t._initialTop=e.top&&"auto"!==e.top?parseFloat(e.top):0,t._initialBottom=e.bottom&&"auto"!==e.bottom?parseFloat(e.bottom):0,t._eventChange()}_eventChange(){const t=this;if(t.disabled)return;const e=t.scroller.scrollTop,o=window.innerHeight,s=t.element.offsetHeight;if(s+t._initialTop+t._initialBottom<o)t.filler.style.height="",t.element.style.top=`${t._initialTop}px`,t.element.style.bottom="auto";else if(e>t._scrollTopOld){if(!t.element.classList.contains("xt-stickyflow-top")){const e=o-s-t._initialBottom,n=Math.max(0,t.element.offsetTop-t.filler.offsetTop);t.filler.style.height=`${n}px`,t.element.style.top=`${e}px`,t.element.style.bottom="auto",t.element.classList.remove("xt-stickyflow-bottom"),t.element.classList.add("xt-stickyflow-top")}}else if(!t.element.classList.contains("xt-stickyflow-bottom")){const e=o-s-t._initialTop,n=Math.max(0,t.element.offsetTop-t.filler.offsetTop);t.filler.style.height=`${n}px`,t.element.style.top="auto",t.element.style.bottom=`${e}px`,t.element.classList.add("xt-stickyflow-bottom"),t.element.classList.remove("xt-stickyflow-top")}n.Xt.frame({el:t.container,ns:`${t.ns}Change`,func:()=>{t.container.dispatchEvent(new CustomEvent(`change.${t._componentNs}`))}}),t._scrollTopOld=e}enable(){const t=this;t.disabled&&(t.disabled=!1,t.container.dispatchEvent(new CustomEvent(`status.${t._componentNs}`)))}disable(){let{skipEvent:t=!1}=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};const e=this;e.disabled||(e.disabled=!0,e.filler.style.height="",e.element.style.top="",e.element.style.bottom="",e.element.classList.remove("xt-stickyflow-bottom"),e.element.classList.remove("xt-stickyflow-top"),t||e.container.dispatchEvent(new CustomEvent(`status.${e._componentNs}`)))}reinit(){this._initLogic()}destroy(){const t=this;if(t.scroller===document.scrollingElement){const e=n.Xt.dataStorage.get(window,`scroll/${t.ns}`);removeEventListener("scroll",e)}else{const e=n.Xt.dataStorage.get(t.scroller,`scroll/${t.ns}`);t.scroller.removeEventListener("scroll",e)}const e=n.Xt.dataStorage.get(window,`resize/${t.ns}`);removeEventListener("resize",e),t.container.removeAttribute(`data-${t.componentName}-init`),n.Xt._remove({name:t.componentName,el:t.container}),t.container.dispatchEvent(new CustomEvent(`destroy.${t._componentNs}`))}}}}]);
//# sourceMappingURL=747.min.js.map