diff --git a/packages/webawesome/docs/_includes/base.njk b/packages/webawesome/docs/_includes/base.njk index 45e1d609d..ebab009ef 100644 --- a/packages/webawesome/docs/_includes/base.njk +++ b/packages/webawesome/docs/_includes/base.njk @@ -1,5 +1,8 @@ - +{% if hasAnchors == undefined %}{% set hasAnchors = true %}{% endif %} +{% if hasBanner == undefined %}{% set hasBanner = true %}{% endif %} +{% if hasGeneratedTitle == undefined %}{% set hasGeneratedTitle = true %}{% endif %} + {% include 'head.njk' %} @@ -27,8 +30,6 @@ - {% if hasBanner == undefined %}{% set hasBanner = true %}{% endif %} - {% if hasGeneratedTitle == undefined %}{% set hasGeneratedTitle = true %}{% endif %} {% set defaultWaPageAttributes = defaultWaPageAttributes or { view: 'desktop', 'disable-navigation-toggle': true, 'mobile-breakpoint': 1180, 'disable-sticky': 'banner' } %} {% set waPageAttributes = waPageAttributes or {} %} diff --git a/packages/webawesome/docs/_transformers/anchor-headings.js b/packages/webawesome/docs/_transformers/anchor-headings.js index 12b150ff7..5b17f6674 100644 --- a/packages/webawesome/docs/_transformers/anchor-headings.js +++ b/packages/webawesome/docs/_transformers/anchor-headings.js @@ -35,9 +35,23 @@ export function anchorHeadingsTransformer(options = {}) { return doc; } - // Look for headings - let selector = `:is(${options.headingSelector}):not([data-no-anchor], [data-no-anchor] *)`; + // Check if the document or container has data-no-anchor (view-level) + const hasNoAnchorOnDocument = doc.querySelector('html')?.hasAttribute('data-no-anchor') || false; + const hasNoAnchorOnContainer = container.closest('[data-no-anchor]') !== null; + + // If view-level data-no-anchor is set, skip processing all headings + if (hasNoAnchorOnDocument || hasNoAnchorOnContainer) { + return doc; + } + + // Look for headings (selector excludes headings with data-no-anchor attribute) + let selector = `:is(${options.headingSelector}):not([data-no-anchor])`; container.querySelectorAll(selector).forEach(heading => { + // Skip if heading is a descendant of an element with data-no-anchor + // (selector already excludes headings with the attribute directly) + if (heading.closest('[data-no-anchor]') !== null) { + return; + } const hasAnchor = heading.querySelector('a'); const existingId = heading.getAttribute('id'); const clone = parse(heading.outerHTML);