Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
Socket
Sign inDemoInstall
Socket
Sign inDemoInstall

vue3-carousel

Package Overview
Dependencies
Maintainers
2
Versions
73
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

vue3-carousel - npm Package Compare versions

Comparing version 0.1.28 to 0.1.29

202

dist/carousel.es.js
/**
* Vue 3 Carousel 0.1.28
* Vue 3 Carousel 0.1.29
* (c) 2021

@@ -8,2 +8,16 @@ * @license MIT

const defaultConfigs = {
itemsToShow: 1,
itemsToScroll: 1,
modelValue: 0,
transition: 300,
autoplay: 0,
snapAlign: 'center',
wrapAround: false,
pauseAutoplayOnHover: false,
mouseDrag: true,
touchDrag: true,
breakpoints: undefined,
};
function counterFactory() {

@@ -69,2 +83,44 @@ return new Proxy({ value: 0, read: 0 }, {

}
function getMaxSlideIndex(config, slidesCount) {
if (config.wrapAround) {
return slidesCount - 1;
}
switch (config.snapAlign) {
case 'start':
return slidesCount - config.itemsToShow;
case 'end':
return slidesCount - 1;
case 'center':
case 'center-odd':
return slidesCount - Math.ceil(config.itemsToShow / 2);
case 'center-even':
return slidesCount - Math.ceil(config.itemsToShow / 2);
default:
return 0;
}
}
function getMinSlideIndex(config) {
if (config.wrapAround) {
return 0;
}
switch (config.snapAlign) {
case 'start':
return 0;
case 'end':
return config.itemsToShow - 1;
case 'center':
case 'center-odd':
return Math.floor((config.itemsToShow - 1) / 2);
case 'center-even':
return Math.floor((config.itemsToShow - 2) / 2);
default:
return 0;
}
}
function getCurrentSlideIndex(config, val, max, min) {
if (config.wrapAround) {
return val;
}
return Math.min(Math.max(val, min), max);
}

@@ -76,3 +132,3 @@ var Carousel = defineComponent({

itemsToShow: {
default: 1,
default: defaultConfigs.itemsToShow,
type: Number,

@@ -82,3 +138,3 @@ },

itemsToScroll: {
default: 1,
default: defaultConfigs.itemsToScroll,
type: Number,

@@ -88,3 +144,3 @@ },

wrapAround: {
default: false,
default: defaultConfigs.wrapAround,
type: Boolean,

@@ -94,3 +150,3 @@ },

snapAlign: {
default: 'center',
default: defaultConfigs.snapAlign,
validator(value) {

@@ -103,15 +159,8 @@ // The value must match one of these strings

transition: {
default: 300,
default: defaultConfigs.transition,
type: Number,
},
// an object to pass all settings
settings: {
default() {
return {};
},
type: Object,
},
// an object to store breakpoints
breakpoints: {
default: null,
default: defaultConfigs.breakpoints,
type: Object,

@@ -121,3 +170,3 @@ },

autoplay: {
default: 0,
default: defaultConfigs.autoplay,
type: Number,

@@ -127,3 +176,3 @@ },

pauseAutoplayOnHover: {
default: false,
default: defaultConfigs.pauseAutoplayOnHover,
type: Boolean,

@@ -138,3 +187,3 @@ },

mouseDrag: {
default: true,
default: defaultConfigs.mouseDrag,
type: Boolean,

@@ -144,5 +193,12 @@ },

touchDrag: {
default: true,
default: defaultConfigs.touchDrag,
type: Boolean,
},
// an object to pass all settings
settings: {
default() {
return {};
},
type: Object,
},
},

@@ -156,15 +212,12 @@ setup(props, { slots, emit }) {

const slidesCount = ref(1);
const paginationCount = ref(1);
const slidesCounter = counterFactory();
let breakpoints = ref({});
// generate carousel configs
let defaultConfig = Object.assign({}, defaultConfigs);
// current config
const config = reactive({});
// generate carousel configs
let defaultConfig = {};
let breakpoints = ref({});
initDefaultConfigs();
updateConfig();
const config = reactive(Object.assign({}, defaultConfigs));
// Update the carousel on props change
watch(props, () => {
initDefaultConfigs();
updateConfig();
updateBreakpointsConfigs();
updateSlidesData();

@@ -174,11 +227,14 @@ updateSlideWidth();

// slides
const currentSlide = ref((_a = config.currentSlide) !== null && _a !== void 0 ? _a : 0);
const prevSlide = ref(0);
const middleSlide = ref(0);
const currentSlideIndex = ref((_a = config.modelValue) !== null && _a !== void 0 ? _a : 0);
const prevSlideIndex = ref(0);
const middleSlideIndex = ref(0);
const maxSlideIndex = ref(0);
const minSlideIndex = ref(0);
provide('config', config);
provide('slidesBuffer', slidesBuffer);
provide('slidesCount', slidesCount);
provide('currentSlide', currentSlide);
provide('currentSlide', currentSlideIndex);
provide('maxSlide', maxSlideIndex);
provide('minSlide', minSlideIndex);
provide('slidesCounter', slidesCounter);
provide('paginationCount', paginationCount);
/**

@@ -189,9 +245,9 @@ * Configs

// generate carousel configs
defaultConfig = Object.assign(Object.assign(Object.assign({}, props), props.settings), { currentSlide: props.modelValue });
const mergedConfigs = Object.assign(Object.assign({}, props), props.settings);
// Set breakpoints
breakpoints = ref(Object.assign({}, defaultConfig.breakpoints));
breakpoints = ref(Object.assign({}, mergedConfigs.breakpoints));
// remove extra values
defaultConfig = Object.assign(Object.assign({}, defaultConfig), { settings: undefined, breakpoints: undefined });
defaultConfig = Object.assign(Object.assign({}, mergedConfigs), { settings: undefined, breakpoints: undefined });
}
function updateConfig() {
function updateBreakpointsConfigs() {
const breakpointsArray = Object.keys(breakpoints.value)

@@ -209,7 +265,11 @@ .map((key) => Number(key))

});
Object.keys(newConfig).forEach((key) => (config[key] = newConfig[key]));
let key;
for (key in newConfig) {
// @ts-ignore
config[key] = newConfig[key];
}
}
const handleWindowResize = debounce(() => {
if (breakpoints.value) {
updateConfig();
updateBreakpointsConfigs();
updateSlidesData();

@@ -229,7 +289,9 @@ }

function updateSlidesData() {
paginationCount.value = slides.value.length;
slidesCount.value = slides.value.length;
middleSlide.value = Math.ceil((slidesCount.value - 1) / 2);
currentSlide.value =
slidesCount.value <= 0 ? 0 : Math.min(slidesCount.value - 1, currentSlide.value);
if (slidesCount.value <= 0)
return;
middleSlideIndex.value = Math.ceil((slidesCount.value - 1) / 2);
maxSlideIndex.value = getMaxSlideIndex(config, slidesCount.value);
minSlideIndex.value = getMinSlideIndex(config);
currentSlideIndex.value = getCurrentSlideIndex(config, currentSlideIndex.value, maxSlideIndex.value, minSlideIndex.value);
}

@@ -239,3 +301,3 @@ function updateSlidesBuffer() {

if (config.wrapAround) {
const shifts = currentSlide.value + middleSlide.value + 1;
const shifts = currentSlideIndex.value + middleSlideIndex.value + 1;
for (let i = 0; i < shifts; i++) {

@@ -249,9 +311,9 @@ slidesArray.push(Number(slidesArray.shift()));

if (breakpoints.value) {
updateConfig();
updateBreakpointsConfigs();
updateSlidesData();
}
updateSlideWidth();
if (config.autoplay > 0)
if (config.autoplay && config.autoplay > 0) {
initializeAutoplay();
// @ts-ignore
}
window.addEventListener('resize', handleWindowResize, { passive: true });

@@ -294,3 +356,2 @@ });

startPosition.y = isTouch ? event.touches[0].clientY : event.clientY;
// @ts-ignore
document.addEventListener(isTouch ? 'touchmove' : 'mousemove', handleDrag);

@@ -303,9 +364,6 @@ document.addEventListener(isTouch ? 'touchend' : 'mouseup', handleDragEnd);

const draggedSlides = Math.round(dragged.x / slideWidth.value + tolerance);
let newSlide = currentSlide.value - draggedSlides;
if (!config.wrapAround)
newSlide = Math.max(Math.min(newSlide, slidesCount.value - 1), 0);
let newSlide = getCurrentSlideIndex(config, currentSlideIndex.value - draggedSlides, maxSlideIndex.value, minSlideIndex.value);
slideTo(newSlide);
dragged.x = 0;
dragged.y = 0;
// @ts-ignore
document.removeEventListener(isTouch ? 'touchmove' : 'mousemove', handleDrag);

@@ -330,3 +388,3 @@ document.removeEventListener(isTouch ? 'touchend' : 'mouseup', handleDragEnd);

function slideTo(slideIndex, mute = false) {
if (currentSlide.value === slideIndex || isSliding.value) {
if (currentSlideIndex.value === slideIndex || isSliding.value) {
return;

@@ -343,6 +401,6 @@ }

isSliding.value = true;
prevSlide.value = currentSlide.value;
currentSlide.value = slideIndex;
prevSlideIndex.value = currentSlideIndex.value;
currentSlideIndex.value = slideIndex;
if (!mute) {
emit('update:modelValue', currentSlide.value);
emit('update:modelValue', currentSlideIndex.value);
}

@@ -356,5 +414,5 @@ setTimeout(() => {

function next() {
let nextSlide = currentSlide.value + config.itemsToScroll;
let nextSlide = currentSlideIndex.value + config.itemsToScroll;
if (!config.wrapAround) {
nextSlide = Math.min(nextSlide, paginationCount.value - 1);
nextSlide = Math.min(nextSlide, maxSlideIndex.value);
}

@@ -364,5 +422,5 @@ slideTo(nextSlide);

function prev() {
let prevSlide = currentSlide.value - config.itemsToScroll;
let prevSlide = currentSlideIndex.value - config.itemsToScroll;
if (!config.wrapAround) {
prevSlide = Math.max(prevSlide, 0);
prevSlide = Math.max(prevSlide, minSlideIndex.value);
}

@@ -377,3 +435,3 @@ slideTo(prevSlide);

const slidesToScroll = computed(() => {
let output = slidesBuffer.value.indexOf(currentSlide.value);
let output = slidesBuffer.value.indexOf(currentSlideIndex.value);
if (config.snapAlign === 'center' || config.snapAlign === 'center-odd') {

@@ -403,3 +461,7 @@ output -= (config.itemsToShow - 1) / 2;

});
const slotsProps = reactive({ slideWidth, slidesCount, currentSlide });
const slotsProps = reactive({
slideWidth,
slidesCount,
currentSlide: currentSlideIndex,
});
const slotSlides = slots.default || slots.slides;

@@ -410,3 +472,3 @@ const slotAddons = slots.addons;

const needToUpdate = slidesCount.value !== slides.value.length;
const currentSlideUpdated = props.modelValue !== undefined && currentSlide.value !== props.modelValue;
const currentSlideUpdated = props.modelValue !== undefined && currentSlideIndex.value !== props.modelValue;
if (currentSlideUpdated) {

@@ -423,2 +485,4 @@ slideTo(Number(props.modelValue), true);

});
initDefaultConfigs();
updateBreakpointsConfigs();
updateSlidesBuffer();

@@ -490,3 +554,3 @@ return () => {

setup(props, { slots }) {
const config = inject('config', reactive({}));
const config = inject('config', reactive(Object.assign({}, defaultConfigs)));
const slidesBuffer = inject('slidesBuffer', ref([]));

@@ -540,4 +604,4 @@ const slidesCounter = inject('slidesCounter');

const Pagination = () => {
inject('slidesCount', ref(1));
const paginationCount = inject('paginationCount', ref(1));
const maxSlide = inject('maxSlide', ref(1));
const minSlide = inject('minSlide', ref(1));
const currentSlide = inject('currentSlide', ref(1));

@@ -548,4 +612,10 @@ const nav = inject('nav', {});

}
const isActive = (slide) => {
const val = currentSlide.value;
return (val === slide ||
(val > maxSlide.value && slide >= maxSlide.value) ||
(val < minSlide.value && slide <= minSlide.value));
};
const children = [];
for (let slide = 0; slide < paginationCount.value; slide++) {
for (let slide = minSlide.value; slide < maxSlide.value + 1; slide++) {
const button = h('button', {

@@ -555,3 +625,3 @@ type: 'button',

'carousel__pagination-button': true,
'carousel__pagination-button--active': currentSlide.value === slide,
'carousel__pagination-button--active': isActive(slide),
},

@@ -558,0 +628,0 @@ onClick: () => handleButtonClick(slide),

202

dist/carousel.js
/**
* Vue 3 Carousel 0.1.28
* Vue 3 Carousel 0.1.29
* (c) 2021

@@ -12,2 +12,16 @@ * @license MIT

const defaultConfigs = {
itemsToShow: 1,
itemsToScroll: 1,
modelValue: 0,
transition: 300,
autoplay: 0,
snapAlign: 'center',
wrapAround: false,
pauseAutoplayOnHover: false,
mouseDrag: true,
touchDrag: true,
breakpoints: undefined,
};
function counterFactory() {

@@ -73,2 +87,44 @@ return new Proxy({ value: 0, read: 0 }, {

}
function getMaxSlideIndex(config, slidesCount) {
if (config.wrapAround) {
return slidesCount - 1;
}
switch (config.snapAlign) {
case 'start':
return slidesCount - config.itemsToShow;
case 'end':
return slidesCount - 1;
case 'center':
case 'center-odd':
return slidesCount - Math.ceil(config.itemsToShow / 2);
case 'center-even':
return slidesCount - Math.ceil(config.itemsToShow / 2);
default:
return 0;
}
}
function getMinSlideIndex(config) {
if (config.wrapAround) {
return 0;
}
switch (config.snapAlign) {
case 'start':
return 0;
case 'end':
return config.itemsToShow - 1;
case 'center':
case 'center-odd':
return Math.floor((config.itemsToShow - 1) / 2);
case 'center-even':
return Math.floor((config.itemsToShow - 2) / 2);
default:
return 0;
}
}
function getCurrentSlideIndex(config, val, max, min) {
if (config.wrapAround) {
return val;
}
return Math.min(Math.max(val, min), max);
}

@@ -80,3 +136,3 @@ var Carousel = vue.defineComponent({

itemsToShow: {
default: 1,
default: defaultConfigs.itemsToShow,
type: Number,

@@ -86,3 +142,3 @@ },

itemsToScroll: {
default: 1,
default: defaultConfigs.itemsToScroll,
type: Number,

@@ -92,3 +148,3 @@ },

wrapAround: {
default: false,
default: defaultConfigs.wrapAround,
type: Boolean,

@@ -98,3 +154,3 @@ },

snapAlign: {
default: 'center',
default: defaultConfigs.snapAlign,
validator(value) {

@@ -107,15 +163,8 @@ // The value must match one of these strings

transition: {
default: 300,
default: defaultConfigs.transition,
type: Number,
},
// an object to pass all settings
settings: {
default() {
return {};
},
type: Object,
},
// an object to store breakpoints
breakpoints: {
default: null,
default: defaultConfigs.breakpoints,
type: Object,

@@ -125,3 +174,3 @@ },

autoplay: {
default: 0,
default: defaultConfigs.autoplay,
type: Number,

@@ -131,3 +180,3 @@ },

pauseAutoplayOnHover: {
default: false,
default: defaultConfigs.pauseAutoplayOnHover,
type: Boolean,

@@ -142,3 +191,3 @@ },

mouseDrag: {
default: true,
default: defaultConfigs.mouseDrag,
type: Boolean,

@@ -148,5 +197,12 @@ },

touchDrag: {
default: true,
default: defaultConfigs.touchDrag,
type: Boolean,
},
// an object to pass all settings
settings: {
default() {
return {};
},
type: Object,
},
},

@@ -160,15 +216,12 @@ setup(props, { slots, emit }) {

const slidesCount = vue.ref(1);
const paginationCount = vue.ref(1);
const slidesCounter = counterFactory();
let breakpoints = vue.ref({});
// generate carousel configs
let defaultConfig = Object.assign({}, defaultConfigs);
// current config
const config = vue.reactive({});
// generate carousel configs
let defaultConfig = {};
let breakpoints = vue.ref({});
initDefaultConfigs();
updateConfig();
const config = vue.reactive(Object.assign({}, defaultConfigs));
// Update the carousel on props change
vue.watch(props, () => {
initDefaultConfigs();
updateConfig();
updateBreakpointsConfigs();
updateSlidesData();

@@ -178,11 +231,14 @@ updateSlideWidth();

// slides
const currentSlide = vue.ref((_a = config.currentSlide) !== null && _a !== void 0 ? _a : 0);
const prevSlide = vue.ref(0);
const middleSlide = vue.ref(0);
const currentSlideIndex = vue.ref((_a = config.modelValue) !== null && _a !== void 0 ? _a : 0);
const prevSlideIndex = vue.ref(0);
const middleSlideIndex = vue.ref(0);
const maxSlideIndex = vue.ref(0);
const minSlideIndex = vue.ref(0);
vue.provide('config', config);
vue.provide('slidesBuffer', slidesBuffer);
vue.provide('slidesCount', slidesCount);
vue.provide('currentSlide', currentSlide);
vue.provide('currentSlide', currentSlideIndex);
vue.provide('maxSlide', maxSlideIndex);
vue.provide('minSlide', minSlideIndex);
vue.provide('slidesCounter', slidesCounter);
vue.provide('paginationCount', paginationCount);
/**

@@ -193,9 +249,9 @@ * Configs

// generate carousel configs
defaultConfig = Object.assign(Object.assign(Object.assign({}, props), props.settings), { currentSlide: props.modelValue });
const mergedConfigs = Object.assign(Object.assign({}, props), props.settings);
// Set breakpoints
breakpoints = vue.ref(Object.assign({}, defaultConfig.breakpoints));
breakpoints = vue.ref(Object.assign({}, mergedConfigs.breakpoints));
// remove extra values
defaultConfig = Object.assign(Object.assign({}, defaultConfig), { settings: undefined, breakpoints: undefined });
defaultConfig = Object.assign(Object.assign({}, mergedConfigs), { settings: undefined, breakpoints: undefined });
}
function updateConfig() {
function updateBreakpointsConfigs() {
const breakpointsArray = Object.keys(breakpoints.value)

@@ -213,7 +269,11 @@ .map((key) => Number(key))

});
Object.keys(newConfig).forEach((key) => (config[key] = newConfig[key]));
let key;
for (key in newConfig) {
// @ts-ignore
config[key] = newConfig[key];
}
}
const handleWindowResize = debounce(() => {
if (breakpoints.value) {
updateConfig();
updateBreakpointsConfigs();
updateSlidesData();

@@ -233,7 +293,9 @@ }

function updateSlidesData() {
paginationCount.value = slides.value.length;
slidesCount.value = slides.value.length;
middleSlide.value = Math.ceil((slidesCount.value - 1) / 2);
currentSlide.value =
slidesCount.value <= 0 ? 0 : Math.min(slidesCount.value - 1, currentSlide.value);
if (slidesCount.value <= 0)
return;
middleSlideIndex.value = Math.ceil((slidesCount.value - 1) / 2);
maxSlideIndex.value = getMaxSlideIndex(config, slidesCount.value);
minSlideIndex.value = getMinSlideIndex(config);
currentSlideIndex.value = getCurrentSlideIndex(config, currentSlideIndex.value, maxSlideIndex.value, minSlideIndex.value);
}

@@ -243,3 +305,3 @@ function updateSlidesBuffer() {

if (config.wrapAround) {
const shifts = currentSlide.value + middleSlide.value + 1;
const shifts = currentSlideIndex.value + middleSlideIndex.value + 1;
for (let i = 0; i < shifts; i++) {

@@ -253,9 +315,9 @@ slidesArray.push(Number(slidesArray.shift()));

if (breakpoints.value) {
updateConfig();
updateBreakpointsConfigs();
updateSlidesData();
}
updateSlideWidth();
if (config.autoplay > 0)
if (config.autoplay && config.autoplay > 0) {
initializeAutoplay();
// @ts-ignore
}
window.addEventListener('resize', handleWindowResize, { passive: true });

@@ -298,3 +360,2 @@ });

startPosition.y = isTouch ? event.touches[0].clientY : event.clientY;
// @ts-ignore
document.addEventListener(isTouch ? 'touchmove' : 'mousemove', handleDrag);

@@ -307,9 +368,6 @@ document.addEventListener(isTouch ? 'touchend' : 'mouseup', handleDragEnd);

const draggedSlides = Math.round(dragged.x / slideWidth.value + tolerance);
let newSlide = currentSlide.value - draggedSlides;
if (!config.wrapAround)
newSlide = Math.max(Math.min(newSlide, slidesCount.value - 1), 0);
let newSlide = getCurrentSlideIndex(config, currentSlideIndex.value - draggedSlides, maxSlideIndex.value, minSlideIndex.value);
slideTo(newSlide);
dragged.x = 0;
dragged.y = 0;
// @ts-ignore
document.removeEventListener(isTouch ? 'touchmove' : 'mousemove', handleDrag);

@@ -334,3 +392,3 @@ document.removeEventListener(isTouch ? 'touchend' : 'mouseup', handleDragEnd);

function slideTo(slideIndex, mute = false) {
if (currentSlide.value === slideIndex || isSliding.value) {
if (currentSlideIndex.value === slideIndex || isSliding.value) {
return;

@@ -347,6 +405,6 @@ }

isSliding.value = true;
prevSlide.value = currentSlide.value;
currentSlide.value = slideIndex;
prevSlideIndex.value = currentSlideIndex.value;
currentSlideIndex.value = slideIndex;
if (!mute) {
emit('update:modelValue', currentSlide.value);
emit('update:modelValue', currentSlideIndex.value);
}

@@ -360,5 +418,5 @@ setTimeout(() => {

function next() {
let nextSlide = currentSlide.value + config.itemsToScroll;
let nextSlide = currentSlideIndex.value + config.itemsToScroll;
if (!config.wrapAround) {
nextSlide = Math.min(nextSlide, paginationCount.value - 1);
nextSlide = Math.min(nextSlide, maxSlideIndex.value);
}

@@ -368,5 +426,5 @@ slideTo(nextSlide);

function prev() {
let prevSlide = currentSlide.value - config.itemsToScroll;
let prevSlide = currentSlideIndex.value - config.itemsToScroll;
if (!config.wrapAround) {
prevSlide = Math.max(prevSlide, 0);
prevSlide = Math.max(prevSlide, minSlideIndex.value);
}

@@ -381,3 +439,3 @@ slideTo(prevSlide);

const slidesToScroll = vue.computed(() => {
let output = slidesBuffer.value.indexOf(currentSlide.value);
let output = slidesBuffer.value.indexOf(currentSlideIndex.value);
if (config.snapAlign === 'center' || config.snapAlign === 'center-odd') {

@@ -407,3 +465,7 @@ output -= (config.itemsToShow - 1) / 2;

});
const slotsProps = vue.reactive({ slideWidth, slidesCount, currentSlide });
const slotsProps = vue.reactive({
slideWidth,
slidesCount,
currentSlide: currentSlideIndex,
});
const slotSlides = slots.default || slots.slides;

@@ -414,3 +476,3 @@ const slotAddons = slots.addons;

const needToUpdate = slidesCount.value !== slides.value.length;
const currentSlideUpdated = props.modelValue !== undefined && currentSlide.value !== props.modelValue;
const currentSlideUpdated = props.modelValue !== undefined && currentSlideIndex.value !== props.modelValue;
if (currentSlideUpdated) {

@@ -427,2 +489,4 @@ slideTo(Number(props.modelValue), true);

});
initDefaultConfigs();
updateBreakpointsConfigs();
updateSlidesBuffer();

@@ -494,3 +558,3 @@ return () => {

setup(props, { slots }) {
const config = vue.inject('config', vue.reactive({}));
const config = vue.inject('config', vue.reactive(Object.assign({}, defaultConfigs)));
const slidesBuffer = vue.inject('slidesBuffer', vue.ref([]));

@@ -544,4 +608,4 @@ const slidesCounter = vue.inject('slidesCounter');

const Pagination = () => {
vue.inject('slidesCount', vue.ref(1));
const paginationCount = vue.inject('paginationCount', vue.ref(1));
const maxSlide = vue.inject('maxSlide', vue.ref(1));
const minSlide = vue.inject('minSlide', vue.ref(1));
const currentSlide = vue.inject('currentSlide', vue.ref(1));

@@ -552,4 +616,10 @@ const nav = vue.inject('nav', {});

}
const isActive = (slide) => {
const val = currentSlide.value;
return (val === slide ||
(val > maxSlide.value && slide >= maxSlide.value) ||
(val < minSlide.value && slide <= minSlide.value));
};
const children = [];
for (let slide = 0; slide < paginationCount.value; slide++) {
for (let slide = minSlide.value; slide < maxSlide.value + 1; slide++) {
const button = vue.h('button', {

@@ -559,3 +629,3 @@ type: 'button',

'carousel__pagination-button': true,
'carousel__pagination-button--active': currentSlide.value === slide,
'carousel__pagination-button--active': isActive(slide),
},

@@ -562,0 +632,0 @@ onClick: () => handleButtonClick(slide),

2

package.json
{
"name": "vue3-carousel",
"version": "0.1.28",
"version": "0.1.29",
"scripts": {

@@ -5,0 +5,0 @@ "build": "rollup -c",

dist/carousel.css

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

About

Packages

npm

Go

Maven

PyPI

Rubygems

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc