wpheadless-lib 1.0.0

package/dist/utils/sitemap.js

@@ -0,0 +1,327 @@
+import { createPageEndpoints, createPostsEndpoints } from "wpjsapi-lib";
+import { createWpClient } from "../api/wpClient";
+import { listPostsWithEmbeds } from "../api/posts";
+import { getCategoryPaginationStaticParams } from "../base";
+import { getHomePaginationStaticParams } from "../base/home/pagination";
+import { getAbsoluteUrl, ensureTrailingSlash } from "./routing";
+import { getTranslationKey, getEntityLanguageId, withXDefault, } from "./hreflang";
+const resolveWpApiUrl = (cfg) => cfg.wpApiUrl ?? process.env.WP_API_URL ?? "";
+const resolveSiteUrl = (cfg) => cfg.siteUrl ?? process.env.NEXT_PUBLIC_SITE_URL;
+const buildHomeAlternates = (cfg) => withXDefault(cfg.languages.reduce((acc, langCfg) => {
+    const basePath = ensureTrailingSlash(langCfg.basePath || "/");
+    acc[langCfg.code] = getAbsoluteUrl(basePath, resolveSiteUrl(cfg));
+    return acc;
+}, {}));
+export function renderSitemap(entries) {
+    const items = entries
+        .map((entry) => {
+        const links = entry.alternates &&
+            Object.entries(entry.alternates)
+                .map(([code, href]) => `<xhtml:link rel="alternate" hreflang="${code}" href="${href}" />`)
+                .join("");
+        return `<url><loc>${entry.url}</loc>${entry.lastmod ? `<lastmod>${entry.lastmod}</lastmod>` : ""}${links ?? ""}</url>`;
+    })
+        .join("");
+    return (`<?xml version="1.0" encoding="UTF-8"?>` +
+        `<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9" xmlns:xhtml="http://www.w3.org/1999/xhtml">` +
+        items +
+        `</urlset>`);
+}
+export function renderSitemapIndex(sitemaps) {
+    const items = sitemaps
+        .map((s) => `<sitemap><loc>${s.url}</loc>${s.lastmod ? `<lastmod>${s.lastmod}</lastmod>` : ""}</sitemap>`)
+        .join("");
+    return (`<?xml version="1.0" encoding="UTF-8"?>` +
+        `<sitemapindex xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">` +
+        items +
+        `</sitemapindex>`);
+}
+export async function getHomeEntries(cfg) {
+    const entries = [];
+    const { languages, runtimeConfig } = cfg;
+    const wpApiUrl = resolveWpApiUrl(cfg);
+    const siteUrl = resolveSiteUrl(cfg);
+    const homeAlternates = buildHomeAlternates(cfg);
+    for (const langCfg of languages) {
+        const basePath = ensureTrailingSlash(langCfg.basePath || "/");
+        const homeUrl = getAbsoluteUrl(basePath, siteUrl);
+        const homePosts = await listPostsWithEmbeds({
+            baseApiUrl: wpApiUrl,
+            perPage: runtimeConfig.postsPerPagePagination,
+            page: 1,
+            langId: langCfg.langId,
+            orderby: "date",
+            order: "desc",
+        });
+        const latest = homePosts.ok ? homePosts.data?.items[0] : undefined;
+        const lastmod = latest?.modified ||
+            latest?.date;
+        entries.push({
+            url: homeUrl,
+            lastmod: lastmod ? new Date(lastmod).toISOString() : undefined,
+            alternates: homeAlternates ?? undefined,
+        });
+    }
+    return entries;
+}
+export async function getHomePaginationEntries(cfg) {
+    const entries = [];
+    const { languages, runtimeConfig } = cfg;
+    const wpApiUrl = resolveWpApiUrl(cfg);
+    const siteUrl = resolveSiteUrl(cfg);
+    for (const langCfg of languages) {
+        const basePath = ensureTrailingSlash(langCfg.basePath || "/");
+        const pages = await getHomePaginationStaticParams({
+            baseApiUrl: wpApiUrl,
+            perPage: runtimeConfig.postsPerPagePagination,
+            langId: langCfg.langId,
+        });
+        for (const p of pages) {
+            const url = getAbsoluteUrl(`${basePath}page/${p.page}/`, siteUrl);
+            const pagePosts = await listPostsWithEmbeds({
+                baseApiUrl: wpApiUrl,
+                perPage: runtimeConfig.postsPerPagePagination,
+                page: Number(p.page),
+                langId: langCfg.langId,
+                orderby: "date",
+                order: "desc",
+            });
+            const latest = pagePosts.ok ? pagePosts.data?.items[0] : undefined;
+            const lastmod = latest?.modified ||
+                latest?.date;
+            entries.push({
+                url,
+                lastmod: lastmod ? new Date(lastmod).toISOString() : undefined,
+            });
+        }
+    }
+    return entries;
+}
+export async function getCategoryEntries(cfg) {
+    const entries = [];
+    const { languages, runtimeConfig } = cfg;
+    const wpApiUrl = resolveWpApiUrl(cfg);
+    const siteUrl = resolveSiteUrl(cfg);
+    const categoriesPerLang = {};
+    const categoryAlternates = {};
+    for (const langCfg of languages) {
+        const { categoriesApi } = createWpClient({ baseUrl: wpApiUrl });
+        const categories = await categoriesApi.listAll({
+            lang: langCfg.code,
+            _fields: ["id", "slug", "name", "description", "meta"],
+        });
+        categoriesPerLang[langCfg.code] = categories;
+        const basePath = ensureTrailingSlash(langCfg.basePath || "/");
+        for (const cat of categories) {
+            const translationKey = getTranslationKey(cat);
+            if (!translationKey)
+                continue;
+            const url = getAbsoluteUrl(`${basePath}${cat.slug}/`, siteUrl);
+            if (!categoryAlternates[translationKey]) {
+                categoryAlternates[translationKey] = {};
+            }
+            categoryAlternates[translationKey][langCfg.code] = url;
+        }
+    }
+    for (const langCfg of languages) {
+        const basePath = ensureTrailingSlash(langCfg.basePath || "/");
+        const categories = categoriesPerLang[langCfg.code] ?? [];
+        for (const cat of categories) {
+            const url = getAbsoluteUrl(`${basePath}${cat.slug}/`, siteUrl);
+            const catPosts = await listPostsWithEmbeds({
+                baseApiUrl: wpApiUrl,
+                categories: [cat.id],
+                perPage: runtimeConfig.postsPerPagePagination,
+                page: 1,
+                langId: langCfg.langId || "",
+                orderby: "date",
+                order: "desc",
+            });
+            const latest = catPosts.ok ? catPosts.data?.items[0] : undefined;
+            const lastmod = latest?.modified ||
+                latest?.date;
+            const alt = (() => {
+                const key = getTranslationKey(cat);
+                if (!key)
+                    return undefined;
+                const a = withXDefault(categoryAlternates[key]);
+                return a;
+            })();
+            entries.push({
+                url,
+                lastmod: lastmod ? new Date(lastmod).toISOString() : undefined,
+                alternates: alt,
+            });
+        }
+    }
+    return entries;
+}
+export async function getCategoryPaginationEntries(cfg) {
+    const entries = [];
+    const { languages, runtimeConfig } = cfg;
+    const wpApiUrl = resolveWpApiUrl(cfg);
+    const siteUrl = resolveSiteUrl(cfg);
+    const catIdsBySlugByLang = {};
+    for (const langCfg of languages) {
+        const { categoriesApi } = createWpClient({ baseUrl: wpApiUrl });
+        const categories = await categoriesApi.listAll({
+            lang: langCfg.code,
+            _fields: ["id", "slug"],
+        });
+        catIdsBySlugByLang[langCfg.code] = Object.fromEntries(categories.map((c) => [c.slug, c.id]));
+    }
+    for (const langCfg of languages) {
+        const catPages = await getCategoryPaginationStaticParams({
+            baseApiUrl: wpApiUrl,
+            perPage: runtimeConfig.postsPerPagePagination,
+            lang: langCfg.code,
+            langId: langCfg.langId || "",
+        });
+        const basePath = ensureTrailingSlash(langCfg.basePath || "/");
+        for (const page of catPages) {
+            const url = getAbsoluteUrl(`${basePath}${page.category}/page/${page.page}/`, siteUrl);
+            const catId = catIdsBySlugByLang[langCfg.code]?.[page.category];
+            let lastmod;
+            if (catId) {
+                const pagePosts = await listPostsWithEmbeds({
+                    baseApiUrl: wpApiUrl,
+                    categories: [catId],
+                    perPage: runtimeConfig.postsPerPagePagination,
+                    page: Number(page.page),
+                    langId: langCfg.langId || "",
+                    orderby: "date",
+                    order: "desc",
+                });
+                const latest = pagePosts.ok ? pagePosts.data?.items[0] : undefined;
+                lastmod =
+                    latest?.modified ||
+                        latest?.date;
+            }
+            entries.push({
+                url,
+                lastmod: lastmod ? new Date(lastmod).toISOString() : undefined,
+            });
+        }
+    }
+    return entries;
+}
+export async function getPostEntriesForLang(langCode, cfg) {
+    const { languages } = cfg;
+    const langCfg = languages.find((l) => l.code === langCode);
+    if (!langCfg)
+        return [];
+    const wpApiUrl = resolveWpApiUrl(cfg);
+    const siteUrl = resolveSiteUrl(cfg);
+    const postsApi = createPostsEndpoints({ baseUrl: wpApiUrl });
+    const posts = await postsApi.listAll({
+        per_page: 100,
+        _embed: true,
+        taxonomies: { language: [Number(langCfg.langId)] },
+    });
+    const postAlternates = {};
+    for (const l of languages) {
+        const base = ensureTrailingSlash(l.basePath || "/");
+        const langPosts = l.code === langCfg.code
+            ? posts
+            : await postsApi.listAll({
+                per_page: 100,
+                _embed: true,
+                taxonomies: { language: [Number(l.langId)] },
+            });
+        for (const p of langPosts) {
+            const translationKey = getTranslationKey(p);
+            if (!translationKey)
+                continue;
+            const category = p._embedded?.["wp:term"]?.[0]?.[0];
+            const categorySlug = category?.slug;
+            if (!categorySlug)
+                continue;
+            const url = getAbsoluteUrl(`${base}${categorySlug}/${p.slug}/`, siteUrl);
+            if (!postAlternates[translationKey])
+                postAlternates[translationKey] = {};
+            postAlternates[translationKey][l.code] = url;
+        }
+    }
+    const basePath = ensureTrailingSlash(langCfg.basePath || "/");
+    return posts
+        .map((p) => {
+        const category = p._embedded?.["wp:term"]?.[0]?.[0];
+        const categorySlug = category?.slug;
+        if (!categorySlug)
+            return null;
+        const url = getAbsoluteUrl(`${basePath}${categorySlug}/${p.slug}/`, siteUrl);
+        const lastmod = p.modified ||
+            p.date;
+        const translationKey = getTranslationKey(p);
+        const alts = translationKey
+            ? withXDefault(postAlternates[translationKey])
+            : undefined;
+        return {
+            url,
+            lastmod: lastmod ? new Date(lastmod).toISOString() : undefined,
+            alternates: alts,
+        };
+    })
+        .filter(Boolean);
+}
+export async function getLegalEntries(cfg) {
+    const entries = [];
+    const { languages } = cfg;
+    const siteUrl = resolveSiteUrl(cfg);
+    const wpApiUrl = resolveWpApiUrl(cfg);
+    const pagesApi = createPageEndpoints({ baseUrl: wpApiUrl });
+    const pagesPerLang = {};
+    const alternatesByKey = {};
+    for (const langCfg of languages) {
+        const parent = await pagesApi.list({
+            slug: "legal",
+            per_page: 1,
+            _fields: ["id", "language", "taxonomies", "meta"],
+        });
+        const parentId = parent.items.find((p) => getEntityLanguageId(p)?.toString() === langCfg.langId?.toString())?.id ?? parent.items[0]?.id;
+        if (!parentId)
+            continue;
+        const pages = await pagesApi.listAll({
+            parent: parentId,
+            _fields: [
+                "slug",
+                "date",
+                "modified",
+                "meta",
+                "taxonomies",
+                "parent",
+                "language",
+            ],
+        });
+        const filtered = pages.filter((p) => getEntityLanguageId(p)?.toString() === langCfg.langId?.toString());
+        pagesPerLang[langCfg.code] = filtered;
+        const basePath = ensureTrailingSlash(langCfg.basePath || "/");
+        for (const p of filtered) {
+            const translationKey = getTranslationKey(p);
+            if (!translationKey)
+                continue;
+            const url = getAbsoluteUrl(`${basePath}legal/${p.slug}/`, siteUrl);
+            if (!alternatesByKey[translationKey])
+                alternatesByKey[translationKey] = {};
+            alternatesByKey[translationKey][langCfg.code] = url;
+        }
+    }
+    for (const langCfg of languages) {
+        const basePath = ensureTrailingSlash(langCfg.basePath || "/");
+        const pages = pagesPerLang[langCfg.code] ?? [];
+        for (const p of pages) {
+            const url = getAbsoluteUrl(`${basePath}legal/${p.slug}/`, siteUrl);
+            const lastmod = p.modified || p.date;
+            const translationKey = getTranslationKey(p);
+            const alts = translationKey
+                ? withXDefault(alternatesByKey[translationKey])
+                : undefined;
+            entries.push({
+                url,
+                lastmod: lastmod ? new Date(lastmod).toISOString() : undefined,
+                alternates: alts,
+            });
+        }
+    }
+    return entries;
+}

