@hkdigital/lib-core 0.5.92 → 0.5.94

package/dist/meta/components/PWA.svelte.d.ts

@@ -0,0 +1,103 @@
+export default PWA;
+type PWA = {
+    $on?(type: string, callback: (e: any) => void): () => void;
+    $set?(props: Partial<$$ComponentProps>): void;
+};
+declare const PWA: import("svelte").Component<{
+    config: import("../config.typedef.js").MetaConfig;
+}, {}, "">;
+type $$ComponentProps = {
+    config: {
+        /**
+         * - Full app name
+         */
+        name: string;
+        /**
+         * - Short app name (max 12 characters)
+         */
+        shortName: string;
+        /**
+         * - App description for search engines
+         *
+         * Language and locale
+         */
+        description: string;
+        /**
+         *   Language configurations
+         */
+        languages: Record<string, {
+            lang: string;
+            locale: string;
+        }>;
+        /**
+         * - Default language code
+         */
+        defaultLanguage: string;
+        /**
+         * - Default locale
+         *
+         * PWA theme and colors
+         */
+        defaultLocale: string;
+        /**
+         * - Theme color
+         */
+        backgroundAndThemeColor: string;
+        /**
+         * - Theme color for browser UI
+         */
+        themeColor: string;
+        /**
+         * - Background color
+         */
+        backgroundColor: string;
+        /**
+         * - iOS status bar style
+         */
+        statusBarStyle: string;
+        /**
+         * - Screen orientation
+         */
+        orientation: string;
+        /**
+         * - Disable pinch-to-zoom
+         *
+         * SEO images
+         */
+        disablePageZoom: boolean;
+        /**
+         * - Landscape SEO image URL (1200×630)
+         */
+        SeoImageLandscape?: string | undefined;
+        /**
+         * - Square SEO image URL (1200×1200)
+         *
+         * Favicon images (processed by imagetools)
+         */
+        SeoImageSquare?: string | undefined;
+        /**
+         *   Processed favicon images
+         */
+        faviconImages: Array<{
+            src: string;
+            width: number;
+        }>;
+        /**
+         *   Processed apple-touch-icon images
+         *
+         * Site configuration
+         */
+        appleTouchIcons: Array<{
+            src: string;
+            width: number;
+        }>;
+        /**
+         *   Routes for sitemap.xml
+         */
+        siteRoutes: import("../typedef.js").SitemapRoute[];
+        /**
+         *   Robots.txt configuration
+         */
+        robotsConfig: import("../typedef.js").RobotsConfig;
+    };
+};

package/dist/meta/components/SEO.svelte

