@cobdfamily/clf-core 7.0.1

package/dist/components/theme-toggle.js

@@ -0,0 +1,130 @@
+// <cobd-theme-toggle> — vanilla custom element that cycles
+// light -> dark -> auto and calls setTheme() from the
+// runtime module. Picks up CLF tokens for its own styling.
+import { setTheme, getThemePreference, onThemeChange, } from "../theming/runtime.js";
+const ORDER = [
+    "light", "dark", "hc-light", "hc-dark", "auto",
+];
+const LABEL = {
+    "light": "Light theme",
+    "dark": "Dark theme",
+    "hc-light": "High-contrast light theme",
+    "hc-dark": "High-contrast dark theme",
+    "auto": "Follow system theme",
+};
+const ICON = {
+    "light": "M12 4V2m0 20v-2m8-8h2M2 12h2m13.66 6.66l1.41 1.41"
+        + "M4.93 4.93l1.41 1.41m11.32 0l1.41-1.41M4.93 19.07"
+        + "l1.41-1.41M12 7a5 5 0 1 0 0 10 5 5 0 0 0 0-10z",
+    "dark": "M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z",
+    "hc-light": "M12 2v20M4 12h16M2 12a10 10 0 0 1 20 0Z",
+    "hc-dark": "M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20zm0 0v20",
+    "auto": "M12 2a10 10 0 1 0 10 10A10 10 0 0 0 12 2zm0 18V4"
+        + "a8 8 0 0 1 0 16z",
+};
+const STYLE = `
+:host {
+    display: inline-block;
+    --_size: 2.5rem;
+}
+button {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    width: var(--_size);
+    height: var(--_size);
+    padding: 0;
+    border: 1px solid var(--cobd-color-medium, currentColor);
+    border-radius: var(--cobd-radius-md, 8px);
+    background: transparent;
+    color: var(--cobd-color-foreground, currentColor);
+    cursor: pointer;
+    font: inherit;
+    line-height: 0;
+    transition:
+        background-color var(--cobd-motion-duration-fast, 120ms)
+            var(--cobd-motion-easing-standard, ease),
+        color var(--cobd-motion-duration-fast, 120ms)
+            var(--cobd-motion-easing-standard, ease);
+}
+button:hover {
+    background: var(--cobd-color-light, rgba(0,0,0,0.05));
+}
+button:focus-visible {
+    outline: 2px solid var(--cobd-color-primary, currentColor);
+    outline-offset: 2px;
+}
+@media (prefers-reduced-motion: reduce) {
+    button { transition: none; }
+}
+svg {
+    width: 1.25rem;
+    height: 1.25rem;
+    fill: none;
+    stroke: currentColor;
+    stroke-width: 2;
+    stroke-linecap: round;
+    stroke-linejoin: round;
+}
+::slotted(*) {
+    width: 1.25rem;
+    height: 1.25rem;
+}
+`;
+export class CobdThemeToggle extends HTMLElement {
+    constructor() {
+        super(...arguments);
+        this.cleanup = null;
+    }
+    connectedCallback() {
+        if (!this.shadowRoot) {
+            const root = this.attachShadow({ mode: "open" });
+            const style = document.createElement("style");
+            style.textContent = STYLE;
+            this.button = document.createElement("button");
+            this.button.type = "button";
+            const svgNS = "http://www.w3.org/2000/svg";
+            const svg = document.createElementNS(svgNS, "svg");
+            svg.setAttribute("viewBox", "0 0 24 24");
+            svg.setAttribute("aria-hidden", "true");
+            this.path = document.createElementNS(svgNS, "path");
+            svg.appendChild(this.path);
+            this.slotEl = document.createElement("slot");
+            this.button.appendChild(svg);
+            this.button.appendChild(this.slotEl);
+            root.appendChild(style);
+            root.appendChild(this.button);
+            this.button.addEventListener("click", () => this.cycle());
+        }
+        this.render();
+        this.cleanup = onThemeChange(() => this.render());
+    }
+    disconnectedCallback() {
+        this.cleanup?.();
+        this.cleanup = null;
+    }
+    cycle() {
+        const current = getThemePreference();
+        const i = ORDER.indexOf(current);
+        const next = ORDER[(i + 1) % ORDER.length];
+        setTheme(next);
+    }
+    render() {
+        const pref = getThemePreference();
+        this.button.setAttribute("aria-label", LABEL[pref]);
+        this.button.title = LABEL[pref];
+        this.path.setAttribute("d", ICON[pref]);
+        // Hide built-in SVG when caller supplied a slotted icon.
+        const slottedIcon = this.querySelector(`[slot="icon-${pref}"]`);
+        const svg = this.button.querySelector("svg");
+        if (svg) {
+            svg.style.display =
+                slottedIcon ? "none" : "";
+        }
+        this.slotEl.name = `icon-${pref}`;
+    }
+}
+if (typeof customElements !== "undefined"
+    && !customElements.get("cobd-theme-toggle")) {
+    customElements.define("cobd-theme-toggle", CobdThemeToggle);
+}