package/dist/views/CategoryListView/index.d.ts

@@ -0,0 +1,12 @@
+import { type WPCategory, type WPPost } from "wpjsapi-lib";
+import { type Locale } from "../../utils";
+type CategoryListViewProps = {
+    category: WPCategory;
+    posts: WPPost[];
+    totalPages: number;
+    baseUrl?: string;
+    locale?: Locale;
+    dateLocale?: string;
+};
+export declare function CategoryListView({ category, posts, totalPages, baseUrl, locale, dateLocale, }: CategoryListViewProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/views/CategoryListView/index.js

@@ -0,0 +1,17 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import Paginator from "../../components/Paginator";
+import PostCard from "../../components/PostCard";
+import styles from "./index.module.css";
+import { getCountLabel, getEmptyLabel, getPaginatorBase } from "./index.utils";
+import { Breadcrumbs } from "../../components";
+import { getTranslator } from "../../utils";
+export function CategoryListView({ category, posts, totalPages, baseUrl, locale, dateLocale = "en-US", }) {
+    const paginatorBase = getPaginatorBase(category, baseUrl);
+    const countLabel = getCountLabel(category, locale);
+    const emptyLabel = getEmptyLabel(locale);
+    const t = getTranslator(locale);
+    return (_jsxs("div", { className: `container ${styles.container}`, children: [_jsxs("header", { className: styles.header, children: [_jsx(Breadcrumbs, { items: [
+                            { label: "Home", href: baseUrl || "/" },
+                            { label: category.name },
+                        ] }), _jsx("h1", { className: styles.title, children: category.name }), category.description && (_jsx("div", { className: styles.description, dangerouslySetInnerHTML: { __html: category.description } })), countLabel && _jsx("p", { className: styles.count, children: countLabel })] }), posts.length === 0 ? (_jsx("p", { className: styles.empty, children: emptyLabel })) : (_jsxs("section", { "aria-label": t("home.title"), className: styles.gridSection, children: [_jsx("div", { className: styles.grid, children: posts.map((post) => (_jsx(PostCard, { post: post, categorySlug: category.slug, locale: locale, dateLocale: dateLocale }, post.id))) }), _jsx(Paginator, { currentPage: 1, totalPages: totalPages, baseUrl: paginatorBase, locale: locale })] }))] }));
+}

package/dist/views/CategoryListView/index.module.css

@@ -0,0 +1,39 @@
+.container {
+  padding-top: var(--spacing-xl);
+  padding-bottom: var(--spacing-xl);
+}
+
+.header {
+  margin-bottom: var(--spacing-xl);
+}
+
+.title {
+  font-size: clamp(2rem, 4vw, 2.5rem);
+  font-weight: 800;
+  margin-bottom: var(--spacing-sm);
+  color: var(--foreground);
+}
+
+.description {
+  font-size: 1.125rem;
+  color: var(--foreground-light);
+  line-height: 1.6;
+}
+
+.count {
+  font-size: 0.875rem;
+  color: var(--foreground-light);
+  margin-top: var(--spacing-xs);
+}
+
+.empty {
+  text-align: center;
+  color: var(--foreground-light);
+  padding: var(--spacing-xl);
+}
+
+.grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
+  gap: var(--spacing-md);
+}

