wpheadless-lib 1.1.17 → 1.1.19

package/dist/components/IntentLink/index.d.ts

@@ -0,0 +1,4 @@
+declare const IntentLink: import("react").ForwardRefExoticComponent<Omit<Omit<import("react").AnchorHTMLAttributes<HTMLAnchorElement>, keyof import("next/link").LinkProps<any>> & import("next/link").LinkProps<any> & {
+    children?: React.ReactNode | undefined;
+} & import("react").RefAttributes<HTMLAnchorElement>, "ref"> & import("react").RefAttributes<HTMLAnchorElement>>;
+export default IntentLink;

package/dist/components/IntentLink/index.js

@@ -0,0 +1,49 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import Link from "next/link";
+import { useRouter } from "next/navigation";
+import { forwardRef, useRef, } from "react";
+function formatHref(href) {
+    if (typeof href === "string")
+        return href;
+    const pathname = href.pathname ?? "";
+    const search = href.search
+        ? href.search.startsWith("?")
+            ? href.search
+            : `?${href.search}`
+        : "";
+    const hash = href.hash
+        ? href.hash.startsWith("#")
+            ? href.hash
+            : `#${href.hash}`
+        : "";
+    return `${pathname}${search}${hash}`;
+}
+function isInternalHref(href) {
+    return href.startsWith("/") && !href.startsWith("//");
+}
+const IntentLink = forwardRef(function IntentLink({ href, onMouseEnter, onFocus, prefetch: _prefetch, ...props }, ref) {
+    const router = useRouter();
+    const lastPrefetchedHref = useRef(null);
+    const prefetchOnIntent = () => {
+        const formattedHref = formatHref(href);
+        if (!isInternalHref(formattedHref) ||
+            lastPrefetchedHref.current === formattedHref) {
+            return;
+        }
+        lastPrefetchedHref.current = formattedHref;
+        router.prefetch(formattedHref);
+    };
+    const handleMouseEnter = (event) => {
+        onMouseEnter?.(event);
+        if (!event.defaultPrevented)
+            prefetchOnIntent();
+    };
+    const handleFocus = (event) => {
+        onFocus?.(event);
+        if (!event.defaultPrevented)
+            prefetchOnIntent();
+    };
+    return (_jsx(Link, { ref: ref, ...props, href: href, prefetch: false, onMouseEnter: handleMouseEnter, onFocus: handleFocus }));
+});
+export default IntentLink;

