@evermade/overflow-slider 3.2.1 → 3.3.0

package/README.md

@@ -456,6 +456,13 @@ Auto-play is not supported at the moment but can probably be implemented as a pl
 
 ## Changelog
 
+### 3.3.0
+
+* Add: Ability to move each direction by one slide at a time via `moveToSlideInDirection` prev/next
+* Add: Support for ArrowsPlugin to move by one slide at a time (default is still one view at a time)
+* Fix: Remove console logs
+* Refactor: Plugin build paths to match import paths. Might fix some eslint warnings. If you are not using import but directly referencing the plugin files under `dist/` you might need to update your paths.
+
 ### 3.2.1
 
 * Add: Documentation on plugins

package/dist/core/slider.esm.js

@@ -267,7 +267,6 @@ function Slider(container, options, plugins) {
         }
         const oldActiveSlideIdx = slider.activeSlideIdx;
         slider.activeSlideIdx = activeSlideIdx;
-        // console.log('activeSlideIdx', activeSlideIdx);
         if (oldActiveSlideIdx !== activeSlideIdx) {
             slider.emit('activeSlideChanged');
         }
@@ -278,6 +277,19 @@ function Slider(container, options, plugins) {
             ensureSlideIsInView(slide);
         }
     }
+    function moveToSlideInDirection(direction) {
+        const activeSlideIdx = slider.activeSlideIdx;
+        if (direction === 'prev') {
+            if (activeSlideIdx > 0) {
+                moveToSlide(activeSlideIdx - 1);
+            }
+        }
+        else if (direction === 'next') {
+            if (activeSlideIdx < slider.slides.length - 1) {
+                moveToSlide(activeSlideIdx + 1);
+            }
+        }
+    }
     function getInclusiveScrollWidth() {
         return slider.container.scrollWidth + getOutermostChildrenEdgeMarginSum(slider.container);
     }
@@ -408,7 +420,6 @@ function Slider(container, options, plugins) {
                 rect: slide.getBoundingClientRect(),
             });
         }
-        console.log('slideReference', slideReference);
         let snapTarget = null;
         const scrollPosition = getScrollLeft();
         if (isMovingForward) {
@@ -472,6 +483,7 @@ function Slider(container, options, plugins) {
         emit,
         moveToDirection,
         moveToSlide,
+        moveToSlideInDirection,
         snapToClosestSlide,
         getInclusiveScrollWidth,
         getInclusiveClientWidth,

package/dist/core/slider.min.js

@@ -1 +1 @@
-import t from"./details.min.js";import{generateId as e,objectsAreEqual as o,getOutermostChildrenEdgeMarginSum as n}from"./utils.min.js";function l(l,i,r){let a,s={};function c(e=!1){const n=a.details,l=t(a);a.details=l,e||o(n,l)?e&&a.emit("detailsChanged"):a.emit("detailsChanged")}function f(){a.slides=Array.from(a.container.querySelectorAll(a.options.slidesSelector))}function d(){a.container.style.setProperty("--slider-container-width",`${a.details.containerWidth}px`),a.container.style.setProperty("--slider-scrollable-width",`${a.details.scrollableAreaWidth}px`),a.container.style.setProperty("--slider-slides-count",`${a.details.slideCount}`)}function h(){a.container.setAttribute("data-has-overflow",a.details.hasOverflow?"true":"false"),a.options.rtl&&a.container.setAttribute("dir","rtl")}function u(t,e=null){const o=e||a.options.scrollBehavior,n=t.getBoundingClientRect(),l=a.container.getBoundingClientRect(),i=a.container.offsetWidth,r=a.container.scrollLeft,s=n.left-l.left+r,c=s+n.width;let f=null;f=Math.floor(s)<Math.floor(r)?s:Math.floor(c)>Math.floor(r)+Math.floor(i)?c-i:0===Math.floor(s)?0:s,null!==f&&setTimeout((t=>{a.emit("programmaticScrollStart"),a.container.scrollTo({left:t,behavior:o})}),50,f)}function g(){const t=a.container.getBoundingClientRect(),e=a.getScrollLeft(),o=a.slides;let n=0,l=!1;if(a.options.rtl){const l=a.getInclusiveScrollWidth()-e-a.getInclusiveClientWidth(),i=[];for(let e=o.length-1;e>=0;e--){const n=o[e].getBoundingClientRect(),r=Math.abs(n.left)-Math.abs(t.left)+l;i.push({slide:o[e],slideEnd:r})}let r=null,s=null;for(let t=0;t<i.length;t++){const e=Math.abs(i[t].slideEnd-l);(null===s||e<s)&&(s=e,r=i[t].slide)}n=r?o.indexOf(r):o.length-1}else for(let i=0;i<o.length;i++){const r=o[i].getBoundingClientRect().left-t.left+e+M();if(Math.floor(r)>=Math.floor(e)){n=i;break}i===o.length-1&&(l=!0)}l&&(n=o.length-1);const i=a.activeSlideIdx;a.activeSlideIdx=n,i!==n&&a.emit("activeSlideChanged")}function m(){return a.options.rtl?Math.abs(a.container.scrollLeft):a.container.scrollLeft}function M(){let t=0;if(a.slides.length>1){const e=a.slides[0].getBoundingClientRect(),o=a.slides[1].getBoundingClientRect();t=a.options.rtl?Math.abs(Math.floor(o.right-e.left)):Math.floor(o.left-e.right)}return t}function p(){let t=0;const e=a.container.getAttribute("data-full-width-offset");return e&&(t=parseInt(e)),Math.floor(t)}return a={emit:function(t){var e;s&&s[t]&&s[t].forEach((t=>{t(a)}));const o=null===(e=null==a?void 0:a.options)||void 0===e?void 0:e[t];"function"==typeof o&&o(a)},moveToDirection:function(t="prev"){const e=a.options.scrollStrategy,o=a.container.scrollLeft,n=a.container.getBoundingClientRect(),l=a.container.offsetWidth;let i=o;const r=a.options.rtl?"prev"===t?"next":"prev":t;if("prev"===r?i=Math.max(0,o-a.container.offsetWidth):"next"===r&&(i=Math.min(a.getInclusiveScrollWidth(),o+a.container.offsetWidth)),"fullSlide"===e){let t=null;if(t="prev"===r?Math.max(0,i-M()):Math.min(a.getInclusiveScrollWidth(),i+M()),"next"===r){let e=!1;for(let l of a.slides){const r=l.getBoundingClientRect(),a=r.left-n.left+o,s=a+r.width;if(Math.floor(a)<Math.floor(i)&&Math.floor(s)>Math.floor(i)){t=a,e=!0;break}}if(e||(t=Math.min(i,a.getInclusiveScrollWidth()-a.container.offsetWidth)),t)if(Math.floor(t)>Math.floor(o)){const e=Math.floor(a.getInclusiveScrollWidth())-Math.floor(l);i=Math.min(t,e)}else i=Math.min(a.getInclusiveScrollWidth(),o+l)}else{let e=!1;for(let i of a.slides){const r=i.getBoundingClientRect(),a=r.left-n.left+o,s=a+r.width;if(Math.floor(a)<Math.floor(o)&&Math.floor(s)>Math.floor(o)){t=s-l,e=!0;break}}e||(t=Math.max(0,o-l)),t&&Math.floor(t)<Math.floor(o)&&(i=t)}}const s=i-p();Math.floor(s)>=0&&(i=s),a.emit("programmaticScrollStart"),a.container.style.scrollBehavior=a.options.scrollBehavior,a.container.scrollLeft=i,setTimeout((()=>a.container.style.scrollBehavior=""),50)},moveToSlide:function(t){const e=a.slides[t];e&&u(e)},snapToClosestSlide:function(t="prev"){const e=a.options.rtl?"prev"===t:"next"===t,o=[];for(let t=0;t<a.slides.length;t++){const e=a.slides[t],n=e.offsetWidth,l=a.options.rtl?Math.abs(e.offsetLeft+n-a.details.containerWidth):e.offsetLeft,i=l+n,r=l+n/2,s=Math.min(r,l+a.options.emulateScrollSnapMaxThreshold);o.push({start:l,middle:r,end:i,width:n,trigger:s,slide:e,offSetleft:e.offsetLeft,rect:e.getBoundingClientRect()})}console.log("slideReference",o);let n=null;const l=m();if(e)for(let t=0;t<o.length;t++){const e=o[t];if(0===t&&Math.floor(l)<=Math.floor(e.trigger)){n=0;break}if(Math.floor(m())<=Math.floor(e.trigger)){n=e.start;break}}else for(let t=o.length-1;t>=0;t--){const e=o[t];if(t===o.length-1&&Math.floor(l)>=Math.floor(e.trigger)){n=e.start;break}if(Math.floor(m())>=Math.floor(e.trigger)){n=e.start;break}}if(null!==n){const t=n-p();Math.floor(t)>=0&&(n=t);const e=a.options.scrollBehavior||"smooth";a.container.scrollTo({left:a.options.rtl?-n:n,behavior:e})}},getInclusiveScrollWidth:function(){return a.container.scrollWidth+n(a.container)},getInclusiveClientWidth:function(){return a.container.clientWidth+n(a.container)},getScrollLeft:m,setScrollLeft:function(t){a.container.scrollLeft=a.options.rtl?-t:t},on:function(t,e){s[t]||(s[t]=[]),s[t].push(e)},options:i},function(){a.container=l;let t=l.getAttribute("id");null===t&&(t=e("overflow-slider"),l.setAttribute("id",t)),f(),c(!0),g(),a.on("contentsChanged",(()=>{f(),c(),g()})),a.on("containerSizeChanged",(()=>c()));let o=0;if(a.on("scroll",(()=>{o&&window.cancelAnimationFrame(o),o=window.requestAnimationFrame((()=>{c(),g()}))})),function(){new MutationObserver((()=>a.emit("contentsChanged"))).observe(a.container,{childList:!0});let t,e,o;new ResizeObserver((()=>a.emit("containerSizeChanged"))).observe(a.container);let n=a.container.scrollLeft,l=a.container.scrollLeft,i=a.container.scrollLeft,r=!1,s=!1,c=!1;a.container.addEventListener("scroll",(()=>{const e=a.container.scrollLeft;Math.floor(n)!==Math.floor(e)&&(r||(r=!0,a.emit("scrollStart")),n=e,clearTimeout(t),t=setTimeout((()=>{r=!1,a.emit("scrollEnd")}),50),a.emit("scroll")),s&&f()}));const f=()=>{const t=a.container.scrollLeft;Math.floor(l)===Math.floor(t)||c||(s||(a.emit("nativeScrollStart"),s=!0),a.emit("nativeScroll"),l=t,clearTimeout(e),e=setTimeout((()=>{s=!1,a.emit("nativeScrollEnd"),i=l}),50))};a.container.addEventListener("touchmove",f),a.container.addEventListener("mousewheel",f),a.container.addEventListener("wheel",f),a.on("programmaticScrollStart",(()=>{c=!0})),a.container.addEventListener("scroll",(()=>{const t=a.container.scrollLeft;Math.floor(i)!==Math.floor(t)&&!s&&c&&(i=t,clearTimeout(o),o=setTimeout((()=>{c=!1,a.emit("programmaticScrollEnd"),l=i}),50),a.emit("programmaticScroll"))})),a.on("programmaticScrollStart",(()=>{a.container.style.scrollSnapType="none"})),a.on("nativeScrollStart",(()=>{a.container.style.scrollSnapType=""}));let d=!1;a.container.addEventListener("mousedown",(()=>{d=!0})),a.container.addEventListener("touchstart",(()=>{d=!0}),{passive:!0}),a.container.addEventListener("focusin",(t=>{if(!d){let e=t.target;for(;e.parentElement!==a.container&&e.parentElement;)e=e.parentElement;u(e,"auto")}d=!1}))}(),h(),d(),r)for(const t of r)t(a);a.on("detailsChanged",(()=>{h(),d()})),a.emit("created"),a.container.setAttribute("data-ready","true")}(),a}export{l as default};
+import t from"./details.min.js";import{generateId as e,objectsAreEqual as o,getOutermostChildrenEdgeMarginSum as n}from"./utils.min.js";function l(l,i,r){let a,s={};function c(e=!1){const n=a.details,l=t(a);a.details=l,e||o(n,l)?e&&a.emit("detailsChanged"):a.emit("detailsChanged")}function f(){a.slides=Array.from(a.container.querySelectorAll(a.options.slidesSelector))}function d(){a.container.style.setProperty("--slider-container-width",`${a.details.containerWidth}px`),a.container.style.setProperty("--slider-scrollable-width",`${a.details.scrollableAreaWidth}px`),a.container.style.setProperty("--slider-slides-count",`${a.details.slideCount}`)}function h(){a.container.setAttribute("data-has-overflow",a.details.hasOverflow?"true":"false"),a.options.rtl&&a.container.setAttribute("dir","rtl")}function u(t,e=null){const o=e||a.options.scrollBehavior,n=t.getBoundingClientRect(),l=a.container.getBoundingClientRect(),i=a.container.offsetWidth,r=a.container.scrollLeft,s=n.left-l.left+r,c=s+n.width;let f=null;f=Math.floor(s)<Math.floor(r)?s:Math.floor(c)>Math.floor(r)+Math.floor(i)?c-i:0===Math.floor(s)?0:s,null!==f&&setTimeout((t=>{a.emit("programmaticScrollStart"),a.container.scrollTo({left:t,behavior:o})}),50,f)}function g(){const t=a.container.getBoundingClientRect(),e=a.getScrollLeft(),o=a.slides;let n=0,l=!1;if(a.options.rtl){const l=a.getInclusiveScrollWidth()-e-a.getInclusiveClientWidth(),i=[];for(let e=o.length-1;e>=0;e--){const n=o[e].getBoundingClientRect(),r=Math.abs(n.left)-Math.abs(t.left)+l;i.push({slide:o[e],slideEnd:r})}let r=null,s=null;for(let t=0;t<i.length;t++){const e=Math.abs(i[t].slideEnd-l);(null===s||e<s)&&(s=e,r=i[t].slide)}n=r?o.indexOf(r):o.length-1}else for(let i=0;i<o.length;i++){const r=o[i].getBoundingClientRect().left-t.left+e+v();if(Math.floor(r)>=Math.floor(e)){n=i;break}i===o.length-1&&(l=!0)}l&&(n=o.length-1);const i=a.activeSlideIdx;a.activeSlideIdx=n,i!==n&&a.emit("activeSlideChanged")}function m(t){const e=a.slides[t];e&&u(e)}function M(){return a.options.rtl?Math.abs(a.container.scrollLeft):a.container.scrollLeft}function v(){let t=0;if(a.slides.length>1){const e=a.slides[0].getBoundingClientRect(),o=a.slides[1].getBoundingClientRect();t=a.options.rtl?Math.abs(Math.floor(o.right-e.left)):Math.floor(o.left-e.right)}return t}function p(){let t=0;const e=a.container.getAttribute("data-full-width-offset");return e&&(t=parseInt(e)),Math.floor(t)}return a={emit:function(t){var e;s&&s[t]&&s[t].forEach((t=>{t(a)}));const o=null===(e=null==a?void 0:a.options)||void 0===e?void 0:e[t];"function"==typeof o&&o(a)},moveToDirection:function(t="prev"){const e=a.options.scrollStrategy,o=a.container.scrollLeft,n=a.container.getBoundingClientRect(),l=a.container.offsetWidth;let i=o;const r=a.options.rtl?"prev"===t?"next":"prev":t;if("prev"===r?i=Math.max(0,o-a.container.offsetWidth):"next"===r&&(i=Math.min(a.getInclusiveScrollWidth(),o+a.container.offsetWidth)),"fullSlide"===e){let t=null;if(t="prev"===r?Math.max(0,i-v()):Math.min(a.getInclusiveScrollWidth(),i+v()),"next"===r){let e=!1;for(let l of a.slides){const r=l.getBoundingClientRect(),a=r.left-n.left+o,s=a+r.width;if(Math.floor(a)<Math.floor(i)&&Math.floor(s)>Math.floor(i)){t=a,e=!0;break}}if(e||(t=Math.min(i,a.getInclusiveScrollWidth()-a.container.offsetWidth)),t)if(Math.floor(t)>Math.floor(o)){const e=Math.floor(a.getInclusiveScrollWidth())-Math.floor(l);i=Math.min(t,e)}else i=Math.min(a.getInclusiveScrollWidth(),o+l)}else{let e=!1;for(let i of a.slides){const r=i.getBoundingClientRect(),a=r.left-n.left+o,s=a+r.width;if(Math.floor(a)<Math.floor(o)&&Math.floor(s)>Math.floor(o)){t=s-l,e=!0;break}}e||(t=Math.max(0,o-l)),t&&Math.floor(t)<Math.floor(o)&&(i=t)}}const s=i-p();Math.floor(s)>=0&&(i=s),a.emit("programmaticScrollStart"),a.container.style.scrollBehavior=a.options.scrollBehavior,a.container.scrollLeft=i,setTimeout((()=>a.container.style.scrollBehavior=""),50)},moveToSlide:m,moveToSlideInDirection:function(t){const e=a.activeSlideIdx;"prev"===t?e>0&&m(e-1):"next"===t&&e<a.slides.length-1&&m(e+1)},snapToClosestSlide:function(t="prev"){const e=a.options.rtl?"prev"===t:"next"===t,o=[];for(let t=0;t<a.slides.length;t++){const e=a.slides[t],n=e.offsetWidth,l=a.options.rtl?Math.abs(e.offsetLeft+n-a.details.containerWidth):e.offsetLeft,i=l+n,r=l+n/2,s=Math.min(r,l+a.options.emulateScrollSnapMaxThreshold);o.push({start:l,middle:r,end:i,width:n,trigger:s,slide:e,offSetleft:e.offsetLeft,rect:e.getBoundingClientRect()})}let n=null;const l=M();if(e)for(let t=0;t<o.length;t++){const e=o[t];if(0===t&&Math.floor(l)<=Math.floor(e.trigger)){n=0;break}if(Math.floor(M())<=Math.floor(e.trigger)){n=e.start;break}}else for(let t=o.length-1;t>=0;t--){const e=o[t];if(t===o.length-1&&Math.floor(l)>=Math.floor(e.trigger)){n=e.start;break}if(Math.floor(M())>=Math.floor(e.trigger)){n=e.start;break}}if(null!==n){const t=n-p();Math.floor(t)>=0&&(n=t);const e=a.options.scrollBehavior||"smooth";a.container.scrollTo({left:a.options.rtl?-n:n,behavior:e})}},getInclusiveScrollWidth:function(){return a.container.scrollWidth+n(a.container)},getInclusiveClientWidth:function(){return a.container.clientWidth+n(a.container)},getScrollLeft:M,setScrollLeft:function(t){a.container.scrollLeft=a.options.rtl?-t:t},on:function(t,e){s[t]||(s[t]=[]),s[t].push(e)},options:i},function(){a.container=l;let t=l.getAttribute("id");null===t&&(t=e("overflow-slider"),l.setAttribute("id",t)),f(),c(!0),g(),a.on("contentsChanged",(()=>{f(),c(),g()})),a.on("containerSizeChanged",(()=>c()));let o=0;if(a.on("scroll",(()=>{o&&window.cancelAnimationFrame(o),o=window.requestAnimationFrame((()=>{c(),g()}))})),function(){new MutationObserver((()=>a.emit("contentsChanged"))).observe(a.container,{childList:!0});let t,e,o;new ResizeObserver((()=>a.emit("containerSizeChanged"))).observe(a.container);let n=a.container.scrollLeft,l=a.container.scrollLeft,i=a.container.scrollLeft,r=!1,s=!1,c=!1;a.container.addEventListener("scroll",(()=>{const e=a.container.scrollLeft;Math.floor(n)!==Math.floor(e)&&(r||(r=!0,a.emit("scrollStart")),n=e,clearTimeout(t),t=setTimeout((()=>{r=!1,a.emit("scrollEnd")}),50),a.emit("scroll")),s&&f()}));const f=()=>{const t=a.container.scrollLeft;Math.floor(l)===Math.floor(t)||c||(s||(a.emit("nativeScrollStart"),s=!0),a.emit("nativeScroll"),l=t,clearTimeout(e),e=setTimeout((()=>{s=!1,a.emit("nativeScrollEnd"),i=l}),50))};a.container.addEventListener("touchmove",f),a.container.addEventListener("mousewheel",f),a.container.addEventListener("wheel",f),a.on("programmaticScrollStart",(()=>{c=!0})),a.container.addEventListener("scroll",(()=>{const t=a.container.scrollLeft;Math.floor(i)!==Math.floor(t)&&!s&&c&&(i=t,clearTimeout(o),o=setTimeout((()=>{c=!1,a.emit("programmaticScrollEnd"),l=i}),50),a.emit("programmaticScroll"))})),a.on("programmaticScrollStart",(()=>{a.container.style.scrollSnapType="none"})),a.on("nativeScrollStart",(()=>{a.container.style.scrollSnapType=""}));let d=!1;a.container.addEventListener("mousedown",(()=>{d=!0})),a.container.addEventListener("touchstart",(()=>{d=!0}),{passive:!0}),a.container.addEventListener("focusin",(t=>{if(!d){let e=t.target;for(;e.parentElement!==a.container&&e.parentElement;)e=e.parentElement;u(e,"auto")}d=!1}))}(),h(),d(),r)for(const t of r)t(a);a.on("detailsChanged",(()=>{h(),d()})),a.emit("created"),a.container.setAttribute("data-ready","true")}(),a}export{l as default};

package/dist/plugins/arrows/{arrows/index.esm.js → index.esm.js}

@@ -13,7 +13,7 @@ const DEFAULT_CLASS_NAMES = {
 };
 function ArrowsPlugin(args) {
     return (slider) => {
-        var _a, _b, _c, _d, _e, _f;
+        var _a, _b, _c, _d, _e, _f, _g;
         const options = {
             texts: Object.assign(Object.assign({}, DEFAULT_TEXTS), (args === null || args === void 0 ? void 0 : args.texts) || []),
             icons: Object.assign(Object.assign({}, DEFAULT_ICONS), (args === null || args === void 0 ? void 0 : args.icons) || []),
@@ -21,6 +21,7 @@ function ArrowsPlugin(args) {
             container: (_a = args === null || args === void 0 ? void 0 : args.container) !== null && _a !== void 0 ? _a : null,
             containerPrev: (_b = args === null || args === void 0 ? void 0 : args.containerPrev) !== null && _b !== void 0 ? _b : null,
             containerNext: (_c = args === null || args === void 0 ? void 0 : args.containerNext) !== null && _c !== void 0 ? _c : null,
+            movementType: (_d = args === null || args === void 0 ? void 0 : args.movementType) !== null && _d !== void 0 ? _d : 'view',
         };
         const nav = document.createElement('div');
         nav.classList.add(options.classNames.navContainer);
@@ -28,24 +29,24 @@ function ArrowsPlugin(args) {
         prev.setAttribute('class', options.classNames.prevButton);
         prev.setAttribute('type', 'button');
         prev.setAttribute('aria-label', options.texts.buttonPrevious);
-        prev.setAttribute('aria-controls', (_d = slider.container.getAttribute('id')) !== null && _d !== void 0 ? _d : '');
+        prev.setAttribute('aria-controls', (_e = slider.container.getAttribute('id')) !== null && _e !== void 0 ? _e : '');
         prev.setAttribute('data-type', 'prev');
         prev.innerHTML = slider.options.rtl ? options.icons.next : options.icons.prev;
         prev.addEventListener('click', () => {
             if (prev.getAttribute('data-has-content') === 'true') {
-                slider.moveToDirection('prev');
+                options.movementType === 'slide' ? slider.moveToSlideInDirection('prev') : slider.moveToDirection('prev');
             }
         });
         const next = document.createElement('button');
         next.setAttribute('class', options.classNames.nextButton);
         next.setAttribute('type', 'button');
         next.setAttribute('aria-label', options.texts.buttonNext);
-        next.setAttribute('aria-controls', (_e = slider.container.getAttribute('id')) !== null && _e !== void 0 ? _e : '');
+        next.setAttribute('aria-controls', (_f = slider.container.getAttribute('id')) !== null && _f !== void 0 ? _f : '');
         next.setAttribute('data-type', 'next');
         next.innerHTML = slider.options.rtl ? options.icons.prev : options.icons.next;
         next.addEventListener('click', () => {
             if (next.getAttribute('data-has-content') === 'true') {
-                slider.moveToDirection('next');
+                options.movementType === 'slide' ? slider.moveToSlideInDirection('next') : slider.moveToDirection('next');
             }
         });
         // insert buttons to the nav
@@ -69,7 +70,6 @@ function ArrowsPlugin(args) {
             else {
                 next.setAttribute('data-has-content', 'true');
             }
-            console.log('next', scrollLeft + clientWidth, scrollWidth);
         };
         if (options.containerNext && options.containerPrev) {
             options.containerPrev.appendChild(prev);
@@ -80,7 +80,7 @@ function ArrowsPlugin(args) {
                 options.container.appendChild(nav);
             }
             else {
-                (_f = slider.container.parentNode) === null || _f === void 0 ? void 0 : _f.insertBefore(nav, slider.container.nextSibling);
+                (_g = slider.container.parentNode) === null || _g === void 0 ? void 0 : _g.insertBefore(nav, slider.container.nextSibling);
             }
         }
         update();

package/dist/plugins/arrows/index.min.js

@@ -0,0 +1 @@
+const t={buttonPrevious:"Previous items",buttonNext:"Next items"},e={prev:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M8.6 3.4l-7.6 7.6 7.6 7.6 1.4-1.4-5-5h12.6v-2h-12.6l5-5z"/></svg>',next:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M15.4 3.4l-1.4 1.4 5 5h-12.6v2h12.6l-5 5 1.4 1.4 7.6-7.6z"/></svg>'},n={navContainer:"overflow-slider__arrows",prevButton:"overflow-slider__arrows-button overflow-slider__arrows-button--prev",nextButton:"overflow-slider__arrows-button overflow-slider__arrows-button--next"};function o(o){return i=>{var r,s,a,l,c,u,d;const v={texts:Object.assign(Object.assign({},t),(null==o?void 0:o.texts)||[]),icons:Object.assign(Object.assign({},e),(null==o?void 0:o.icons)||[]),classNames:Object.assign(Object.assign({},n),(null==o?void 0:o.classNames)||[]),container:null!==(r=null==o?void 0:o.container)&&void 0!==r?r:null,containerPrev:null!==(s=null==o?void 0:o.containerPrev)&&void 0!==s?s:null,containerNext:null!==(a=null==o?void 0:o.containerNext)&&void 0!==a?a:null,movementType:null!==(l=null==o?void 0:o.movementType)&&void 0!==l?l:"view"},b=document.createElement("div");b.classList.add(v.classNames.navContainer);const p=document.createElement("button");p.setAttribute("class",v.classNames.prevButton),p.setAttribute("type","button"),p.setAttribute("aria-label",v.texts.buttonPrevious),p.setAttribute("aria-controls",null!==(c=i.container.getAttribute("id"))&&void 0!==c?c:""),p.setAttribute("data-type","prev"),p.innerHTML=i.options.rtl?v.icons.next:v.icons.prev,p.addEventListener("click",(()=>{"true"===p.getAttribute("data-has-content")&&("slide"===v.movementType?i.moveToSlideInDirection("prev"):i.moveToDirection("prev"))}));const h=document.createElement("button");h.setAttribute("class",v.classNames.nextButton),h.setAttribute("type","button"),h.setAttribute("aria-label",v.texts.buttonNext),h.setAttribute("aria-controls",null!==(u=i.container.getAttribute("id"))&&void 0!==u?u:""),h.setAttribute("data-type","next"),h.innerHTML=i.options.rtl?v.icons.prev:v.icons.next,h.addEventListener("click",(()=>{"true"===h.getAttribute("data-has-content")&&("slide"===v.movementType?i.moveToSlideInDirection("next"):i.moveToDirection("next"))})),b.appendChild(p),b.appendChild(h);const m=()=>{const t=i.getScrollLeft(),e=i.getInclusiveScrollWidth(),n=i.getInclusiveClientWidth();0===Math.floor(t)?p.setAttribute("data-has-content","false"):p.setAttribute("data-has-content","true");Math.abs(Math.floor(t+n)-Math.floor(e))<=1?h.setAttribute("data-has-content","false"):h.setAttribute("data-has-content","true")};v.containerNext&&v.containerPrev?(v.containerPrev.appendChild(p),v.containerNext.appendChild(h)):v.container?v.container.appendChild(b):null===(d=i.container.parentNode)||void 0===d||d.insertBefore(b,i.container.nextSibling),m(),i.on("scrollEnd",m),i.on("contentsChanged",m),i.on("containerSizeChanged",m)}}export{o as default};

package/{docs/dist/plugins/skip-links → dist/plugins}/skip-links/index.esm.js

@@ -1,4 +1,4 @@
-import { generateId } from '../../../core/utils.esm.js';
+import { generateId } from '../../core/utils.esm.js';
 
 const DEFAULT_TEXTS = {
     skipList: 'Skip list'

package/dist/plugins/skip-links/index.min.js

@@ -0,0 +1 @@
+import{generateId as e}from"../../core/utils.min.js";const t={skipList:"Skip list"},n={skipLink:"screen-reader-text",skipLinkTarget:"overflow-slider__skip-link-target"};function i(i){return r=>{var o,s,a,l,c,d;const u={texts:Object.assign(Object.assign({},t),(null==i?void 0:i.texts)||[]),classNames:Object.assign(Object.assign({},n),(null==i?void 0:i.classNames)||[]),containerBefore:null!==(o=null==i?void 0:i.containerAfter)&&void 0!==o?o:null,containerAfter:null!==(s=null==i?void 0:i.containerAfter)&&void 0!==s?s:null},f=e("overflow-slider-skip"),p=document.createElement("a");p.setAttribute("href",`#${f}`),p.textContent=u.texts.skipList,p.classList.add(u.classNames.skipLink);const v=document.createElement("div");v.setAttribute("id",f),v.setAttribute("tabindex","-1"),u.containerBefore?null===(a=u.containerBefore.parentNode)||void 0===a||a.insertBefore(p,u.containerBefore):null===(l=r.container.parentNode)||void 0===l||l.insertBefore(p,r.container),u.containerAfter?null===(c=u.containerAfter.parentNode)||void 0===c||c.insertBefore(v,u.containerAfter.nextSibling):null===(d=r.container.parentNode)||void 0===d||d.insertBefore(v,r.container.nextSibling)}}export{i as default};

package/docs/assets/demo.js

@@ -11,14 +11,14 @@
  * import SkipLinksPlugin from '@overflow-slider/plugins/skip-links';
  */
 import { OverflowSlider } from '../dist/index.esm.js';
-import DragScrollingPlugin from '../dist/plugins/drag-scrolling/drag-scrolling/index.esm.js';
-import SkipLinksPlugin from '../dist/plugins/skip-links/skip-links/index.esm.js';
-import ArrowsPlugin from '../dist/plugins/arrows/arrows/index.esm.js';
-import ScrollIndicatorPlugin from '../dist/plugins/scroll-indicator/scroll-indicator/index.esm.js';
-import DotsPlugin from '../dist/plugins/dots/dots/index.esm.js';
-import FullWidthPlugin from '../dist/plugins/full-width/full-width/index.esm.js';
-import ThumbnailsPlugin from '../dist/plugins/thumbnails/thumbnails/index.esm.js';
-import FadePlugin from '../dist/plugins/fade/fade/index.esm.js';
+import DragScrollingPlugin from '../dist/plugins/drag-scrolling/index.esm.js';
+import SkipLinksPlugin from '../dist/plugins/skip-links/index.esm.js';
+import ArrowsPlugin from '../dist/plugins/arrows/index.esm.js';
+import ScrollIndicatorPlugin from '../dist/plugins/scroll-indicator/index.esm.js';
+import DotsPlugin from '../dist/plugins/dots/index.esm.js';
+import FullWidthPlugin from '../dist/plugins/full-width/index.esm.js';
+import ThumbnailsPlugin from '../dist/plugins/thumbnails/index.esm.js';
+import FadePlugin from '../dist/plugins/fade/index.esm.js';
 
 (function () {
 	const init = () => {
@@ -76,6 +76,21 @@ import FadePlugin from '../dist/plugins/fade/fade/index.esm.js';
 		);
 		console.log( '1-arrows', example1Arrows );
 
+		const example1ArrowsBySlide = new OverflowSlider(
+			document.querySelector( '.example-container-1-arrows-by-slide' ),
+			{
+				rtl: document.documentElement.dir === 'rtl',
+			},
+			[
+				DragScrollingPlugin(),
+				SkipLinksPlugin(),
+				ArrowsPlugin({
+					movementType: 'slide',
+				}),
+			]
+		);
+		console.log( '1-arrows-by-slide', example1ArrowsBySlide );
+
 		const example1ScrollIndicator = new OverflowSlider(
 			document.querySelector( '.example-container-1-scroll-indicator' ),
 			{

package/docs/dist/core/slider.esm.js

@@ -267,7 +267,6 @@ function Slider(container, options, plugins) {
         }
         const oldActiveSlideIdx = slider.activeSlideIdx;
         slider.activeSlideIdx = activeSlideIdx;
-        // console.log('activeSlideIdx', activeSlideIdx);
         if (oldActiveSlideIdx !== activeSlideIdx) {
             slider.emit('activeSlideChanged');
         }
@@ -278,6 +277,19 @@ function Slider(container, options, plugins) {
             ensureSlideIsInView(slide);
         }
     }
+    function moveToSlideInDirection(direction) {
+        const activeSlideIdx = slider.activeSlideIdx;
+        if (direction === 'prev') {
+            if (activeSlideIdx > 0) {
+                moveToSlide(activeSlideIdx - 1);
+            }
+        }
+        else if (direction === 'next') {
+            if (activeSlideIdx < slider.slides.length - 1) {
+                moveToSlide(activeSlideIdx + 1);
+            }
+        }
+    }
     function getInclusiveScrollWidth() {
         return slider.container.scrollWidth + getOutermostChildrenEdgeMarginSum(slider.container);
     }
@@ -408,7 +420,6 @@ function Slider(container, options, plugins) {
                 rect: slide.getBoundingClientRect(),
             });
         }
-        console.log('slideReference', slideReference);
         let snapTarget = null;
         const scrollPosition = getScrollLeft();
         if (isMovingForward) {
@@ -472,6 +483,7 @@ function Slider(container, options, plugins) {
         emit,
         moveToDirection,
         moveToSlide,
+        moveToSlideInDirection,
         snapToClosestSlide,
         getInclusiveScrollWidth,
         getInclusiveClientWidth,

package/docs/dist/core/slider.min.js

@@ -1 +1 @@
-import t from"./details.min.js";import{generateId as e,objectsAreEqual as o,getOutermostChildrenEdgeMarginSum as n}from"./utils.min.js";function l(l,i,r){let a,s={};function c(e=!1){const n=a.details,l=t(a);a.details=l,e||o(n,l)?e&&a.emit("detailsChanged"):a.emit("detailsChanged")}function f(){a.slides=Array.from(a.container.querySelectorAll(a.options.slidesSelector))}function d(){a.container.style.setProperty("--slider-container-width",`${a.details.containerWidth}px`),a.container.style.setProperty("--slider-scrollable-width",`${a.details.scrollableAreaWidth}px`),a.container.style.setProperty("--slider-slides-count",`${a.details.slideCount}`)}function h(){a.container.setAttribute("data-has-overflow",a.details.hasOverflow?"true":"false"),a.options.rtl&&a.container.setAttribute("dir","rtl")}function u(t,e=null){const o=e||a.options.scrollBehavior,n=t.getBoundingClientRect(),l=a.container.getBoundingClientRect(),i=a.container.offsetWidth,r=a.container.scrollLeft,s=n.left-l.left+r,c=s+n.width;let f=null;f=Math.floor(s)<Math.floor(r)?s:Math.floor(c)>Math.floor(r)+Math.floor(i)?c-i:0===Math.floor(s)?0:s,null!==f&&setTimeout((t=>{a.emit("programmaticScrollStart"),a.container.scrollTo({left:t,behavior:o})}),50,f)}function g(){const t=a.container.getBoundingClientRect(),e=a.getScrollLeft(),o=a.slides;let n=0,l=!1;if(a.options.rtl){const l=a.getInclusiveScrollWidth()-e-a.getInclusiveClientWidth(),i=[];for(let e=o.length-1;e>=0;e--){const n=o[e].getBoundingClientRect(),r=Math.abs(n.left)-Math.abs(t.left)+l;i.push({slide:o[e],slideEnd:r})}let r=null,s=null;for(let t=0;t<i.length;t++){const e=Math.abs(i[t].slideEnd-l);(null===s||e<s)&&(s=e,r=i[t].slide)}n=r?o.indexOf(r):o.length-1}else for(let i=0;i<o.length;i++){const r=o[i].getBoundingClientRect().left-t.left+e+M();if(Math.floor(r)>=Math.floor(e)){n=i;break}i===o.length-1&&(l=!0)}l&&(n=o.length-1);const i=a.activeSlideIdx;a.activeSlideIdx=n,i!==n&&a.emit("activeSlideChanged")}function m(){return a.options.rtl?Math.abs(a.container.scrollLeft):a.container.scrollLeft}function M(){let t=0;if(a.slides.length>1){const e=a.slides[0].getBoundingClientRect(),o=a.slides[1].getBoundingClientRect();t=a.options.rtl?Math.abs(Math.floor(o.right-e.left)):Math.floor(o.left-e.right)}return t}function p(){let t=0;const e=a.container.getAttribute("data-full-width-offset");return e&&(t=parseInt(e)),Math.floor(t)}return a={emit:function(t){var e;s&&s[t]&&s[t].forEach((t=>{t(a)}));const o=null===(e=null==a?void 0:a.options)||void 0===e?void 0:e[t];"function"==typeof o&&o(a)},moveToDirection:function(t="prev"){const e=a.options.scrollStrategy,o=a.container.scrollLeft,n=a.container.getBoundingClientRect(),l=a.container.offsetWidth;let i=o;const r=a.options.rtl?"prev"===t?"next":"prev":t;if("prev"===r?i=Math.max(0,o-a.container.offsetWidth):"next"===r&&(i=Math.min(a.getInclusiveScrollWidth(),o+a.container.offsetWidth)),"fullSlide"===e){let t=null;if(t="prev"===r?Math.max(0,i-M()):Math.min(a.getInclusiveScrollWidth(),i+M()),"next"===r){let e=!1;for(let l of a.slides){const r=l.getBoundingClientRect(),a=r.left-n.left+o,s=a+r.width;if(Math.floor(a)<Math.floor(i)&&Math.floor(s)>Math.floor(i)){t=a,e=!0;break}}if(e||(t=Math.min(i,a.getInclusiveScrollWidth()-a.container.offsetWidth)),t)if(Math.floor(t)>Math.floor(o)){const e=Math.floor(a.getInclusiveScrollWidth())-Math.floor(l);i=Math.min(t,e)}else i=Math.min(a.getInclusiveScrollWidth(),o+l)}else{let e=!1;for(let i of a.slides){const r=i.getBoundingClientRect(),a=r.left-n.left+o,s=a+r.width;if(Math.floor(a)<Math.floor(o)&&Math.floor(s)>Math.floor(o)){t=s-l,e=!0;break}}e||(t=Math.max(0,o-l)),t&&Math.floor(t)<Math.floor(o)&&(i=t)}}const s=i-p();Math.floor(s)>=0&&(i=s),a.emit("programmaticScrollStart"),a.container.style.scrollBehavior=a.options.scrollBehavior,a.container.scrollLeft=i,setTimeout((()=>a.container.style.scrollBehavior=""),50)},moveToSlide:function(t){const e=a.slides[t];e&&u(e)},snapToClosestSlide:function(t="prev"){const e=a.options.rtl?"prev"===t:"next"===t,o=[];for(let t=0;t<a.slides.length;t++){const e=a.slides[t],n=e.offsetWidth,l=a.options.rtl?Math.abs(e.offsetLeft+n-a.details.containerWidth):e.offsetLeft,i=l+n,r=l+n/2,s=Math.min(r,l+a.options.emulateScrollSnapMaxThreshold);o.push({start:l,middle:r,end:i,width:n,trigger:s,slide:e,offSetleft:e.offsetLeft,rect:e.getBoundingClientRect()})}console.log("slideReference",o);let n=null;const l=m();if(e)for(let t=0;t<o.length;t++){const e=o[t];if(0===t&&Math.floor(l)<=Math.floor(e.trigger)){n=0;break}if(Math.floor(m())<=Math.floor(e.trigger)){n=e.start;break}}else for(let t=o.length-1;t>=0;t--){const e=o[t];if(t===o.length-1&&Math.floor(l)>=Math.floor(e.trigger)){n=e.start;break}if(Math.floor(m())>=Math.floor(e.trigger)){n=e.start;break}}if(null!==n){const t=n-p();Math.floor(t)>=0&&(n=t);const e=a.options.scrollBehavior||"smooth";a.container.scrollTo({left:a.options.rtl?-n:n,behavior:e})}},getInclusiveScrollWidth:function(){return a.container.scrollWidth+n(a.container)},getInclusiveClientWidth:function(){return a.container.clientWidth+n(a.container)},getScrollLeft:m,setScrollLeft:function(t){a.container.scrollLeft=a.options.rtl?-t:t},on:function(t,e){s[t]||(s[t]=[]),s[t].push(e)},options:i},function(){a.container=l;let t=l.getAttribute("id");null===t&&(t=e("overflow-slider"),l.setAttribute("id",t)),f(),c(!0),g(),a.on("contentsChanged",(()=>{f(),c(),g()})),a.on("containerSizeChanged",(()=>c()));let o=0;if(a.on("scroll",(()=>{o&&window.cancelAnimationFrame(o),o=window.requestAnimationFrame((()=>{c(),g()}))})),function(){new MutationObserver((()=>a.emit("contentsChanged"))).observe(a.container,{childList:!0});let t,e,o;new ResizeObserver((()=>a.emit("containerSizeChanged"))).observe(a.container);let n=a.container.scrollLeft,l=a.container.scrollLeft,i=a.container.scrollLeft,r=!1,s=!1,c=!1;a.container.addEventListener("scroll",(()=>{const e=a.container.scrollLeft;Math.floor(n)!==Math.floor(e)&&(r||(r=!0,a.emit("scrollStart")),n=e,clearTimeout(t),t=setTimeout((()=>{r=!1,a.emit("scrollEnd")}),50),a.emit("scroll")),s&&f()}));const f=()=>{const t=a.container.scrollLeft;Math.floor(l)===Math.floor(t)||c||(s||(a.emit("nativeScrollStart"),s=!0),a.emit("nativeScroll"),l=t,clearTimeout(e),e=setTimeout((()=>{s=!1,a.emit("nativeScrollEnd"),i=l}),50))};a.container.addEventListener("touchmove",f),a.container.addEventListener("mousewheel",f),a.container.addEventListener("wheel",f),a.on("programmaticScrollStart",(()=>{c=!0})),a.container.addEventListener("scroll",(()=>{const t=a.container.scrollLeft;Math.floor(i)!==Math.floor(t)&&!s&&c&&(i=t,clearTimeout(o),o=setTimeout((()=>{c=!1,a.emit("programmaticScrollEnd"),l=i}),50),a.emit("programmaticScroll"))})),a.on("programmaticScrollStart",(()=>{a.container.style.scrollSnapType="none"})),a.on("nativeScrollStart",(()=>{a.container.style.scrollSnapType=""}));let d=!1;a.container.addEventListener("mousedown",(()=>{d=!0})),a.container.addEventListener("touchstart",(()=>{d=!0}),{passive:!0}),a.container.addEventListener("focusin",(t=>{if(!d){let e=t.target;for(;e.parentElement!==a.container&&e.parentElement;)e=e.parentElement;u(e,"auto")}d=!1}))}(),h(),d(),r)for(const t of r)t(a);a.on("detailsChanged",(()=>{h(),d()})),a.emit("created"),a.container.setAttribute("data-ready","true")}(),a}export{l as default};
+import t from"./details.min.js";import{generateId as e,objectsAreEqual as o,getOutermostChildrenEdgeMarginSum as n}from"./utils.min.js";function l(l,i,r){let a,s={};function c(e=!1){const n=a.details,l=t(a);a.details=l,e||o(n,l)?e&&a.emit("detailsChanged"):a.emit("detailsChanged")}function f(){a.slides=Array.from(a.container.querySelectorAll(a.options.slidesSelector))}function d(){a.container.style.setProperty("--slider-container-width",`${a.details.containerWidth}px`),a.container.style.setProperty("--slider-scrollable-width",`${a.details.scrollableAreaWidth}px`),a.container.style.setProperty("--slider-slides-count",`${a.details.slideCount}`)}function h(){a.container.setAttribute("data-has-overflow",a.details.hasOverflow?"true":"false"),a.options.rtl&&a.container.setAttribute("dir","rtl")}function u(t,e=null){const o=e||a.options.scrollBehavior,n=t.getBoundingClientRect(),l=a.container.getBoundingClientRect(),i=a.container.offsetWidth,r=a.container.scrollLeft,s=n.left-l.left+r,c=s+n.width;let f=null;f=Math.floor(s)<Math.floor(r)?s:Math.floor(c)>Math.floor(r)+Math.floor(i)?c-i:0===Math.floor(s)?0:s,null!==f&&setTimeout((t=>{a.emit("programmaticScrollStart"),a.container.scrollTo({left:t,behavior:o})}),50,f)}function g(){const t=a.container.getBoundingClientRect(),e=a.getScrollLeft(),o=a.slides;let n=0,l=!1;if(a.options.rtl){const l=a.getInclusiveScrollWidth()-e-a.getInclusiveClientWidth(),i=[];for(let e=o.length-1;e>=0;e--){const n=o[e].getBoundingClientRect(),r=Math.abs(n.left)-Math.abs(t.left)+l;i.push({slide:o[e],slideEnd:r})}let r=null,s=null;for(let t=0;t<i.length;t++){const e=Math.abs(i[t].slideEnd-l);(null===s||e<s)&&(s=e,r=i[t].slide)}n=r?o.indexOf(r):o.length-1}else for(let i=0;i<o.length;i++){const r=o[i].getBoundingClientRect().left-t.left+e+v();if(Math.floor(r)>=Math.floor(e)){n=i;break}i===o.length-1&&(l=!0)}l&&(n=o.length-1);const i=a.activeSlideIdx;a.activeSlideIdx=n,i!==n&&a.emit("activeSlideChanged")}function m(t){const e=a.slides[t];e&&u(e)}function M(){return a.options.rtl?Math.abs(a.container.scrollLeft):a.container.scrollLeft}function v(){let t=0;if(a.slides.length>1){const e=a.slides[0].getBoundingClientRect(),o=a.slides[1].getBoundingClientRect();t=a.options.rtl?Math.abs(Math.floor(o.right-e.left)):Math.floor(o.left-e.right)}return t}function p(){let t=0;const e=a.container.getAttribute("data-full-width-offset");return e&&(t=parseInt(e)),Math.floor(t)}return a={emit:function(t){var e;s&&s[t]&&s[t].forEach((t=>{t(a)}));const o=null===(e=null==a?void 0:a.options)||void 0===e?void 0:e[t];"function"==typeof o&&o(a)},moveToDirection:function(t="prev"){const e=a.options.scrollStrategy,o=a.container.scrollLeft,n=a.container.getBoundingClientRect(),l=a.container.offsetWidth;let i=o;const r=a.options.rtl?"prev"===t?"next":"prev":t;if("prev"===r?i=Math.max(0,o-a.container.offsetWidth):"next"===r&&(i=Math.min(a.getInclusiveScrollWidth(),o+a.container.offsetWidth)),"fullSlide"===e){let t=null;if(t="prev"===r?Math.max(0,i-v()):Math.min(a.getInclusiveScrollWidth(),i+v()),"next"===r){let e=!1;for(let l of a.slides){const r=l.getBoundingClientRect(),a=r.left-n.left+o,s=a+r.width;if(Math.floor(a)<Math.floor(i)&&Math.floor(s)>Math.floor(i)){t=a,e=!0;break}}if(e||(t=Math.min(i,a.getInclusiveScrollWidth()-a.container.offsetWidth)),t)if(Math.floor(t)>Math.floor(o)){const e=Math.floor(a.getInclusiveScrollWidth())-Math.floor(l);i=Math.min(t,e)}else i=Math.min(a.getInclusiveScrollWidth(),o+l)}else{let e=!1;for(let i of a.slides){const r=i.getBoundingClientRect(),a=r.left-n.left+o,s=a+r.width;if(Math.floor(a)<Math.floor(o)&&Math.floor(s)>Math.floor(o)){t=s-l,e=!0;break}}e||(t=Math.max(0,o-l)),t&&Math.floor(t)<Math.floor(o)&&(i=t)}}const s=i-p();Math.floor(s)>=0&&(i=s),a.emit("programmaticScrollStart"),a.container.style.scrollBehavior=a.options.scrollBehavior,a.container.scrollLeft=i,setTimeout((()=>a.container.style.scrollBehavior=""),50)},moveToSlide:m,moveToSlideInDirection:function(t){const e=a.activeSlideIdx;"prev"===t?e>0&&m(e-1):"next"===t&&e<a.slides.length-1&&m(e+1)},snapToClosestSlide:function(t="prev"){const e=a.options.rtl?"prev"===t:"next"===t,o=[];for(let t=0;t<a.slides.length;t++){const e=a.slides[t],n=e.offsetWidth,l=a.options.rtl?Math.abs(e.offsetLeft+n-a.details.containerWidth):e.offsetLeft,i=l+n,r=l+n/2,s=Math.min(r,l+a.options.emulateScrollSnapMaxThreshold);o.push({start:l,middle:r,end:i,width:n,trigger:s,slide:e,offSetleft:e.offsetLeft,rect:e.getBoundingClientRect()})}let n=null;const l=M();if(e)for(let t=0;t<o.length;t++){const e=o[t];if(0===t&&Math.floor(l)<=Math.floor(e.trigger)){n=0;break}if(Math.floor(M())<=Math.floor(e.trigger)){n=e.start;break}}else for(let t=o.length-1;t>=0;t--){const e=o[t];if(t===o.length-1&&Math.floor(l)>=Math.floor(e.trigger)){n=e.start;break}if(Math.floor(M())>=Math.floor(e.trigger)){n=e.start;break}}if(null!==n){const t=n-p();Math.floor(t)>=0&&(n=t);const e=a.options.scrollBehavior||"smooth";a.container.scrollTo({left:a.options.rtl?-n:n,behavior:e})}},getInclusiveScrollWidth:function(){return a.container.scrollWidth+n(a.container)},getInclusiveClientWidth:function(){return a.container.clientWidth+n(a.container)},getScrollLeft:M,setScrollLeft:function(t){a.container.scrollLeft=a.options.rtl?-t:t},on:function(t,e){s[t]||(s[t]=[]),s[t].push(e)},options:i},function(){a.container=l;let t=l.getAttribute("id");null===t&&(t=e("overflow-slider"),l.setAttribute("id",t)),f(),c(!0),g(),a.on("contentsChanged",(()=>{f(),c(),g()})),a.on("containerSizeChanged",(()=>c()));let o=0;if(a.on("scroll",(()=>{o&&window.cancelAnimationFrame(o),o=window.requestAnimationFrame((()=>{c(),g()}))})),function(){new MutationObserver((()=>a.emit("contentsChanged"))).observe(a.container,{childList:!0});let t,e,o;new ResizeObserver((()=>a.emit("containerSizeChanged"))).observe(a.container);let n=a.container.scrollLeft,l=a.container.scrollLeft,i=a.container.scrollLeft,r=!1,s=!1,c=!1;a.container.addEventListener("scroll",(()=>{const e=a.container.scrollLeft;Math.floor(n)!==Math.floor(e)&&(r||(r=!0,a.emit("scrollStart")),n=e,clearTimeout(t),t=setTimeout((()=>{r=!1,a.emit("scrollEnd")}),50),a.emit("scroll")),s&&f()}));const f=()=>{const t=a.container.scrollLeft;Math.floor(l)===Math.floor(t)||c||(s||(a.emit("nativeScrollStart"),s=!0),a.emit("nativeScroll"),l=t,clearTimeout(e),e=setTimeout((()=>{s=!1,a.emit("nativeScrollEnd"),i=l}),50))};a.container.addEventListener("touchmove",f),a.container.addEventListener("mousewheel",f),a.container.addEventListener("wheel",f),a.on("programmaticScrollStart",(()=>{c=!0})),a.container.addEventListener("scroll",(()=>{const t=a.container.scrollLeft;Math.floor(i)!==Math.floor(t)&&!s&&c&&(i=t,clearTimeout(o),o=setTimeout((()=>{c=!1,a.emit("programmaticScrollEnd"),l=i}),50),a.emit("programmaticScroll"))})),a.on("programmaticScrollStart",(()=>{a.container.style.scrollSnapType="none"})),a.on("nativeScrollStart",(()=>{a.container.style.scrollSnapType=""}));let d=!1;a.container.addEventListener("mousedown",(()=>{d=!0})),a.container.addEventListener("touchstart",(()=>{d=!0}),{passive:!0}),a.container.addEventListener("focusin",(t=>{if(!d){let e=t.target;for(;e.parentElement!==a.container&&e.parentElement;)e=e.parentElement;u(e,"auto")}d=!1}))}(),h(),d(),r)for(const t of r)t(a);a.on("detailsChanged",(()=>{h(),d()})),a.emit("created"),a.container.setAttribute("data-ready","true")}(),a}export{l as default};

package/docs/dist/plugins/arrows/{arrows/index.esm.js → index.esm.js}

@@ -13,7 +13,7 @@ const DEFAULT_CLASS_NAMES = {
 };
 function ArrowsPlugin(args) {
     return (slider) => {
-        var _a, _b, _c, _d, _e, _f;
+        var _a, _b, _c, _d, _e, _f, _g;
         const options = {
             texts: Object.assign(Object.assign({}, DEFAULT_TEXTS), (args === null || args === void 0 ? void 0 : args.texts) || []),
             icons: Object.assign(Object.assign({}, DEFAULT_ICONS), (args === null || args === void 0 ? void 0 : args.icons) || []),
@@ -21,6 +21,7 @@ function ArrowsPlugin(args) {
             container: (_a = args === null || args === void 0 ? void 0 : args.container) !== null && _a !== void 0 ? _a : null,
             containerPrev: (_b = args === null || args === void 0 ? void 0 : args.containerPrev) !== null && _b !== void 0 ? _b : null,
             containerNext: (_c = args === null || args === void 0 ? void 0 : args.containerNext) !== null && _c !== void 0 ? _c : null,
+            movementType: (_d = args === null || args === void 0 ? void 0 : args.movementType) !== null && _d !== void 0 ? _d : 'view',
         };
         const nav = document.createElement('div');
         nav.classList.add(options.classNames.navContainer);
@@ -28,24 +29,24 @@ function ArrowsPlugin(args) {
         prev.setAttribute('class', options.classNames.prevButton);
         prev.setAttribute('type', 'button');
         prev.setAttribute('aria-label', options.texts.buttonPrevious);
-        prev.setAttribute('aria-controls', (_d = slider.container.getAttribute('id')) !== null && _d !== void 0 ? _d : '');
+        prev.setAttribute('aria-controls', (_e = slider.container.getAttribute('id')) !== null && _e !== void 0 ? _e : '');
         prev.setAttribute('data-type', 'prev');
         prev.innerHTML = slider.options.rtl ? options.icons.next : options.icons.prev;
         prev.addEventListener('click', () => {
             if (prev.getAttribute('data-has-content') === 'true') {
-                slider.moveToDirection('prev');
+                options.movementType === 'slide' ? slider.moveToSlideInDirection('prev') : slider.moveToDirection('prev');
             }
         });
         const next = document.createElement('button');
         next.setAttribute('class', options.classNames.nextButton);
         next.setAttribute('type', 'button');
         next.setAttribute('aria-label', options.texts.buttonNext);
-        next.setAttribute('aria-controls', (_e = slider.container.getAttribute('id')) !== null && _e !== void 0 ? _e : '');
+        next.setAttribute('aria-controls', (_f = slider.container.getAttribute('id')) !== null && _f !== void 0 ? _f : '');
         next.setAttribute('data-type', 'next');
         next.innerHTML = slider.options.rtl ? options.icons.prev : options.icons.next;
         next.addEventListener('click', () => {
             if (next.getAttribute('data-has-content') === 'true') {
-                slider.moveToDirection('next');
+                options.movementType === 'slide' ? slider.moveToSlideInDirection('next') : slider.moveToDirection('next');
             }
         });
         // insert buttons to the nav
@@ -69,7 +70,6 @@ function ArrowsPlugin(args) {
             else {
                 next.setAttribute('data-has-content', 'true');
             }
-            console.log('next', scrollLeft + clientWidth, scrollWidth);
         };
         if (options.containerNext && options.containerPrev) {
             options.containerPrev.appendChild(prev);
@@ -80,7 +80,7 @@ function ArrowsPlugin(args) {
                 options.container.appendChild(nav);
             }
             else {
-                (_f = slider.container.parentNode) === null || _f === void 0 ? void 0 : _f.insertBefore(nav, slider.container.nextSibling);
+                (_g = slider.container.parentNode) === null || _g === void 0 ? void 0 : _g.insertBefore(nav, slider.container.nextSibling);
             }
         }
         update();

package/docs/dist/plugins/arrows/index.min.js

@@ -0,0 +1 @@
+const t={buttonPrevious:"Previous items",buttonNext:"Next items"},e={prev:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M8.6 3.4l-7.6 7.6 7.6 7.6 1.4-1.4-5-5h12.6v-2h-12.6l5-5z"/></svg>',next:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M15.4 3.4l-1.4 1.4 5 5h-12.6v2h12.6l-5 5 1.4 1.4 7.6-7.6z"/></svg>'},n={navContainer:"overflow-slider__arrows",prevButton:"overflow-slider__arrows-button overflow-slider__arrows-button--prev",nextButton:"overflow-slider__arrows-button overflow-slider__arrows-button--next"};function o(o){return i=>{var r,s,a,l,c,u,d;const v={texts:Object.assign(Object.assign({},t),(null==o?void 0:o.texts)||[]),icons:Object.assign(Object.assign({},e),(null==o?void 0:o.icons)||[]),classNames:Object.assign(Object.assign({},n),(null==o?void 0:o.classNames)||[]),container:null!==(r=null==o?void 0:o.container)&&void 0!==r?r:null,containerPrev:null!==(s=null==o?void 0:o.containerPrev)&&void 0!==s?s:null,containerNext:null!==(a=null==o?void 0:o.containerNext)&&void 0!==a?a:null,movementType:null!==(l=null==o?void 0:o.movementType)&&void 0!==l?l:"view"},b=document.createElement("div");b.classList.add(v.classNames.navContainer);const p=document.createElement("button");p.setAttribute("class",v.classNames.prevButton),p.setAttribute("type","button"),p.setAttribute("aria-label",v.texts.buttonPrevious),p.setAttribute("aria-controls",null!==(c=i.container.getAttribute("id"))&&void 0!==c?c:""),p.setAttribute("data-type","prev"),p.innerHTML=i.options.rtl?v.icons.next:v.icons.prev,p.addEventListener("click",(()=>{"true"===p.getAttribute("data-has-content")&&("slide"===v.movementType?i.moveToSlideInDirection("prev"):i.moveToDirection("prev"))}));const h=document.createElement("button");h.setAttribute("class",v.classNames.nextButton),h.setAttribute("type","button"),h.setAttribute("aria-label",v.texts.buttonNext),h.setAttribute("aria-controls",null!==(u=i.container.getAttribute("id"))&&void 0!==u?u:""),h.setAttribute("data-type","next"),h.innerHTML=i.options.rtl?v.icons.prev:v.icons.next,h.addEventListener("click",(()=>{"true"===h.getAttribute("data-has-content")&&("slide"===v.movementType?i.moveToSlideInDirection("next"):i.moveToDirection("next"))})),b.appendChild(p),b.appendChild(h);const m=()=>{const t=i.getScrollLeft(),e=i.getInclusiveScrollWidth(),n=i.getInclusiveClientWidth();0===Math.floor(t)?p.setAttribute("data-has-content","false"):p.setAttribute("data-has-content","true");Math.abs(Math.floor(t+n)-Math.floor(e))<=1?h.setAttribute("data-has-content","false"):h.setAttribute("data-has-content","true")};v.containerNext&&v.containerPrev?(v.containerPrev.appendChild(p),v.containerNext.appendChild(h)):v.container?v.container.appendChild(b):null===(d=i.container.parentNode)||void 0===d||d.insertBefore(b,i.container.nextSibling),m(),i.on("scrollEnd",m),i.on("contentsChanged",m),i.on("containerSizeChanged",m)}}export{o as default};

package/{dist/plugins/skip-links → docs/dist/plugins}/skip-links/index.esm.js

@@ -1,4 +1,4 @@
-import { generateId } from '../../../core/utils.esm.js';
+import { generateId } from '../../core/utils.esm.js';
 
 const DEFAULT_TEXTS = {
     skipList: 'Skip list'

package/docs/dist/plugins/skip-links/index.min.js

@@ -0,0 +1 @@
+import{generateId as e}from"../../core/utils.min.js";const t={skipList:"Skip list"},n={skipLink:"screen-reader-text",skipLinkTarget:"overflow-slider__skip-link-target"};function i(i){return r=>{var o,s,a,l,c,d;const u={texts:Object.assign(Object.assign({},t),(null==i?void 0:i.texts)||[]),classNames:Object.assign(Object.assign({},n),(null==i?void 0:i.classNames)||[]),containerBefore:null!==(o=null==i?void 0:i.containerAfter)&&void 0!==o?o:null,containerAfter:null!==(s=null==i?void 0:i.containerAfter)&&void 0!==s?s:null},f=e("overflow-slider-skip"),p=document.createElement("a");p.setAttribute("href",`#${f}`),p.textContent=u.texts.skipList,p.classList.add(u.classNames.skipLink);const v=document.createElement("div");v.setAttribute("id",f),v.setAttribute("tabindex","-1"),u.containerBefore?null===(a=u.containerBefore.parentNode)||void 0===a||a.insertBefore(p,u.containerBefore):null===(l=r.container.parentNode)||void 0===l||l.insertBefore(p,r.container),u.containerAfter?null===(c=u.containerAfter.parentNode)||void 0===c||c.insertBefore(v,u.containerAfter.nextSibling):null===(d=r.container.parentNode)||void 0===d||d.insertBefore(v,r.container.nextSibling)}}export{i as default};

package/docs/index-rtl.html

@@ -121,6 +121,22 @@
 									<a href="#12" class="example-item example-item--12">12</a>
 									<a href="#13" class="example-item example-item--13">13</a>
 								</div>
+								<p style="margin-top:1.5rem;">Arrows can move also one slide at a time with "movementType" set to "slide".</p>
+								<div class="overflow-slider example-container example-container-1-arrows-by-slide">
+									<a href="#1" class="example-item example-item--1">1</a>
+									<a href="#2" class="example-item example-item--2">2</a>
+									<a href="#3" class="example-item example-item--3">3</a>
+									<a href="#4" class="example-item example-item--4">4</a>
+									<a href="#5" class="example-item example-item--5">5</a>
+									<a href="#6" class="example-item example-item--6">6</a>
+									<a href="#7" class="example-item example-item--7">7</a>
+									<a href="#8" class="example-item example-item--8">8</a>
+									<a href="#9" class="example-item example-item--9">9</a>
+									<a href="#10" class="example-item example-item--10">10</a>
+									<a href="#11" class="example-item example-item--11">11</a>
+									<a href="#12" class="example-item example-item--12">12</a>
+									<a href="#13" class="example-item example-item--13">13</a>
+								</div>
 							</div>
 
 							<div class="entry__item">

package/docs/index.html

@@ -121,6 +121,22 @@
 									<a href="#12" class="example-item example-item--12">12</a>
 									<a href="#13" class="example-item example-item--13">13</a>
 								</div>
+								<p style="margin-top:1.5rem;">Arrows can move also one slide at a time with "movementType" set to "slide".</p>
+								<div class="overflow-slider example-container example-container-1-arrows-by-slide">
+									<a href="#1" class="example-item example-item--1">1</a>
+									<a href="#2" class="example-item example-item--2">2</a>
+									<a href="#3" class="example-item example-item--3">3</a>
+									<a href="#4" class="example-item example-item--4">4</a>
+									<a href="#5" class="example-item example-item--5">5</a>
+									<a href="#6" class="example-item example-item--6">6</a>
+									<a href="#7" class="example-item example-item--7">7</a>
+									<a href="#8" class="example-item example-item--8">8</a>
+									<a href="#9" class="example-item example-item--9">9</a>
+									<a href="#10" class="example-item example-item--10">10</a>
+									<a href="#11" class="example-item example-item--11">11</a>
+									<a href="#12" class="example-item example-item--12">12</a>
+									<a href="#13" class="example-item example-item--13">13</a>
+								</div>
 							</div>
 
 							<div class="entry__item">

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@evermade/overflow-slider",
-	"version": "3.2.1",
+	"version": "3.3.0",
 	"description": "Accessible slider tha works with overflow: auto.",
 	"type": "module",
 	"main": "dist/index.js",
@@ -12,36 +12,36 @@
 			"require": "./dist/index.min.js"
 		},
 		"./plugins/drag-scrolling": {
-			"import": "./dist/plugins/drag-scrolling/drag-scrolling/index.esm.js",
-			"require": "./dist/plugins/drag-scrolling/drag-scrolling/index.min.js"
+			"import": "./dist/plugins/drag-scrolling/index.esm.js",
+			"require": "./dist/plugins/drag-scrolling/index.min.js"
 		},
 		"./plugins/skip-links": {
-			"import": "./dist/plugins/skip-links/skip-links/index.esm.js",
-			"require": "./dist/plugins/skip-links/skip-links/index.min.js"
+			"import": "./dist/plugins/skip-links/index.esm.js",
+			"require": "./dist/plugins/skip-links/index.min.js"
 		},
 		"./plugins/scroll-indicator": {
-			"import": "./dist/plugins/scroll-indicator/scroll-indicator/index.esm.js",
-			"require": "./dist/plugins/scroll-indicator/scroll-indicator/index.min.js"
+			"import": "./dist/plugins/scroll-indicator/index.esm.js",
+			"require": "./dist/plugins/scroll-indicator/index.min.js"
 		},
 		"./plugins/arrows": {
-			"import": "./dist/plugins/arrows/arrows/index.esm.js",
-			"require": "./dist/plugins/arrows/arrows/index.min.js"
+			"import": "./dist/plugins/arrows/index.esm.js",
+			"require": "./dist/plugins/arrows/index.min.js"
 		},
 		"./plugins/full-width": {
-			"import": "./dist/plugins/full-width/full-width/index.esm.js",
-			"require": "./dist/plugins/full-width/full-width/index.min.js"
+			"import": "./dist/plugins/full-width/index.esm.js",
+			"require": "./dist/plugins/full-width/index.min.js"
 		},
 		"./plugins/dots": {
-			"import": "./dist/plugins/dots/dots/index.esm.js",
-			"require": "./dist/plugins/dots/dots/index.min.js"
+			"import": "./dist/plugins/dots/index.esm.js",
+			"require": "./dist/plugins/dots/index.min.js"
 		},
 		"./plugins/thumbnails": {
-			"import": "./dist/plugins/thumbnails/thumbnails/index.esm.js",
-			"require": "./dist/plugins/thumbnails/thumbnails/index.min.js"
+			"import": "./dist/plugins/thumbnails/index.esm.js",
+			"require": "./dist/plugins/thumbnails/index.min.js"
 		},
 		"./plugins/fade": {
-			"import": "./dist/plugins/fade/fade/index.esm.js",
-			"require": "./dist/plugins/fade/fade/index.min.js"
+			"import": "./dist/plugins/fade/index.esm.js",
+			"require": "./dist/plugins/fade/index.min.js"
 		},
 		"./style.css": "./dist/overflow-slider.css"
 	},

package/rollup.config.js

@@ -35,9 +35,9 @@ const plugins = [
 const pluginEntries = {
 		index: 'src/index.ts', // Adding the core file
 		...glob.sync('src/plugins/**/*.ts').reduce((entries, path) => {
-				const name = path.replace(/^src\/plugins\//, '').replace(/\.ts$/, '');
-				entries[name] = path;
-				return entries;
+			const name = path.replace(/^src\/plugins\//, '').replace(/\.ts$/, '');
+			entries[name] = path;
+			return entries;
 		}, {}),
 };
 
@@ -53,7 +53,11 @@ export default [
 						...baseOutput,
 						dir: 'dist',
 						format: 'es',
-						entryFileNames: '[name].esm.js',
+						entryFileNames: (chunkInfo) => {
+							return chunkInfo.facadeModuleId.includes('/src/plugins/')
+								? 'index.esm.js'
+								: '[name].esm.js';
+						},
 				},
 				plugins,
 		},
@@ -63,7 +67,11 @@ export default [
 						...baseOutput,
 						dir: 'dist',
 						format: 'es',
-						entryFileNames: '[name].min.js',
+						entryFileNames: (chunkInfo) => {
+							return chunkInfo.facadeModuleId.includes('/src/plugins/')
+								? 'index.min.js'
+								: '[name].min.js';
+						},
 						plugins: [terser()],
 				},
 				plugins,

package/src/core/slider.ts

@@ -292,8 +292,6 @@ export default function Slider( container: HTMLElement, options : SliderOptions,
 		const oldActiveSlideIdx = slider.activeSlideIdx;
 		slider.activeSlideIdx = activeSlideIdx;
 
-		// console.log('activeSlideIdx', activeSlideIdx);
-
 		if (oldActiveSlideIdx !== activeSlideIdx) {
 			slider.emit('activeSlideChanged');
 		}
@@ -307,6 +305,19 @@ export default function Slider( container: HTMLElement, options : SliderOptions,
 		}
 	};
 
+	function moveToSlideInDirection( direction: 'prev' | 'next' ) {
+		const activeSlideIdx = slider.activeSlideIdx;
+		if (direction === 'prev') {
+			if (activeSlideIdx > 0) {
+				moveToSlide(activeSlideIdx - 1);
+			}
+		} else if (direction === 'next') {
+			if (activeSlideIdx < slider.slides.length - 1) {
+				moveToSlide(activeSlideIdx + 1);
+			}
+		}
+	}
+
 	function getInclusiveScrollWidth() : number {
 		return slider.container.scrollWidth + getOutermostChildrenEdgeMarginSum(slider.container);
 	};
@@ -447,7 +458,6 @@ export default function Slider( container: HTMLElement, options : SliderOptions,
 				rect: slide.getBoundingClientRect(),
 			});
 		}
-		console.log('slideReference', slideReference);
 		let snapTarget = null;
 		const scrollPosition = getScrollLeft();
 		if (isMovingForward) {
@@ -515,6 +525,7 @@ export default function Slider( container: HTMLElement, options : SliderOptions,
 		emit,
 		moveToDirection,
 		moveToSlide,
+		moveToSlideInDirection,
 		snapToClosestSlide,
 		getInclusiveScrollWidth,
 		getInclusiveClientWidth,

package/src/core/types.ts

@@ -5,6 +5,9 @@ export type Slider<O = {}, C = {}, H extends string = string> = {
 	moveToDirection: (
 		direction: 'prev' | 'next'
 	) => void
+	moveToSlideInDirection: (
+		direction: 'prev' | 'next'
+	) => void
 	snapToClosestSlide: (
 		direction: 'prev' | 'next'
 	) => void

package/src/plugins/arrows/index.ts

@@ -16,6 +16,8 @@ const DEFAULT_CLASS_NAMES = {
 	nextButton: 'overflow-slider__arrows-button overflow-slider__arrows-button--next',
 };
 
+export type ArrowsMovementTypes = 'view' | 'slide';
+
 export type ArrowsOptions = {
 	texts: {
 		buttonPrevious: string;
@@ -33,6 +35,7 @@ export type ArrowsOptions = {
 	container: HTMLElement | null,
 	containerPrev: HTMLElement | null,
 	containerNext: HTMLElement | null,
+	movementType: ArrowsMovementTypes,
 };
 
 export default function ArrowsPlugin( args: { [key: string]: unknown } ) {
@@ -54,6 +57,7 @@ export default function ArrowsPlugin( args: { [key: string]: unknown } ) {
 			container: args?.container ?? null,
 			containerPrev: args?.containerPrev ?? null,
 			containerNext: args?.containerNext ?? null,
+			movementType: args?.movementType ?? 'view',
 		};
 
 		const nav = document.createElement( 'div' );
@@ -68,7 +72,7 @@ export default function ArrowsPlugin( args: { [key: string]: unknown } ) {
 		prev.innerHTML = slider.options.rtl ? options.icons.next : options.icons.prev;
 		prev.addEventListener( 'click', () => {
 			if ( prev.getAttribute('data-has-content') === 'true' ) {
-				slider.moveToDirection( 'prev' );
+				options.movementType === 'slide' ? slider.moveToSlideInDirection( 'prev' ) : slider.moveToDirection( 'prev' );
 			}
 		} );
 
@@ -81,7 +85,7 @@ export default function ArrowsPlugin( args: { [key: string]: unknown } ) {
 		next.innerHTML = slider.options.rtl ? options.icons.prev : options.icons.next;
 		next.addEventListener( 'click', () => {
 			if ( next.getAttribute('data-has-content') === 'true' ) {
-				slider.moveToDirection( 'next' );
+				options.movementType === 'slide' ? slider.moveToSlideInDirection( 'next' ) : slider.moveToDirection( 'next' );
 			}
 		} );
 
@@ -105,7 +109,6 @@ export default function ArrowsPlugin( args: { [key: string]: unknown } ) {
 			} else {
 				next.setAttribute( 'data-has-content', 'true' );
 			}
-			console.log( 'next', scrollLeft + clientWidth, scrollWidth );
 		};
 
 		if ( options.containerNext && options.containerPrev ) {

package/dist/plugins/arrows/arrows/index.min.js

@@ -1 +0,0 @@
-const t={buttonPrevious:"Previous items",buttonNext:"Next items"},e={prev:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M8.6 3.4l-7.6 7.6 7.6 7.6 1.4-1.4-5-5h12.6v-2h-12.6l5-5z"/></svg>',next:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M15.4 3.4l-1.4 1.4 5 5h-12.6v2h12.6l-5 5 1.4 1.4 7.6-7.6z"/></svg>'},n={navContainer:"overflow-slider__arrows",prevButton:"overflow-slider__arrows-button overflow-slider__arrows-button--prev",nextButton:"overflow-slider__arrows-button overflow-slider__arrows-button--next"};function o(o){return s=>{var i,r,a,l,c,u;const d={texts:Object.assign(Object.assign({},t),(null==o?void 0:o.texts)||[]),icons:Object.assign(Object.assign({},e),(null==o?void 0:o.icons)||[]),classNames:Object.assign(Object.assign({},n),(null==o?void 0:o.classNames)||[]),container:null!==(i=null==o?void 0:o.container)&&void 0!==i?i:null,containerPrev:null!==(r=null==o?void 0:o.containerPrev)&&void 0!==r?r:null,containerNext:null!==(a=null==o?void 0:o.containerNext)&&void 0!==a?a:null},v=document.createElement("div");v.classList.add(d.classNames.navContainer);const b=document.createElement("button");b.setAttribute("class",d.classNames.prevButton),b.setAttribute("type","button"),b.setAttribute("aria-label",d.texts.buttonPrevious),b.setAttribute("aria-controls",null!==(l=s.container.getAttribute("id"))&&void 0!==l?l:""),b.setAttribute("data-type","prev"),b.innerHTML=s.options.rtl?d.icons.next:d.icons.prev,b.addEventListener("click",(()=>{"true"===b.getAttribute("data-has-content")&&s.moveToDirection("prev")}));const p=document.createElement("button");p.setAttribute("class",d.classNames.nextButton),p.setAttribute("type","button"),p.setAttribute("aria-label",d.texts.buttonNext),p.setAttribute("aria-controls",null!==(c=s.container.getAttribute("id"))&&void 0!==c?c:""),p.setAttribute("data-type","next"),p.innerHTML=s.options.rtl?d.icons.prev:d.icons.next,p.addEventListener("click",(()=>{"true"===p.getAttribute("data-has-content")&&s.moveToDirection("next")})),v.appendChild(b),v.appendChild(p);const h=()=>{const t=s.getScrollLeft(),e=s.getInclusiveScrollWidth(),n=s.getInclusiveClientWidth();0===Math.floor(t)?b.setAttribute("data-has-content","false"):b.setAttribute("data-has-content","true");Math.abs(Math.floor(t+n)-Math.floor(e))<=1?p.setAttribute("data-has-content","false"):p.setAttribute("data-has-content","true"),console.log("next",t+n,e)};d.containerNext&&d.containerPrev?(d.containerPrev.appendChild(b),d.containerNext.appendChild(p)):d.container?d.container.appendChild(v):null===(u=s.container.parentNode)||void 0===u||u.insertBefore(v,s.container.nextSibling),h(),s.on("scrollEnd",h),s.on("contentsChanged",h),s.on("containerSizeChanged",h)}}export{o as default};

package/dist/plugins/skip-links/skip-links/index.min.js

@@ -1 +0,0 @@
-import{generateId as e}from"../../../core/utils.min.js";const t={skipList:"Skip list"},n={skipLink:"screen-reader-text",skipLinkTarget:"overflow-slider__skip-link-target"};function i(i){return r=>{var o,s,a,l,c,d;const u={texts:Object.assign(Object.assign({},t),(null==i?void 0:i.texts)||[]),classNames:Object.assign(Object.assign({},n),(null==i?void 0:i.classNames)||[]),containerBefore:null!==(o=null==i?void 0:i.containerAfter)&&void 0!==o?o:null,containerAfter:null!==(s=null==i?void 0:i.containerAfter)&&void 0!==s?s:null},f=e("overflow-slider-skip"),p=document.createElement("a");p.setAttribute("href",`#${f}`),p.textContent=u.texts.skipList,p.classList.add(u.classNames.skipLink);const v=document.createElement("div");v.setAttribute("id",f),v.setAttribute("tabindex","-1"),u.containerBefore?null===(a=u.containerBefore.parentNode)||void 0===a||a.insertBefore(p,u.containerBefore):null===(l=r.container.parentNode)||void 0===l||l.insertBefore(p,r.container),u.containerAfter?null===(c=u.containerAfter.parentNode)||void 0===c||c.insertBefore(v,u.containerAfter.nextSibling):null===(d=r.container.parentNode)||void 0===d||d.insertBefore(v,r.container.nextSibling)}}export{i as default};

package/docs/dist/plugins/arrows/arrows/index.min.js

@@ -1 +0,0 @@
-const t={buttonPrevious:"Previous items",buttonNext:"Next items"},e={prev:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M8.6 3.4l-7.6 7.6 7.6 7.6 1.4-1.4-5-5h12.6v-2h-12.6l5-5z"/></svg>',next:'<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M15.4 3.4l-1.4 1.4 5 5h-12.6v2h12.6l-5 5 1.4 1.4 7.6-7.6z"/></svg>'},n={navContainer:"overflow-slider__arrows",prevButton:"overflow-slider__arrows-button overflow-slider__arrows-button--prev",nextButton:"overflow-slider__arrows-button overflow-slider__arrows-button--next"};function o(o){return s=>{var i,r,a,l,c,u;const d={texts:Object.assign(Object.assign({},t),(null==o?void 0:o.texts)||[]),icons:Object.assign(Object.assign({},e),(null==o?void 0:o.icons)||[]),classNames:Object.assign(Object.assign({},n),(null==o?void 0:o.classNames)||[]),container:null!==(i=null==o?void 0:o.container)&&void 0!==i?i:null,containerPrev:null!==(r=null==o?void 0:o.containerPrev)&&void 0!==r?r:null,containerNext:null!==(a=null==o?void 0:o.containerNext)&&void 0!==a?a:null},v=document.createElement("div");v.classList.add(d.classNames.navContainer);const b=document.createElement("button");b.setAttribute("class",d.classNames.prevButton),b.setAttribute("type","button"),b.setAttribute("aria-label",d.texts.buttonPrevious),b.setAttribute("aria-controls",null!==(l=s.container.getAttribute("id"))&&void 0!==l?l:""),b.setAttribute("data-type","prev"),b.innerHTML=s.options.rtl?d.icons.next:d.icons.prev,b.addEventListener("click",(()=>{"true"===b.getAttribute("data-has-content")&&s.moveToDirection("prev")}));const p=document.createElement("button");p.setAttribute("class",d.classNames.nextButton),p.setAttribute("type","button"),p.setAttribute("aria-label",d.texts.buttonNext),p.setAttribute("aria-controls",null!==(c=s.container.getAttribute("id"))&&void 0!==c?c:""),p.setAttribute("data-type","next"),p.innerHTML=s.options.rtl?d.icons.prev:d.icons.next,p.addEventListener("click",(()=>{"true"===p.getAttribute("data-has-content")&&s.moveToDirection("next")})),v.appendChild(b),v.appendChild(p);const h=()=>{const t=s.getScrollLeft(),e=s.getInclusiveScrollWidth(),n=s.getInclusiveClientWidth();0===Math.floor(t)?b.setAttribute("data-has-content","false"):b.setAttribute("data-has-content","true");Math.abs(Math.floor(t+n)-Math.floor(e))<=1?p.setAttribute("data-has-content","false"):p.setAttribute("data-has-content","true"),console.log("next",t+n,e)};d.containerNext&&d.containerPrev?(d.containerPrev.appendChild(b),d.containerNext.appendChild(p)):d.container?d.container.appendChild(v):null===(u=s.container.parentNode)||void 0===u||u.insertBefore(v,s.container.nextSibling),h(),s.on("scrollEnd",h),s.on("contentsChanged",h),s.on("containerSizeChanged",h)}}export{o as default};

package/docs/dist/plugins/skip-links/skip-links/index.min.js

@@ -1 +0,0 @@
-import{generateId as e}from"../../../core/utils.min.js";const t={skipList:"Skip list"},n={skipLink:"screen-reader-text",skipLinkTarget:"overflow-slider__skip-link-target"};function i(i){return r=>{var o,s,a,l,c,d;const u={texts:Object.assign(Object.assign({},t),(null==i?void 0:i.texts)||[]),classNames:Object.assign(Object.assign({},n),(null==i?void 0:i.classNames)||[]),containerBefore:null!==(o=null==i?void 0:i.containerAfter)&&void 0!==o?o:null,containerAfter:null!==(s=null==i?void 0:i.containerAfter)&&void 0!==s?s:null},f=e("overflow-slider-skip"),p=document.createElement("a");p.setAttribute("href",`#${f}`),p.textContent=u.texts.skipList,p.classList.add(u.classNames.skipLink);const v=document.createElement("div");v.setAttribute("id",f),v.setAttribute("tabindex","-1"),u.containerBefore?null===(a=u.containerBefore.parentNode)||void 0===a||a.insertBefore(p,u.containerBefore):null===(l=r.container.parentNode)||void 0===l||l.insertBefore(p,r.container),u.containerAfter?null===(c=u.containerAfter.parentNode)||void 0===c||c.insertBefore(v,u.containerAfter.nextSibling):null===(d=r.container.parentNode)||void 0===d||d.insertBefore(v,r.container.nextSibling)}}export{i as default};