package/dist/views/CategoryListView/index.utils.d.ts

@@ -0,0 +1,5 @@
+import { type WPCategory } from "wpjsapi-lib";
+import { type Locale } from "../../utils";
+export declare const getPaginatorBase: (category: WPCategory, baseUrl?: string) => string;
+export declare const getCountLabel: (category: WPCategory, locale?: Locale) => string | null;
+export declare const getEmptyLabel: (locale?: Locale) => string;

package/dist/views/CategoryListView/index.utils.js

@@ -0,0 +1,14 @@
+import { getTranslator } from "../../utils";
+export const getPaginatorBase = (category, baseUrl) => baseUrl ?? `/${category.slug}`;
+export const getCountLabel = (category, locale) => {
+    const t = getTranslator(locale);
+    const countValue = typeof category.count === "number" && !Number.isNaN(category.count)
+        ? category.count
+        : null;
+    if (countValue === null)
+        return null;
+    return countValue === 1
+        ? t("category.countOne", { count: countValue })
+        : t("category.countMany", { count: countValue });
+};
+export const getEmptyLabel = (locale) => getTranslator(locale)("category.empty");

package/dist/views/CategoryPaginationView/index.d.ts

@@ -0,0 +1,13 @@
+import { type WPCategory, type WPPost } from "wpjsapi-lib";
+import { type Locale } from "../../utils";
+type CategoryPaginationViewProps = {
+    category: WPCategory;
+    posts: WPPost[];
+    currentPage: number;
+    totalPages: number;
+    baseUrl?: string;
+    locale?: Locale;
+    dateLocale?: string;
+};
+export declare function CategoryPaginationView({ category, posts, currentPage, totalPages, baseUrl, locale, dateLocale, }: CategoryPaginationViewProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/views/CategoryPaginationView/index.js

@@ -0,0 +1,18 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import Paginator from "../../components/Paginator";
+import PostCard from "../../components/PostCard";
+import styles from "./index.module.css";
+import { getEmptyLabel, getPageLabel, getPaginatorBase } from "./index.utils";
+import { Breadcrumbs } from "../../components";
+import { getTranslator } from "../../utils";
+export function CategoryPaginationView({ category, posts, currentPage, totalPages, baseUrl, locale, dateLocale = "en-US", }) {
+    const paginatorBase = getPaginatorBase(category, baseUrl);
+    const pageLabel = getPageLabel(locale, currentPage);
+    const emptyLabel = getEmptyLabel(locale);
+    const t = getTranslator(locale);
+    return (_jsxs("div", { className: `container ${styles.container}`, children: [_jsxs("header", { className: styles.header, children: [_jsx(Breadcrumbs, { items: [
+                            { label: "Home", href: paginatorBase || "/" },
+                            { label: category.name },
+                            { label: pageLabel },
+                        ] }), _jsx("h1", { className: styles.title, children: category.name }), category.description && (_jsx("p", { className: styles.description, dangerouslySetInnerHTML: { __html: category.description } })), _jsx("p", { className: styles.pageLabel, children: pageLabel })] }), posts.length === 0 ? (_jsx("p", { className: styles.empty, children: emptyLabel })) : (_jsxs("section", { "aria-label": t("category.pageLabel", { page: currentPage }), className: styles.gridSection, children: [_jsx("div", { className: styles.grid, children: posts.map((post) => (_jsx(PostCard, { post: post, categorySlug: category.slug, locale: locale, dateLocale: dateLocale }, post.id))) }), _jsx(Paginator, { currentPage: currentPage, totalPages: totalPages, baseUrl: paginatorBase, locale: locale })] }))] }));
+}

package/dist/views/CategoryPaginationView/index.module.css

@@ -0,0 +1,39 @@
+.container {
+  padding-top: var(--spacing-xl);
+  padding-bottom: var(--spacing-xl);
+}
+
+.header {
+  margin-bottom: var(--spacing-xl);
+}
+
+.title {
+  font-size: clamp(2rem, 4vw, 2.5rem);
+  font-weight: 800;
+  margin-bottom: var(--spacing-sm);
+  color: var(--foreground);
+}
+
+.description {
+  font-size: 1.125rem;
+  color: var(--foreground-light);
+  line-height: 1.6;
+}
+
+.pageLabel {
+  font-size: 0.875rem;
+  color: var(--foreground-light);
+  margin-top: var(--spacing-xs);
+}
+
+.empty {
+  text-align: center;
+  color: var(--foreground-light);
+  padding: var(--spacing-xl);
+}
+
+.grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
+  gap: var(--spacing-md);
+}

