From d589953818de0482f09ea0c25db0bef50bf728a2 Mon Sep 17 00:00:00 2001 From: Vladimir Kharlampidi Date: Fri, 18 Dec 2020 21:42:17 +0300 Subject: [PATCH 01/11] Update CHANGELOG.md --- CHANGELOG.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 59527a531..eb3dc2df1 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,6 +1,6 @@ # Changelog -## [Swiper 6.4.5](https://github.com/nolimits4web/swiper/compare/v6.4.4...v6.4.4) - Released on December 18th, 2020 +## [Swiper 6.4.5](https://github.com/nolimits4web/swiper/compare/v6.4.4...v6.4.5) - Released on December 18th, 2020 - Fixed issue with `postinstall` script From bac488e04a765cba85ed858836292c2028427d37 Mon Sep 17 00:00:00 2001 From: Michael Silber Date: Sat, 19 Dec 2020 00:48:58 -0500 Subject: [PATCH 02/11] Reduce pagination border-radius; 100% actually decreases rounding on some browsers --- src/components/pagination/pagination.less | 2 +- src/components/pagination/pagination.scss | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/pagination/pagination.less b/src/components/pagination/pagination.less index cbe04c009..b84ca5528 100644 --- a/src/components/pagination/pagination.less +++ b/src/components/pagination/pagination.less @@ -64,7 +64,7 @@ width: 8px; height: 8px; display: inline-block; - border-radius: 100%; + border-radius: 50%; background: #000; opacity: 0.2; button& { diff --git a/src/components/pagination/pagination.scss b/src/components/pagination/pagination.scss index e1d468b56..b52744e78 100644 --- a/src/components/pagination/pagination.scss +++ b/src/components/pagination/pagination.scss @@ -54,7 +54,7 @@ width: 8px; height: 8px; display: inline-block; - border-radius: 100%; + border-radius: 50%; background: #000; opacity: 0.2; @at-root button#{&} { From d28ed1f413c7a5bba80c381f9aad9f66ec93574d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=D0=90=D0=BD=D0=B4=D1=80=D0=B5=D0=B9?= Date: Sat, 9 Jan 2021 12:14:48 +0300 Subject: [PATCH 03/11] fix(types): add init --- src/types/swiper-class.d.ts | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/src/types/swiper-class.d.ts b/src/types/swiper-class.d.ts index bf6ad2b8f..61cb86184 100644 --- a/src/types/swiper-class.d.ts +++ b/src/types/swiper-class.d.ts @@ -261,6 +261,11 @@ interface Swiper extends SwiperClass { */ attachEvents(): void; + /** + * Initialize slider + */ + init(): void; + /** * Destroy slider instance and detach all events listeners * From d957165a712f566a711b4e6ba541341265d671d4 Mon Sep 17 00:00:00 2001 From: Vlad Date: Mon, 18 Jan 2021 19:34:40 +0200 Subject: [PATCH 04/11] fix: cube shadow chrome --- src/components/effect-cube/effect-cube.less | 15 ++++++++++++--- src/components/effect-cube/effect-cube.scss | 15 ++++++++++++--- 2 files changed, 24 insertions(+), 6 deletions(-) diff --git a/src/components/effect-cube/effect-cube.less b/src/components/effect-cube/effect-cube.less index 764a77356..d87dd5f98 100644 --- a/src/components/effect-cube/effect-cube.less +++ b/src/components/effect-cube/effect-cube.less @@ -41,10 +41,19 @@ bottom: 0px; width: 100%; height: 100%; - background: #000; opacity: 0.6; - -webkit-filter: blur(50px); - filter: blur(50px); z-index: 0; + + &:before { + content: ''; + background: #000; + position: absolute; + left: 0; + top: 0; + bottom: 0; + right: 0; + -webkit-filter: blur(50px); + filter: blur(50px); + } } } diff --git a/src/components/effect-cube/effect-cube.scss b/src/components/effect-cube/effect-cube.scss index 764a77356..d87dd5f98 100644 --- a/src/components/effect-cube/effect-cube.scss +++ b/src/components/effect-cube/effect-cube.scss @@ -41,10 +41,19 @@ bottom: 0px; width: 100%; height: 100%; - background: #000; opacity: 0.6; - -webkit-filter: blur(50px); - filter: blur(50px); z-index: 0; + + &:before { + content: ''; + background: #000; + position: absolute; + left: 0; + top: 0; + bottom: 0; + right: 0; + -webkit-filter: blur(50px); + filter: blur(50px); + } } } From ecb05ceca06e3be755a16825d24db43b75d64cae Mon Sep 17 00:00:00 2001 From: Vladimir Kharlampidi Date: Wed, 20 Jan 2021 15:39:30 +0300 Subject: [PATCH 05/11] Update to latest React --- package-lock.json | 24 +++++++++++------------- package.json | 4 ++-- 2 files changed, 13 insertions(+), 15 deletions(-) diff --git a/package-lock.json b/package-lock.json index 6a44b312a..e2340f76d 100644 --- a/package-lock.json +++ b/package-lock.json @@ -20694,26 +20694,24 @@ } }, "react": { - "version": "16.13.1", - "resolved": "https://registry.npmjs.org/react/-/react-16.13.1.tgz", - "integrity": "sha512-YMZQQq32xHLX0bz5Mnibv1/LHb3Sqzngu7xstSM+vrkE5Kzr9xE0yMByK5kMoTK30YVJE61WfbxIFFvfeDKT1w==", + "version": "17.0.1", + "resolved": "https://registry.npmjs.org/react/-/react-17.0.1.tgz", + "integrity": "sha512-lG9c9UuMHdcAexXtigOZLX8exLWkW0Ku29qPRU8uhF2R9BN96dLCt0psvzPLlHc5OWkgymP3qwTRgbnw5BKx3w==", "dev": true, "requires": { "loose-envify": "^1.1.0", - "object-assign": "^4.1.1", - "prop-types": "^15.6.2" + "object-assign": "^4.1.1" } }, "react-dom": { - "version": "16.13.1", - "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-16.13.1.tgz", - "integrity": "sha512-81PIMmVLnCNLO/fFOQxdQkvEq/+Hfpv24XNJfpyZhTRfO0QcmQIF/PgCa1zCOj2w1hrn12MFLyaJ/G0+Mxtfag==", + "version": "17.0.1", + "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-17.0.1.tgz", + "integrity": "sha512-6eV150oJZ9U2t9svnsspTMrWNyHc6chX0KzDeAOXftRa8bNeOKTTfCJ7KorIwenkHd2xqVTBTCZd79yk/lx/Ug==", "dev": true, "requires": { "loose-envify": "^1.1.0", "object-assign": "^4.1.1", - "prop-types": "^15.6.2", - "scheduler": "^0.19.1" + "scheduler": "^0.20.1" } }, "react-is": { @@ -21514,9 +21512,9 @@ "dev": true }, "scheduler": { - "version": "0.19.1", - "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.19.1.tgz", - "integrity": "sha512-n/zwRWRYSUj0/3g/otKDRPMh6qv2SYMWNq85IEa8iZyAv8od9zDYpGSnpBEjNgcMNq6Scbu5KfIPxNF72R/2EA==", + "version": "0.20.1", + "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.20.1.tgz", + "integrity": "sha512-LKTe+2xNJBNxu/QhHvDR14wUXHRQbVY5ZOYpOGWRzhydZUqrLb2JBvLPY7cAqFmqrWuDED0Mjk7013SZiOz6Bw==", "dev": true, "requires": { "loose-envify": "^1.1.0", diff --git a/package.json b/package.json index 5ba0e8179..f6bd148c6 100644 --- a/package.json +++ b/package.json @@ -133,8 +133,8 @@ "prettier": "^2.2.1", "prettier-plugin-svelte": "^1.4.2", "protractor": "~7.0.0", - "react": "^16.13.1", - "react-dom": "^16.13.1", + "react": "^17.0.1", + "react-dom": "^17.0.1", "rollup": "^2.34.2", "rxjs": "~6.6.3", "serve": "^11.3.2", From 7b128c2bf144464d3a709a548819805a1d9c9c7f Mon Sep 17 00:00:00 2001 From: Vladimir Kharlampidi Date: Wed, 20 Jan 2021 15:39:47 +0300 Subject: [PATCH 06/11] Fix virtual slides params override Fixes #4098 --- src/angular/src/swiper.component.ts | 12 ++++++++---- src/react/swiper.js | 12 ++++++++---- src/svelte/swiper.svelte | 20 ++++++++++++-------- src/vue/swiper.js | 14 +++++++++----- 4 files changed, 37 insertions(+), 21 deletions(-) diff --git a/src/angular/src/swiper.component.ts b/src/angular/src/swiper.component.ts index 35b097064..c137d83ca 100644 --- a/src/angular/src/swiper.component.ts +++ b/src/angular/src/swiper.component.ts @@ -463,11 +463,15 @@ export class SwiperComponent implements OnInit { } if (swiper.virtual && swiper.params.virtual.enabled) { swiper.virtual.slides = this.slides; - swiper.params.virtual.cache = false; - swiper.params.virtual.renderExternal = (data) => { - this.updateVirtualSlides(data); + const extendWith = { + cache: false, + renderExternal: (data) => { + this.updateVirtualSlides(data); + }, + renderExternalUpdate: false, }; - swiper.params.virtual.renderExternalUpdate = false; + extend(swiper.params.virtual, extendWith); + extend(swiper.originalParams.virtual, extendWith); } this._changeDetectorRef.detectChanges(); }, diff --git a/src/react/swiper.js b/src/react/swiper.js index 4861982df..61a83e7d9 100644 --- a/src/react/swiper.js +++ b/src/react/swiper.js @@ -1,7 +1,7 @@ import React, { useRef, useState, useEffect, forwardRef } from 'react'; import { getParams } from './get-params'; import { initSwiper } from './init-swiper'; -import { needsScrollbar, needsNavigation, needsPagination, uniqueClasses } from './utils'; +import { needsScrollbar, needsNavigation, needsPagination, uniqueClasses, extend } from './utils'; import { renderLoop, calcLoopedSlides } from './loop'; import { getChangedParams } from './get-changed-params'; import { getChildren } from './get-children'; @@ -66,9 +66,13 @@ const Swiper = forwardRef( swiperRef.current = swiper; if (swiper.virtual && swiper.params.virtual.enabled) { swiper.virtual.slides = slides; - swiper.params.virtual.cache = false; - swiper.params.virtual.renderExternal = setVirtualData; - swiper.params.virtual.renderExternalUpdate = false; + const extendWith = { + cache: false, + renderExternal: setVirtualData, + renderExternalUpdate: false, + }; + extend(swiper.params.virtual, extendWith); + extend(swiper.originalParams.virtual, extendWith); } }, }); diff --git a/src/svelte/swiper.svelte b/src/svelte/swiper.svelte index 9539b527a..bcfd8579e 100644 --- a/src/svelte/swiper.svelte +++ b/src/svelte/swiper.svelte @@ -9,7 +9,7 @@ } from 'svelte'; import { getParams } from './get-params'; import { initSwiper } from './init-swiper'; - import { needsScrollbar, needsNavigation, needsPagination, uniqueClasses } from './utils'; + import { needsScrollbar, needsNavigation, needsPagination, uniqueClasses, extend } from './utils'; import { getChangedParams } from './get-changed-params'; import { updateSwiper } from './update-swiper'; @@ -80,14 +80,18 @@ _swiper(_swiper) { swiperInstance = _swiper; if (_swiper.virtual && _swiper.params.virtual.enabled) { - _swiper.params.virtual.cache = false; - _swiper.params.virtual.renderExternalUpdate = false; - _swiper.params.virtual.renderExternal = (data) => { - setVirtualData(data); - if (swiperParams.virtual && swiperParams.virtual.renderExternal) { - swiperParams.virtual.renderExternal(data); - } + const extendWith = { + cache: false, + renderExternal: (data) => { + setVirtualData(data); + if (swiperParams.virtual && swiperParams.virtual.renderExternal) { + swiperParams.virtual.renderExternal(data); + } + }, + renderExternalUpdate: false, }; + extend(_swiper.params.virtual, extendWith); + extend(_swiper.originalParams.virtual, extendWith); } dispatch('swiper', [_swiper]); }, diff --git a/src/vue/swiper.js b/src/vue/swiper.js index 1ad9a8211..c01e7f2c8 100644 --- a/src/vue/swiper.js +++ b/src/vue/swiper.js @@ -1,7 +1,7 @@ import { h, ref, onMounted, onUpdated, onBeforeUnmount, watch } from 'vue'; import { getParams } from './get-params'; import { initSwiper } from './init-swiper'; -import { needsScrollbar, needsNavigation, needsPagination, uniqueClasses } from './utils'; +import { needsScrollbar, needsNavigation, needsPagination, uniqueClasses, extend } from './utils'; import { renderLoop, calcLoopedSlides } from './loop'; import { getChangedParams } from './get-changed-params'; import { getChildren } from './get-children'; @@ -257,11 +257,15 @@ const Swiper = { swiperRef.value = swiper; if (swiper.virtual && swiper.params.virtual.enabled) { swiper.virtual.slides = slidesRef.value; - swiper.params.virtual.cache = false; - swiper.params.virtual.renderExternal = (data) => { - virtualData.value = data; + const extendWith = { + cache: false, + renderExternal: (data) => { + virtualData.value = data; + }, + renderExternalUpdate: false, }; - swiper.params.virtual.renderExternalUpdate = false; + extend(swiper.params.virtual, extendWith); + extend(swiper.originalParams.virtual, extendWith); } }, }); From 1733a49103ba1683ada39d899b4e9e4b1f745720 Mon Sep 17 00:00:00 2001 From: Vlad Shilov Date: Wed, 20 Jan 2021 15:49:51 +0300 Subject: [PATCH 07/11] Fix React types --- src/swiper-react.d.ts | 10 +++++++++- 1 file changed, 9 insertions(+), 1 deletion(-) diff --git a/src/swiper-react.d.ts b/src/swiper-react.d.ts index 95e496260..bf37761a6 100644 --- a/src/swiper-react.d.ts +++ b/src/swiper-react.d.ts @@ -53,7 +53,15 @@ interface SwiperSlide { interface Swiper extends Omit< React.HTMLAttributes, - 'onProgress' | 'onClick' | 'onTouchEnd' | 'onTouchMove' | 'onTouchStart' | 'onTransitionEnd' + | 'onProgress' + | 'onClick' + | 'onTouchEnd' + | 'onTouchMove' + | 'onTouchStart' + | 'onTransitionEnd' + | 'onKeyPress' + | 'onDoubleClick' + | 'onScroll' > {} interface SwiperSlide extends React.HTMLAttributes {} From 10c93be93f3181dfa9311561fbb78db6eb073abb Mon Sep 17 00:00:00 2001 From: Vladimir Kharlampidi Date: Wed, 20 Jan 2021 16:09:40 +0300 Subject: [PATCH 08/11] Core: Correctly normalize index Fixes #4083 --- src/components/core/slide/slideTo.js | 17 ++++++++++++++++- 1 file changed, 16 insertions(+), 1 deletion(-) diff --git a/src/components/core/slide/slideTo.js b/src/components/core/slide/slideTo.js index 6de61e7a4..f32bc252a 100644 --- a/src/components/core/slide/slideTo.js +++ b/src/components/core/slide/slideTo.js @@ -68,7 +68,22 @@ export default function slideTo( // Normalize slideIndex if (params.normalizeSlideIndex) { for (let i = 0; i < slidesGrid.length; i += 1) { - if (-Math.floor(translate * 100) >= Math.floor(slidesGrid[i] * 100)) { + const normalizedTranslate = -Math.floor(translate * 100); + const normalizedGird = Math.floor(slidesGrid[i] * 100); + const normalizedGridNext = Math.floor(slidesGrid[i + 1] * 100); + if (typeof slidesGrid[i + 1] !== 'undefined') { + if ( + normalizedTranslate >= normalizedGird && + normalizedTranslate < normalizedGridNext - (normalizedGridNext - normalizedGird) / 2 + ) { + slideIndex = i; + } else if ( + normalizedTranslate >= normalizedGird && + normalizedTranslate < normalizedGridNext + ) { + slideIndex = i + 1; + } + } else if (normalizedTranslate >= normalizedGird) { slideIndex = i; } } From f6ec0a101034cdddaf44b20e57ffa1c69b33ba43 Mon Sep 17 00:00:00 2001 From: Vladimir Kharlampidi Date: Wed, 20 Jan 2021 16:47:57 +0300 Subject: [PATCH 09/11] Prevent iOS swipe back Fixes #4080 --- src/angular/src/swiper.component.ts | 2 +- src/components/core/events/onTouchStart.js | 6 +++++- src/types/swiper-options.d.ts | 8 ++++---- src/vue/swiper.js | 2 +- 4 files changed, 11 insertions(+), 7 deletions(-) diff --git a/src/angular/src/swiper.component.ts b/src/angular/src/swiper.component.ts index c137d83ca..ab62b99b0 100644 --- a/src/angular/src/swiper.component.ts +++ b/src/angular/src/swiper.component.ts @@ -55,7 +55,7 @@ export class SwiperComponent implements OnInit { @Input() preventInteractionOnTransition: SwiperOptions['preventInteractionOnTransition']; @Input() userAgent: SwiperOptions['userAgent']; @Input() url: SwiperOptions['url']; - @Input() edgeSwipeDetection: boolean; + @Input() edgeSwipeDetection: boolean | string; @Input() edgeSwipeThreshold: number; @Input() freeMode: SwiperOptions['freeMode']; @Input() freeModeMomentum: SwiperOptions['freeModeMomentum']; diff --git a/src/components/core/events/onTouchStart.js b/src/components/core/events/onTouchStart.js index dc9bce791..db7343171 100644 --- a/src/components/core/events/onTouchStart.js +++ b/src/components/core/events/onTouchStart.js @@ -58,7 +58,11 @@ export default function onTouchStart(event) { edgeSwipeDetection && (startX <= edgeSwipeThreshold || startX >= window.innerWidth - edgeSwipeThreshold) ) { - return; + if (edgeSwipeDetection === 'prevent') { + event.preventDefault(); + } else { + return; + } } extend(data, { diff --git a/src/types/swiper-options.d.ts b/src/types/swiper-options.d.ts index bc29e5ee8..4d8cdc010 100644 --- a/src/types/swiper-options.d.ts +++ b/src/types/swiper-options.d.ts @@ -307,14 +307,14 @@ export interface SwiperOptions { touchMoveStopPropagation?: boolean; /** - * Enable to release Swiper events for swipe-to-go-back work in iOS UIWebView + * Enable to release Swiper events for swipe-to-go-back work in app */ - iOSEdgeSwipeDetection?: boolean; + edgeSwipeDetection?: boolean | string; /** - * Area (in px) from left edge of the screen to release touch events for swipe-to-go-back in iOS UIWebView + * Area (in px) from left edge of the screen to release touch events for swipe-to-go-back in app */ - iOSEdgeSwipeThreshold?: number; + edgeSwipeThreshold?: number; /** * Enable to release touch events on slider edge position (beginning, end) to allow for further page scrolling diff --git a/src/vue/swiper.js b/src/vue/swiper.js index c01e7f2c8..8acf27d1f 100644 --- a/src/vue/swiper.js +++ b/src/vue/swiper.js @@ -33,7 +33,7 @@ const Swiper = { preventInteractionOnTransition: { type: Boolean, default: undefined }, userAgent: { type: String, default: undefined }, url: { type: String, default: undefined }, - edgeSwipeDetection: { type: Boolean, default: undefined }, + edgeSwipeDetection: { type: [Boolean, String], default: undefined }, edgeSwipeThreshold: { type: Number, default: undefined }, freeMode: { type: Boolean, default: undefined }, freeModeMomentum: { type: Boolean, default: undefined }, From 4783a7d9fba04020aab94bcba575d110e8479355 Mon Sep 17 00:00:00 2001 From: Vladimir Kharlampidi Date: Wed, 20 Jan 2021 16:49:00 +0300 Subject: [PATCH 10/11] Update swiper-options.d.ts Ref #4080 --- src/types/swiper-options.d.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/types/swiper-options.d.ts b/src/types/swiper-options.d.ts index 4d8cdc010..cf592097f 100644 --- a/src/types/swiper-options.d.ts +++ b/src/types/swiper-options.d.ts @@ -307,12 +307,12 @@ export interface SwiperOptions { touchMoveStopPropagation?: boolean; /** - * Enable to release Swiper events for swipe-to-go-back work in app + * Enable to release Swiper events for swipe-back work in app. If set to `'prevent'` then it will prevent system swipe-back navigation instead */ edgeSwipeDetection?: boolean | string; /** - * Area (in px) from left edge of the screen to release touch events for swipe-to-go-back in app + * Area (in px) from left edge of the screen to release touch events for swipe-back in app */ edgeSwipeThreshold?: number; From ad1eab753a1148abb1d580f31a4c1553afbc8e9f Mon Sep 17 00:00:00 2001 From: Vladimir Kharlampidi Date: Wed, 20 Jan 2021 16:52:32 +0300 Subject: [PATCH 11/11] 6.4.6 release --- CHANGELOG.md | 11 +++++++++++ package-lock.json | 2 +- package.json | 2 +- package/package.json | 2 +- 4 files changed, 14 insertions(+), 3 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index eb3dc2df1..c59c92b78 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,16 @@ # Changelog +## [Swiper 6.4.6](https://github.com/nolimits4web/swiper/compare/v6.4.5...v6.4.6) - Released on January 20th, 2020 + +- Core + - `edgeSwipeDetection` parameter now can receive string `'prevent'` to prevent system swipe-back navigation + - Fixed issue when with decimal `slidesPerView` last slide never received "active" class/state + - Cube + - Fixed shadow rendering issues in Chrome +- React/Svelte/Vue/Angular + - Fixed rendering issue when virtual slides used with breakpoints +- Minor fixes + ## [Swiper 6.4.5](https://github.com/nolimits4web/swiper/compare/v6.4.4...v6.4.5) - Released on December 18th, 2020 - Fixed issue with `postinstall` script diff --git a/package-lock.json b/package-lock.json index e2340f76d..11b9bbf60 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,6 +1,6 @@ { "name": "swiper-src", - "version": "6.4.5", + "version": "6.4.6", "lockfileVersion": 1, "requires": true, "dependencies": { diff --git a/package.json b/package.json index f6bd148c6..2246997c9 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "swiper-src", - "version": "6.4.5", + "version": "6.4.6", "description": "Most modern mobile touch slider and framework with hardware accelerated transitions", "scripts": { "build:dev": "cross-env NODE_ENV=development node scripts/build", diff --git a/package/package.json b/package/package.json index 92dcfa278..30997e3a5 100644 --- a/package/package.json +++ b/package/package.json @@ -1,6 +1,6 @@ { "name": "swiper", - "version": "6.4.5", + "version": "6.4.6", "description": "Most modern mobile touch slider and framework with hardware accelerated transitions", "main": "swiper.cjs.js", "jsnext:main": "swiper.esm.js",