diff --git a/src/components/Carousel/Carousel.svelte b/src/components/Carousel/Carousel.svelte index ef977b9..ed1d46d 100644 --- a/src/components/Carousel/Carousel.svelte +++ b/src/components/Carousel/Carousel.svelte @@ -9,33 +9,18 @@ import { tappable } from '../../actions/tappable' import { applyParticleSizes, - getCurrentPageIndexByCurrentParticleIndex, - getPartialPageSize, - getPagesCountByParticlesCount, - getParticleIndexByPageIndex, createResizeObserver, } from '../../utils/page' import { getClones, applyClones, - getClonesCount, } from '../../utils/clones' - import { - getAdjacentIndexes, - } from '../../utils/lazy' - import { - getValueInRange, - } from '../../utils/math' import { get, switcher } from '../../utils/object' - import { ProgressManager } from '../../utils/ProgressManager' - import { wait } from '../../utils/interval' - import createCarousel from './createCarousel' // used for lazy loading images, preloaded only current, adjacent and cloanable images let loaded = [] let currentPageIndex - let focused = false let progressValue let offset = 0 let durationMs = 0 @@ -45,7 +30,6 @@ switcher({ 'currentPageIndex': () => currentPageIndex = value, 'progressValue': () => progressValue = value, - 'focused': () => focused = value, 'offset': () => offset = value, 'durationMs': () => durationMs = value, 'pagesCount': () => pagesCount = value, @@ -169,7 +153,6 @@ } let pageWindowWidth = 0 - let particleWidth = 0 let pageWindowElement let particlesContainer @@ -177,7 +160,6 @@ width, }) => { pageWindowWidth = width - particleWidth = pageWindowWidth / data.particlesToShow data.particleWidth = pageWindowWidth / data.particlesToShow applyParticleSizes({ @@ -259,7 +241,7 @@ function handleHovered(event) { data.focused = event.detail.value } - function handleTapped(event) { + function handleTapped() { methods.toggleFocused() } @@ -388,6 +370,3 @@ bottom: 0; } - - - diff --git a/src/components/Carousel/createCarousel.js b/src/components/Carousel/createCarousel.js index 6013f18..18c6fb0 100644 --- a/src/components/Carousel/createCarousel.js +++ b/src/components/Carousel/createCarousel.js @@ -20,7 +20,7 @@ function createCarousel(onChange) { }, }) - const [data, methods, service] = simplyReactive( + const reactive = simplyReactive( { data: { particlesCountWithoutClones: 0, @@ -42,7 +42,7 @@ function createCarousel(onChange) { focused: false, autoplay: false, autoplayDirection: 'next', - disabled: false, // Disable page change while animation is in progress + disabled: false, // disable page change while animation is in progress durationMsInit: 1000, durationMs: 1000, offset: 0, @@ -268,8 +268,9 @@ function createCarousel(onChange) { onChange, } ) + const [data, methods] = reactive - return [{ data, progressManager }, methods, service] + return [{ data, progressManager }, methods, reactive._internal] } export default createCarousel diff --git a/src/components/Carousel/stories/CarouselView.svelte b/src/components/Carousel/stories/CarouselView.svelte index ee52096..33b9082 100644 --- a/src/components/Carousel/stories/CarouselView.svelte +++ b/src/components/Carousel/stories/CarouselView.svelte @@ -121,7 +121,7 @@ {/each} - +