package/dist/views/CategoryPaginationView/index.utils.d.ts

@@ -0,0 +1,5 @@
+import { type WPCategory } from "wpjsapi-lib";
+import { type Locale } from "../../utils";
+export declare const getPaginatorBase: (category: WPCategory, baseUrl?: string) => string;
+export declare const getPageLabel: (locale: Locale | undefined, page: number) => string;
+export declare const getEmptyLabel: (locale?: Locale) => string;

package/dist/views/CategoryPaginationView/index.utils.js

@@ -0,0 +1,4 @@
+import { getTranslator } from "../../utils";
+export const getPaginatorBase = (category, baseUrl) => baseUrl ?? `/${category.slug}`;
+export const getPageLabel = (locale, page) => getTranslator(locale)("category.pageLabel", { page });
+export const getEmptyLabel = (locale) => getTranslator(locale)("category.emptyPage");

package/dist/views/HomePaginationView/index.d.ts

@@ -0,0 +1,13 @@
+import { type WPPost } from "wpjsapi-lib";
+import { type Locale } from "../../utils";
+type HomePaginationViewProps = {
+    posts: WPPost[];
+    currentPage: number;
+    totalPages: number;
+    error?: string | null;
+    baseUrl?: string;
+    locale?: Locale;
+    dateLocale?: string;
+};
+export declare function HomePaginationView({ posts, currentPage, totalPages, error, baseUrl, locale, dateLocale, }: HomePaginationViewProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/views/HomePaginationView/index.js

@@ -0,0 +1,9 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import Paginator from "../../components/Paginator";
+import PostCard from "../../components/PostCard";
+import styles from "./index.module.css";
+import { buildHomePaginationCopy } from "./index.utils";
+export function HomePaginationView({ posts, currentPage, totalPages, error, baseUrl = "", locale, dateLocale = "en-US", }) {
+    const copy = buildHomePaginationCopy(locale, currentPage, error);
+    return (_jsxs("div", { className: `container ${styles.container}`, children: [_jsxs("header", { className: styles.header, children: [_jsx("h1", { className: styles.title, children: copy.title }), _jsx("p", { className: styles.subtitle, children: copy.subtitle })] }), error ? (_jsx("div", { className: `card ${styles.errorCard}`, children: copy.errorText && _jsx("p", { children: copy.errorText }) })) : posts.length === 0 ? (_jsx("p", { className: styles.empty, children: copy.empty })) : (_jsxs("section", { "aria-label": copy.title, className: styles.gridSection, role: "region", children: [_jsx("div", { className: styles.grid, children: posts.map((post) => (_jsx(PostCard, { post: post, locale: locale, dateLocale: dateLocale }, post.id))) }), _jsx(Paginator, { currentPage: currentPage, totalPages: totalPages, baseUrl: baseUrl, locale: locale })] }))] }));
+}

package/dist/views/HomePaginationView/index.module.css

@@ -0,0 +1,38 @@
+.container {
+  padding-top: var(--spacing-xl);
+  padding-bottom: var(--spacing-xl);
+}
+
+.header {
+  margin-bottom: var(--spacing-xl);
+}
+
+.title {
+  font-size: clamp(2rem, 4vw, 2.5rem);
+  font-weight: 800;
+  color: var(--foreground);
+}
+
+.subtitle {
+  font-size: 1.125rem;
+  color: var(--foreground-light);
+  margin-top: var(--spacing-sm);
+}
+
+.errorCard {
+  padding: var(--spacing-lg);
+  color: #ef4444;
+  text-align: center;
+}
+
+.empty {
+  text-align: center;
+  color: var(--foreground-light);
+  padding: var(--spacing-xl);
+}
+
+.grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
+  gap: var(--spacing-md);
+}

