@ecomconsult/consentkit 0.5.1 → 0.5.3

package/npm/internal-stub.mjs

@@ -28,7 +28,7 @@ export function undecidedState() {
  */
 export function createStub() {
   const stub = {
-    version: '0.5.1',
+    version: '0.5.3',
     config: {},
     init: function () { return undecidedState(); },
     allowed: function (cat) { return cat === 'necessary'; },

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ecomconsult/consentkit",
-  "version": "0.5.1",
+  "version": "0.5.3",
   "description": "GDPR cookie consent core with blocking engine, Shadow DOM UI and Google Consent Mode v2. Zero dependencies, no build step.",
   "repository": {
     "type": "git",

package/src/ck-core.js

@@ -1461,7 +1461,7 @@
   // Public API
   // ---------------------------------------------------------------------------
   var ConsentKit = {
-    version: '0.5.1',
+    version: '0.5.3',
     config: config,
 
     init: function (userConfig) {

package/src/ck-debug.js

@@ -203,9 +203,11 @@
       themeMode: 'тема',
       themeModeLight: 'светлая',
       themeModeDark: 'тёмная',
-      themeFont: 'шрифт',
-      themeFontInherit: 'как на сайте',
+      themeFont: 'Шрифт',
+      themeFontInherit: 'наследуется',
       themeFontSystem: 'системный',
+      themeFontPage: 'со страницы',
+      themeFontTry: 'попытка',
       themeRadius: 'скругления',
       themeCard: 'карточка',
       themeBtn: 'кнопки',
@@ -262,9 +264,11 @@
       themeMode: 'theme',
       themeModeLight: 'light',
       themeModeDark: 'dark',
-      themeFont: 'font',
-      themeFontInherit: 'site font',
+      themeFont: 'Font',
+      themeFontInherit: 'inherited',
       themeFontSystem: 'system',
+      themeFontPage: 'from the page',
+      themeFontTry: 'attempt',
       themeRadius: 'radii',
       themeCard: 'card',
       themeBtn: 'buttons',
@@ -598,6 +602,28 @@
     return typeof r === 'number' && isFinite(r) ? (Math.round(r * 100) / 100) + ':1' : '?';
   }
 
+  /* «Шрифт: <значение> (со страницы | системный | наследуется)».
+     theme.font:'system' is a fixed stack; otherwise the UI samples real page
+     text and only falls back to CSS `inherit` when the page states no family of
+     its own — the three cases have to be told apart, because «наследуется» on a
+     site whose body is unstyled is exactly the Times bug being diagnosed. */
+  function fontRow(built, T) {
+    if (built.font !== 'inherit') return built.font + ' (' + T.themeFontSystem + ')';
+    var page = null, n = 0;
+    try {
+      if (CK && typeof CK._resolvePageFont === 'function') page = CK._resolvePageFont();
+    } catch (e) { page = null; }
+    // The attempt number is the whole point of the 0.5.3 re-probe: a page whose
+    // stylesheets land late resolves on look 2 or 3, and «попытка 1» vs
+    // «попытка 3» is what tells those two pages apart in the panel.
+    try {
+      if (CK && typeof CK._pageFontAttempt === 'function') n = CK._pageFontAttempt();
+    } catch (e) { n = 0; }
+    var tries = (typeof n === 'number' && n > 1) ? ', ' + T.themeFontTry + ' ' + n : '';
+    return page ? page + ' (' + T.themeFontPage + tries + ')'
+                : 'inherit (' + T.themeFontInherit + tries + ')';
+  }
+
   // Resolved lazily, not at parse time: this file runs before ConsentKit.init()
   // has merged the site's config, so asking for the language now would always
   // read the built-in default. Re-resolved on every render so a page that
@@ -749,7 +775,7 @@
         sT.appendChild(defs([
           [T.themeMode, (dark ? T.themeModeDark : T.themeModeLight) +
             (built.mode === 'auto' ? ' (auto)' : '')],
-          [T.themeFont, built.font === 'inherit' ? T.themeFontInherit : T.themeFontSystem],
+          [T.themeFont, fontRow(built, T)],
           [T.themeRadius, T.themeCard + ' ' + built.radius.card + 'px · ' +
             T.themeBtn + ' ' + built.radius.button + 'px'],
           [T.themeLink, lkTxt]

package/src/ck-ui.js

@@ -663,6 +663,240 @@
     return (theme && theme.font === 'system') ? SYSTEM_FONT : 'inherit';
   }
 
+  /* CSS `inherit` on the shadow root takes the family of the HOST <div>, which
+     hangs off <body>. On a site that sets its typeface on inner blocks and not
+     on body/html, body's computed family IS the browser default (Times), so the
+     banner came out in Times on a page that is entirely sans-serif. Reading the
+     family off real page TEXT instead is what «как на сайте» was always meant
+     to mean.
+
+     Split in two: pickPageFont is pure arithmetic over already-collected
+     samples (unit-testable in node, published on _contrast), resolvePageFont
+     does the DOM reading. */
+
+  // Families are compared as CSS grammar, not as strings: '"Google Sans"' and
+  // 'google sans' name the same face, and only the UA default must be rejected.
+  function normFamily(v) {
+    if (typeof v !== 'string') return '';
+    return v.replace(/["']/g, '').replace(/\s*,\s*/g, ',').trim().toLowerCase();
+  }
+
+  /* First sample whose family differs from the UA default wins; null when the
+     page never states a family of its own (the caller then keeps `inherit`).
+     `samples` is [{ family }] in priority order. */
+  function pickPageFont(samples, uaDefault) {
+    if (!samples || typeof samples.length !== 'number') return null;
+    var ua = normFamily(uaDefault);
+    for (var i = 0; i < samples.length; i++) {
+      var s = samples[i];
+      var fam = s && typeof s.family === 'string' ? s.family.trim() : '';
+      if (!fam) continue;                       // unstyled / detached element
+      var norm = normFamily(fam);
+      if (!norm) continue;
+      if (ua && norm === ua) continue;          // still the browser default
+      // The value lands in a generated stylesheet. getComputedStyle normalises,
+      // but a family that could close the declaration is never worth the risk.
+      if (/[;{}]|\/\*/.test(fam)) continue;
+      return fam;
+    }
+    return null;
+  }
+
+  /* One probe at mount is not enough. On a page whose stylesheets are injected
+     by script (Tilda is the reported case) a CACHED reload mounts the banner
+     BEFORE those sheets apply, so every sample still computes to the UA default
+     and the probe returns null — the banner stays in Times and nothing looks
+     again. So the mount probe is only the first look: re-probes are scheduled
+     until the answer stops changing.
+
+     Both halves of that schedule are pure arithmetic, published on _contrast so
+     the behaviour is testable without timers or a DOM.
+
+     The timed ladder, in ms after mount. Deliberately front-loaded: a page that
+     styles itself quickly is corrected before a visitor can read the banner,
+     and the 4 s tail catches a slow webfont-driven sheet. `window.load` and
+     `document.fonts.ready` fire on their own and are NOT part of this ladder. */
+  var REPROBE_DELAYS = [500, 1500, 4000];
+
+  // Attempt is 1-based over the TIMED probes only; null means "no more timers".
+  function nextProbeDelay(attempt) {
+    if (typeof attempt !== 'number' || !isFinite(attempt) || attempt < 1) return null;
+    var i = Math.floor(attempt) - 1;
+    return i < REPROBE_DELAYS.length ? REPROBE_DELAYS[i] : null;
+  }
+
+  /* Should a freshly probed family replace what the banner is painting?
+     `current` is the applied value (null while the page still states nothing).
+     Only a non-null find is ever worth applying — a later null means the page
+     got LESS specific, which never happens for real and would otherwise throw
+     away a good answer. */
+  function shouldReprobe(current, found) {
+    if (typeof found !== 'string' || !found) return false;
+    if (typeof current !== 'string' || !current) return true;   // null -> found
+    return normFamily(current) !== normFamily(found);
+  }
+
+  // Ordered so the first hit is the most representative body text on the page.
+  var FONT_PROBES = ['main p', 'article p', '[role=main] p', 'p', 'h1', 'h2', 'a', 'button', 'li'];
+
+  function visibleOutsideHost(el) {
+    if (!el) return false;
+    if (host && (el === host || (host.contains && host.contains(el)))) return false;
+    try {
+      if (el.offsetParent !== null) return true;
+      return !!(el.getClientRects && el.getClientRects().length > 0);
+    } catch (e) { return false; }
+  }
+
+  // The UA default is whatever an element states no opinion about, measured
+  // INSIDE the shadow root so `:host{all:initial}` is already in force.
+  function uaDefaultFamily() {
+    if (!root || typeof document === 'undefined') return '';
+    var probe = null;
+    try {
+      probe = document.createElement('span');
+      probe.style.setProperty('font-family', 'initial');
+      root.appendChild(probe);
+      return window.getComputedStyle(probe).fontFamily || '';
+    } catch (e) {
+      return '';
+    } finally {
+      try { if (probe && probe.parentNode) probe.parentNode.removeChild(probe); } catch (e2) { /* noop */ }
+    }
+  }
+
+  // Cached at applyTheme time so the debug panel (which may open long before or
+  // after a remount) quotes the value the banner actually painted.
+  var pageFont = null;
+
+  /* How many times the SCHEDULER has looked, for the debug panel's «попытка N».
+     Counted here and not inside resolvePageFont() on purpose: _resolvePageFont()
+     re-runs the whole probe on every debug-panel render, and counting there would
+     report «попытка 14» after a few renders and exhaust the cap on nothing. */
+  var fontProbeCount = 1;          // the mount probe is attempt 1
+
+  function resolvePageFont() {
+    if (typeof document === 'undefined') return pageFont;
+    try {
+      var ua = uaDefaultFamily();
+      var samples = [];
+      var body = document.body;
+      if (body) {
+        try { samples.push({ family: window.getComputedStyle(body).fontFamily }); } catch (e) { /* noop */ }
+      }
+      for (var i = 0; i < FONT_PROBES.length; i++) {
+        // First VISIBLE match, not the first match if it happens to be visible:
+        // the leading <p> on a real page is often hidden a11y text, a template
+        // or an inert modal, and skipping straight to the next selector would
+        // throw away the page's body copy. Capped so a long article does not
+        // cost a layout read per node.
+        var el = null, list = null;
+        try { list = document.querySelectorAll(FONT_PROBES[i]); } catch (e) { list = null; }
+        if (!list) continue;
+        for (var j = 0; j < list.length && j < 5; j++) {
+          if (visibleOutsideHost(list[j])) { el = list[j]; break; }
+        }
+        if (!el) continue;
+        try { samples.push({ family: window.getComputedStyle(el).fontFamily }); } catch (e) { /* noop */ }
+      }
+      pageFont = pickPageFont(samples, ua);
+    } catch (e) {
+      pageFont = null;
+    }
+    return pageFont;
+  }
+
+  /* ------------------------------------------------ page-font re-probing */
+
+  /* Live timers, so remount() can cancel a schedule that belongs to the DOM it
+     is about to throw away. Everything here is guarded and only ever RUNS after
+     mount(), so the parse-time SSR context below never reaches it. */
+  var fontTimers = [];
+  var fontStable = false;          // a non-null value survived one extra probe
+  var fontScheduled = false;
+
+  // Cap on SCHEDULED probes (the mount probe is not one of them): the three
+  // timed rungs plus window.load plus fonts.ready.
+  var MAX_REPROBES = 5;
+
+  function clearFontTimers() {
+    for (var i = 0; i < fontTimers.length; i++) {
+      try { clearTimeout(fontTimers[i]); } catch (e) { /* noop */ }
+    }
+    fontTimers = [];
+  }
+
+  /* One look. Re-applies the theme when the family changed, and reports whether
+     the answer has now held still for a whole extra probe — which is the only
+     thing that stops the ladder early. Applying and stopping are deliberately
+     separate: a first non-null find is painted IMMEDIATELY (the visitor must not
+     wait out the confirmation), the confirmation only decides about timers. */
+  function probeFontOnce() {
+    var before = pageFont;
+    var found = resolvePageFont();               // rewrites the pageFont cache
+    if (shouldReprobe(before, found)) {
+      // applyTheme() rewrites themeStyle.textContent wholesale, so the --ck-font
+      // rule is REPLACED rather than appended a second time.
+      try { applyTheme(safeConfig()); } catch (e) { /* noop */ }
+      fontStable = false;
+      return false;
+    }
+    // Unchanged. Stable only once we have an actual family in hand: a page that
+    // keeps answering null is exactly the case that has to keep looking.
+    if (found) { fontStable = true; return true; }
+    return false;
+  }
+
+  /* Run a scheduled probe. Every trigger — window.load, fonts.ready and each
+     rung of the timed ladder — funnels through here so the cap and the counter
+     are counted in one place. */
+  function runScheduledProbe() {
+    if (!mounted || fontStable) return;
+    if (fontProbeCount >= 1 + MAX_REPROBES) return;
+    fontProbeCount++;
+    if (probeFontOnce()) clearFontTimers();      // settled: drop the rest
+  }
+
+  /* Called once from the end of mount(). Not from applyTheme(): that runs again
+     on every palette-only ck:init, which would restart the whole ladder. */
+  function scheduleFontProbes(cfg) {
+    if (typeof window === 'undefined' || typeof document === 'undefined') return;
+    if (fontScheduled) return;
+    // theme.font:'system' is a fixed stack — there is nothing to sample.
+    try {
+      var t = (cfg && cfg.theme) || {};
+      if (resolveFont(t) !== 'inherit') return;
+    } catch (e) { return; }
+
+    fontScheduled = true;
+    try {
+      for (var a = 1; ; a++) {
+        var d = nextProbeDelay(a);
+        if (d === null) break;
+        fontTimers.push(setTimeout(runScheduledProbe, d));
+      }
+    } catch (e) { /* noop */ }
+
+    // A cached reload's mount can precede the page's own stylesheets; `load`
+    // is the first moment every <link> in the document has definitely applied.
+    try {
+      if (document.readyState === 'complete') {
+        // Already past it — the ladder covers this case on its own.
+      } else {
+        window.addEventListener('load', function () { runScheduledProbe(); }, { once: true });
+      }
+    } catch (e) { /* noop */ }
+
+    // A webfont swapping in can change the computed family outright.
+    try {
+      if (document.fonts && typeof document.fonts.ready === 'object' &&
+          document.fonts.ready && typeof document.fonts.ready.then === 'function') {
+        document.fonts.ready.then(function () { runScheduledProbe(); },
+                                  function () { /* noop */ });
+      }
+    } catch (e) { /* noop */ }
+  }
+
   /* --------------------------------------------------- button resolution */
 
   var BTN_ROLES = ['accept', 'reject', 'settings'];
@@ -919,9 +1153,25 @@
   function applyTheme(cfg) {
     if (!host || !nodes.themeStyle) return;
     var built = buildThemeCss(cfg);
+    // `inherit` would take the family of the host <div> — i.e. of <body>, which
+    // on many sites still carries the browser default. Overwrite the token with
+    // the family real page text is set in. Appended AFTER built.css so the two
+    // equal-specificity :host rules resolve in source order; buildThemeCss stays
+    // pure and DOM-free (the theme editor and the debug panel both call it).
+    var fontCss = '';
+    if (built.font === 'inherit') {
+      var page = resolvePageFont();
+      // Owner rule (2026-09-06): the page's font when it can be read, the
+      // system stack when it cannot — never a bare `inherit`, which on Tilda
+      // and friends resolves to <body>'s browser default (Times). A later
+      // re-probe that finds the page font swaps the system stack out again.
+      fontCss = '\n:host{--ck-font:' + (page || SYSTEM_FONT) + '}';
+    } else {
+      pageFont = null;                          // theme.font:'system' opts out
+    }
     // Brand rules ride along in the same sheet: the dark/light logo swap depends
     // on theme.mode, so it must be rebuilt whenever the palette is.
-    nodes.themeStyle.textContent = built.css + '\n' + buildBrandCss(cfg);  // replace, never append
+    nodes.themeStyle.textContent = built.css + fontCss + '\n' + buildBrandCss(cfg);  // replace, never append
     host.classList.remove('ck-mode-dark', 'ck-mode-light');
     if (built.mode === 'dark') host.classList.add('ck-mode-dark');
     else if (built.mode === 'light') host.classList.add('ck-mode-light');
@@ -1292,6 +1542,21 @@
 
   function openPanel(invoker) {
     if (!mounted || !nodes.panel) return;
+    /* A visitor who opens the settings long after load is the last chance to
+       get the typeface right, and by then the page is certainly styled. Only
+       when the banner is still on `inherit` — a resolved family is left alone
+       so opening the panel can never restyle a correct banner. Hooked here
+       rather than on the ck:ui:open-preferences listener because the banner's
+       own «Настроить» button calls openPanel() directly.
+
+       Gated on fontScheduled, which is only ever set for a theme that actually
+       samples the page: with theme.font:'system' applyTheme() nulls pageFont on
+       every call, so without this the condition would be permanently true and
+       every panel open would re-probe the DOM and rewrite the sheet to produce
+       byte-identical CSS, forever. */
+    if (fontScheduled && !pageFont && !fontStable) {
+      try { probeFontOnce(); } catch (e) { /* noop */ }
+    }
     lastFocus = invoker || root.activeElement || document.activeElement;
     syncSwitches(safeState());
     nodes.panelScrim.classList.remove('ck-hidden');
@@ -1367,6 +1632,12 @@
     mounted = false;
     panelOpen = false;
     lastFocus = null;
+    // The pending schedule belongs to the shadow root about to be rebuilt; the
+    // fresh mount() starts its own ladder from a clean count.
+    clearFontTimers();
+    fontScheduled = false;
+    fontStable = false;
+    fontProbeCount = 1;
     mount(cfg);
   }
 
@@ -1411,6 +1682,10 @@
     mounted = true;
     mountedSig = signature(cfg);
     syncFromState();
+
+    // Only now: scheduleFontProbes() re-applies the theme from a timer, and
+    // applyTheme() is a no-op until there is a host and a themeStyle to write.
+    scheduleFontProbes(cfg);
   }
 
   /* ---------------------------------------------------------------- events */
@@ -1437,9 +1712,23 @@
       resolveButtonStyles: resolveButtonStyles,
       resolveRadius: resolveRadius,
       resolveFont: resolveFont,
+      pickPageFont: pickPageFont,
+      nextProbeDelay: nextProbeDelay,
+      shouldReprobe: shouldReprobe,
       resolveDetails: resolveDetails,
       buildThemeCss: buildThemeCss
     };
+    // The page-font probe reads the DOM, so it is not part of the pure block —
+    // but the debug panel must be able to quote the family the banner painted
+    // rather than guess at it. Safe to call before mount: with no shadow root
+    // to measure the UA default against it simply returns the cache (null).
+    ck._resolvePageFont = function () {
+      return (typeof document === 'undefined' || !root) ? pageFont : resolvePageFont();
+    };
+    // How many times the SCHEDULER has looked (1 = the mount probe alone). The
+    // debug panel prints it: on a Tilda-style page the interesting fact is that
+    // the family arrived on the third look, not on the first.
+    ck._pageFontAttempt = function () { return fontProbeCount; };
   })();
 
   // SSR-safe: with no DOM there is nothing to render or listen to, so importing