mnfst 0.5.205 → 0.5.207

package/lib/manifest.appwrite.data.js

@@ -2,7 +2,7 @@
 
 (function () {
 
-const MANIFEST_BUILD_VERSION = '0.5.205';
+const MANIFEST_BUILD_VERSION = '0.5.207';
 
 /* Manifest Data Sources - Appwrite Integration */
 

package/lib/manifest.d.ts

@@ -510,6 +510,17 @@ declare global {
         Alpine?: unknown;
         __manifestLoaded?: unknown;
     }
+
+    /**
+     * Fired when the utilities runtime sees a class the baked sheet (and
+     * `manifest.json`'s `utilities.safelist`/`patterns`) doesn't cover, after
+     * publish stamped that sheet as covering every class — see
+     * manifest.utilities.static.js. `engineLoaded` is true once the lazily
+     * loaded Tailwind engine has taken over, false if that load failed.
+     */
+    interface WindowEventMap {
+        'manifest:utilities-uncovered': CustomEvent<{ classes: string[]; engineLoaded: boolean }>;
+    }
 }
 
 // ---------------------------------------------------------------------------

package/lib/manifest.data.js

@@ -2,7 +2,7 @@
 
 (function () {
 
-const MANIFEST_BUILD_VERSION = '0.5.205';
+const MANIFEST_BUILD_VERSION = '0.5.207';
 
 /* Manifest Data Sources - Configuration */
 

package/lib/manifest.integrity.json

@@ -1,6 +1,6 @@
 {
   "manifest.appwrite.auth.js": "sha384-HMJmRXnvdDBWyuteXL+DTxWM2llSCdjl4EDamEI7iHNAVlqeOCE4GDTm8ZHipPRj",
-  "manifest.appwrite.data.js": "sha384-SNLZhDdZFodPsMINThHOZ/rPyLqV/hRyvI/lMxsHCctKB+TI4HdlLt9USnaKFKnG",
+  "manifest.appwrite.data.js": "sha384-/1T3gJYo2B7Ct4s24VFKgle5LpTdnZ2kWrMReqamsSzUg1nCqwOjS7T8Z/qgJSoV",
   "manifest.appwrite.presences.js": "sha384-JyVDWFT69b7Svq8J8p9tNWe2v9PZNQBY5UyhtOl1vnuHFAX0CRQ3MA9SiKq5wzNh",
   "manifest.bindings.js": "sha384-lPtMf8Ykaic9gNVZKq8Scia1881ZeMAyxer3WCIkUNwwrgzGBWto1OXADUwjvORF",
   "manifest.charts.js": "sha384-qQrjhWkIDi4oU5uQrpy8DdlMjY+gfiivBuX6mssNiFdkawgkVBvKneGgp+nd3PYJ",
@@ -11,7 +11,7 @@
   "manifest.combobox.js": "sha384-SN3XHumoebxcduFQqx5zt65/Cd10y8nuf9Gkco6UnsZ42sadRd+gvVLfWPdkkuPH",
   "manifest.components.js": "sha384-DLGSqCbnGkS87AWJ8GpKoAFP4nCosgC5SFSg6C10hH/nWu/MxI+0ntHlnFEfs++u",
   "manifest.computed.js": "sha384-GYML/e81gQfN+iDbqhPUgny8bINCyL+SrbTofoGk4hlCnLLjv51mCv42JMqq+ku5",
-  "manifest.data.js": "sha384-pCz9N7amtpL1KG/Z/3ZbGRPqof5K/pXwjK4NgB7MxBPg4efzFp0MlsQtJpjRnoNd",
+  "manifest.data.js": "sha384-dq1Hp751qrHoMVX1rDGjj09KkiKb3jzrbW6rCMdwzPWKjzoIQT22InmU6QVP0JhO",
   "manifest.datepicker.js": "sha384-8vTJYkLqqvgXgm1w1becuaRR/jUEpiLBjBJ6RsRbUr+ZkypvspD6EsssuDrX4SQq",
   "manifest.defer.js": "sha384-wXa60M2OHigi5rBurXQ7Oa8eyr5WTKs7EUn2GOru62KMdfs/LDyNegxCc9MNJFSe",
   "manifest.device.js": "sha384-g+txmrEszYtuOvRelTp/c1wSNR2AtllVI9rx5NPPD7DzhVUnMNughonZykv2xlBW",
@@ -28,14 +28,14 @@
   "manifest.slides.js": "sha384-3uRTkyK9XPLmnxI2+igZlpi4EyPlU/7IHj5j3BZJJ2KN455vXyk99fiXV3feO/XY",
   "manifest.status.js": "sha384-nwvUSbT+gpRMqhYx6MeBYswUMH72rY92mjgxv0vrSG7Ht7l83XYpEB6fCTbXjjfK",
   "manifest.svg.js": "sha384-qr/8H9+2cIhSXNbRWRtIdrDlTOxKlNJqwEefHvCYoiBNW/kKhPTFa109Orv/EBnb",
-  "manifest.sw.js": "sha384-f+wBpbAvoE4WwJXkMiFJ4pN/UDVdsmEBX7Uav3SoycmUXzgZDz+U/39UWXtLaItm",
+  "manifest.sw.js": "sha384-a4rb/5qNtjrIQEP6oMusHWeJVtWZ9LIXR/uIpBholtH1808et2NibzgtM1GTEpgq",
   "manifest.tabs.js": "sha384-OIIcyaQnGS0eNYk4zgAFEDboNYect7THvUd9D0V6nqCeDOxQcoiqLrBEmmWVTTet",
   "manifest.tailwind.js": "sha384-r/Jvqb+Piz21jUts10BbVAJoKkShOdJRVFpywyi4HPIi/OfOJq5CtPyWAPbdkMgt",
   "manifest.text.edit.js": "sha384-pfhc4IPKNJokj6ldlgD+KwGLN4UoM21CNeVf2sVq/34X1Un2PUhEuyTg5itmtsXS",
   "manifest.toasts.js": "sha384-/OV32LLMJl0Iw8NoNQJ+5lgntLxjIJq/YNj5JAKS/+nUhVx4MMB9h1FOqP7zuj2M",
   "manifest.tooltips.js": "sha384-uXVVQADl6pY2Pj9i/UaSclZN7dzbKhLkmevv7Ad0+wXR8LgqodALNFrc5jZJjlwm",
   "manifest.url.parameters.js": "sha384-J2aSVBOPsoqsbafHndrWLHEDpKb4AKJAoQnVmKA4gZh5P/8HHjFWHO/lkusmG84l",
-  "manifest.utilities.js": "sha384-Dtpf9qskRUYB4bLuJaCBGWYFENVypV5AxlLFPdi7S7+meaGeupzD2zkDr7CYhvXf",
+  "manifest.utilities.js": "sha384-pIKcTvk9lrlXZK0OXld6SA6wrmlaFTCmTpLn67nOCE+XhNw4fuGSDX4Z3C2eR6CJ",
   "manifest.virtual.js": "sha384-YwwmAsZNddajnAkLhBWtrK8edHMJOhD7cJkQi3qmm5o1Thg0wbtDU0dsfrCHKTIQ",
-  "manifest.js": "sha384-jH0veyUdnBMoGwHxgUQ9Yjs0UneDMI/fYIsg1U58YPZwriKJ6Rv/aoA7RbLepoGa"
+  "manifest.js": "sha384-fyktZSCaKJ267Hj5ORpbS/Dk11vtT+J8BN1XkA8zG+kXG1wPDwcA1hmB/40fY5Pq"
 }

package/lib/manifest.js

@@ -686,7 +686,11 @@
 	// Expose API
 	window.Manifest = {
 		loadPlugin: function (pluginName, version = RESOLVED_VERSION) {
-			const allPlugins = [...AVAILABLE_PLUGINS, ...APPWRITE_PLUGINS, ...AUTHORING_PLUGINS, 'payments', 'chat', 'device'];
+			// 'tailwind' isn't a core/Appwrite/authoring plugin — it's the Play-CDN
+			// browser engine (lib/manifest.tailwind.js) — but the utilities plugin's
+			// uncovered-class watcher lazily loads it this way (see
+			// manifest.utilities.static.js setupUncoveredClassWatcher).
+			const allPlugins = [...AVAILABLE_PLUGINS, ...APPWRITE_PLUGINS, ...AUTHORING_PLUGINS, 'payments', 'chat', 'device', 'tailwind'];
 			if (!allPlugins.includes(pluginName)) {
 				console.warn(`[Manifest Loader] Unknown plugin: ${pluginName}`);
 				return Promise.reject(new Error(`Unknown plugin: ${pluginName}`));

package/lib/manifest.schema.json

@@ -431,6 +431,23 @@
             "type": "object",
             "description": "Deprecated alias of `device` (renamed in 0.5.199); still accepted.",
             "additionalProperties": true
+        },
+        "utilities": {
+            "type": "object",
+            "description": "Utilities-plugin overrides for classes a plain HTML/component scan can't find on its own — e.g. built from a runtime value (`:class=\"ok ? 'bg-green-500' : 'bg-amber-500'\"`). `safelist` classes are baked into the static utilities sheet (scanClasses/compileUtilities) and treated as covered by the runtime; `patterns` classes are trusted as covered by the runtime only (a regex can't be baked).",
+            "properties": {
+                "safelist": {
+                    "type": "array",
+                    "items": { "type": "string" },
+                    "description": "Exact utility class names, e.g. [\"bg-amber-500\", \"bg-green-500\"]."
+                },
+                "patterns": {
+                    "type": "array",
+                    "items": { "type": "string" },
+                    "description": "Regex source strings matched against each class token, e.g. \"^bg-(red|green|blue)-[0-9]+$\"."
+                }
+            },
+            "additionalProperties": false
         }
     },
     "definitions": {

package/lib/manifest.sw.js

@@ -16,7 +16,7 @@
 
 // Build stamps the published version here; unstamped (dev) falls back to the
 // registration URL's `v`, then 'dev'.
-const BUILD_VERSION = '0.5.205';
+const BUILD_VERSION = '0.5.207';
 const CACHE_PREFIX = 'mnfst-sw:';
 const META_CACHE = CACHE_PREFIX + 'meta';
 const SWR_CAP = 200;

package/lib/manifest.utilities.js

@@ -556,12 +556,19 @@ class TailwindCompiler {
         // Cache for parsed class names (must be before addCriticalBlockingStylesSync)
         this.classCache = new Map();
 
-        // Read any publish/render-provided static utilities sheet before the
-        // first compile — its classes are skipped rather than regenerated.
-        // Fails open (never "everything covered") until this resolves —
-        // compile()'s first run awaits it, capped at 2s (see static.js).
+        // Read any publish/render-provided static utilities sheet, plus
+        // manifest.json's utilities.safelist/patterns, before the first
+        // compile — those classes are skipped rather than regenerated. Fails
+        // open (never "everything covered") until this resolves — compile()'s
+        // first run awaits it, capped at 2s (see static.js). Once settled,
+        // arm the uncovered-class watcher (a no-op unless the loader actually
+        // skipped fetching the Tailwind engine for this page).
         this.staticUtilitiesCoveredClasses = null;
-        this.staticUtilitiesReady = this.detectStaticUtilitiesSheet();
+        this.staticUtilitiesReady = Promise.all([
+            this.detectStaticUtilitiesSheet(),
+            this.loadUtilitiesSafelist()
+        ]);
+        this.staticUtilitiesReady.then(() => this.setupUncoveredClassWatcher());
 
         // Add critical styles IMMEDIATELY - don't wait for anything
         this.addCriticalBlockingStylesSync();
@@ -1493,13 +1500,17 @@ TailwindCompiler.prototype.extractClassesFromHTML = function (html, classSet) {
     // Literal class="..."/class='...' only — lookbehind excludes `:class=`
     // (Alpine binding), whose "class=" substring would otherwise match and
     // truncate at the literal's first internal quote, leaking a stray '{'.
+    // Backreference to the opening quote (rather than stopping at either
+    // quote char) so an arbitrary Tailwind value containing the OTHER quote
+    // character — `content-['*']`, `content-['']` — survives instead of
+    // truncating the whole class list at its first `'`.
     // Whitespace-only split below keeps every token Tailwind would accept
     // (variants, arbitrary values, leading '-', '!'); only x-/$ tokens drop.
-    const classRegex = /(?<![:\w])class=["']([^"']+)["']/g;
+    const classRegex = /(?<![:\w])class=(["'])((?:(?!\1)[\s\S])*)\1/g;
     let match;
 
     while ((match = classRegex.exec(html)) !== null) {
-        const classString = match[1];
+        const classString = match[2];
         const classes = classString.split(/\s+/).filter(Boolean);
         for (const cls of classes) {
             if (cls && !cls.startsWith('x-') && !cls.startsWith('$')) {
@@ -1517,7 +1528,11 @@ TailwindCompiler.prototype.extractClassesFromHTML = function (html, classSet) {
         if (classMatches) {
             for (const classMatch of classMatches) {
                 const cls = classMatch.replace(/['"`]/g, '');
-                if (cls && !cls.startsWith('$') && !cls.includes('(')) {
+                // x-data is arbitrary JS — a plain string literal in there
+                // (e.g. `location.pathname.split('/')`) matches this quoted-
+                // token scan too, so require a letter/digit; a punctuation-only
+                // "token" like a bare '/' is skipped (seen on a live page).
+                if (cls && !cls.startsWith('$') && !cls.includes('(') && /[a-zA-Z0-9]/.test(cls)) {
                     classSet.add(cls);
                 }
             }
@@ -3390,6 +3405,7 @@ TailwindCompiler.prototype.extractSelectorsFromCssText = function (cssText) {
     const len = cssText.length;
     let i = 0;
     while (i < len) {
+        if (cssText[i] === ' ' || cssText[i] === '\n' || cssText[i] === '\r' || cssText[i] === '\t') { i++; continue; }   // else an @-rule after a newline reads as a selector
         // Skip inter-rule whitespace first — without this, whitespace before an
         // `@layer`/`@media` (e.g. after a preceding `@layer base, ...;` statement
         // or sibling rule) leaves `i` off the '@', so the block below never fires
@@ -3434,17 +3450,30 @@ TailwindCompiler.prototype.extractSelectorsFromCssText = function (cssText) {
     return selectors;
 };
 
+// Undo escapeClassName's per-char escaping, including the CSS hex-escape
+// form used for a class whose first character can't appear bare at the start
+// of an identifier — a leading digit. Real Tailwind/CSS.escape emit `\32 `
+// (backslash + hex codepoint + one trailing space) for the '2' in `2xl:*`;
+// a naive `\X` → `X` unescape corrupts this (leaves a stray "2" + space and
+// drops the rest of the selector), so `2xl:` variants silently stopped being
+// recognized as covered — caught by the corpus test (utilities-corpus.test.js).
+TailwindCompiler.prototype.unescapeClassToken = function (token) {
+    return token.replace(/\\([0-9a-fA-F]{1,6}) ?|\\(.)/g, (m, hex, ch) => hex ? String.fromCodePoint(parseInt(hex, 16)) : ch);
+};
+
 // Selectors escape every non-alphanumeric/hyphen char (see escapeClassName),
 // so `.hover\:bg-brand` unescapes back to the `hover:bg-brand` token form
-// used everywhere else (class attributes, usedClasses, parseClassName).
+// used everywhere else (class attributes, usedClasses, parseClassName). The
+// hex-escape alternative is tried first so `\32 ` is consumed as one unit
+// rather than stopping at the literal digits.
 TailwindCompiler.prototype.classNamesFromCssText = function (cssText) {
     const classSet = new Set();
-    const classRe = /\.((?:\\.|[a-zA-Z0-9_-])+)/g;
+    const classRe = /\.((?:\\[0-9a-fA-F]{1,6} ?|\\.|[a-zA-Z0-9_-])+)/g;
     for (const selector of this.extractSelectorsFromCssText(cssText)) {
         let m;
         classRe.lastIndex = 0;
         while ((m = classRe.exec(selector)) !== null) {
-            classSet.add(m[1].replace(/\\(.)/g, '$1'));
+            classSet.add(this.unescapeClassToken(m[1]));
         }
     }
     return classSet;
@@ -3516,12 +3545,63 @@ TailwindCompiler.prototype.detectStaticUtilitiesSheet = function () {
     });
 };
 
-// Drop classes already covered by the static sheet before generating rules
-// for them again — the JIT should only ever patch what's left uncovered.
+// manifest.json's `utilities.safelist` (exact class names) / `utilities.patterns`
+// (regex source strings) — classes a project knows are already baked (or
+// intentionally safe to leave unbaked) even though a plain HTML/component
+// scan can't find them, e.g. built from a runtime value
+// (`:class="ok ? 'bg-green-500' : 'bg-amber-500'"`). Read once from the
+// shared manifest.json fetch (already in flight for other plugins); fails
+// open to "no safelist" so a bad/missing config never blocks anything.
+TailwindCompiler.prototype.loadUtilitiesSafelist = async function () {
+    this.safelistClasses = new Set();
+    this.safelistPatterns = [];
+    try {
+        let manifest = window.__manifestLoaded || null;
+        if (!manifest && window.__manifestPromise) manifest = await window.__manifestPromise;
+        const cfg = manifest && typeof manifest === 'object' ? manifest.utilities : null;
+        if (cfg && Array.isArray(cfg.safelist)) {
+            for (const c of cfg.safelist) if (typeof c === 'string' && c) this.safelistClasses.add(c);
+        }
+        if (cfg && Array.isArray(cfg.patterns)) {
+            for (const p of cfg.patterns) {
+                if (typeof p !== 'string') continue;
+                try { this.safelistPatterns.push(new RegExp(p)); } catch (e) { /* invalid pattern, ignore */ }
+            }
+        }
+    } catch (e) {
+        // Fail open: no manifest.json, or it couldn't be read.
+    }
+};
+
+TailwindCompiler.prototype.isClassSafelisted = function (cls) {
+    if (this.safelistClasses && this.safelistClasses.has(cls)) return true;
+    if (this.safelistPatterns) {
+        for (const re of this.safelistPatterns) {
+            if (re.test(cls)) return true;
+        }
+    }
+    return false;
+};
+
+// Single source of truth for "covered" everywhere that concept is used: the
+// static sheet's own classes, or the safelist. Both mean "don't regenerate,
+// and don't treat as a signal that the Tailwind engine needs to load".
+TailwindCompiler.prototype.isClassCovered = function (cls) {
+    const covered = this.staticUtilitiesCoveredClasses;
+    if (covered && covered.has(cls)) return true;
+    return this.isClassSafelisted(cls);
+};
+
+TailwindCompiler.prototype.hasSafelistEntries = function () {
+    return !!((this.safelistClasses && this.safelistClasses.size) || (this.safelistPatterns && this.safelistPatterns.length));
+};
+
+// Drop classes already covered by the static sheet (or the safelist) before
+// generating rules for them again — the JIT should only ever patch what's left.
 TailwindCompiler.prototype.filterStaticallyCoveredClasses = function (classes) {
     const covered = this.staticUtilitiesCoveredClasses;
-    if (!covered || covered.size === 0) return classes;
-    return classes.filter(c => !covered.has(c));
+    if ((!covered || covered.size === 0) && !this.hasSafelistEntries()) return classes;
+    return classes.filter(c => !this.isClassCovered(c));
 };
 
 // The localStorage cache (manifest.utilities.cache.js) stores a full compiled
@@ -3530,13 +3610,14 @@ TailwindCompiler.prototype.filterStaticallyCoveredClasses = function (classes) {
 // rule the static sheet already covers, so strip those rules out first.
 TailwindCompiler.prototype.stripCoveredRulesFromCss = function (cssText) {
     const covered = this.staticUtilitiesCoveredClasses;
-    if (!covered || covered.size === 0 || !cssText) return cssText;
+    if (!cssText || ((!covered || covered.size === 0) && !this.hasSafelistEntries())) return cssText;
 
     const strip = (text) => {
         const out = [];
         const len = text.length;
         let i = 0;
         while (i < len) {
+            if (text[i] === ' ' || text[i] === '\n' || text[i] === '\r' || text[i] === '\t') { out.push(text[i]); i++; continue; }
             // Skip (but preserve) inter-rule whitespace before checking for an
             // at-rule — see extractSelectorsFromCssText for why this matters.
             const wsStart = i;
@@ -3582,14 +3663,14 @@ TailwindCompiler.prototype.stripCoveredRulesFromCss = function (cssText) {
             // Match tokens directly against the bare selector text — it has no
             // rule body for classNamesFromCssText's selector-then-`{` scan to key off.
             const classes = [];
-            const classRe = /\.((?:\\.|[a-zA-Z0-9_-])+)/g;
+            const classRe = /\.((?:\\[0-9a-fA-F]{1,6} ?|\\.|[a-zA-Z0-9_-])+)/g;
             let cm;
             while ((cm = classRe.exec(selector)) !== null) {
-                classes.push(cm[1].replace(/\\(.)/g, '$1'));
+                classes.push(this.unescapeClassToken(cm[1]));
             }
             // Only drop a rule once every class it references is covered — a
             // mixed selector (`:where(.row, .col)`) stays if either is new.
-            const isFullyCovered = classes.length > 0 && classes.every(c => covered.has(c));
+            const isFullyCovered = classes.length > 0 && classes.every(c => this.isClassCovered(c));
             if (!isFullyCovered) out.push(fullRule);
         }
         return out.join('\n');
@@ -3598,6 +3679,96 @@ TailwindCompiler.prototype.stripCoveredRulesFromCss = function (cssText) {
     return strip(cssText);
 };
 
+// Runtime safety net for the loader's Tailwind-engine skip (manifest.js
+// staticUtilitiesFullyCovered): true only when this page (a) asked for the
+// Tailwind engine at all (`data-tailwind`), and (b) publish stamped the
+// static utilities sheet complete, so the loader chose not to fetch it
+// eagerly. Checked against the fuller link-or-style read
+// (findStaticUtilitiesElement) rather than manifest.js's synchronous
+// style-only check — this runs well after boot, so it isn't limited by that
+// decision's timing constraint.
+TailwindCompiler.prototype.tailwindEngineWasSkipped = function () {
+    try {
+        if (!document.querySelector('script[src*="manifest.js"][data-tailwind]')) return false;
+        const el = this.findStaticUtilitiesElement();
+        return !!(el && el.hasAttribute('data-mnfst-utilities-complete'));
+    } catch (e) {
+        return false;
+    }
+};
+
+// Arms once staticUtilitiesReady (sheet + safelist) has settled. Watches for
+// any class token — already on the page, or added/changed after — that the
+// bake doesn't cover and the safelist doesn't excuse: the signal that a
+// "complete" stamp was wrong and the page would otherwise render unstyled.
+// A burst of nodes collapses into one lazy load; the observer disconnects
+// the moment that load succeeds, handing off to the real engine exactly as
+// if it had loaded eagerly.
+TailwindCompiler.prototype.setupUncoveredClassWatcher = function () {
+    if (this.usesStaticPrerenderUtilities) return;
+    if (!this.tailwindEngineWasSkipped()) return;
+    if (window.__mnfstTailwindWatcherArmed) return; // one watcher per page load
+    window.__mnfstTailwindWatcherArmed = true;
+
+    let pending = new Set();
+    let loading = false;
+    let observer = null;
+
+    const collectFrom = (el) => {
+        const cls = el.getAttribute && el.getAttribute('class');
+        if (!cls) return;
+        for (const tok of cls.split(/\s+/)) {
+            if (tok && !this.isClassCovered(tok)) pending.add(tok);
+        }
+    };
+
+    const flush = this.debounce(() => {
+        if (loading || pending.size === 0) return;
+        const classes = Array.from(pending).sort();
+        pending = new Set();
+        loading = true;
+        console.warn('[Manifest Utilities] Uncovered utility class(es) — loading the Tailwind engine:', classes.join(', '));
+        window.Manifest.loadPlugin('tailwind').then(() => {
+            if (observer) observer.disconnect();
+            window.dispatchEvent(new CustomEvent('manifest:utilities-uncovered', { detail: { classes, engineLoaded: true } }));
+        }).catch((err) => {
+            loading = false; // let a further uncovered class try again
+            console.error('[Manifest Utilities] Failed to load the Tailwind engine:', err);
+            window.dispatchEvent(new CustomEvent('manifest:utilities-uncovered', { detail: { classes, engineLoaded: false } }));
+        });
+    }, this.options.debounceTime || 50);
+
+    observer = new MutationObserver((mutations) => {
+        for (const mutation of mutations) {
+            if (mutation.type === 'attributes') {
+                if (mutation.target.nodeType === Node.ELEMENT_NODE) collectFrom(mutation.target);
+            } else if (mutation.type === 'childList') {
+                for (const node of mutation.addedNodes) {
+                    if (node.nodeType !== Node.ELEMENT_NODE) continue;
+                    collectFrom(node);
+                    if (node.querySelectorAll) {
+                        for (const desc of node.querySelectorAll('[class]')) collectFrom(desc);
+                    }
+                }
+            }
+        }
+        if (pending.size > 0) flush();
+    });
+
+    observer.observe(document.documentElement, {
+        childList: true,
+        subtree: true,
+        attributes: true,
+        attributeFilter: ['class']
+    });
+    this.uncoveredClassObserver = observer; // exposed for tests/diagnostics
+
+    // A wrongly-stamped "complete" sheet may already have uncovered classes
+    // in the initial markup, before any mutation ever fires — check once now.
+    for (const el of document.querySelectorAll('[class]')) collectFrom(el);
+    if (pending.size > 0) flush();
+};
+
 
 // DOM observation: watch for changes and trigger recompilation
 

package/lib/manifest.utilities.node.mjs

@@ -574,12 +574,19 @@ class TailwindCompiler {
         // Cache for parsed class names (must be before addCriticalBlockingStylesSync)
         this.classCache = new Map();
 
-        // Read any publish/render-provided static utilities sheet before the
-        // first compile — its classes are skipped rather than regenerated.
-        // Fails open (never "everything covered") until this resolves —
-        // compile()'s first run awaits it, capped at 2s (see static.js).
+        // Read any publish/render-provided static utilities sheet, plus
+        // manifest.json's utilities.safelist/patterns, before the first
+        // compile — those classes are skipped rather than regenerated. Fails
+        // open (never "everything covered") until this resolves — compile()'s
+        // first run awaits it, capped at 2s (see static.js). Once settled,
+        // arm the uncovered-class watcher (a no-op unless the loader actually
+        // skipped fetching the Tailwind engine for this page).
         this.staticUtilitiesCoveredClasses = null;
-        this.staticUtilitiesReady = this.detectStaticUtilitiesSheet();
+        this.staticUtilitiesReady = Promise.all([
+            this.detectStaticUtilitiesSheet(),
+            this.loadUtilitiesSafelist()
+        ]);
+        this.staticUtilitiesReady.then(() => this.setupUncoveredClassWatcher());
 
         // Add critical styles IMMEDIATELY - don't wait for anything
         this.addCriticalBlockingStylesSync();
@@ -927,13 +934,17 @@ TailwindCompiler.prototype.extractClassesFromHTML = function (html, classSet) {
     // Literal class="..."/class='...' only — lookbehind excludes `:class=`
     // (Alpine binding), whose "class=" substring would otherwise match and
     // truncate at the literal's first internal quote, leaking a stray '{'.
+    // Backreference to the opening quote (rather than stopping at either
+    // quote char) so an arbitrary Tailwind value containing the OTHER quote
+    // character — `content-['*']`, `content-['']` — survives instead of
+    // truncating the whole class list at its first `'`.
     // Whitespace-only split below keeps every token Tailwind would accept
     // (variants, arbitrary values, leading '-', '!'); only x-/$ tokens drop.
-    const classRegex = /(?<![:\w])class=["']([^"']+)["']/g;
+    const classRegex = /(?<![:\w])class=(["'])((?:(?!\1)[\s\S])*)\1/g;
     let match;
 
     while ((match = classRegex.exec(html)) !== null) {
-        const classString = match[1];
+        const classString = match[2];
         const classes = classString.split(/\s+/).filter(Boolean);
         for (const cls of classes) {
             if (cls && !cls.startsWith('x-') && !cls.startsWith('$')) {
@@ -951,7 +962,11 @@ TailwindCompiler.prototype.extractClassesFromHTML = function (html, classSet) {
         if (classMatches) {
             for (const classMatch of classMatches) {
                 const cls = classMatch.replace(/['"`]/g, '');
-                if (cls && !cls.startsWith('$') && !cls.includes('(')) {
+                // x-data is arbitrary JS — a plain string literal in there
+                // (e.g. `location.pathname.split('/')`) matches this quoted-
+                // token scan too, so require a letter/digit; a punctuation-only
+                // "token" like a bare '/' is skipped (seen on a live page).
+                if (cls && !cls.startsWith('$') && !cls.includes('(') && /[a-zA-Z0-9]/.test(cls)) {
                     classSet.add(cls);
                 }
             }
@@ -3010,13 +3025,22 @@ async function compileTailwindPass(classes, injected) {
  * isolate) — see loadTailwindEngine. Omit it (the default) to keep using the
  * Node/CLI fs-based load.
  *
- * @param {{classes?: string[], themeCss?: string, baseCss?: string, tailwind?: {engine: object, themeCss: string, utilitiesCss: string}}} options
+ * `safelist` adds literal class names as extra candidates alongside `classes`
+ * — manifest.json's `utilities.safelist` (see scanClasses below), for classes
+ * a project knows it needs baked even though they never turn up in a plain
+ * HTML scan (e.g. built from a runtime value: `:class="ok ? 'bg-green-500' :
+ * 'bg-amber-500'"`). `utilities.patterns` (regex source strings) has no
+ * equivalent here — a pattern can't be enumerated into concrete candidates,
+ * so it only ever excuses a class from the runtime's uncovered-class watcher
+ * (manifest.utilities.static.js), never bakes one.
+ *
+ * @param {{classes?: string[], themeCss?: string, baseCss?: string, safelist?: string[], tailwind?: {engine: object, themeCss: string, utilitiesCss: string}}} options
  * @returns {Promise<string>}
  */
-export async function compileUtilities({ classes = [], themeCss = '', baseCss = '', tailwind = null } = {}) {
+export async function compileUtilities({ classes = [], themeCss = '', baseCss = '', safelist = [], tailwind = null } = {}) {
     const compiler = createNodeCompiler();
     const cssText = [baseCss, themeCss].filter(Boolean).join('\n');
-    const uniqueClasses = Array.from(new Set(classes));
+    const uniqueClasses = Array.from(new Set([...classes, ...safelist]));
 
     const discovered = compiler.extractCustomUtilities(cssText);
     for (const [name, value] of discovered) compiler.customUtilities.set(name, value);
@@ -3052,12 +3076,17 @@ const SHORTHAND_CLASS_BINDING_RE = /\B:class=(["'])((?:(?!\1)[\s\S])*)\1/g;
  * plugin uses (extractClassesFromHTML), plus `class:`/`:class` static tokens.
  * Skips `x-`/`$` tokens. Returns a sorted, deduplicated array.
  *
+ * `safelist` (manifest.json's `utilities.safelist`) is folded into the result
+ * so a caller that bakes per-file (scripts/utilities-static.mjs, or a
+ * publish pipeline) doesn't need a separate union step — see compileUtilities.
+ *
  * @param {string} html
+ * @param {{safelist?: string[]}} [options]
  * @returns {string[]}
  */
-export function scanClasses(html) {
+export function scanClasses(html, { safelist = [] } = {}) {
     const compiler = createNodeCompiler();
-    const set = new Set();
+    const set = new Set(safelist.filter(c => typeof c === 'string' && c));
     compiler.extractClassesFromHTML(html, set);
 
     let m;
@@ -3074,7 +3103,9 @@ export function scanClasses(html) {
         if (quoted) {
             for (const q of quoted) {
                 const cls = q.replace(/['"`]/g, '');
-                if (cls && !cls.startsWith('$') && !cls.startsWith('x-') && !cls.includes('(')) set.add(cls);
+                // Reject punctuation-only "tokens" (e.g. a bare '/' from an
+                // unrelated string literal in the expression) — see helpers.js.
+                if (cls && !cls.startsWith('$') && !cls.startsWith('x-') && !cls.includes('(') && /[a-zA-Z0-9]/.test(cls)) set.add(cls);
             }
         }
     }

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "mnfst",
-    "version": "0.5.205",
+    "version": "0.5.207",
     "private": false,
     "workspaces": [
         "templates/starter",