@@ -0,0 +1,146 @@
+<script>
+  /**
+   * SEO component
+   *
+   * Generates SEO meta tags, Open Graph tags, and hreflang links.
+   *
+   * @typedef {import('../typedef.js').MetaConfig} MetaConfig
+   */
+
+  /**
+   * SEO component props
+   *
+   * @typedef {Object} SEOProps
+   * @property {MetaConfig} config - Configuration object
+   * @property {string} [title] - Page title (defaults to config name)
+   * @property {string} [description]
+   *   Page description (defaults to config description)
+   * @property {string} [url] - Canonical URL for this page
+   * @property {string} [image]
+   *   Social media preview image URL (defaults to landscape SEO image)
+   * @property {string} [imageAlt] - Alt text for social media image
+   * @property {string} [type] - Open Graph type (default: 'website')
+   * @property {string} [locale]
+   *   Content locale (auto-detected from URL or defaults to config)
+   * @property {string} [siteName]
+   *   Site name for Open Graph (defaults to config name)
+   * @property {Record<string, string>} [alternateUrls]
+   *   Alternate language URLs for hreflang tags
+   * @property {string} [robots]
+   *   Robots meta directives (e.g., 'noindex, nofollow')
+   * @property {boolean} [noAiTraining]
+   *   Prevent AI training on this page content
+   */
+
+  /** @type {SEOProps} */
+  let {
+    config,
+    title,
+    description,
+    url = undefined,
+    image,
+    imageAlt,
+    type = 'website',
+    locale = undefined,
+    siteName,
+    alternateUrls = undefined,
+    robots = undefined,
+    noAiTraining = false
+  } = $props();
+
+  // Extract config values
+  const {
+    name: defaultTitle,
+    description: defaultDescription,
+    SeoImageLandscape,
+    SeoImageSquare,
+    defaultLocale,
+    languages
+  } = config;
+
+  // Use the landscape image as default (best for most platforms)
+  const defaultSeoImage = SeoImageLandscape || undefined;
+
+  // Apply defaults from config
+  title = title ?? defaultTitle;
+  description = description ?? defaultDescription;
+  image = image ?? defaultSeoImage;
+  imageAlt = imageAlt ?? title;
+  siteName = siteName ?? defaultTitle;
+
+  // Use locale from prop or fall back to config default
+  const finalLocale = locale || defaultLocale;
+</script>
+
+<svelte:head>
+  <!-- Page title (overrides %title% from app.html) -->
+  <title>{title}</title>
+
+  <!-- Basic SEO -->
+  <meta name="description" content={description}>
+
+  <!-- Robots directives -->
+  {#if robots}
+    <meta name="robots" content={robots}>
+  {/if}
+
+  <!-- AI training and reading restrictions -->
+  {#if noAiTraining}
+    <!-- Google AI -->
+    <meta name="google-extended" content="noindex, nofollow">
+    <!-- OpenAI (ChatGPT) -->
+    <meta name="OAI-SearchBot" content="noindex, nofollow">
+    <!-- Common Crawl -->
+    <meta name="CCBot" content="noindex, nofollow">
+    <!-- Anthropic Claude -->
+    <meta name="anthropic-ai" content="noindex, nofollow">
+    <!-- General AI crawlers -->
+    <meta name="robots" content="noai, noimageai">
+  {/if}
+
+  <!-- Open Graph / Facebook / LinkedIn / Discord -->
+  <meta property="og:type" content={type}>
+  <meta property="og:title" content={title}>
+  <meta property="og:description" content={description}>
+  <meta property="og:site_name" content={siteName}>
+  <meta property="og:locale" content={finalLocale}>
+
+  {#if url}
+    <meta property="og:url" content={url}>
+    <link rel="canonical" href={url}>
+  {/if}
+
+  {#if image}
+    <meta property="og:image" content={image}>
+    <meta property="og:image:alt" content={imageAlt}>
+    <!-- Image metadata (dimensions from preprocessor) -->
+    {#if image === SeoImageLandscape}
+      <meta property="og:image:width" content="1200">
+      <meta property="og:image:height" content="630">
+      <meta property="og:image:type" content="image/jpeg">
+    {/if}
+  {/if}
+
+  <!-- Additional square image for platforms that prefer it -->
+  {#if SeoImageSquare && SeoImageSquare !== image}
+    <meta property="og:image" content={SeoImageSquare}>
+    <meta property="og:image:width" content="1200">
+    <meta property="og:image:height" content="1200">
+    <meta property="og:image:type" content="image/jpeg">
+  {/if}
+
+  <!-- Alternate locales for Open Graph -->
+  {#each Object.entries(languages) as [code, config]}
+    {#if config.locale !== finalLocale}
+      <meta property="og:locale:alternate" content={config.locale}>
+    {/if}
+  {/each}
+
+  <!-- Alternate language URLs (hreflang) -->
+  {#if alternateUrls}
+    {#each Object.entries(alternateUrls) as [lang, href]}
+      <link rel="alternate" hreflang={lang} href={href}>
+    {/each}
+  {/if}
+
+</svelte:head>

package/dist/meta/components/SEO.svelte.d.ts

@@ -0,0 +1,108 @@
+export default SEO;
+type SEO = {
+    $on?(type: string, callback: (e: any) => void): () => void;
+    $set?(props: Partial<SEOProps>): void;
+};
+declare const SEO: import("svelte").Component<{
+    /**
+     * - Configuration object
+     */
+    config: import("../config.typedef.js").MetaConfig;
+    /**
+     * - Page title (defaults to config name)
+     */
+    title?: string | undefined;
+    /**
+     * Page description (defaults to config description)
+     */
+    description?: string | undefined;
+    /**
+     * - Canonical URL for this page
+     */
+    url?: string | undefined;
+    /**
+     * Social media preview image URL (defaults to landscape SEO image)
+     */
+    image?: string | undefined;
+    /**
+     * - Alt text for social media image
+     */
+    imageAlt?: string | undefined;
+    /**
+     * - Open Graph type (default: 'website')
+     */
+    type?: string | undefined;
+    /**
+     * Content locale (auto-detected from URL or defaults to config)
+     */
+    locale?: string | undefined;
+    /**
+     * Site name for Open Graph (defaults to config name)
+     */
+    siteName?: string | undefined;
+    /**
+     * Alternate language URLs for hreflang tags
+     */
+    alternateUrls?: Record<string, string> | undefined;
+    /**
+     * Robots meta directives (e.g., 'noindex, nofollow')
+     */
+    robots?: string | undefined;
+    /**
+     * Prevent AI training on this page content
+     */
+    noAiTraining?: boolean | undefined;
+}, {}, "">;
+/**
+ * SEO component props
+ */
+type SEOProps = {
+    /**
+     * - Configuration object
+     */
+    config: import("../config.typedef.js").MetaConfig;
+    /**
+     * - Page title (defaults to config name)
+     */
+    title?: string | undefined;
+    /**
+     * Page description (defaults to config description)
+     */
+    description?: string | undefined;
+    /**
+     * - Canonical URL for this page
+     */
+    url?: string | undefined;
+    /**
+     * Social media preview image URL (defaults to landscape SEO image)
+     */
+    image?: string | undefined;
+    /**
+     * - Alt text for social media image
+     */
+    imageAlt?: string | undefined;
+    /**
+     * - Open Graph type (default: 'website')
+     */
+    type?: string | undefined;
+    /**
+     * Content locale (auto-detected from URL or defaults to config)
+     */
+    locale?: string | undefined;
+    /**
+     * Site name for Open Graph (defaults to config name)
+     */
+    siteName?: string | undefined;
+    /**
+     * Alternate language URLs for hreflang tags
+     */
+    alternateUrls?: Record<string, string> | undefined;
+    /**
+     * Robots meta directives (e.g., 'noindex, nofollow')
+     */
+    robots?: string | undefined;
+    /**
+     * Prevent AI training on this page content
+     */
+    noAiTraining?: boolean | undefined;
+};

package/dist/meta/components.d.ts

@@ -0,0 +1,3 @@
+export { default as Favicons } from "./components/Favicons.svelte";
+export { default as PWA } from "./components/PWA.svelte";
+export { default as SEO } from "./components/SEO.svelte";

package/dist/meta/components.js

@@ -0,0 +1,3 @@
+export { default as Favicons } from './components/Favicons.svelte';
+export { default as PWA } from './components/PWA.svelte';
+export { default as SEO } from './components/SEO.svelte';

package/dist/meta/config.typedef.d.ts

@@ -0,0 +1,98 @@
+declare const _default: {};
+export default _default;
+/**
+ * App identity
+ */
+export type MetaConfig = {
+    /**
+     * - Full app name
+     */
+    name: string;
+    /**
+     * - Short app name (max 12 characters)
+     */
+    shortName: string;
+    /**
+     * - App description for search engines
+     *
+     * Language and locale
+     */
+    description: string;
+    /**
+     *   Language configurations
+     */
+    languages: Record<string, {
+        lang: string;
+        locale: string;
+    }>;
+    /**
+     * - Default language code
+     */
+    defaultLanguage: string;
+    /**
+     * - Default locale
+     *
+     * PWA theme and colors
+     */
+    defaultLocale: string;
+    /**
+     * - Theme color
+     */
+    backgroundAndThemeColor: string;
+    /**
+     * - Theme color for browser UI
+     */
+    themeColor: string;
+    /**
+     * - Background color
+     */
+    backgroundColor: string;
+    /**
+     * - iOS status bar style
+     */
+    statusBarStyle: string;
+    /**
+     * - Screen orientation
+     */
+    orientation: string;
+    /**
+     * - Disable pinch-to-zoom
+     *
+     * SEO images
+     */
+    disablePageZoom: boolean;
+    /**
+     * - Landscape SEO image URL (1200×630)
+     */
+    SeoImageLandscape?: string | undefined;
+    /**
+     * - Square SEO image URL (1200×1200)
+     *
+     * Favicon images (processed by imagetools)
+     */
+    SeoImageSquare?: string | undefined;
+    /**
+     *   Processed favicon images
+     */
+    faviconImages: Array<{
+        src: string;
+        width: number;
+    }>;
+    /**
+     *   Processed apple-touch-icon images
+     *
+     * Site configuration
+     */
+    appleTouchIcons: Array<{
+        src: string;
+        width: number;
+    }>;
+    /**
+     *   Routes for sitemap.xml
+     */
+    siteRoutes: import("./utils/sitemap/typedef.js").SitemapRoute[];
+    /**
+     *   Robots.txt configuration
+     */
+    robotsConfig: import("./utils/robots/typedef.js").RobotsConfig;
+};

package/dist/meta/config.typedef.js

@@ -0,0 +1,44 @@
+/**
+ * Meta configuration type definitions
+ */
+
+/**
+ * @typedef {Object} MetaConfig
+ *
+ * App identity
+ * @property {string} name - Full app name
+ * @property {string} shortName - Short app name (max 12 characters)
+ * @property {string} description - App description for search engines
+ *
+ * Language and locale
+ * @property {Record<string, {lang: string, locale: string}>} languages
+ *   Language configurations
+ * @property {string} defaultLanguage - Default language code
+ * @property {string} defaultLocale - Default locale
+ *
+ * PWA theme and colors
+ * @property {string} backgroundAndThemeColor - Theme color
+ * @property {string} themeColor - Theme color for browser UI
+ * @property {string} backgroundColor - Background color
+ * @property {string} statusBarStyle - iOS status bar style
+ * @property {string} orientation - Screen orientation
+ * @property {boolean} disablePageZoom - Disable pinch-to-zoom
+ *
+ * SEO images
+ * @property {string} [SeoImageLandscape] - Landscape SEO image URL (1200×630)
+ * @property {string} [SeoImageSquare] - Square SEO image URL (1200×1200)
+ *
+ * Favicon images (processed by imagetools)
+ * @property {Array<{src: string, width: number}>} faviconImages
+ *   Processed favicon images
+ * @property {Array<{src: string, width: number}>} appleTouchIcons
+ *   Processed apple-touch-icon images
+ *
+ * Site configuration
+ * @property {import('./utils/sitemap/typedef.js').SitemapRoute[]} siteRoutes
+ *   Routes for sitemap.xml
+ * @property {import('./utils/robots/typedef.js').RobotsConfig} robotsConfig
+ *   Robots.txt configuration
+ */
+
+export default {};

package/dist/meta/typedef.d.ts

@@ -0,0 +1,3 @@
+export * from "./config.typedef.js";
+export * from "./utils/robots/typedef.js";
+export * from "./utils/sitemap/typedef.js";

package/dist/meta/typedef.js

@@ -0,0 +1,14 @@
+/**
+ * Type definitions for meta utilities
+ *
+ * Re-exports all typedefs from utils subfolder for convenient importing
+ */
+
+// Re-export config typedefs
+export * from './config.typedef.js';
+
+// Re-export robots typedefs
+export * from './utils/robots/typedef.js';
+
+// Re-export sitemap typedefs
+export * from './utils/sitemap/typedef.js';

package/dist/meta/utils/lang.d.ts

@@ -0,0 +1,29 @@
+/**
+ * Create language utilities configured with your app config
+ *
+ * @param {Object} config - Configuration object
+ * @param {Record<string, {lang: string, locale: string}>} config.languages
+ *   Language configurations
+ * @param {string} config.defaultLanguage - Default language code
+ * @param {string} config.name - App name (for %title% injection)
+ * @param {string} config.description - App description
+ *
+ * @returns {{
+ *   getLangFromPath: Function,
+ *   injectLang: Function,
+ *   handleLang: Function
+ * }}
+ */
+export function createLangUtils(config: {
+    languages: Record<string, {
+        lang: string;
+        locale: string;
+    }>;
+    defaultLanguage: string;
+    name: string;
+    description: string;
+}): {
+    getLangFromPath: Function;
+    injectLang: Function;
+    handleLang: Function;
+};

package/dist/meta/utils/lang.js

@@ -0,0 +1,84 @@
+/**
+ * Create language utilities configured with your app config
+ *
+ * @param {Object} config - Configuration object
+ * @param {Record<string, {lang: string, locale: string}>} config.languages
+ *   Language configurations
+ * @param {string} config.defaultLanguage - Default language code
+ * @param {string} config.name - App name (for %title% injection)
+ * @param {string} config.description - App description
+ *
+ * @returns {{
+ *   getLangFromPath: Function,
+ *   injectLang: Function,
+ *   handleLang: Function
+ * }}
+ */
+export function createLangUtils(config) {
+  const { languages, defaultLanguage, name, description } = config;
+
+  /**
+   * Extract language code from URL pathname
+   *
+   * @param {string} pathname - URL pathname (e.g., '/en/shop')
+   *
+   * @returns {{
+   *   langCode: string,
+   *   lang: string,
+   *   locale: string
+   * }}
+   */
+  function getLangFromPath(pathname) {
+    const match = pathname.match(/^\/([a-z]{2}(?:-[a-z]{2})?)\//i);
+    const langCode = match ? match[1].toLowerCase() : defaultLanguage;
+
+    const langConfig = languages[langCode] || languages[defaultLanguage];
+
+    return {
+      langCode,
+      lang: langConfig.lang,
+      locale: langConfig.locale
+    };
+  }
+
+  /**
+   * Transform HTML to inject language, title, and description
+   *
+   * @param {string} html - HTML string with placeholders
+   * @param {string} lang - Language code (e.g., 'en-GB')
+   *
+   * @returns {string} HTML with values injected
+   */
+  function injectLang(html, lang) {
+    return html
+      .replace('%lang%', lang)
+      .replace('%title%', name)
+      .replace('%description%', description);
+  }
+
+  /**
+   * SvelteKit hook handler for language detection
+   *
+   * @param {object} event - SvelteKit event object
+   * @param {Function} resolve - SvelteKit resolve function
+   *
+   * @returns {Promise<Response>}
+   */
+  async function handleLang(event, resolve) {
+    const { langCode, lang, locale } = getLangFromPath(event.url.pathname);
+
+    event.locals.langCode = langCode;
+    event.locals.lang = lang;
+    event.locals.locale = locale;
+
+    return resolve(event, {
+      transformPageChunk: ({ html }) => injectLang(html, lang)
+    });
+  }
+
+  return {
+    getLangFromPath,
+    injectLang,
+    handleLang
+  };
+}

package/dist/meta/utils/robots.d.ts

@@ -0,0 +1 @@
+export { generateRobotsTxt, isHostAllowed } from "./robots/robots.js";

package/dist/meta/utils/robots.js

@@ -0,0 +1 @@
+export { generateRobotsTxt, isHostAllowed } from './robots/robots.js';

package/dist/meta/utils/sitemap.d.ts

@@ -0,0 +1 @@
+export { generateSitemap } from "./sitemap/sitemap.js";

package/dist/meta/utils/sitemap.js

@@ -0,0 +1 @@
+export { generateSitemap } from './sitemap/sitemap.js';

package/dist/meta/utils.d.ts

@@ -0,0 +1,3 @@
+export { createLangUtils } from "./utils/lang.js";
+export { generateSitemap } from "./utils/sitemap.js";
+export { generateRobotsTxt, isHostAllowed } from "./utils/robots.js";

package/dist/meta/utils.js

@@ -0,0 +1,11 @@
+/**
+ * Meta utilities for SEO, PWA, and favicons
+ *
+ * @module @hkdigital/lib-core/meta
+ */
+
+// Language utilities
+export { createLangUtils } from './utils/lang.js';
+
+export { generateRobotsTxt, isHostAllowed } from './utils/robots.js';
+export { generateSitemap } from './utils/sitemap.js';