[Release] Stage to Main

libs/blocks/aside/aside.css

@@ -752,7 +752,7 @@
   }
 
   .aside .split-image .modal-img-link,
-  .aside.split .split-image img,
+  .aside.split .split-image img:not(.accessibility-control),
   .aside.split .split-image video {
     width: 50vw;
     position: absolute;

libs/blocks/carousel/carousel.js

@@ -1,5 +1,5 @@
 import { createTag, getConfig, MILO_EVENTS } from '../../utils/utils.js';
-import { decorateAnchorVideo } from '../../utils/decorate.js';
+import { decorateAnchorVideo, syncPausePlayIcon } from '../../utils/decorate.js';
 
 const { miloLibs, codeRoot } = getConfig();
 const base = miloLibs || codeRoot;
@@ -134,8 +134,9 @@ function jumpToDirection(activeSlideIndex, jumpToIndex, slideContainer) {
 function checkSlideForVideo(activeSlide) {
   const video = activeSlide.querySelector('video');
   /* c8 ignore start */
-  if (video?.played.length > 0) {
+  if (video?.played.length > 0 && !video?.paused) {
     video.pause();
+    syncPausePlayIcon(video);
   }
   /* c8 ignore end */
 }

libs/blocks/faas/faas.css

@@ -394,6 +394,25 @@ input[type="checkbox"] + label {
   line-height: 1.375em;
 }
 
+.dialog-modal .faas-form-confirm-overlay {
+  position: absolute;
+  height: 100%;
+  width: 100%;
+  background-color: #FBFBFB;
+  opacity: 0.5;
+  top: 0;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  animation: fade-in-to-opaque .5s ease-in;
+}
+
+.dialog-modal .faas-form-confirm-overlay .icon-milo.checkmark-green {
+  height: 44px;
+  animation: pulse 2s ease;
+}
+
+
 /* for mobile */
 @media (max-width:799.99px) {
   .faas-form label,
@@ -450,3 +469,28 @@ input[type="checkbox"] + label {
     width: 100%;
   }
 }
+
+
+@keyframes pulse {
+  0% {
+    transform: scale(0.7);
+  }
+
+  50% {
+    transform: scale(1);
+  }
+
+  100% {
+    transform: scale(0.7);
+  }
+}
+
+@keyframes fade-in-to-opaque {
+  0% {
+    opacity: 0;
+  }
+
+  100% {
+    opacity: 0.5;
+  }
+}

libs/blocks/faas/utils.js

@@ -254,6 +254,32 @@ const beforeSubmitCallback = () => {
 };
 /* c8 ignore stop */
 
+export const afterSubmitCallback = (e) => {
+  const config = getConfig();
+  if (!e.success || !(config.faasCloseModalAfterSubmit === 'on')) return;
+  const faasForms = document.querySelectorAll('.dialog-modal .faas');
+  if (faasForms.length !== 1) return;
+  const faas = faasForms[0];
+  const dialogModal = faas.closest('.dialog-modal');
+  if (!dialogModal) return;
+  const closeBtn = dialogModal.querySelector('.dialog-close');
+  const faasFormWrapper = dialogModal.querySelector('.faas-form-wrapper');
+  if (!faasFormWrapper) return;
+  const overlay = createTag('div', { class: 'faas-form-confirm-overlay' });
+  const checkIcon = createTag('img', {
+    class: 'icon-milo checkmark-green',
+    src: `${config.miloLibs || config.codeRoot}/ui/img/checkmark-green.svg`,
+    alt: 'checkmark-green',
+  });
+  overlay.append(checkIcon);
+  faasFormWrapper.append(overlay);
+
+  checkIcon.addEventListener('animationend', () => {
+    if (faas.reset) faas.reset();
+    if (closeBtn) closeBtn.click();
+  }, { passive: true, once: true });
+};
+
 export const makeFaasConfig = (targetState) => {
   if (!targetState) {
     state = defaultState;
@@ -293,6 +319,7 @@ export const makeFaasConfig = (targetState) => {
     e: {
       afterYiiLoadedCallback,
       beforeSubmitCallback,
+      afterSubmitCallback,
     },
     style_backgroundTheme: targetState.style_backgroundTheme || 'white',
     style_layout: targetState.style_layout || 'column1',

libs/blocks/fallback/fallback.js

@@ -17,6 +17,7 @@ const SYNTHETIC_BLOCKS = [
   'region-selector',
   'search',
   'social',
+  'product-entry-cta',
 ];
 
 // eslint-disable-next-line import/prefer-default-export

libs/blocks/global-navigation/global-navigation.css

@@ -86,6 +86,11 @@ header.global-navigation {
   z-index: 1;
 }
 
+/* Product Entry CTA */
+.feds-product-entry-cta{
+  align-items: center;
+}
+
 /* Hamburger toggle */
 .feds-toggle {
   width: 60px;
@@ -488,6 +493,12 @@ header.global-navigation {
   right: auto;
 }
 
+@media (max-width: 900px) {
+  .feds-product-entry-cta {
+    display: none;
+  }
+}
+
 /* Desktop styles */
 @media (min-width: 900px) {
   /* General */

libs/blocks/global-navigation/global-navigation.js

@@ -354,6 +354,14 @@ class Gnav {
       lanaLog({ message: 'GNAV: Error with IMS', e, tags: 'errorType=info,module=gnav' });
     }));
 
+  decorateProductEntryCTA = () => {
+    const button = this.content.querySelector('.product-entry-cta a');
+    if (!button) return null;
+    const cta = decorateCta({ elem: button, type: this.getMainNavItemType(button) });
+    cta.closest('.feds-cta-wrapper').classList.add('feds-product-entry-cta');
+    return cta;
+  };
+
   decorateTopNav = () => {
     this.elements.mobileToggle = this.decorateToggle();
     this.elements.topnav = toFragment`
@@ -363,6 +371,7 @@ class Gnav {
           ${this.decorateBrand()}
         </div>
         ${this.elements.navWrapper}
+        ${getMetadata('product-entry-cta')?.toLowerCase() === 'on' ? this.decorateProductEntryCTA() : ''}
         ${getConfig().searchEnabled === 'on' ? toFragment`<div class="feds-client-search"></div>` : ''}
         ${this.useUniversalNav ? this.blocks.universalNav : ''}
         ${(!this.useUniversalNav && this.blocks.profile.rawElem) ? this.blocks.profile.decoratedElem : ''}

libs/blocks/merch-card-collection/merch-card-collection.js

@@ -5,7 +5,9 @@ import {
 } from '../../utils/utils.js';
 import { replaceText } from '../../features/placeholders.js';
 
-const DIGITS_ONLY = /^\d+$/;
+const DIGITS_ONLY = /^\/?\d+\/?$/;
+const FILTER_REGEX = /(filter|\/filter\/)/;
+const SEARCH_REGEX = /search|\/search\//;
 export const OVERRIDE_PATHS = 'overrides';
 
 const LITERAL_SLOTS = [
@@ -275,14 +277,14 @@ export default async function init(el) {
     ? el.lastElementChild : el.lastElementChild?.firstElementChild;
   // parse literals
   const literalSlots = [];
-  if (/filter/.test(literalsEl?.querySelector('u')?.innerText)) {
-    literalsEl?.querySelectorAll('u').forEach((u) => {
+  if (literalsEl && FILTER_REGEX.test(literalsEl.querySelector('u')?.innerText)) {
+    literalsEl.querySelectorAll('u').forEach((u) => {
       const text = u.innerText.trim();
       if (DIGITS_ONLY.test(text)) {
         u.outerHTML = '<span data-placeholder="resultCount"></span>';
-      } else if (text === 'search') {
+      } else if (SEARCH_REGEX.test(text)) {
         u.outerHTML = '<span data-placeholder="searchTerm"></span>';
-      } else if (text === 'filter') {
+      } else if (FILTER_REGEX.test(text)) {
         u.outerHTML = '<span data-placeholder="filter"></span>';
       }
     });

libs/blocks/mmm/mmm.css

@@ -1,5 +1,12 @@
 @import '../../styles/inline.css';
 
+.mmm-page_item-subtext {
+  position: absolute;
+  font-size: 12px;
+  bottom: 3px;
+  left: 16px;
+  color: #505050;
+}
 .mmm-container {
   padding: var(--spacing-m) 0;
 }

libs/blocks/mmm/mmm.js

@@ -26,11 +26,16 @@ async function toggleDrawer(target, dd) {
   }
 }
 function createButtonDetailsPair(mmmEl, page) {
-  const { url, pageId } = page;
+  const { url, pageId, numOfActivities } = page;
   const triggerId = `mmm-trigger-${pageId}`;
   const panelId = `mmm-content-${pageId}`;
   const icon = createTag('span', { class: 'mmm-icon' });
   const hTag = createTag('h5', false, url);
+  const activitiesNum = createTag(
+    'span',
+    { class: 'mmm-page_item-subtext' },
+    `${numOfActivities} Manifest(s) found`,
+  );
   const button = createTag('button', {
     type: 'button',
     id: triggerId,
@@ -39,6 +44,7 @@ function createButtonDetailsPair(mmmEl, page) {
     'aria-controls': panelId,
   }, hTag);
   button.append(icon);
+  button.append(activitiesNum);
 
   const dtHtml = hTag ? createTag(hTag.tagName, { class: 'mmm-heading' }, button) : button;
   const dt = createTag('dt', false, dtHtml);

libs/blocks/region-nav/region-nav.js

@@ -1,5 +1,7 @@
 import { getConfig } from '../../utils/utils.js';
 
+const queriedPages = [];
+
 function setInternational(prefix) {
   const domain = window.location.host.endsWith('.adobe.com') ? 'domain=adobe.com' : '';
   const maxAge = 365 * 24 * 60 * 60; // max-age in seconds for 365 days
@@ -10,25 +12,38 @@
 function handleEvent({ prefix, link, callback } = {}) {
   if (typeof callback !== 'function') return;
 
+  const existingPage = queriedPages.find((page) => page.href === link.href);
+  if (existingPage) {
+    callback(existingPage.resp.ok
+      ? link.href
+      : `${prefix ? `/${prefix}` : ''}/`);
+    return;
+  }
   fetch(link.href, { method: 'HEAD' }).then((resp) => {
+    queriedPages.push({ href: link.href, resp });
     if (!resp.ok) throw new Error('request failed');
     callback(link.href);
   }).catch(() => {
-    const prefixUrl = prefix ? `/${prefix}` : '';
-    callback(`${prefixUrl}/`);
+    callback(`${prefix ? `/${prefix}` : ''}/`);
   });
 }
 
-function decorateLink(link, path) {
+export function decorateLink(link, path) {
   let hrefAdapted;
   let pathname = link.getAttribute('href');
   if (pathname.startsWith('http')) {
     try { pathname = new URL(pathname).pathname; } catch (e) { /* href does not contain domain */ }
   }
   const linkParts = pathname.split('/');
-  const prefix = linkParts[1] || 'us';
+  const prefix = linkParts[1] || '';
   let { href } = link;
   if (href.endsWith('/')) href = href.slice(0, -1);
+
+  const { languageMap } = getConfig();
+  if (languageMap && !getConfig().locales[prefix]) {
+    const valueInMap = languageMap[prefix];
+    href = href.replace(`/${prefix}`, valueInMap ? `/${valueInMap}` : '');
+  }
   link.href = `${href}${path}`;
 
   link.addEventListener('mouseover', () => {
@@ -47,7 +62,7 @@
   });
 
   link.addEventListener('click', (e) => {
-    setInternational(prefix);
+    setInternational(prefix === '' ? 'us' : prefix);
     if (hrefAdapted) return;
     e.preventDefault();
     handleEvent({

libs/blocks/section-metadata/sticky-section.js

@@ -2,7 +2,7 @@ import { createTag } from '../../utils/utils.js';
 import { getMetadata, getDelayTime } from './section-metadata.js';
 
 function handleTopHeight(section) {
-  const headerHeight = document.querySelector('header').offsetHeight;
+  const headerHeight = document.querySelector('header')?.offsetHeight ?? 0;
   section.style.top = `${headerHeight}px`;
 }
 
@@ -35,6 +35,7 @@ function handleStickyPromobar(section, delay) {
   if ((section.querySelector(':is(.promobar, .notification)').classList.contains('no-delay'))
     || (delay && section.classList.contains('popup'))) {
     hasScrollControl = true;
+    section.classList.remove('hide-sticky-section');
   }
   if (!hasScrollControl && main.children[0] !== section) {
     stickySectionEl = createTag('div', { class: 'section show-sticky-section' });
@@ -53,6 +54,7 @@ export default async function handleStickySection(sticky, section) {
     case 'sticky-top': {
       const { debounce } = await import('../../utils/action.js');
       window.addEventListener('resize', debounce(() => handleTopHeight(section)));
+      handleTopHeight(section);
       main.prepend(section);
       break;
     }

libs/blocks/table/table.js

@@ -19,7 +19,7 @@ function defineDeviceByScreenSize() {
   return 'TABLET';
 }
 
-function isStickyHeader(el) {
+export function isStickyHeader(el) {
   return el.classList.contains('sticky')
     || (el.classList.contains('sticky-desktop-up') && defineDeviceByScreenSize() === 'DESKTOP')
     || (el.classList.contains('sticky-tablet-up') && defineDeviceByScreenSize() !== 'MOBILE' && !isMobileLandscape());
@@ -150,6 +150,7 @@ function handleAddOnContent(table) {
     });
   });
   setTimeout(() => handleEqualHeight(table, '.row-heading'), 0);
+  table.addEventListener('mas:resolved', debounce(() => { handleEqualHeight(table, '.row-heading'); }));
 }
 
 function handleHighlight(table) {

libs/blocks/video/video.css

@@ -112,8 +112,11 @@ video {
   position: inherit;
 }
 
-:is(.video-container .pause-play-wrapper, .aside.split.split-left .split-image) img.accessibility-control {
-  width: auto;
+:is(.video-container .pause-play-wrapper, .aside.split.split-left .split-image) img.accessibility-control,
+.brick.split.row.media-right .foreground .brick-media img.accessibility-control {
+  width: inherit;
+  height: inherit;
+  margin: 0;
 }
 
 .video-container .pause-play-wrapper img.hidden {