package/dist/i18n/chrome.json

@@ -0,0 +1,94 @@
+{
+  "$comment": "CLF chrome i18n strings. Every label here belongs to a CLF-shipped UI surface (menu, skip links, theme toggle, text-size segment, Accessibility Settings accordion, error page, searchbar). They live in clf so the package that owns the chrome also owns its translations. clf-factory's build-i18n reads this file and emits engine-native i18n files (Hugo YAML, KC properties, WP gettext, Moodle PHP) for the consuming theme.",
+  "locales": ["en", "fr"],
+  "strings": [
+    {
+      "id": "i18n.menu",
+      "hugo": "menu",
+      "kc": "menu",
+      "moodle": "menu",
+      "en": "Menu",
+      "fr": "Menu"
+    },
+    {
+      "id": "i18n.done",
+      "hugo": "done",
+      "kc": "done",
+      "moodle": "done",
+      "en": "Done",
+      "fr": "Terminé"
+    },
+    {
+      "id": "i18n.skip_to_main",
+      "hugo": "skip_to_main",
+      "kc": "skipToMain",
+      "moodle": "skiptomain",
+      "en": "Skip to main content",
+      "fr": "Passer au contenu principal"
+    },
+    {
+      "id": "i18n.skip_to_search",
+      "hugo": "skip_to_search",
+      "kc": "skipToSearch",
+      "moodle": "skiptosearch",
+      "en": "Skip to search",
+      "fr": "Passer à la recherche"
+    },
+    {
+      "id": "i18n.primary_nav",
+      "hugo": "primary_nav",
+      "kc": "primaryNav",
+      "moodle": "primary_nav",
+      "en": "Primary",
+      "fr": "Principal"
+    },
+    {
+      "id": "i18n.search_placeholder",
+      "hugo": "search_placeholder",
+      "kc": "searchPlaceholder",
+      "moodle": "search_placeholder",
+      "en": "Search",
+      "fr": "Rechercher"
+    },
+    {
+      "id": "i18n.return_home",
+      "hugo": "return_home",
+      "kc": "returnHome",
+      "moodle": "return_home",
+      "en": "Return home",
+      "fr": "Retour à l'accueil"
+    },
+    {
+      "id": "i18n.theme",
+      "hugo": "theme",
+      "kc": "theme",
+      "moodle": "theme",
+      "en": "Theme",
+      "fr": "Thème"
+    },
+    {
+      "id": "i18n.text_size",
+      "hugo": "text_size",
+      "kc": "textSize",
+      "moodle": "textsize",
+      "en": "Text size",
+      "fr": "Taille du texte"
+    },
+    {
+      "id": "i18n.accessibility_settings",
+      "hugo": "accessibility_settings",
+      "kc": "accessibilitySettings",
+      "moodle": "accessibilitysettings",
+      "en": "Accessibility Settings",
+      "fr": "Paramètres d'accessibilité"
+    },
+    {
+      "id": "i18n.submit",
+      "hugo": "submit",
+      "kc": "submit",
+      "moodle": "submit",
+      "en": "Submit",
+      "fr": "Soumettre"
+    }
+  ]
+}

package/dist/navs/cobd.ca.json

