https://www.americaneagle.ae/blocks/fragment/fragment.js

1/*
2 * Fragment Block
3 * Include content on a page as a fragment.
4 * https://www.aem.live/developer/block-collection/fragment
5 */
6import { replacePlaceholders, fetchLocalPlaceholders } from '../../scripts/utils.js';
7// eslint-disable-next-line import/no-cycle
8import { loadFragment } from '../../scripts/scripts.js';
9
10export default async function decorate(block) {
11  const link = block.querySelector('a');
12  const path = link ? link.getAttribute('href') : block.textContent.trim();
13  const lcpHintClass = Array.from(block.classList)
14    .find((className) => className.startsWith('lcp-hint-'));
15
16  const fragment = window.axp.preloadedFragments[path] ?? await loadFragment(path, lcpHintClass);
17  if (fragment) {
18    const placeholders = await fetchLocalPlaceholders();
19    replacePlaceholders(fragment, placeholders);
20    const fragmentSection = fragment.querySelector(':scope .section');
21    if (fragmentSection) {
22      block.closest('.section').classList.add(...fragmentSection.classList);
23      block.closest('.fragment').replaceWith(...fragment.childNodes);
24    }
25  } else {
26    block.classList.add('hidden');
27  }
28}