@asante-org/atlascopco-vt-litesitegenerator 3.0.7 → 3.0.8

package/dist/src/components/lsg/LsgHero/LsgHero.stories.d.ts

@@ -34,3 +34,4 @@ export declare const CarouselNoArrows: Story;
  * (renders as a full solid-colour card).
  */
 export declare const PerCardColour: Story;
+export declare const FourSlides: Story;

package/dist/themes/theme-1.js

@@ -2443,11 +2443,19 @@
                 scrollDownBtn: hero.querySelector(".lsg-hero__scroll-down-btn"),
                 scrollDownTarget: hero.nextElementSibling,
             }, { transition: transition, autoplay: isCarousel });
-            // DAM video fade-in on canplay
-            hero.querySelectorAll(".lsg-hero__video").forEach(function (video) {
-                video.addEventListener("canplay", function () {
-                    video.classList.add("lsg-hero__video--ready");
-                }, { once: true });
+            // DAM video fade-in on canplay. The element is .lsg-hero-card__video (LsgHeroCard owns it),
+            // and the SCSS keys the opacity transition on .lsg-hero-card__video--ready.
+            hero.querySelectorAll(".lsg-hero-card__video").forEach(function (video) {
+                var markReady = function () { return video.classList.add("lsg-hero-card__video--ready"); };
+                // Server-rendered markup (AEM) can reach a playable readyState before this footer
+                // clientlib runs, in which case "canplay" has already fired and never arrives again.
+                // HAVE_FUTURE_DATA (3) is the readyState "canplay" corresponds to.
+                if (video.readyState >= 3) {
+                    markReady();
+                }
+                else {
+                    video.addEventListener("canplay", markReady, { once: true });
+                }
             });
         });
     }