package/dist/views/HomePaginationView/index.utils.d.ts

@@ -0,0 +1,7 @@
+import { type Locale } from "../../utils";
+export declare const buildHomePaginationCopy: (locale: Locale | undefined, page: number, error?: string | null) => {
+    title: string;
+    subtitle: string;
+    empty: string;
+    errorText: string;
+};

package/dist/views/HomePaginationView/index.utils.js

@@ -0,0 +1,10 @@
+import { getTranslator } from "../../utils";
+export const buildHomePaginationCopy = (locale, page, error) => {
+    const t = getTranslator(locale);
+    return {
+        title: t("home.title"),
+        subtitle: t("home.pageLabel", { page }),
+        empty: t("home.empty"),
+        errorText: error ? t("home.loadError", { error }) : null,
+    };
+};

package/dist/views/HomeView/index.d.ts

@@ -0,0 +1,13 @@
+import { type WPPost } from "wpjsapi-lib";
+import { type Locale } from "../../utils";
+type HomeViewProps = {
+    featuredPost?: WPPost;
+    regularPosts: WPPost[];
+    error?: string | null;
+    totalPages: number;
+    baseUrl?: string;
+    locale?: Locale;
+    dateLocale?: string;
+};
+export declare function HomeView({ featuredPost, regularPosts, error, totalPages, baseUrl, locale, dateLocale, }: HomeViewProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/views/HomeView/index.js

@@ -0,0 +1,21 @@
+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 Paginator from "../../components/Paginator";
+import PostCard from "../../components/PostCard";
+import styles from "./index.module.css";
+import { buildFeaturedViewModel, getHomeCopy } from "./index.utils";
+export function HomeView({ featuredPost, regularPosts, error, totalPages, baseUrl = "", locale, dateLocale = "en-US", }) {
+    const copy = getHomeCopy(locale);
+    const featuredModel = featuredPost
+        ? buildFeaturedViewModel(featuredPost, locale, dateLocale)
+        : null;
+    return (_jsx("div", { className: `container ${styles.container}`, children: error ? (_jsxs("div", { className: styles.errorBox, children: [_jsxs("p", { children: [copy.errorTitle, ": ", error] }), _jsx("p", { className: styles.errorHint, children: copy.errorHint })] })) : !featuredModel && regularPosts.length === 0 ? (_jsx("p", { className: styles.empty, children: copy.empty })) : (_jsxs(_Fragment, { children: [featuredModel && (_jsxs("article", { className: `card ${styles.featured} ${featuredModel.image
+                        ? styles.featuredWithImage
+                        : styles.featuredNoImage}`, children: [featuredModel.image && (_jsx(Link, { href: featuredModel.postUrl, className: styles.featuredImageLink, children: _jsx(Image, { src: featuredModel.image.src, alt: featuredModel.image.alt, fill: true, className: styles.featuredImage, priority: true, sizes: "(max-width: 768px) 100vw, 50vw" }) })), _jsxs("div", { className: styles.featuredBody, children: [featuredModel.badgeLabel &&
+                                    (featuredModel.badgeUrl ? (_jsx(Link, { href: featuredModel.badgeUrl, className: `${styles.featuredBadge} badge`, children: featuredModel.badgeLabel })) : (_jsx("span", { className: `${styles.featuredBadge} badge`, children: featuredModel.badgeLabel }))), _jsx(Link, { href: featuredModel.postUrl, children: _jsx("h2", { dangerouslySetInnerHTML: {
+                                            __html: featuredModel.titleHtml,
+                                        }, className: styles.featuredTitle }) }), _jsx("div", { dangerouslySetInnerHTML: {
+                                        __html: featuredModel.excerptHtml,
+                                    }, className: `text-muted ${styles.featuredExcerpt}` }), _jsx("time", { dateTime: featuredModel.dateTime, className: `text-muted ${styles.featuredDate}`, children: featuredModel.dateLabel })] })] })), _jsx("section", { className: styles.postsGrid, "aria-label": copy.title, role: "region", children: regularPosts.map((post) => (_jsx(PostCard, { post: post, locale: locale }, post.id))) }), _jsx(Paginator, { currentPage: 1, totalPages: totalPages, baseUrl: baseUrl, locale: locale })] })) }));
+}