npm - meno-core - Versions diffs - 1.0.13 → 1.0.15 - Mend

meno-core 1.0.13 → 1.0.15

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (7) hide show

package/build-static.ts +2 -2
package/lib/server/ssr/htmlGenerator.ts +69 -35
package/lib/server/ssr/metaTagGenerator.ts +32 -1
package/lib/server/ssr/ssrRenderer.ts +12 -2
package/lib/server/ssrRenderer.test.ts +143 -2
package/lib/shared/validation/propValidator.ts +7 -1
package/package.json +1 -1

package/build-static.ts CHANGED Viewed

@@ -361,7 +361,7 @@ async function buildCMSTemplates(
           let finalHtml = result.html;
           if (result.javascript) {
             const scriptPath = await getScriptPath(result.javascript, distDir);
-            finalHtml = finalHtml.replace('</body>', `  <script src="${scriptPath}"></script>\n</body>`);
+            finalHtml = finalHtml.replace('</body>', `  <script src="${scriptPath}" defer></script>\n</body>`);
           }
           const outputPath = locale === i18nConfig.defaultLocale
@@ -537,7 +537,7 @@ async function buildStaticPages(): Promise<void> {
         if (result.javascript) {
           const scriptPath = await getScriptPath(result.javascript, distDir);
           // Insert script reference before </body>
-          finalHtml = finalHtml.replace('</body>', `  <script src="${scriptPath}"></script>\n</body>`);
+          finalHtml = finalHtml.replace('</body>', `  <script src="${scriptPath}" defer></script>\n</body>`);
         }
         // Determine locale-specific output path with translated slug

package/lib/server/ssr/htmlGenerator.ts CHANGED Viewed

@@ -18,6 +18,30 @@ import { escapeHtml } from './attributeBuilder';
 import { renderPageSSR } from './ssrRenderer';
 import type { CMSContext } from './cmsSSRProcessor';
+/**
+ * Minify CSS code using regex-based minification
+ * Removes comments, unnecessary whitespace, and optimizes values
+ */
+function minifyCSS(code: string): string {
+  if (!code.trim()) return code;
+  return code
+    // Remove CSS comments
+    .replace(/\/\*[\s\S]*?\*\//g, '')
+    // Remove whitespace around special characters
+    .replace(/\s*([{};:,>~+])\s*/g, '$1')
+    // Collapse multiple spaces/newlines into single space
+    .replace(/\s+/g, ' ')
+    // Remove space after opening brace
+    .replace(/\{\s+/g, '{')
+    // Remove space before closing brace
+    .replace(/\s+\}/g, '}')
+    // Remove trailing semicolons before closing braces
+    .replace(/;}/g, '}')
+    // Remove leading/trailing whitespace
+    .trim();
+}
 /**
  * Result of SSR HTML generation with separate JS for CSP compliance
  */
@@ -190,7 +214,7 @@ export async function generateSSRHTML(
   const themeColorVariablesCSS = generateThemeColorVariablesCSS(themeConfig);
   // Include component CSS (no longer generating inline style classes)
-  const allCSS = rendered.componentCSS || '';
+  const componentCSS = rendered.componentCSS || '';
   // Extract and generate utility CSS from rendered HTML
   const usedUtilityClasses = extractUtilityClassesFromHTML(rendered.html);
@@ -206,6 +230,44 @@ export async function generateSSRHTML(
   // Print warnings for any unmapped styles found during build
   printMissingStyleWarnings(false);
+  // Build base CSS (reset styles)
+  const baseCSS = `* {
+  margin: 0;
+  padding: 0;
+  box-sizing: border-box;
+}
+body {
+  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', sans-serif;
+}
+button {
+  background: none;
+  border: none;
+  padding: 0;
+  font: inherit;
+  cursor: pointer;
+  outline: inherit;
+}
+img {
+  width: 100%;
+  height: 100%;
+}
+.olink {
+  text-decoration: none;
+}`;
+  // Combine all CSS
+  const combinedCSS = [
+    fontCSS,
+    themeColorVariablesCSS,
+    baseCSS,
+    componentCSS,
+    utilityCSS,
+    interactiveCSS
+  ].filter(Boolean).join('\n');
+  // Minify CSS in production mode
+  const finalCSS = useBundled ? minifyCSS(combinedCSS) : combinedCSS;
   // Load prefetch config for client-side prefetching
   const prefetchConfig = await loadPrefetchConfig();
   // Only include non-default values to minimize payload
@@ -240,46 +302,18 @@ export async function generateSSRHTML(
     ? `<link rel="preload" href="${extScriptPath}" as="script">`
     : '';
+  // In production, output minified CSS on single line; in dev, preserve formatting
+  const styleContent = useBundled
+    ? finalCSS
+    : `\n    ${combinedCSS.split('\n').join('\n    ')}\n  `;
   const htmlDocument = `<!DOCTYPE html>
 <html lang="${rendered.locale}" theme="${themeConfig.default}">
 <head>
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   ${iconTags ? iconTags + '\n  ' : ''}${scriptPreloadTag ? scriptPreloadTag + '\n  ' : ''}${fontPreloadTags ? fontPreloadTags + '\n  ' : ''}${rendered.meta}
-  ${configInlineScript}${cmsInlineScript}<style>
-    ${fontCSS ? fontCSS + '\n    ' : ''}${themeColorVariablesCSS ? themeColorVariablesCSS + '\n    ' : ''}* {
-      margin: 0;
-      padding: 0;
-      box-sizing: border-box;
-    }
-    body {
-      font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', sans-serif;
-    }
-    button {
-      background: none;
-      border: none;
-      padding: 0;
-      font: inherit;
-      cursor: pointer;
-      outline: inherit;
-    }
-    img {
-      width: 100%;
-      height: 100%;
-    }
-    .olink {
-      text-decoration: none;
-    }
-    ${allCSS}
-    ${utilityCSS}
-  </style>${interactiveCSS ? `
-  <style id="interactive-styles">
-    ${interactiveCSS}
-  </style>` : ''}
+  ${configInlineScript}${cmsInlineScript}<style>${styleContent}</style>
 </head>
 <body>
   <div id="root">

package/lib/server/ssr/metaTagGenerator.ts CHANGED Viewed

@@ -7,6 +7,7 @@ import type { JSONPage } from '../../shared/types';
 import type { I18nConfig } from '../../shared/types/components';
 import { DEFAULT_I18N_CONFIG, resolveI18nValue } from '../../shared/i18n';
 import { escapeHtml } from './attributeBuilder';
+import { buildSlugIndex, getLocaleLinks, type SlugMap } from '../../shared/slugTranslator';
 /**
  * Page meta information for SEO
@@ -38,15 +39,26 @@ export function extractPageMeta(pageData: JSONPage): PageMeta {
   return meta;
 }
+/**
+ * Options for hreflang tag generation
+ */
+export interface HreflangOptions {
+  slugMappings?: SlugMap[];
+  pagePath?: string;
+  baseUrl?: string;
+}
 /**
  * Generate HTML meta tags string
  * Resolves i18n values using the provided locale and config
+ * Optionally generates hreflang tags for multilingual pages
  */
 export function generateMetaTags(
   meta: PageMeta,
   url: string = '',
   locale: string = 'en',
-  config: I18nConfig = DEFAULT_I18N_CONFIG
+  config: I18nConfig = DEFAULT_I18N_CONFIG,
+  hreflangOptions?: HreflangOptions
 ): string {
   const tags: string[] = [];
@@ -102,5 +114,24 @@ export function generateMetaTags(
     tags.push(`<link rel="canonical" href="${escapeHtml(url)}" />`);
   }
+  // Hreflang tags for multilingual pages
+  if (hreflangOptions?.slugMappings && hreflangOptions.slugMappings.length > 0 && config.locales.length > 1) {
+    const { slugMappings, pagePath = '/', baseUrl = '' } = hreflangOptions;
+    const slugIndex = buildSlugIndex(slugMappings);
+    const localeLinks = getLocaleLinks(pagePath, locale, config, slugIndex);
+    for (const link of localeLinks) {
+      const hrefUrl = baseUrl ? `${baseUrl}${link.path}` : link.path;
+      tags.push(`<link rel="alternate" hreflang="${escapeHtml(link.langTag)}" href="${escapeHtml(hrefUrl)}" />`);
+    }
+    // Add x-default pointing to default locale version
+    const defaultLink = localeLinks.find(l => l.locale === config.defaultLocale);
+    if (defaultLink) {
+      const xDefaultUrl = baseUrl ? `${baseUrl}${defaultLink.path}` : defaultLink.path;
+      tags.push(`<link rel="alternate" hreflang="x-default" href="${escapeHtml(xDefaultUrl)}" />`);
+    }
+  }
   return tags.join('\n  ');
 }

package/lib/server/ssr/ssrRenderer.ts CHANGED Viewed

@@ -461,6 +461,12 @@ async function renderNode(
   if (isObjectLinkNode(node)) {
     let href: string = typeof node.href === 'string' ? node.href : '#';
+    // Process item templates in href (for CMSList context)
+    const templateCtx = getTemplateContext(ctx);
+    if (templateCtx && hasItemTemplates(href)) {
+      href = processItemTemplate(href, templateCtx, getI18nResolver(ctx));
+    }
     // Localize internal page links to current locale
     if (href.startsWith('/') && !href.startsWith('//') && locale && i18nConfig) {
       if (slugMappings) {
@@ -1205,8 +1211,12 @@ export async function renderPageSSR(
   // Build full URL for meta tags
   const fullUrl = baseUrl ? `${baseUrl}${pagePath}` : pagePath;
-  // Generate meta tags with i18n resolution
-  const metaTags = generateMetaTags(meta, fullUrl, effectiveLocale, config);
+  // Generate meta tags with i18n resolution and hreflang tags
+  const metaTags = generateMetaTags(meta, fullUrl, effectiveLocale, config, {
+    slugMappings,
+    pagePath,
+    baseUrl,
+  });
   // Resolve title for use in HTML template
   const resolvedTitle = resolveI18nValue(meta.title, effectiveLocale, config);

package/lib/server/ssrRenderer.test.ts CHANGED Viewed

@@ -170,11 +170,95 @@ describe("SSR Renderer - generateMetaTags", () => {
   test("should handle empty meta", () => {
     const meta = {};
     const tags = generateMetaTags(meta);
     expect(tags).toBe("");
   });
+  test("should generate hreflang tags when slugMappings provided", () => {
+    const meta = { title: "About Us" };
+    const i18nConfig = {
+      defaultLocale: 'en',
+      locales: [
+        { code: 'en', name: 'English', nativeName: 'English', langTag: 'en-US' },
+        { code: 'pl', name: 'Polish', nativeName: 'Polski', langTag: 'pl-PL' },
+        { code: 'de', name: 'German', nativeName: 'Deutsch', langTag: 'de-DE' },
+      ],
+    };
+    const slugMappings = [
+      { pageId: 'about', slugs: { en: 'about', pl: 'o-nas', de: 'uber-uns' } },
+    ];
+    const tags = generateMetaTags(meta, 'https://example.com/about', 'en', i18nConfig, {
+      slugMappings,
+      pagePath: '/about',
+      baseUrl: 'https://example.com',
+    });
+    expect(tags).toContain('<link rel="alternate" hreflang="en-US" href="https://example.com/about" />');
+    expect(tags).toContain('<link rel="alternate" hreflang="pl-PL" href="https://example.com/pl/o-nas" />');
+    expect(tags).toContain('<link rel="alternate" hreflang="de-DE" href="https://example.com/de/uber-uns" />');
+    expect(tags).toContain('<link rel="alternate" hreflang="x-default" href="https://example.com/about" />');
+  });
+  test("should not generate hreflang tags for single locale", () => {
+    const meta = { title: "About Us" };
+    const i18nConfig = {
+      defaultLocale: 'en',
+      locales: [
+        { code: 'en', name: 'English', nativeName: 'English', langTag: 'en-US' },
+      ],
+    };
+    const slugMappings = [
+      { pageId: 'about', slugs: { en: 'about' } },
+    ];
+    const tags = generateMetaTags(meta, 'https://example.com/about', 'en', i18nConfig, {
+      slugMappings,
+      pagePath: '/about',
+      baseUrl: 'https://example.com',
+    });
+    expect(tags).not.toContain('hreflang');
+  });
+  test("should not generate hreflang tags without slugMappings", () => {
+    const meta = { title: "About Us" };
+    const i18nConfig = {
+      defaultLocale: 'en',
+      locales: [
+        { code: 'en', name: 'English', nativeName: 'English', langTag: 'en-US' },
+        { code: 'pl', name: 'Polish', nativeName: 'Polski', langTag: 'pl-PL' },
+      ],
+    };
+    const tags = generateMetaTags(meta, 'https://example.com/about', 'en', i18nConfig);
+    expect(tags).not.toContain('hreflang');
+  });
+  test("should escape special characters in hreflang URLs", () => {
+    const meta = { title: "Test" };
+    const i18nConfig = {
+      defaultLocale: 'en',
+      locales: [
+        { code: 'en', name: 'English', nativeName: 'English', langTag: 'en-US' },
+        { code: 'pl', name: 'Polish', nativeName: 'Polski', langTag: 'pl-PL' },
+      ],
+    };
+    const slugMappings = [
+      { pageId: 'test', slugs: { en: 'test&page', pl: 'test-strona' } },
+    ];
+    const tags = generateMetaTags(meta, 'https://example.com/test&page', 'en', i18nConfig, {
+      slugMappings,
+      pagePath: '/test&page',
+      baseUrl: 'https://example.com',
+    });
+    expect(tags).toContain('href="https://example.com/test&amp;page"');
+  });
 });
 describe("SSR Renderer - renderPageSSR", () => {
@@ -1298,6 +1382,63 @@ describe("SSR Renderer - CMSList rendering", () => {
     expect(result.html).toContain('data-cms-list="true"');
     expect(result.html).toContain('data-collection="blog-posts"');
   });
+  test("should process item templates in object-link href", async () => {
+    const pageData: JSONPage = {
+      root: {
+        type: "cms-list",
+        collection: "blog-posts",
+        children: [
+          {
+            type: "object-link",
+            href: "/blog/{{item.slug}}",
+            children: [
+              { type: "node", tag: "span", children: ["{{item.title}}"] }
+            ]
+          }
+        ]
+      } as unknown as ComponentNode
+    };
+    const mockCmsService = new CMSService();
+    mockCmsService.queryItems = async () => mockCmsItems;
+    const result = await renderPageSSR(pageData, {}, '/', '', undefined, undefined, undefined, undefined, mockCmsService);
+    // Should render object-link as <a> with processed href
+    expect(result.html).toContain('href="/blog/post-1"');
+    expect(result.html).toContain('href="/blog/post-2"');
+    expect(result.html).toContain('First Post');
+    expect(result.html).toContain('Second Post');
+  });
+  test("should process item templates in anchor tag attributes", async () => {
+    const pageData: JSONPage = {
+      root: {
+        type: "cms-list",
+        collection: "blog-posts",
+        children: [
+          {
+            type: "node",
+            tag: "a",
+            attributes: { href: "/blog/{{item.slug}}" },
+            children: ["{{item.title}}"]
+          }
+        ]
+      } as unknown as ComponentNode
+    };
+    const mockCmsService = new CMSService();
+    mockCmsService.queryItems = async () => mockCmsItems;
+    const result = await renderPageSSR(pageData, {}, '/', '', undefined, undefined, undefined, undefined, mockCmsService);
+    // Should render anchor with processed href from attributes
+    expect(result.html).toContain('href="/blog/post-1"');
+    expect(result.html).toContain('href="/blog/post-2"');
+    expect(result.html).toContain('First Post');
+    expect(result.html).toContain('Second Post');
+  });
 });
 describe("SSR Renderer - Interactive Styles", () => {

package/lib/shared/validation/propValidator.ts CHANGED Viewed

@@ -137,10 +137,16 @@ function validateSingleProp(
       break;
     case 'link':
-      // Link type expects an object with href (and optional target)
+      // Link type accepts either:
+      // 1. An object with href (and optional target): { href: "/path", target: "_blank" }
+      // 2. A plain string URL (coerced to { href: string }): "/path" or "https://..."
       if (typeof value === 'object' && value !== null && 'href' in value) {
         coercedValue = value;
         typeValid = true;
+      } else if (typeof value === 'string') {
+        // Coerce string to link object for convenience (e.g., from CMS templates)
+        coercedValue = value;
+        typeValid = true;
       } else {
         typeValid = false;
       }

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "meno-core",
-  "version": "1.0.13",
+  "version": "1.0.15",
   "type": "module",
   "bin": {
     "meno": "./bin/cli.ts"