@@ -0,0 +1,83 @@
+{
+  "$schema": "https://clf.cobd.ca/schemas/nav.json",
+  "slug": "cobd.ca",
+  "label": "COBD",
+  "label_i18n": {
+    "fr": "COBD"
+  },
+  "items": [
+    {
+      "id": "home",
+      "label": "COBD Home",
+      "label_i18n": {
+        "fr": "Accueil COBD"
+      },
+      "href": "/",
+      "icon": "home-outline"
+    },
+    {
+      "id": "training",
+      "label": "Training",
+      "label_i18n": {
+        "fr": "Formation"
+      },
+      "href": "/programs/training/",
+      "icon": "school-outline"
+    },
+    {
+      "id": "camps",
+      "label": "Camps",
+      "label_i18n": {
+        "fr": "Camps"
+      },
+      "href": "https://campbowen.ca/",
+      "icon": "bonfire-outline",
+      "rel": "external"
+    },
+    {
+      "id": "programs",
+      "label": "All Programs",
+      "label_i18n": {
+        "fr": "Tous les programmes"
+      },
+      "href": "/programs/",
+      "icon": "apps-outline"
+    },
+    {
+      "id": "events",
+      "label": "Upcoming Events",
+      "label_i18n": {
+        "fr": "Évènements à venir"
+      },
+      "href": "/events/",
+      "icon": "calendar-outline"
+    },
+    {
+      "id": "blog",
+      "label": "Blog",
+      "label_i18n": {
+        "fr": "Blogue"
+      },
+      "href": "/blog/",
+      "icon": "newspaper-outline"
+    },
+    {
+      "id": "donate",
+      "label": "Donate",
+      "label_i18n": {
+        "fr": "Faire un don"
+      },
+      "href": "/donate/",
+      "icon": "heart-outline"
+    },
+    {
+      "id": "contact",
+      "label": "Contact Us",
+      "label_i18n": {
+        "fr": "Nous joindre"
+      },
+      "href": "/contact/",
+      "icon": "mail-outline"
+    }
+  ]
+}

package/dist/navs/more-cobd.json

@@ -0,0 +1,60 @@
+{
+  "$schema": "https://clf.cobd.ca/schemas/nav.json",
+  "slug": "more-cobd",
+  "label": "More COBD",
+  "label_i18n": {
+    "fr": "Famille COBD"
+  },
+  "items": [
+    {
+      "id": "about",
+      "label": "About COBD",
+      "label_i18n": {
+        "fr": "À propos de COBD"
+      },
+      "href": "https://cobd.ca/",
+      "icon": "information-circle",
+      "rel": "external"
+    },
+    {
+      "id": "programs",
+      "label": "More Programs and Services",
+      "label_i18n": {
+        "fr": "Plus de programmes et services"
+      },
+      "href": "https://cobd.ca/programs/",
+      "icon": "apps",
+      "rel": "external"
+    },
+    {
+      "id": "accessibility",
+      "label": "Accessibility Statement",
+      "label_i18n": {
+        "fr": "Déclaration d'accessibilité"
+      },
+      "href": "https://cobd.ca/accessibility/",
+      "icon": "accessibility",
+      "rel": "external"
+    },
+    {
+      "id": "privacy",
+      "label": "Privacy Policy",
+      "label_i18n": {
+        "fr": "Politique de confidentialité"
+      },
+      "href": "https://cobd.ca/privacy/",
+      "icon": "shield-checkmark",
+      "rel": "external"
+    },
+    {
+      "id": "contact",
+      "label": "Contact COBD",
+      "label_i18n": {
+        "fr": "Contacter COBD"
+      },
+      "href": "https://cobd.ca/contact/",
+      "icon": "mail",
+      "rel": "external"
+    }
+  ]
+}

package/dist/navs.d.ts

@@ -0,0 +1,27 @@
+// Generated by build-navs.mjs — do not edit.
+
+export interface NavItem {
+    id: string;
+    label: string;
+    href?: string;
+    rel?: "external";
+    icon?: string;
+    items?: NavItem[];
+    requiresAuth?: boolean;
+    description?: string;
+}
+
+export interface Nav {
+    slug: string;
+    label: string;
+    items: NavItem[];
+}
+
+export function listNavs(): string[];
+// Pass a BCP-47 locale to apply label_i18n overrides;
+// labels without a match for that locale stay as-is.
+export function getNav(slug: string, locale?: string): Nav;
+export function getNavRemote(
+    slug: string,
+    opts?: { base?: string; locale?: string },
+): Promise<Nav>;

package/dist/navs.js

