Merge branch 'master' into horizontal-gallery-styles-fix

lerna.json

@@ -2,5 +2,5 @@
   "packages": [
     "packages/*"
   ],
-  "version": "5.0.101"
+  "version": "5.0.104"
 }

packages/blueprints/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pro-gallery-blueprints",
-  "version": "5.0.101",
+  "version": "5.0.104",
   "private": false,
   "author": {
     "name": "Nir Naor",
@@ -41,8 +41,8 @@
     "typescript": "^4.9.5"
   },
   "dependencies": {
-    "pro-gallery-lib": "5.0.101",
-    "pro-layouts": "5.0.101"
+    "pro-gallery-lib": "5.0.104",
+    "pro-layouts": "5.0.104"
   },
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"

packages/gallery/package.json

@@ -1,7 +1,7 @@
 {
   "private": false,
   "name": "pro-gallery",
-  "version": "5.0.101",
+  "version": "5.0.104",
   "sideEffects": [
     "./src/components/styles/gallery.scss"
   ],
@@ -38,9 +38,9 @@
   "dependencies": {
     "@vimeo/player": "2.8.2",
     "hls.js": "1.4.12",
-    "pro-gallery-blueprints": "5.0.101",
-    "pro-gallery-lib": "5.0.101",
-    "pro-layouts": "5.0.101",
+    "pro-gallery-blueprints": "5.0.104",
+    "pro-gallery-lib": "5.0.104",
+    "pro-layouts": "5.0.104",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "react-player": "2.11.0",

packages/gallery/src/components/gallery/proGallery/slideshowView.js

@@ -78,7 +78,7 @@ class SlideshowView extends React.Component {
     return this.scrollPosition() <= 1;
   }
 
-  isScrollEnd() {
+  isScrollEnd(props = this.props) {
     const slideAnimation = this.props.options.behaviourParams_gallery_horizontal_slideAnimation;
     if (
       this.props.options.behaviourParams_gallery_horizontal_loop ||
@@ -88,7 +88,8 @@ class SlideshowView extends React.Component {
       return false;
     }
     return (
-      this.isAllItemsLoaded() && this.scrollPositionAtTheAndOfTheGallery() >= Math.floor(this.getScrollElementWidth())
+      this.isAllItemsLoaded() &&
+      this.scrollPositionAtTheAndOfTheGallery() >= Math.floor(this.getScrollElementWidth(props))
     );
   }
 
@@ -98,8 +99,8 @@ class SlideshowView extends React.Component {
     return visibleItemsCount >= totalItemsCount;
   }
 
-  getScrollElementWidth() {
-    const { galleryStructure } = this.props;
+  getScrollElementWidth(props = this.props) {
+    const { galleryStructure } = props;
     return galleryStructure.width - this.props.options.layoutParams_structure_itemSpacing / 2;
   }
 
@@ -110,11 +111,9 @@ class SlideshowView extends React.Component {
     return !this.props.options.behaviourParams_gallery_horizontal_loop && this.isScrollEnd();
   }
 
-  isLastItem() {
-    return (
-      !this.props.options.behaviourParams_gallery_horizontal_loop &&
-      this.state.activeIndex >= this.props.totalItemsCount - 1
-    );
+  isLastItem(props = this.props) {
+    const activeIndex = props?.activeIndex ?? this.state.activeIndex;
+    return !this.props.options.behaviourParams_gallery_horizontal_loop && activeIndex >= this.props.totalItemsCount - 1;
   }
 
   //__________________________________Slide show loop functions_____________________________________________
@@ -346,7 +345,7 @@ class SlideshowView extends React.Component {
     };
   }
 
-  onCurrentItemChanged() {
+  onCurrentItemChanged(props = this.props) {
     if (this.lastCurrentItem !== this.state.activeIndex) {
       this.lastCurrentItem = this.state.activeIndex;
       //this.props.actions.onCurrentItemChanged(this.state.currentIdx);
@@ -362,7 +361,7 @@ class SlideshowView extends React.Component {
       }
       this.navigationPanelCallbackOnIndexChange(this.state.activeIndex);
     }
-    this.removeArrowsIfNeeded();
+    this.removeArrowsIfNeeded(props);
   }
   clearAutoSlideshowInterval() {
     clearInterval(this.autoSlideshowInterval);
@@ -1074,16 +1073,17 @@ class SlideshowView extends React.Component {
           activeIndex: props.activeIndex,
         },
         () => {
-          this.onCurrentItemChanged();
+          this.onCurrentItemChanged(props);
         }
       );
     }
     if (
       this.props.totalItemsCount !== props.totalItemsCount ||
       this.props.container.galleryHeight !== props.container.galleryHeight ||
-      this.props.container.galleryWidth !== props.container.galleryWidth
+      this.props.container.galleryWidth !== props.container.galleryWidth ||
+      this.state.activeIndex !== props.activeIndex
     ) {
-      this.removeArrowsIfNeeded();
+      this.removeArrowsIfNeeded(props);
     }
     if (isEditMode() || isPreviewMode()) {
       if (
@@ -1105,16 +1105,16 @@ class SlideshowView extends React.Component {
       props.options.behaviourParams_gallery_horizontal_slideshowInfo_enablePlayButton;
   }
 
-  removeArrowsIfNeeded() {
+  removeArrowsIfNeeded(props = this.props) {
     const isRTL =
-      this.props.options.behaviourParams_gallery_layoutDirection ===
+      props.options.behaviourParams_gallery_layoutDirection ===
       GALLERY_CONSTS[optionsMap.behaviourParams.gallery.layoutDirection].RIGHT_TO_LEFT;
     const { hideLeftArrow, hideRightArrow } = this.state;
 
     const isScrollStart = this.isScrollStart();
     const isFirstItem = this.isFirstItem();
-    const isScrollEnd = this.isScrollEnd();
-    const isLastItem = this.isLastItem();
+    const isScrollEnd = this.isScrollEnd(props);
+    const isLastItem = this.isLastItem(props);
 
     const atStart = isScrollStart || isFirstItem;
     const atEnd = isScrollEnd || isLastItem;

packages/layouts/package.json

@@ -2,7 +2,7 @@
   "private": false,
   "name": "pro-layouts",
   "sideEffects": false,
-  "version": "5.0.101",
+  "version": "5.0.104",
   "author": {
     "name": "Guy Sopher",
     "email": "[email protected]"
@@ -43,6 +43,6 @@
     "registry": "https://registry.npmjs.org/"
   },
   "dependencies": {
-    "pro-gallery-lib": "5.0.101"
+    "pro-gallery-lib": "5.0.104"
   }
 }

packages/lib/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pro-gallery-lib",
-  "version": "5.0.101",
+  "version": "5.0.104",
   "private": false,
   "author": {
     "name": "Rita Bazak",

packages/lib/src/common/window/windowWrapper.js

@@ -22,7 +22,6 @@ class WindowWrapper {
   }
 
   initProxyWindow() {
-    console.log('locall pro-gallery ==>');
     const handler = {
       // here the proxy target is the global window object
       get: function (target, property) {

packages/playground/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pro-playground",
-  "version": "5.0.101",
+  "version": "5.0.104",
   "private": true,
   "scripts": {
     "watch": "sleep 10 && node scripts/start.js",
@@ -22,10 +22,10 @@
     "image-client-api": "^1.3130.0",
     "lodash.clonedeep": "^4.5.0",
     "moment": "2.29.2",
-    "pro-gallery": "5.0.101",
-    "pro-gallery-blueprints": "5.0.101",
-    "pro-gallery-lib": "5.0.101",
-    "pro-layouts": "5.0.101",
+    "pro-gallery": "5.0.104",
+    "pro-gallery-blueprints": "5.0.104",
+    "pro-gallery-lib": "5.0.104",
+    "pro-layouts": "5.0.104",
     "re-resizable": "^6.8.0",
     "react": "^18.2.0",
     "react-color": "^2.17.3",