package/dist/components/LanguageLinks/index.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import Link from "next/link";
+import IntentLink from "../IntentLink/index.js";
 import styles from "./index.module.css";
 import { getTranslator } from "../../utils/index.js";
 export function LanguageLinks({ links, label, locale, className, }) {
@@ -8,5 +8,5 @@ export function LanguageLinks({ links, label, locale, className, }) {
         return null;
     const t = getTranslator(locale);
     const resolvedLabel = label ?? t("language.available");
-    return (_jsxs("nav", { "aria-label": resolvedLabel, className: [styles.languageLinks, className].filter(Boolean).join(" "), children: [_jsx("span", { className: styles.label, children: resolvedLabel }), _jsx("ul", { className: styles.list, children: visibleLinks.map((link) => (_jsx("li", { children: link.current ? (_jsx("span", { className: `${styles.link} ${styles.current}`, "aria-current": "page", lang: link.code, children: link.label })) : (_jsx(Link, { href: link.href, className: styles.link, hrefLang: link.code, children: link.label })) }, link.code))) })] }));
+    return (_jsxs("nav", { "aria-label": resolvedLabel, className: [styles.languageLinks, className].filter(Boolean).join(" "), children: [_jsx("span", { className: styles.label, children: resolvedLabel }), _jsx("ul", { className: styles.list, children: visibleLinks.map((link) => (_jsx("li", { children: link.current ? (_jsx("span", { className: `${styles.link} ${styles.current}`, "aria-current": "page", lang: link.code, children: link.label })) : (_jsx(IntentLink, { href: link.href, className: styles.link, hrefLang: link.code, children: link.label })) }, link.code))) })] }));
 }

package/dist/components/PostCard/index.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import Image from "next/image";
-import Link from "next/link";
+import IntentLink from "../IntentLink/index.js";
 import { getFeaturedMedia } from "../../utils/index.js";
 import { buildCategoryUrl, buildPostUrl, formatPostDate, resolveCategorySlug, } from "./index.utils.js";
 import styles from "./index.module.css";
@@ -21,7 +21,7 @@ export default function PostCard({ post, categorySlug, locale = "en", defaultLoc
         defaultLocale,
         basePath,
     });
-    return (_jsxs(Card, { as: "article", className: styles.card, children: [imageUrl && (_jsx(Link, { href: postUrl, className: styles.imageLink, children: _jsx("div", { className: styles.imageWrapper, children: _jsx(Image, { src: imageUrl, alt: featuredMedia?.alt_text || post.title.rendered, fill: true, style: { objectFit: "cover" }, sizes: "(max-width: 768px) 100vw, (max-width: 1200px) 50vw, 33vw" }) }) })), _jsxs(CardContent, { className: styles.body, children: [categories.length > 0 && (_jsx("div", { className: styles.badges, children: categories.map((cat) => (_jsx(Link, { href: buildCategoryUrl(cat.slug, locale, basePath, defaultLocale), className: badgeClassName(styles.badge), title: cat.name, children: truncateText(cat.name, 20) }, cat.id ?? cat.slug))) })), _jsxs(Link, { href: postUrl, className: styles.postLink, children: [_jsx("h2", { className: styles.title, dangerouslySetInnerHTML: {
+    return (_jsxs(Card, { as: "article", className: styles.card, children: [imageUrl && (_jsx(IntentLink, { href: postUrl, className: styles.imageLink, children: _jsx("div", { className: styles.imageWrapper, children: _jsx(Image, { src: imageUrl, alt: featuredMedia?.alt_text || post.title.rendered, fill: true, style: { objectFit: "cover" }, sizes: "(max-width: 768px) 100vw, (max-width: 1200px) 50vw, 33vw" }) }) })), _jsxs(CardContent, { className: styles.body, children: [categories.length > 0 && (_jsx("div", { className: styles.badges, children: categories.map((cat) => (_jsx(IntentLink, { href: buildCategoryUrl(cat.slug, locale, basePath, defaultLocale), className: badgeClassName(styles.badge), title: cat.name, children: truncateText(cat.name, 20) }, cat.id ?? cat.slug))) })), _jsxs(IntentLink, { href: postUrl, className: styles.postLink, children: [_jsx("h2", { className: styles.title, dangerouslySetInnerHTML: {
                                     __html: post.title.rendered,
                                 } }), _jsx("div", { dangerouslySetInnerHTML: {
                                     __html: post.excerpt.rendered,

package/dist/components/layout/Footer/index.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import Link from "next/link";
+import IntentLink from "../../IntentLink/index.js";
 import { getTranslator } from "../../../utils/index.js";
 import { fetchMenuLinks } from "../../../api/menus.js";
 import styles from "./index.module.css";
@@ -27,7 +27,7 @@ export default async function Footer({ menuId, wpApiUrl, wpUsername, wpAppPasswo
     catch (e) {
         console.error("Error obteniendo menú footer:", e);
     }
-    return (_jsx("footer", { className: styles.footer, children: _jsx("div", { className: styles.container, children: _jsxs("div", { className: styles.wrapper, children: [_jsxs("div", { className: styles.grid, children: [_jsxs("div", { children: [_jsx("div", { className: styles.siteName, children: logoData ? (_jsx("img", { src: logoData.src, alt: logoAlt, className: styles.logoImage, width: logoData.width, height: logoData.height, style: logoStyle })) : (siteName) }), _jsx("p", { className: `${styles.muted} text-muted`, children: t("footer.tagline") })] }), menuLinks.length > 0 && (_jsxs("nav", { "aria-label": t("footer.navAria"), className: styles.nav, children: [_jsx("h4", { className: styles.navTitle, children: t("footer.navTitle") }), _jsx("ul", { className: styles.list, children: menuLinks.map((item) => (_jsx("li", { children: _jsx(Link, { href: item.href, className: styles.footerLink, target: item.target || undefined, rel: item.target === "_blank"
+    return (_jsx("footer", { className: styles.footer, children: _jsx("div", { className: styles.container, children: _jsxs("div", { className: styles.wrapper, children: [_jsxs("div", { className: styles.grid, children: [_jsxs("div", { children: [_jsx("div", { className: styles.siteName, children: logoData ? (_jsx("img", { src: logoData.src, alt: logoAlt, className: styles.logoImage, width: logoData.width, height: logoData.height, style: logoStyle })) : (siteName) }), _jsx("p", { className: `${styles.muted} text-muted`, children: t("footer.tagline") })] }), menuLinks.length > 0 && (_jsxs("nav", { "aria-label": t("footer.navAria"), className: styles.nav, children: [_jsx("h4", { className: styles.navTitle, children: t("footer.navTitle") }), _jsx("ul", { className: styles.list, children: menuLinks.map((item) => (_jsx("li", { children: _jsx(IntentLink, { href: item.href, className: styles.footerLink, target: item.target || undefined, rel: item.target === "_blank"
                                                     ? "noopener noreferrer"
                                                     : undefined, children: item.label }) }, item.id))) })] }))] }), _jsxs("div", { className: styles.bottomBar, children: [_jsxs("span", { children: ["\u00A9 ", new Date().getFullYear(), " ", siteName] }), _jsx("span", { children: t("footer.noCookies") })] })] }) }) }));
 }

package/dist/components/layout/Header/HeaderClient.js

@@ -1,6 +1,6 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import Link from "next/link";
+import IntentLink from "../../IntentLink/index.js";
 import { useEffect, useRef, useState } from "react";
 import styles from "./index.module.css";
 import { Button } from "../../ui/index.js";
@@ -49,7 +49,7 @@ export default function HeaderClient({ menuLinks, siteName, homeHref, labels, lo
             ...(logoData.width ? { width: logoData.width } : {}),
         }
         : undefined;
-    return (_jsxs("div", { className: styles.inner, children: [_jsx(Link, { href: homeHref, className: styles.logo, children: logoData ? (_jsx("img", { src: logoData.src, alt: logoAlt, className: styles.logoImage, width: logoData.width, height: logoData.height, style: logoStyle })) : (siteName) }), menuLinks.length > 0 && (_jsxs("div", { className: styles.navWrapper, children: [_jsxs(Button, { type: "button", variant: "ghost", className: styles.menuButton, ref: menuButtonRef, "aria-expanded": isMenuOpen, "aria-controls": "primary-navigation", "aria-label": menuLabel, onClick: toggleMenu, children: [_jsxs("span", { className: styles.menuIcon, "aria-hidden": "true", children: [_jsx("span", {}), _jsx("span", {}), _jsx("span", {})] }), _jsx("span", { className: styles.menuText, children: menuLabel })] }), _jsx("nav", { id: "primary-navigation", ref: navRef, "aria-label": labels.navAria, className: `${styles.nav} ${isMenuOpen ? styles.navOpen : ""}`, "aria-hidden": !isMenuOpen && isMobileView, hidden: !isMenuOpen && isMobileView, children: _jsx("ul", { className: styles.list, children: menuLinks.map((item) => (_jsx("li", { children: _jsx(Link, { href: item.href, className: styles.navLink, onClick: handleLinkClick, tabIndex: !isMenuOpen && isMobileView ? -1 : undefined, target: item.target || undefined, rel: item.target === "_blank"
+    return (_jsxs("div", { className: styles.inner, children: [_jsx(IntentLink, { href: homeHref, className: styles.logo, children: logoData ? (_jsx("img", { src: logoData.src, alt: logoAlt, className: styles.logoImage, width: logoData.width, height: logoData.height, style: logoStyle })) : (siteName) }), menuLinks.length > 0 && (_jsxs("div", { className: styles.navWrapper, children: [_jsxs(Button, { type: "button", variant: "ghost", className: styles.menuButton, ref: menuButtonRef, "aria-expanded": isMenuOpen, "aria-controls": "primary-navigation", "aria-label": menuLabel, onClick: toggleMenu, children: [_jsxs("span", { className: styles.menuIcon, "aria-hidden": "true", children: [_jsx("span", {}), _jsx("span", {}), _jsx("span", {})] }), _jsx("span", { className: styles.menuText, children: menuLabel })] }), _jsx("nav", { id: "primary-navigation", ref: navRef, "aria-label": labels.navAria, className: `${styles.nav} ${isMenuOpen ? styles.navOpen : ""}`, "aria-hidden": !isMenuOpen && isMobileView, hidden: !isMenuOpen && isMobileView, children: _jsx("ul", { className: styles.list, children: menuLinks.map((item) => (_jsx("li", { children: _jsx(IntentLink, { href: item.href, className: styles.navLink, onClick: handleLinkClick, tabIndex: !isMenuOpen && isMobileView ? -1 : undefined, target: item.target || undefined, rel: item.target === "_blank"
                                         ? "noopener noreferrer"
                                         : undefined, children: item.label }) }, item.id))) }) })] }))] }));
 }

package/dist/components/ui/breadcrumb.d.ts

@@ -1,8 +1,8 @@
-import Link from "next/link";
+import IntentLink from "../IntentLink/index.js";
 import type { ComponentPropsWithoutRef } from "react";
 export declare function Breadcrumb({ className, ...props }: ComponentPropsWithoutRef<"nav">): import("react").JSX.Element;
 export declare function BreadcrumbList({ className, ...props }: ComponentPropsWithoutRef<"ol">): import("react").JSX.Element;
 export declare function BreadcrumbItem({ className, ...props }: ComponentPropsWithoutRef<"li">): import("react").JSX.Element;
-export declare function BreadcrumbLink({ className, ...props }: ComponentPropsWithoutRef<typeof Link>): import("react").JSX.Element;
+export declare function BreadcrumbLink({ className, ...props }: ComponentPropsWithoutRef<typeof IntentLink>): import("react").JSX.Element;
 export declare function BreadcrumbPage({ className, ...props }: ComponentPropsWithoutRef<"span">): import("react").JSX.Element;
 export declare function BreadcrumbSeparator({ className, children, ...props }: ComponentPropsWithoutRef<"span">): import("react").JSX.Element;

package/dist/components/ui/breadcrumb.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import Link from "next/link";
+import IntentLink from "../IntentLink/index.js";
 import { cn } from "./cn.js";
 import styles from "./breadcrumb.module.css";
 export function Breadcrumb({ className, ...props }) {
@@ -12,7 +12,7 @@ export function BreadcrumbItem({ className, ...props }) {
     return (_jsx("li", { "data-slot": "breadcrumb-item", className: cn(styles.item, className), ...props }));
 }
 export function BreadcrumbLink({ className, ...props }) {
-    return (_jsx(Link, { "data-slot": "breadcrumb-link", className: cn(styles.link, className), ...props }));
+    return (_jsx(IntentLink, { "data-slot": "breadcrumb-link", className: cn(styles.link, className), ...props }));
 }
 export function BreadcrumbPage({ className, ...props }) {
     return (_jsx("span", { "data-slot": "breadcrumb-page", "aria-current": "page", className: cn(styles.page, className), ...props }));

package/dist/components/ui/pagination.d.ts

@@ -1,9 +1,9 @@
-import Link from "next/link";
+import IntentLink from "../IntentLink/index.js";
 import type { ComponentPropsWithoutRef } from "react";
 export declare function Pagination({ className, ...props }: ComponentPropsWithoutRef<"nav">): import("react").JSX.Element;
 export declare function PaginationContent({ className, ...props }: ComponentPropsWithoutRef<"ul">): import("react").JSX.Element;
 export declare function PaginationItem(props: ComponentPropsWithoutRef<"li">): import("react").JSX.Element;
-type PaginationLinkProps = ComponentPropsWithoutRef<typeof Link> & {
+type PaginationLinkProps = ComponentPropsWithoutRef<typeof IntentLink> & {
     isActive?: boolean;
     size?: "default" | "icon";
 };

package/dist/components/ui/pagination.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import Link from "next/link";
+import IntentLink from "../IntentLink/index.js";
 import { cn } from "./cn.js";
 import styles from "./pagination.module.css";
 export function Pagination({ className, ...props }) {
@@ -12,7 +12,7 @@ export function PaginationItem(props) {
     return _jsx("li", { "data-slot": "pagination-item", ...props });
 }
 export function PaginationLink({ className, isActive, size = "icon", ...props }) {
-    return (_jsx(Link, { "data-slot": "pagination-link", "data-active": isActive, "aria-current": isActive ? "page" : undefined, className: cn(styles.link, size === "icon" ? styles.icon : styles.defaultSize, isActive && styles.active, className), ...props }));
+    return (_jsx(IntentLink, { "data-slot": "pagination-link", "data-active": isActive, "aria-current": isActive ? "page" : undefined, className: cn(styles.link, size === "icon" ? styles.icon : styles.defaultSize, isActive && styles.active, className), ...props }));
 }
 export function PaginationPrevious({ children, className, ...props }) {
     return (_jsxs(PaginationLink, { size: "default", className: className, ...props, children: [_jsx("span", { "aria-hidden": "true", children: "\u2190" }), _jsx("span", { children: children })] }));

package/dist/utils/seo.d.ts

@@ -34,6 +34,7 @@ type RewriteOpts = {
     wpApiUrl?: string;
     basePath?: string;
     inLanguage?: string;
+    canonicalUrl?: string;
 };
 /**
  * Replace Yoast URLs so they match the frontend domain instead of the WP API domain.

package/dist/utils/seo.js

@@ -110,6 +110,47 @@ const rewriteYoastSchemaUrls = (schema, opts, canonical) => {
         return schema;
     return rewriteSchemaValue(schema, origins);
 };
+const applyCanonicalUrlOverride = (schema, canonicalUrl) => {
+    if (!canonicalUrl || !schema || typeof schema !== "object")
+        return schema;
+    const graph = schema["@graph"];
+    if (!Array.isArray(graph))
+        return schema;
+    const pageUrls = new Set();
+    for (const node of graph) {
+        if (!nodeHasType(node, "WebPage"))
+            continue;
+        if (typeof node["@id"] === "string")
+            pageUrls.add(node["@id"]);
+        if (typeof node.url === "string")
+            pageUrls.add(node.url);
+    }
+    if (!pageUrls.size)
+        return schema;
+    const replacePageReferences = (value) => {
+        if (typeof value === "string") {
+            return pageUrls.has(value) ? canonicalUrl : value;
+        }
+        if (Array.isArray(value))
+            return value.map(replacePageReferences);
+        if (value && typeof value === "object") {
+            return Object.fromEntries(Object.entries(value).map(([key, val]) => [
+                key,
+                replacePageReferences(val),
+            ]));
+        }
+        return value;
+    };
+    const normalizedGraph = graph.map((node) => {
+        const next = replacePageReferences(node);
+        if (nodeHasType(next, "WebPage")) {
+            next["@id"] = canonicalUrl;
+            next.url = canonicalUrl;
+        }
+        return next;
+    });
+    return { ...schema, "@graph": normalizedGraph };
+};
 const getYoastDescription = (yoast) => {
     const description = yoast?.description || yoast?.og_description;
     return typeof description === "string" && description.trim()
@@ -256,7 +297,8 @@ export function getYoastSchema(entity, opts) {
         return null;
     const options = opts ?? {};
     const enriched = enrichYoastSchema(yoast.schema, entity, yoast, options);
-    return rewriteYoastSchemaUrls(enriched, options, yoast.canonical) || null;
+    const rewritten = rewriteYoastSchemaUrls(enriched, options, yoast.canonical);
+    return applyCanonicalUrlOverride(rewritten, options.canonicalUrl) || null;
 }
 export function stripBreadcrumbsFromSchema(schema) {
     if (!schema || typeof schema !== "object")

package/dist/views/HomeView/index.js

@@ -1,6 +1,6 @@
 import { jsxs as _jsxs, jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
 import Image from "next/image";
-import Link from "next/link";
+import IntentLink from "../../components/IntentLink/index.js";
 import Paginator from "../../components/Paginator/index.js";
 import PostCard from "../../components/PostCard/index.js";
 import styles from "./index.module.css";
@@ -19,7 +19,7 @@ export function HomeView({ featuredPost, regularPosts, error, totalPages, baseUr
     return (_jsx("div", { className: styles.container, children: error ? (_jsxs(Alert, { className: styles.errorBox, variant: "destructive", children: [_jsxs(AlertTitle, { children: [copy.errorTitle, ": ", error] }), _jsx(AlertDescription, { className: styles.errorHint, children: copy.errorHint })] })) : !featuredModel && regularPosts.length === 0 ? (_jsx("p", { className: styles.empty, children: copy.empty })) : (_jsxs(_Fragment, { children: [_jsx("h1", { id: "home-title", className: styles.visuallyHidden, children: copy.title }), _jsx("section", { className: styles.masthead, "aria-labelledby": "home-title", children: featuredModel && (_jsxs("article", { className: `${styles.featured} ${featuredModel.image
                             ? styles.featuredWithImage
                             : styles.featuredNoImage}`, children: [featuredModel.image && (_jsxs("div", { className: styles.featuredImageFrame, children: [_jsx(Image, { src: featuredModel.image.src, alt: featuredModel.image.alt, fill: true, className: styles.featuredImage, priority: true, sizes: "(max-width: 768px) 100vw, 50vw" }), _jsx("div", { className: styles.featuredOverlay, "aria-hidden": "true" })] })), _jsxs("div", { className: styles.featuredBody, children: [featuredModel.badgeLabel &&
-                                        (featuredModel.badgeUrl ? (_jsx(Link, { href: featuredModel.badgeUrl, className: badgeClassName(styles.featuredBadge), title: featuredModel.badgeLabel, children: truncateLabel(featuredModel.badgeLabel) })) : (_jsx("span", { className: badgeClassName(styles.featuredBadge), title: featuredModel.badgeLabel, children: truncateLabel(featuredModel.badgeLabel) }))), _jsx(Link, { href: featuredModel.postUrl, children: _jsx("h2", { dangerouslySetInnerHTML: {
+                                        (featuredModel.badgeUrl ? (_jsx(IntentLink, { href: featuredModel.badgeUrl, className: badgeClassName(styles.featuredBadge), title: featuredModel.badgeLabel, children: truncateLabel(featuredModel.badgeLabel) })) : (_jsx("span", { className: badgeClassName(styles.featuredBadge), title: featuredModel.badgeLabel, children: truncateLabel(featuredModel.badgeLabel) }))), _jsx(IntentLink, { href: featuredModel.postUrl, children: _jsx("h2", { dangerouslySetInnerHTML: {
                                                 __html: featuredModel.titleHtml,
                                             }, className: styles.featuredTitle }) }), _jsx("div", { dangerouslySetInnerHTML: {
                                             __html: featuredModel.excerptHtml,

package/dist/views/PostView/index.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import Image from "next/image";
-import Link from "next/link";
+import IntentLink from "../../components/IntentLink/index.js";
 import styles from "./index.module.css";
 import { getTranslator, getYoastSchema, rewritePostContentLinks, stripBreadcrumbsFromSchema, } from "../../utils/index.js";
 import { Breadcrumbs, JsonLd, LanguageLinks } from "../../components/index.js";
@@ -42,5 +42,5 @@ export function PostView({ post, dateLocale = "en-US", categoryBasePath = "/", l
             inLanguage: dateLocale,
         }))
         : null;
-    return (_jsxs("div", { className: styles.container, children: [_jsx(JsonLd, { data: yoastSchema }), _jsxs("article", { className: styles.article, children: [_jsx(Breadcrumbs, { items: breadcrumbs }), featuredImage && (_jsxs("figure", { className: styles.figure, children: [_jsx(Image, { src: featuredImage.src, alt: featuredImage.alt, fill: true, className: styles.image, priority: priorityImage, sizes: "(max-width: 1200px) 100vw, 1200px" }), _jsx("div", { className: styles.heroOverlay, "aria-hidden": "true" }), primaryCategory && (_jsx("div", { className: styles.badgeOverlay, children: categoryUrl ? (_jsx(Link, { href: categoryUrl, className: badgeClassName(), title: primaryCategory.name, children: truncateLabel(primaryCategory.name, 20) })) : (_jsx("span", { className: badgeClassName(), title: primaryCategory.name, children: truncateLabel(primaryCategory.name, 20) })) })), _jsx("h1", { dangerouslySetInnerHTML: { __html: post.title.rendered }, className: `${styles.title} ${styles.heroTitle}` })] })), !featuredImage && (_jsx("header", { className: styles.postHeader, children: _jsx("h1", { dangerouslySetInnerHTML: { __html: post.title.rendered }, className: styles.title }) })), _jsxs("div", { className: styles.meta, children: [author && (_jsx("span", { className: styles.authorLabel, children: t("post.authorPrefix", { name: author.name }) })), _jsx("span", { children: "\u2022" }), _jsx("time", { dateTime: post.date, children: publishedDate })] }), _jsx("div", { dangerouslySetInnerHTML: { __html: contentHtml }, className: `post-content ${styles.content}` }), disclaimer && (_jsx(Alert, { className: styles.disclaimer, role: "note", children: disclaimer })), _jsx(LanguageLinks, { links: languageLinks, locale: locale }), author && (_jsx(Card, { as: "aside", className: styles.authorCard, size: "sm", children: _jsx(CardContent, { children: _jsxs("address", { className: styles.authorAddress, children: [_jsx("strong", { className: styles.authorName, children: author.name }), authorBio && _jsx("p", { className: styles.authorBio, children: authorBio })] }) }) }))] })] }));
+    return (_jsxs("div", { className: styles.container, children: [_jsx(JsonLd, { data: yoastSchema }), _jsxs("article", { className: styles.article, children: [_jsx(Breadcrumbs, { items: breadcrumbs }), featuredImage && (_jsxs("figure", { className: styles.figure, children: [_jsx(Image, { src: featuredImage.src, alt: featuredImage.alt, fill: true, className: styles.image, priority: priorityImage, sizes: "(max-width: 1200px) 100vw, 1200px" }), _jsx("div", { className: styles.heroOverlay, "aria-hidden": "true" }), primaryCategory && (_jsx("div", { className: styles.badgeOverlay, children: categoryUrl ? (_jsx(IntentLink, { href: categoryUrl, className: badgeClassName(), title: primaryCategory.name, children: truncateLabel(primaryCategory.name, 20) })) : (_jsx("span", { className: badgeClassName(), title: primaryCategory.name, children: truncateLabel(primaryCategory.name, 20) })) })), _jsx("h1", { dangerouslySetInnerHTML: { __html: post.title.rendered }, className: `${styles.title} ${styles.heroTitle}` })] })), !featuredImage && (_jsx("header", { className: styles.postHeader, children: _jsx("h1", { dangerouslySetInnerHTML: { __html: post.title.rendered }, className: styles.title }) })), _jsxs("div", { className: styles.meta, children: [author && (_jsx("span", { className: styles.authorLabel, children: t("post.authorPrefix", { name: author.name }) })), _jsx("span", { children: "\u2022" }), _jsx("time", { dateTime: post.date, children: publishedDate })] }), _jsx("div", { dangerouslySetInnerHTML: { __html: contentHtml }, className: `post-content ${styles.content}` }), disclaimer && (_jsx(Alert, { className: styles.disclaimer, role: "note", children: disclaimer })), _jsx(LanguageLinks, { links: languageLinks, locale: locale }), author && (_jsx(Card, { as: "aside", className: styles.authorCard, size: "sm", children: _jsx(CardContent, { children: _jsxs("address", { className: styles.authorAddress, children: [_jsx("strong", { className: styles.authorName, children: author.name }), authorBio && _jsx("p", { className: styles.authorBio, children: authorBio })] }) }) }))] })] }));
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "wpheadless-lib",
-  "version": "1.1.17",
+  "version": "1.1.19",
   "private": false,
   "type": "module",
   "main": "dist/index.js",
@@ -9,6 +9,7 @@
   "scripts": {
     "build": "tsc -p tsconfig.json && tsc-alias -p tsconfig.json -f && node ./scripts/copy-assets.mjs",
     "copy:assets": "node ./scripts/copy-assets.mjs",
+    "test": "vitest run",
     "prepublishOnly": "npm run build"
   },
   "files": [
@@ -62,14 +63,17 @@
     "wpjsapi-lib": "^3.1.2"
   },
   "devDependencies": {
+    "@testing-library/react": "^16.3.2",
     "@types/node": "^20",
     "@types/react": "^19",
     "@types/react-dom": "^19",
+    "jsdom": "^26.1.0",
     "next": "16.2.6",
     "react": "19.2.6",
     "react-dom": "19.2.6",
     "tsc-alias": "^1.8.10",
-    "typescript": "^5.9.3"
+    "typescript": "^5.9.3",
+    "vitest": "^4.1.10"
   },
   "peerDependencies": {
     "next": "^16.2.6",