@@ -0,0 +1,193 @@
+// Generated by build-navs.mjs — do not edit.
+
+const NAVS = {
+  "cobd.ca": {
+    "$schema": "https://clf.cobd.ca/schemas/nav.json",
+    "slug": "cobd.ca",
+    "label": "COBD",
+    "label_i18n": {
+      "fr": "COBD"
+    },
+    "items": [
+      {
+        "id": "home",
+        "label": "COBD Home",
+        "label_i18n": {
+          "fr": "Accueil COBD"
+        },
+        "href": "/",
+        "icon": "home-outline"
+      },
+      {
+        "id": "training",
+        "label": "Training",
+        "label_i18n": {
+          "fr": "Formation"
+        },
+        "href": "/programs/training/",
+        "icon": "school-outline"
+      },
+      {
+        "id": "camps",
+        "label": "Camps",
+        "label_i18n": {
+          "fr": "Camps"
+        },
+        "href": "https://campbowen.ca/",
+        "icon": "bonfire-outline",
+        "rel": "external"
+      },
+      {
+        "id": "programs",
+        "label": "All Programs",
+        "label_i18n": {
+          "fr": "Tous les programmes"
+        },
+        "href": "/programs/",
+        "icon": "apps-outline"
+      },
+      {
+        "id": "events",
+        "label": "Upcoming Events",
+        "label_i18n": {
+          "fr": "Évènements à venir"
+        },
+        "href": "/events/",
+        "icon": "calendar-outline"
+      },
+      {
+        "id": "blog",
+        "label": "Blog",
+        "label_i18n": {
+          "fr": "Blogue"
+        },
+        "href": "/blog/",
+        "icon": "newspaper-outline"
+      },
+      {
+        "id": "donate",
+        "label": "Donate",
+        "label_i18n": {
+          "fr": "Faire un don"
+        },
+        "href": "/donate/",
+        "icon": "heart-outline"
+      },
+      {
+        "id": "contact",
+        "label": "Contact Us",
+        "label_i18n": {
+          "fr": "Nous joindre"
+        },
+        "href": "/contact/",
+        "icon": "mail-outline"
+      }
+    ]
+  },
+  "more-cobd": {
+    "$schema": "https://clf.cobd.ca/schemas/nav.json",
+    "slug": "more-cobd",
+    "label": "More COBD",
+    "label_i18n": {
+      "fr": "Famille COBD"
+    },
+    "items": [
+      {
+        "id": "about",
+        "label": "About COBD",
+        "label_i18n": {
+          "fr": "À propos de COBD"
+        },
+        "href": "https://cobd.ca/",
+        "icon": "information-circle",
+        "rel": "external"
+      },
+      {
+        "id": "programs",
+        "label": "More Programs and Services",
+        "label_i18n": {
+          "fr": "Plus de programmes et services"
+        },
+        "href": "https://cobd.ca/programs/",
+        "icon": "apps",
+        "rel": "external"
+      },
+      {
+        "id": "accessibility",
+        "label": "Accessibility Statement",
+        "label_i18n": {
+          "fr": "Déclaration d'accessibilité"
+        },
+        "href": "https://cobd.ca/accessibility/",
+        "icon": "accessibility",
+        "rel": "external"
+      },
+      {
+        "id": "privacy",
+        "label": "Privacy Policy",
+        "label_i18n": {
+          "fr": "Politique de confidentialité"
+        },
+        "href": "https://cobd.ca/privacy/",
+        "icon": "shield-checkmark",
+        "rel": "external"
+      },
+      {
+        "id": "contact",
+        "label": "Contact COBD",
+        "label_i18n": {
+          "fr": "Contacter COBD"
+        },
+        "href": "https://cobd.ca/contact/",
+        "icon": "mail",
+        "rel": "external"
+      }
+    ]
+  }
+};
+
+function applyLocale(obj, locale) {
+    if (locale && obj.label_i18n && obj.label_i18n[locale]) {
+        obj.label = obj.label_i18n[locale];
+    }
+    if (obj.items) {
+        for (const child of obj.items) applyLocale(child, locale);
+    }
+    delete obj.label_i18n;
+    return obj;
+}
+
+export function listNavs() {
+    return Object.keys(NAVS).sort();
+}
+
+// getNav(slug)               -> default labels
+// getNav(slug, 'fr')         -> French labels (fallback
+//                              to default when missing)
+export function getNav(slug, locale) {
+    const nav = NAVS[slug];
+    if (!nav) {
+        throw new Error(
+            "@cobdfamily/clf-core: unknown nav slug '" + slug + "'. "
+            + "Known: " + Object.keys(NAVS).join(", "),
+        );
+    }
+    // Defensive deep-copy, then localize in place.
+    return applyLocale(
+        JSON.parse(JSON.stringify(nav)), locale);
+}
+
+export async function getNavRemote(slug, opts) {
+    const base = (opts && opts.base) || "https://nav.cobd.ca";
+    const locale = opts && opts.locale;
+    const url = base.replace(/\/+$/, "") + "/" + slug + ".json";
+    try {
+        const res = await fetch(url, { cache: "no-cache" });
+        if (!res.ok) throw new Error("http " + res.status);
+        const nav = await res.json();
+        return applyLocale(nav, locale);
+    } catch (err) {
+        // Fall back to bundled.
+        return getNav(slug, locale);
+    }
+}

