@spw-ds/spw-stencil-library 1.3.4 → 1.4.0

package/dist/spw-stencil-library/p-e1f204c9.entry.js

@@ -1 +0,0 @@
-import{r as t,h as i,H as s,a as e}from"./p-BhcwOlgO.js";const o=class{constructor(i){t(this,i),this.showArrows=!0,this.showDots=!0,this.showAutoplayToggle=!1,this.autoplayInterval=5e3,this.autoplayEnabled=!1,this.autoplayText="Défilement automatique",this.arrowsPosition="inside",this.nextSlideText="Slide suivante",this.previousSlideText="Slide précédente",this.activeIndex=0,this.totalSlides=0,this.currentHeight=0,this.isAutoplayActive=!1,this.startX=0,this.currentX=0,this.isDragging=!1,this.slides=[],this.handleSlotChange=()=>{this.updateSlides(),this.scheduleHeightUpdate(50)},this.handleResize=()=>{this.scheduleHeightUpdate(50)},this.handlePrevious=()=>{this.activeIndex>0&&this.goToSlide(this.activeIndex-1)},this.handleNext=()=>{this.activeIndex<this.totalSlides-1&&this.goToSlide(this.activeIndex+1)},this.handleDotClick=t=>{this.goToSlide(t)},this.startAutoplay=()=>{this.stopAutoplay(),this.autoplayTimer=window.setInterval((()=>{this.goToSlide(this.activeIndex<this.totalSlides-1?this.activeIndex+1:0)}),this.autoplayInterval)},this.stopAutoplay=()=>{this.autoplayTimer&&(clearInterval(this.autoplayTimer),this.autoplayTimer=null)},this.handleAutoplayToggle=t=>{this.isAutoplayActive=t.detail,this.isAutoplayActive?this.startAutoplay():this.stopAutoplay()}}componentDidLoad(){this.initializeSlider();const t=this.el.shadowRoot.querySelector("slot");t&&t.addEventListener("slotchange",this.handleSlotChange),window.addEventListener("resize",this.handleResize),this.setupResizeObserver(),this.isAutoplayActive=this.autoplayEnabled,this.isAutoplayActive&&this.startAutoplay()}disconnectedCallback(){var t;window.removeEventListener("resize",this.handleResize);const i=null===(t=this.el.shadowRoot)||void 0===t?void 0:t.querySelector("slot");i&&i.removeEventListener("slotchange",this.handleSlotChange),this.resizeObserver&&this.resizeObserver.disconnect(),this.heightUpdateTimeout&&clearTimeout(this.heightUpdateTimeout),this.stopAutoplay()}initializeSlider(){this.updateSlides(),this.scheduleHeightUpdate(200),this.scheduleHeightUpdate(500)}setupResizeObserver(){"undefined"!=typeof ResizeObserver&&(this.resizeObserver=new ResizeObserver((()=>{this.scheduleHeightUpdate(50)})),this.slides.forEach((t=>{var i,s;this.resizeObserver.observe(t);const e=null===(s=null===(i=t.shadowRoot)||void 0===i?void 0:i.querySelector("slot"))||void 0===s?void 0:s.assignedElements()[0];if(e&&(this.resizeObserver.observe(e),e.shadowRoot)){const t=e.shadowRoot.firstElementChild;t&&this.resizeObserver.observe(t)}})))}scheduleHeightUpdate(t=0){this.heightUpdateTimeout&&clearTimeout(this.heightUpdateTimeout),this.heightUpdateTimeout=window.setTimeout((()=>{this.updateHeight()}),t)}updateSlides(){const t=this.el.shadowRoot.querySelector("slot");if(t){const i=t.assignedElements();this.resizeObserver&&this.slides.forEach((t=>{this.resizeObserver.unobserve(t)})),this.slides=i,this.totalSlides=this.slides.length,this.slides.forEach(((t,i)=>{t.style.transform=`translateX(${100*i}%)`})),this.resizeObserver&&this.slides.forEach((t=>{this.resizeObserver.observe(t)}))}}async updateHeight(){var t,i;if(this.slides[this.activeIndex]){const s=this.slides[this.activeIndex],e=null===(i=null===(t=s.shadowRoot)||void 0===t?void 0:t.querySelector("slot"))||void 0===i?void 0:i.assignedElements()[0];if(e){const t=e.tagName.toLowerCase();if(t.includes("-"))try{await customElements.whenDefined(t),await new Promise((t=>setTimeout(t,50)))}catch(t){}let i=e.offsetHeight||e.scrollHeight;if(e.shadowRoot){const t=e.shadowRoot.firstElementChild;t&&(i=t.offsetHeight||t.scrollHeight)}if(i>0)return void(this.currentHeight=i)}let o=s.offsetHeight||s.scrollHeight;o>50?this.currentHeight=o:this.retryHeightCalculation(0)}}retryHeightCalculation(t){t>=15||setTimeout((()=>{var i,s;const e=this.slides[this.activeIndex];if(!e)return;const o=null===(s=null===(i=e.shadowRoot)||void 0===i?void 0:i.querySelector("slot"))||void 0===s?void 0:s.assignedElements()[0];if(o){let t=o.offsetHeight||o.scrollHeight;if(o.shadowRoot){const i=o.shadowRoot.firstElementChild;i&&(t=i.offsetHeight||i.scrollHeight)}if(t>50)return void(this.currentHeight=t)}const a=e.offsetHeight||e.scrollHeight;a>50?this.currentHeight=a:this.retryHeightCalculation(t+1)}),100*(t+1))}goToSlide(t){t<0||t>=this.totalSlides||(this.activeIndex=t,this.slides.forEach(((t,i)=>{const s=100*(i-this.activeIndex);t.style.transition="transform 0.3s ease-in-out",t.style.transform=`translateX(${s}%)`})),this.scheduleHeightUpdate(0),this.scheduleHeightUpdate(320),this.isAutoplayActive&&(this.stopAutoplay(),this.startAutoplay()))}handleTouchStart(t){this.startX=t.touches[0].clientX,this.currentX=this.startX,this.isDragging=!0,this.isAutoplayActive&&this.stopAutoplay()}handleMouseDown(t){this.startX=t.clientX,this.currentX=this.startX,this.isDragging=!0,t.preventDefault(),this.isAutoplayActive&&this.stopAutoplay()}handleTouchMove(t){this.isDragging&&(this.currentX=t.touches[0].clientX)}handleMouseMove(t){this.isDragging&&(this.currentX=t.clientX)}handleTouchEnd(){this.handleDragEnd()}handleMouseUp(){this.handleDragEnd()}handleMouseLeave(){this.isDragging&&this.handleDragEnd()}handleDragEnd(){if(!this.isDragging)return;const t=this.startX-this.currentX;Math.abs(t)>50&&(t>0?this.handleNext():this.handlePrevious()),this.isDragging=!1,this.startX=0,this.currentX=0,this.isAutoplayActive&&this.startAutoplay()}get elementClass(){return{"spw-slider":!0,[`spw-slider--arrows-${this.arrowsPosition}`]:!0}}render(){return i(s,{key:"f2f56fd126c0f75f402e3d5134a70828fac10e36"},i("div",{key:"f008da7bc74aad6768ee73c757ea467245b5da30",class:this.elementClass,style:{height:`${this.currentHeight}px`}},i("div",{key:"da55e2148b162d4b6518c7482fb847b5b5c00da6",class:"spw-slider__track"},i("slot",{key:"4e0c297f3110391080adf41eeeb9630aa034d2ac"})),this.showArrows&&i("div",{key:"fefce0506f350a8ec4b99f291f49abfbf8451859",class:"spw-slider__navigation"},i("button",{key:"66a6aabf105bf3ad732d7f3344dcc31367bfbc6b",class:"spw-slider__arrow spw-slider__arrow--prev",onClick:this.handlePrevious,disabled:0===this.activeIndex,"aria-label":this.previousSlideText},i("spw-icon",{key:"e6eaba9a599727e53dd87cc3b59594b60434e68e",icon:"fa-chevron-left"})),i("button",{key:"0de842f1851e3f3afb6bf1459f02ff89456f6f3f",class:"spw-slider__arrow spw-slider__arrow--next",onClick:this.handleNext,disabled:this.activeIndex===this.totalSlides-1,"aria-label":this.nextSlideText},i("spw-icon",{key:"5b0cd79f255d8b25acfa41a0595a6c8336d6d565",icon:"fa-chevron-right"}))),this.showDots&&this.totalSlides>1&&i("div",{key:"b57fc576bb08fe5fba35a6a85db3884c3a8cb1c8",class:"spw-slider__dots"},Array.from({length:this.totalSlides},((t,s)=>i("button",{class:{"spw-slider__dot":!0,"spw-slider__dot--active":s===this.activeIndex},onClick:()=>this.handleDotClick(s),"aria-label":`Aller à la slide ${s+1}`,"aria-current":s===this.activeIndex?"true":"false"}))))),this.showAutoplayToggle&&i("div",{key:"45208eb291d1d906cf32077ea84dce663d648714",class:"spw-slider__autoplay-toggle"},i("spw-checkbox",{key:"0aeae8f2a3b73620a203cf0b2c78b1069ee9cae7",variant:"toggle",checked:this.isAutoplayActive,onSpwChange:this.handleAutoplayToggle},this.autoplayText)))}get el(){return e(this)}};o.style='html{line-height:1.3;-webkit-text-size-adjust:100%;}h1,h2,h3,h4,h5,h6,p,ul,li{padding:0;margin:0}ul{list-style:none}:host{box-sizing:border-box;line-height:1.3;-webkit-text-size-adjust:100%;font-size:100%}:host *,:host *::before,:host *::after{box-sizing:inherit;font-family:"Nunito Sans"}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0;}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px;}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}:root{--spw-ds-container-xl:1232px;--spw-ds-container-lg:1024px;--spw-ds-container-md:768px;--spw-ds-container-sm:640px}.spw-ds-container{width:100%;padding-left:16px;padding-right:16px;margin-left:auto;margin-right:auto}@media (min-width: 460px){.spw-ds-container{max-width:var(--spw-ds-container-sm)}}@media (min-width: 768px){.spw-ds-container{max-width:var(--spw-ds-container-md)}}@media (min-width: 1024px){.spw-ds-container{max-width:var(--spw-ds-container-lg)}}@media (min-width: 1350px){.spw-ds-container{max-width:var(--spw-ds-container-xl)}}:host{display:block}.spw-slider{position:relative;width:100%;transition:height 0.3s ease-in-out;min-height:100px}.spw-slider[style*="height: 0px"]{min-height:200px}.spw-slider--arrows-outside{padding:0 56px}.spw-slider__track{position:relative;width:100%;height:100%;overflow:hidden;cursor:grab;user-select:none}.spw-slider__track:active{cursor:grabbing}.spw-slider__navigation{position:absolute;top:50%;left:0;right:0;transform:translateY(-50%);display:flex;justify-content:space-between;padding:0 12px;pointer-events:none;width:calc(100% + 64px);margin-left:-32px}@media (min-width: 1024px){.spw-slider__navigation{width:100%;margin-left:0}}.spw-slider--arrows-outside .spw-slider__navigation{width:100%;padding:0;margin-left:0}.spw-slider__arrow{pointer-events:all;width:40px;height:40px;border-radius:50%;border:none;background-color:var(--spw-ds-primary);color:white;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all 0.2s ease;font-size:1.25rem}.spw-slider__arrow:hover:not(:disabled){transform:scale(0.9)}.spw-slider__arrow:disabled{cursor:not-allowed;background-color:var(--spw-color-themes-grey-grey-300);color:var(--spw-color-themes-grey-grey-400)}.spw-slider__arrow:focus-visible{outline:2px solid black;outline-offset:2px}.spw-slider__dots{position:absolute;bottom:10px;left:50%;transform:translateX(-50%);display:flex;gap:0.5rem;z-index:10;background:white;box-shadow:var(--spw-effect-elevation-5);padding:8px;border-radius:999px}.spw-slider__dot{width:12px;height:12px;border-radius:50%;background:var(--spw-color-themes-grey-grey-300);cursor:pointer;border:none;transition:all 0.2s ease;padding:0}.spw-slider__dot:hover{transform:scale(1.2)}.spw-slider__dot--active{background-color:var(--spw-ds-primary)}.spw-slider__dot:focus-visible{outline:2px solid black;outline-offset:2px}.spw-slider__autoplay-toggle{margin-top:12px}';export{o as spw_slider}