package/dist/theming/font-scale-paint.js

@@ -0,0 +1,32 @@
+"use strict";
+/* clf font-scale-paint.ts -- runs synchronously in
+ * <head> before first paint so users who picked
+ * Small or Large text-size don't see a flash of
+ * Medium-sized content while the rest of the
+ * page loads.
+ *
+ * Classic script (NOT a module). The file is
+ * compiled with no imports / exports so tsc
+ * emits it script-shape; loaded via
+ * <script src="..."> (no type="module") in
+ * <head>. Module scripts defer execution past
+ * first paint, which would cause a flash for
+ * users on Large/Small.
+ *
+ * This is a deliberately minimal duplicate of
+ * the runtime's font-scale logic -- the runtime
+ * module loads as a module and can't be relied
+ * on to execute pre-paint. Keep the SCALES map
+ * + cookie name in sync with runtime.ts.
+ */
+(() => {
+    const SCALES = {
+        sm: 0.9, md: 1.0, lg: 1.15,
+    };
+    const m = /(?:^|; )cobd-font-scale=([^;]+)/
+        .exec(document.cookie);
+    const v = m && (m[1] in SCALES) ? m[1] : "md";
+    const root = document.documentElement;
+    root.style.setProperty("--cobd-font-scale", String(SCALES[v]));
+    root.setAttribute("data-cobd-font-scale", v);
+})();

package/dist/theming/init.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/theming/init.js

@@ -0,0 +1,19 @@
+// Side-effect module: imports the theming runtime
+// and calls initTheming() at load time. Exists so
+// consumers can replace the inline
+//
+//   <script type="module">
+//     import { initTheming } from ".../runtime.js";
+//     initTheming();
+//   </script>
+//
+// in their static HTML with an external module
+// script reference. That keeps the compiled output
+// CSP-strict-clean -- no inline blocks (other than
+// JSON-LD, which strict CSP whitelists separately).
+//
+// Loaded as a module script, so the import is
+// resolved + initTheming() fires once when the
+// browser parses the module.
+import { initTheming } from "./runtime.js";
+initTheming();

package/dist/theming/runtime.d.ts

@@ -0,0 +1,22 @@
+export type ThemePref = "light" | "dark" | "hc-light" | "hc-dark" | "auto";
+export type Resolved = "light" | "dark" | "hc-light" | "hc-dark";
+export interface ThemingOptions {
+    storage?: "local" | "cookie";
+    cookieDomain?: string;
+    cookieName?: string;
+    cookieMaxAgeDays?: number;
+}
+type Listener = (t: Resolved) => void;
+export declare function getThemes(): ThemePref[];
+export declare function getThemePreference(): ThemePref;
+export declare function getActiveTheme(): Resolved;
+export declare function setTheme(pref: ThemePref): void;
+export declare function onThemeChange(cb: Listener): () => void;
+export declare function initTheming(opts?: ThemingOptions): void;
+export type FontScalePref = "sm" | "md" | "lg";
+type FontScaleListener = (p: FontScalePref) => void;
+export declare function getFontScales(): FontScalePref[];
+export declare function getFontScalePreference(): FontScalePref;
+export declare function setFontScale(pref: FontScalePref): void;
+export declare function onFontScaleChange(cb: FontScaleListener): () => void;
+export {};