@stacksjs/stx 0.2.345 → 0.2.347

package/dist/dev-server/ts-css.js

@@ -354,56 +354,25 @@ async function generateCssUncached(htmlContent, appDir) {
       cachedConfig = await resolveUserCssConfig(resolveRoot);
       configFingerprint = fingerprintConfig(cachedConfig);
     }
-    const baseConfig = hw.defaultConfig || hw.config, userConfig = cachedConfig || {}, merged = mergeCssConfig(baseConfig, userConfig), { safelist, includePreflight, minify, tokenCSS } = merged, cssConfig = merged.config, generator = new hw.CSSGenerator(cssConfig);
+    const baseConfig = hw.defaultConfig || hw.config, userConfig = cachedConfig || {}, merged = mergeCssConfig(baseConfig, userConfig), { safelist, includePreflight, minify, tokenCSS } = merged, cssConfig = merged.config, generator = new hw.CSSGenerator(cssConfig), shortcuts = cssConfig.shortcuts || userConfig.shortcuts || {}, usedShortcuts = Object.keys(shortcuts).filter((name) => classes.has(name) || safelist.includes(name));
     for (const cls of safelist)
-      generator.generate(cls);
+      if (!shortcuts[cls])
+        generator.generate(cls);
     for (const className of classes)
-      generator.generate(className);
-    let css = generator.toCSS(includePreflight, minify);
-    const shortcuts = cssConfig.shortcuts || userConfig.shortcuts || {};
-    for (const [name, classStr] of Object.entries(shortcuts)) {
-      if (!classes.has(name) && !safelist.includes(name))
-        continue;
-      const parts = classStr.split(/\s+/).filter(Boolean);
-      for (const p of parts)
-        generator.generate(p);
-    }
-    css = generator.toCSS(includePreflight, minify);
-    const cssLines = css.split(`
-`);
-    for (const [name, classStr] of Object.entries(shortcuts)) {
-      if (!classes.has(name) && !safelist.includes(name))
-        continue;
-      const parts = classStr.split(/\s+/).filter(Boolean), decls = [], darkDecls = [];
-      for (const cls of parts) {
-        const isDark = cls.startsWith("dark:"), selectorTarget = `.${(isDark ? cls.slice(5) : cls).replace(/\//g, "\\/").replace(/:/g, "\\:").replace(/\./g, "\\.").replace(/\[/g, "\\[").replace(/\]/g, "\\]").replace(/%/g, "\\%")}`;
-        for (let i = 0;i < cssLines.length; i++) {
-          const line = cssLines[i].trim();
-          if (line === `${selectorTarget} {` || line.startsWith(`${selectorTarget} {`)) {
-            let j = i, ruleContent = "";
-            while (j < cssLines.length) {
-              ruleContent += cssLines[j];
-              if (cssLines[j].includes("}"))
-                break;
-              j++;
-            }
-            const declMatch = ruleContent.match(/\{([^}]+)\}/);
-            if (declMatch)
-              if (isDark)
-                darkDecls.push(declMatch[1].trim());
-              else
-                decls.push(declMatch[1].trim());
-            break;
-          }
-        }
-      }
-      if (decls.length)
-        css += `
-.${name} { ${decls.join(" ")} }`;
-      if (darkDecls.length)
-        css += `
-@media (prefers-color-scheme: dark) { .dark .${name} { ${darkDecls.join(" ")} } }`;
+      if (!shortcuts[className])
+        generator.generate(className);
+    let shortcutCSS = "";
+    if (usedShortcuts.length > 0) {
+      const shortcutGenerator = new hw.CSSGenerator(cssConfig);
+      for (const name of usedShortcuts)
+        shortcutGenerator.generate(name);
+      shortcutCSS = shortcutGenerator.toCSS(!1, minify);
+      if (shortcutCSS && !shortcutCSS.endsWith(`
+`))
+        shortcutCSS += `
+`;
     }
+    let css = shortcutCSS + generator.toCSS(includePreflight, minify);
     css = tokenCSS + css;
     setLruCache(cacheKey, css);
     writeDiskCache(cacheKey, css);

package/dist/process.js

@@ -641,23 +641,49 @@ function scriptSourceOf(attrs) {
   const match = new RegExp(`${SCRIPT_SOURCE_ATTR}="([^"]*)"`).exec(attrs);
   return match ? decodeURIComponent(match[1]) : void 0;
 }
+function escapeForBoundary(value) {
+  return value.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;");
+}
+function serverScriptErrorBoundary(sourcePath, kind, message) {
+  return `<div data-stx-server-script-error role="alert" style="padding:12px 14px;border:1px solid #f0b4b4;border-left-width:4px;background:#fff5f5;color:#7a1f1f;font:13px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace"><strong style="display:block;margin-bottom:4px">stx: a &lt;script server&gt; ${kind === "module-resolution" ? "imports a module that does not resolve" : kind === "syntax" ? "does not parse" : "names something that does not exist"}, so this component rendered nothing.</strong><span style="display:block;opacity:.85">${escapeForBoundary(sourcePath)}</span><span style="display:block;margin-top:4px">${escapeForBoundary(message)}</span></div>`;
+}
 async function extractServerScriptVariables(output, context, filePath) {
-  const scriptRegex = /<script\b([^>]*)>([\s\S]*?)<\/script>/gi;
-  let scriptMatch;
-  while ((scriptMatch = scriptRegex.exec(output)) !== null) {
-    const attrs = scriptMatch[1], scriptContent = scriptMatch[2];
-    if (!/\bserver\b/.test(attrs) || !scriptContent.trim())
+  const { scanScriptTags } = await importOnce("stx/signal-processing", () => import("./signal-processing.js")), boundaries = [], showBoundaries = !isProduction() && !isTest();
+  for (const script of scanScriptTags(output)) {
+    const attrs = script.attrs;
+    if (!/\bserver\b/.test(attrs))
+      continue;
+    const bodyStart = script.start + script.fullMatch.indexOf(">") + 1, closeStart = findScriptBodyEnd(output, bodyStart);
+    if (closeStart === -1)
+      continue;
+    const scriptContent = output.slice(bodyStart, closeStart);
+    if (!scriptContent.trim())
       continue;
-    const sourcePath = scriptSourceOf(attrs) ?? filePath;
+    const sourcePath = scriptSourceOf(attrs) ?? filePath, at = { index: script.start, length: closeStart + 9 - script.start };
     try {
       const { extractVariables } = await importOnce("stx/variable-extractor", () => import("./variable-extractor.js"));
-      await extractVariables(scriptContent, context, sourcePath, { preserveExisting: !0 });
+      await extractVariables(scriptContent, context, sourcePath, {
+        preserveExisting: !0,
+        onFailure: (failure) => {
+          if (!showBoundaries || failure.kind === "unknown")
+            return;
+          boundaries.push({ ...at, markup: serverScriptErrorBoundary(sourcePath, failure.kind, failure.message) });
+        }
+      });
     } catch (e) {
       const err = e instanceof Error ? e : Error(String(e));
       errorLogger.log(err, { filePath: sourcePath, phase: "server-script-extraction" }, "warning");
       console.warn(`[stx] server <script> extraction failed in ${sourcePath}: ${err.message}`);
+      if (showBoundaries)
+        boundaries.push({ ...at, markup: serverScriptErrorBoundary(sourcePath, "unknown", err.message) });
     }
   }
+  if (boundaries.length === 0)
+    return output;
+  let result = output;
+  for (const boundary of boundaries.sort((a, b) => b.index - a.index))
+    result = result.slice(0, boundary.index) + boundary.markup + result.slice(boundary.index + boundary.length);
+  return result;
 }
 async function interpolateClientScriptExpressions(output, context, filePath) {
   try {
@@ -673,7 +699,7 @@ async function interpolateClientScriptExpressions(output, context, filePath) {
 async function processOtherDirectives(template, context, filePath, options, dependencies) {
   let output = template;
   const opts = options;
-  await extractServerScriptVariables(output, context, filePath);
+  output = await extractServerScriptVariables(output, context, filePath);
   output = await interpolateClientScriptExpressions(output, context, filePath);
   output = await processJsDirectives(output, context, filePath);
   output = await processTsDirectives(output, context, filePath);

package/dist/pwa.js

@@ -1,6 +1,6 @@
 // @bun
 import{Fk as wq,Gk as dq,Hk as Cq,Ik as mq,Jk as gq}from"./chunk-wvc7t11n.js";import{Kk as S,Lk as Tq,Mk as _q,Nk as z,Ok as D,Pk as P,Qk as kq,Rk as vq,Sk as w,Tk as Iq,Uk as d,Vk as Hq,Wk as Oq,Xk as Mq}from"./chunk-c30qnb6z.js";import{Ew as Aq,Fw as bq,Gw as Sq,Hw as zq,Iw as Dq,Jw as Pq}from"./chunk-9nrgjtah.js";import{Nw as N}from"./chunk-ejqpq0wc.js";import p from"fs";import E from"path";import C from"fs";import L from"path";var k=[72,96,128,144,152,192,384,512],v=[120,152,167,180],I=[16,32];async function H(G,B){let q={success:!0,generatedFiles:[],errors:[],warnings:[]},K=G.pwa?.icons;if(!K?.src)return q.errors.push("No source icon specified in pwa.icons.src"),q.success=!1,q;let Y=L.isAbsolute(K.src)?K.src:L.resolve(process.cwd(),K.src);if(!await Bun.file(Y).exists())return q.errors.push(`Source icon not found: ${Y}`),q.success=!1,q;let Q=L.resolve(B,K.outputDir||"pwa-icons");try{C.mkdirSync(Q,{recursive:!0})}catch{return q.errors.push(`Failed to create output directory: ${Q}`),q.success=!1,q}let X=K.sizes||k,j=K.generateWebP??!0,J=K.generateAppleIcons??!0;try{let y;try{y=await import("sharp")}catch{return q.errors.push(`sharp is not installed. Install it with: bun add sharp
-Icon generation requires the sharp package for image processing.`),q.success=!1,q}let R=await y.default(Y).metadata();if(R.width&&R.width<512)q.warnings.push(`Source icon is ${R.width}x${R.height}. Recommend using at least 512x512 for best quality.`);for(let $ of X){let x=L.join(Q,`icon-${$}x${$}.png`);if(await y.default(Y).resize($,$,{fit:"contain",background:{r:0,g:0,b:0,alpha:0}}).png().toFile(x),q.generatedFiles.push(x),j){let F=L.join(Q,`icon-${$}x${$}.webp`);await y.default(Y).resize($,$,{fit:"contain",background:{r:0,g:0,b:0,alpha:0}}).webp({quality:90}).toFile(F),q.generatedFiles.push(F)}}if(J){for(let x of v){let F=L.join(Q,`apple-touch-icon-${x}x${x}.png`);await y.default(Y).resize(x,x,{fit:"contain",background:{r:255,g:255,b:255,alpha:1}}).png().toFile(F),q.generatedFiles.push(F)}let $=L.join(Q,"apple-touch-icon.png");await y.default(Y).resize(180,180,{fit:"contain",background:{r:255,g:255,b:255,alpha:1}}).png().toFile($),q.generatedFiles.push($)}for(let $ of I){let x=L.join(Q,`favicon-${$}x${$}.png`);await y.default(Y).resize($,$,{fit:"contain",background:{r:0,g:0,b:0,alpha:0}}).png().toFile(x),q.generatedFiles.push(x)}let U=512,T=L.join(Q,`icon-maskable-${U}x${U}.png`),Z=Math.floor(U*0.1),_=U-Z*2;await y.default(Y).resize(_,_,{fit:"contain",background:{r:0,g:0,b:0,alpha:0}}).extend({top:Z,bottom:Z,left:Z,right:Z,background:{r:255,g:255,b:255,alpha:1}}).png().toFile(T),q.generatedFiles.push(T)}catch(y){let V=y instanceof Error?y.message:String(y);q.errors.push(`Icon generation failed: ${V}`),q.success=!1}return q}function n(G){let B=G.sizes||k,q=G.outputDir?`/${G.outputDir}`:"/pwa-icons",K=G.generateWebP??!0,Y=G.generateAppleIcons??!0,Q=[];for(let X of B)if(Q.push(`${q}/icon-${X}x${X}.png`),K)Q.push(`${q}/icon-${X}x${X}.webp`);if(Y){Q.push(`${q}/apple-touch-icon.png`);for(let X of v)Q.push(`${q}/apple-touch-icon-${X}x${X}.png`)}for(let X of I)Q.push(`${q}/favicon-${X}x${X}.png`);return Q.push(`${q}/icon-maskable-512x512.png`),Q}async function O(){try{return await import("sharp"),!0}catch{return!1}}function m(G,B,q,K){let Y=[],Q=K.join(" ");for(let X of G)if(Y.push({src:`${B}/icon-${X}x${X}.png`,sizes:`${X}x${X}`,type:"image/png",purpose:Q}),q)Y.push({src:`${B}/icon-${X}x${X}.webp`,sizes:`${X}x${X}`,type:"image/webp",purpose:Q});return Y}function g(G){return G.map((B)=>({name:B.name,short_name:B.shortName,description:B.description,url:B.url,icons:B.icons?.map((q)=>({src:q.src,sizes:q.sizes,type:q.type}))}))}function h(G){let B=G.pwa?.shareTarget;if(!B?.enabled)return;let q={action:B.action||"/share",method:B.method||"POST",enctype:B.enctype||"multipart/form-data",params:{title:B.params?.title||"title",text:B.params?.text||"text",url:B.params?.url||"url"}};if(B.acceptFiles&&B.acceptFiles.length>0)q.params.files=B.acceptFiles.map((K)=>({name:K.name,accept:K.accept}));return q}function c(G){let B=G.pwa?.fileHandlers;if(!B?.enabled||!B.accept)return;let q=[{action:B.action||"/",accept:B.accept,launch_type:B.launchType||"single-client"}];if(B.icons)q[0].icons=B.icons.map((K)=>({src:K.src,sizes:K.sizes,type:K.type}));return q}function l(G){let B=G.pwa?.protocolHandlers;if(!B||B.length===0)return;return B.map((q)=>({protocol:q.protocol,url:q.url}))}function u(G){let B=G.pwa;if(!B?.enabled||!B.manifest)return null;let{manifest:q,icons:K}=B,Y=K?.sizes||[72,96,128,144,152,192,384,512],Q=K?.outputDir?`/${K.outputDir}`:"/pwa-icons",X=K?.generateWebP??!0,j=K?.purpose||["any","maskable"],J={name:q.name,short_name:q.shortName||q.name,description:q.description,start_url:q.startUrl||"/",display:q.display||"standalone",display_override:q.displayOverride,orientation:q.orientation,theme_color:q.themeColor,background_color:q.backgroundColor,scope:q.scope||"/",lang:q.lang,dir:q.dir,id:q.id,categories:q.categories,icons:m(Y,Q,X,j)};if(q.shortcuts&&q.shortcuts.length>0)J.shortcuts=g(q.shortcuts);if(q.screenshots&&q.screenshots.length>0)J.screenshots=q.screenshots.map((U)=>({src:U.src,sizes:U.sizes,type:U.type,label:U.label,form_factor:U.platform}));let y=h(G);if(y)J.share_target=y;let V=c(G);if(V)J.file_handlers=V;let R=l(G);if(R)J.protocol_handlers=R;if(q.launchHandler)J.launch_handler={client_mode:q.launchHandler};if(q.handleLinks)J.handle_links=q.handleLinks;if(q.edgeSidePanel?.enabled)J.edge_side_panel={preferred_width:q.edgeSidePanel.preferredWidth};return J}function M(G){let B=u(G);if(!B)return"";let q=JSON.parse(JSON.stringify(B));return JSON.stringify(q,null,2)}function i(G,B){return{...B,...G,shortcuts:G.shortcuts||B.shortcuts,screenshots:G.screenshots||B.screenshots,categories:G.categories||B.categories}}function s(G){let B=[],q=G.pwa;if(!q?.enabled)return B;let K=q.manifest;if(!K)return B.push("PWA manifest configuration is missing"),B;if(!K.name)B.push("Manifest name is required");let Y=["fullscreen","standalone","minimal-ui","browser"];if(K.display&&!Y.includes(K.display))B.push(`Invalid display mode: ${K.display}. Must be one of: ${Y.join(", ")}`);let Q=["any","natural","landscape","landscape-primary","landscape-secondary","portrait","portrait-primary","portrait-secondary"];if(K.orientation&&!Q.includes(K.orientation))B.push(`Invalid orientation: ${K.orientation}`);let X=/^#([0-9A-Fa-f]{3}|[0-9A-Fa-f]{6})$/;if(K.themeColor&&!X.test(K.themeColor))B.push(`Invalid theme color: ${K.themeColor}. Must be a valid hex color.`);if(K.backgroundColor&&!X.test(K.backgroundColor))B.push(`Invalid background color: ${K.backgroundColor}. Must be a valid hex color.`);if(q.shareTarget?.enabled){if(!q.shareTarget.action)B.push("Share target action URL is required")}if(q.fileHandlers?.enabled){if(!q.fileHandlers.accept||Object.keys(q.fileHandlers.accept).length===0)B.push("File handlers must specify accepted MIME types")}if(q.protocolHandlers)for(let j of q.protocolHandlers){if(!j.protocol)B.push("Protocol handler missing protocol");if(!j.url||!j.url.includes("%s"))B.push(`Protocol handler URL must contain %s placeholder: ${j.protocol}`)}return B}import A from"path";async function b(G){let B=G.pwa?.offline;if(!B?.enabled)return"";if(B.page){let q=A.isAbsolute(B.page)?B.page:A.resolve(process.cwd(),B.page);if(await Bun.file(q).exists())try{let{processDirectives:K}=await import("./chunk-2fhk4e68.js"),Y=await Bun.file(q).text();return await K(Y,{},q,G,new Set)}catch(K){console.warn(`[PWA] Failed to process custom offline page: ${K}`)}else console.warn(`[PWA] Custom offline page not found: ${q}`)}return f(G)}function f(G){let B=G.pwa?.offline,q=G.pwa?.manifest,K=B?.fallbackTitle||"You are offline",Y=B?.fallbackMessage||"Please check your internet connection and try again.",Q=q?.themeColor||"#4f46e5",X=q?.shortName||q?.name||"App";return`<!DOCTYPE html>
+Icon generation requires the sharp package for image processing.`),q.success=!1,q}let R=await y.default(Y).metadata();if(R.width&&R.width<512)q.warnings.push(`Source icon is ${R.width}x${R.height}. Recommend using at least 512x512 for best quality.`);for(let $ of X){let x=L.join(Q,`icon-${$}x${$}.png`);if(await y.default(Y).resize($,$,{fit:"contain",background:{r:0,g:0,b:0,alpha:0}}).png().toFile(x),q.generatedFiles.push(x),j){let F=L.join(Q,`icon-${$}x${$}.webp`);await y.default(Y).resize($,$,{fit:"contain",background:{r:0,g:0,b:0,alpha:0}}).webp({quality:90}).toFile(F),q.generatedFiles.push(F)}}if(J){for(let x of v){let F=L.join(Q,`apple-touch-icon-${x}x${x}.png`);await y.default(Y).resize(x,x,{fit:"contain",background:{r:255,g:255,b:255,alpha:1}}).png().toFile(F),q.generatedFiles.push(F)}let $=L.join(Q,"apple-touch-icon.png");await y.default(Y).resize(180,180,{fit:"contain",background:{r:255,g:255,b:255,alpha:1}}).png().toFile($),q.generatedFiles.push($)}for(let $ of I){let x=L.join(Q,`favicon-${$}x${$}.png`);await y.default(Y).resize($,$,{fit:"contain",background:{r:0,g:0,b:0,alpha:0}}).png().toFile(x),q.generatedFiles.push(x)}let U=512,T=L.join(Q,`icon-maskable-${U}x${U}.png`),Z=Math.floor(U*0.1),_=U-Z*2;await y.default(Y).resize(_,_,{fit:"contain",background:{r:0,g:0,b:0,alpha:0}}).extend({top:Z,bottom:Z,left:Z,right:Z,background:{r:255,g:255,b:255,alpha:1}}).png().toFile(T),q.generatedFiles.push(T)}catch(y){let V=y instanceof Error?y.message:String(y);q.errors.push(`Icon generation failed: ${V}`),q.success=!1}return q}function n(G){let B=G.sizes||k,q=G.outputDir?`/${G.outputDir}`:"/pwa-icons",K=G.generateWebP??!0,Y=G.generateAppleIcons??!0,Q=[];for(let X of B)if(Q.push(`${q}/icon-${X}x${X}.png`),K)Q.push(`${q}/icon-${X}x${X}.webp`);if(Y){Q.push(`${q}/apple-touch-icon.png`);for(let X of v)Q.push(`${q}/apple-touch-icon-${X}x${X}.png`)}for(let X of I)Q.push(`${q}/favicon-${X}x${X}.png`);return Q.push(`${q}/icon-maskable-512x512.png`),Q}async function O(){try{return await import("sharp"),!0}catch{return!1}}function m(G,B,q,K){let Y=[],Q=K.join(" ");for(let X of G)if(Y.push({src:`${B}/icon-${X}x${X}.png`,sizes:`${X}x${X}`,type:"image/png",purpose:Q}),q)Y.push({src:`${B}/icon-${X}x${X}.webp`,sizes:`${X}x${X}`,type:"image/webp",purpose:Q});return Y}function g(G){return G.map((B)=>({name:B.name,short_name:B.shortName,description:B.description,url:B.url,icons:B.icons?.map((q)=>({src:q.src,sizes:q.sizes,type:q.type}))}))}function h(G){let B=G.pwa?.shareTarget;if(!B?.enabled)return;let q={action:B.action||"/share",method:B.method||"POST",enctype:B.enctype||"multipart/form-data",params:{title:B.params?.title||"title",text:B.params?.text||"text",url:B.params?.url||"url"}};if(B.acceptFiles&&B.acceptFiles.length>0)q.params.files=B.acceptFiles.map((K)=>({name:K.name,accept:K.accept}));return q}function c(G){let B=G.pwa?.fileHandlers;if(!B?.enabled||!B.accept)return;let q=[{action:B.action||"/",accept:B.accept,launch_type:B.launchType||"single-client"}];if(B.icons)q[0].icons=B.icons.map((K)=>({src:K.src,sizes:K.sizes,type:K.type}));return q}function l(G){let B=G.pwa?.protocolHandlers;if(!B||B.length===0)return;return B.map((q)=>({protocol:q.protocol,url:q.url}))}function u(G){let B=G.pwa;if(!B?.enabled||!B.manifest)return null;let{manifest:q,icons:K}=B,Y=K?.sizes||[72,96,128,144,152,192,384,512],Q=K?.outputDir?`/${K.outputDir}`:"/pwa-icons",X=K?.generateWebP??!0,j=K?.purpose||["any","maskable"],J={name:q.name,short_name:q.shortName||q.name,description:q.description,start_url:q.startUrl||"/",display:q.display||"standalone",display_override:q.displayOverride,orientation:q.orientation,theme_color:q.themeColor,background_color:q.backgroundColor,scope:q.scope||"/",lang:q.lang,dir:q.dir,id:q.id,categories:q.categories,icons:m(Y,Q,X,j)};if(q.shortcuts&&q.shortcuts.length>0)J.shortcuts=g(q.shortcuts);if(q.screenshots&&q.screenshots.length>0)J.screenshots=q.screenshots.map((U)=>({src:U.src,sizes:U.sizes,type:U.type,label:U.label,form_factor:U.platform}));let y=h(G);if(y)J.share_target=y;let V=c(G);if(V)J.file_handlers=V;let R=l(G);if(R)J.protocol_handlers=R;if(q.launchHandler)J.launch_handler={client_mode:q.launchHandler};if(q.handleLinks)J.handle_links=q.handleLinks;if(q.edgeSidePanel?.enabled)J.edge_side_panel={preferred_width:q.edgeSidePanel.preferredWidth};return J}function M(G){let B=u(G);if(!B)return"";let q=JSON.parse(JSON.stringify(B));return JSON.stringify(q,null,2)}function i(G,B){return{...B,...G,shortcuts:G.shortcuts||B.shortcuts,screenshots:G.screenshots||B.screenshots,categories:G.categories||B.categories}}function s(G){let B=[],q=G.pwa;if(!q?.enabled)return B;let K=q.manifest;if(!K)return B.push("PWA manifest configuration is missing"),B;if(!K.name)B.push("Manifest name is required");let Y=["fullscreen","standalone","minimal-ui","browser"];if(K.display&&!Y.includes(K.display))B.push(`Invalid display mode: ${K.display}. Must be one of: ${Y.join(", ")}`);let Q=["any","natural","landscape","landscape-primary","landscape-secondary","portrait","portrait-primary","portrait-secondary"];if(K.orientation&&!Q.includes(K.orientation))B.push(`Invalid orientation: ${K.orientation}`);let X=/^#([0-9A-Fa-f]{3}|[0-9A-Fa-f]{6})$/;if(K.themeColor&&!X.test(K.themeColor))B.push(`Invalid theme color: ${K.themeColor}. Must be a valid hex color.`);if(K.backgroundColor&&!X.test(K.backgroundColor))B.push(`Invalid background color: ${K.backgroundColor}. Must be a valid hex color.`);if(q.shareTarget?.enabled){if(!q.shareTarget.action)B.push("Share target action URL is required")}if(q.fileHandlers?.enabled){if(!q.fileHandlers.accept||Object.keys(q.fileHandlers.accept).length===0)B.push("File handlers must specify accepted MIME types")}if(q.protocolHandlers)for(let j of q.protocolHandlers){if(!j.protocol)B.push("Protocol handler missing protocol");if(!j.url||!j.url.includes("%s"))B.push(`Protocol handler URL must contain %s placeholder: ${j.protocol}`)}return B}import A from"path";async function b(G){let B=G.pwa?.offline;if(!B?.enabled)return"";if(B.page){let q=A.isAbsolute(B.page)?B.page:A.resolve(process.cwd(),B.page);if(await Bun.file(q).exists())try{let{processDirectives:K}=await import("./chunk-ns38fhve.js"),Y=await Bun.file(q).text();return await K(Y,{},q,G,new Set)}catch(K){console.warn(`[PWA] Failed to process custom offline page: ${K}`)}else console.warn(`[PWA] Custom offline page not found: ${q}`)}return f(G)}function f(G){let B=G.pwa?.offline,q=G.pwa?.manifest,K=B?.fallbackTitle||"You are offline",Y=B?.fallbackMessage||"Please check your internet connection and try again.",Q=q?.themeColor||"#4f46e5",X=q?.shortName||q?.name||"App";return`<!DOCTYPE html>
 <html lang="en">
 <head>
   <meta charset="UTF-8">

package/dist/signals.js

@@ -6487,6 +6487,89 @@ catch (e) {} }
   // Both return Promises and render into a temporary modal overlay.
 
   var _dialogId = 0;
+
+  // Shared across every open dialog, because four of the defects in #1998 were
+  // each dialog acting as if it were the only one.
+  var _dialogStack = [];
+  // What WE set inert, so restoring never clears an app's own inert.
+  var _dialogInerted = [];
+  // Saved once, when the first dialog opens.
+  var _dialogScrollLock = null;
+
+  /*
+   * The page behind an aria-modal dialog does not scroll and is not reachable
+   * by a virtual cursor (stacksjs/stx#1998, items 1 and 2).
+   *
+   * The backdrop is position:fixed;inset:0, so it stayed put while the content
+   * behind it scrolled away underneath - the dialog claimed to be modal and the
+   * page moved anyway. And the Tab trap, which #1875 added, only covers the
+   * keyboard: aria-modal support for the virtual cursor is uneven, so a screen
+   * reader could still browse the page behind the dialog.
+   *
+   * inert rather than aria-hidden on the siblings: aria-hidden on an element
+   * that contains focus is itself a violation, and inert removes the subtree
+   * from the tab order and the accessibility tree together. Everything except
+   * the TOPMOST dialog goes inert, which also settles the two traps competing
+   * for Tab while both were open - a backgrounded dialog's buttons stop being
+   * focusable at all.
+   */
+  function _dialogSyncModality() {
+    var top = _dialogStack.length ? _dialogStack[_dialogStack.length - 1] : null;
+
+    for (var i = 0; i < _dialogInerted.length; i++) {
+      try { _dialogInerted[i].inert = false; }
+      catch (_e) { /* element may be gone */ }
+    }
+    _dialogInerted = [];
+
+    if (!top) {
+      if (_dialogScrollLock) {
+        document.body.style.overflow = _dialogScrollLock.body;
+        document.documentElement.style.overflow = _dialogScrollLock.html;
+        document.body.style.paddingRight = _dialogScrollLock.pad;
+        _dialogScrollLock = null;
+      }
+      return;
+    }
+
+    if (!_dialogScrollLock) {
+      _dialogScrollLock = {
+        body: document.body.style.overflow,
+        html: document.documentElement.style.overflow,
+        pad: document.body.style.paddingRight
+      };
+      // Compensate for the scrollbar the lock removes, or the whole page shifts
+      // sideways the moment a dialog opens.
+      var gap = window.innerWidth - document.documentElement.clientWidth;
+      if (gap > 0) {
+        var existing = Number.parseFloat(window.getComputedStyle(document.body).paddingRight) || 0;
+        document.body.style.paddingRight = (existing + gap) + 'px';
+      }
+      document.body.style.overflow = 'hidden';
+      document.documentElement.style.overflow = 'hidden';
+    }
+
+    var kids = document.body.children;
+    for (var k = 0; k < kids.length; k++) {
+      var kid = kids[k];
+      if (kid === top || kid.inert) continue;
+      try {
+        kid.inert = true;
+        _dialogInerted.push(kid);
+      }
+      catch (_e) { /* inert unsupported; the Tab trap still holds */ }
+    }
+  }
+
+  /** Dialogs animate unless the reader asked them not to (#1998 item 5). */
+  function _dialogReducedMotion() {
+    try {
+      return !!(window.matchMedia && window.matchMedia('(prefers-reduced-motion: reduce)').matches);
+    }
+    catch (_e) {
+      return false;
+    }
+  }
   var _dialogIcons = {
     info: '<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#2563eb" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><line x1="12" y1="16" x2="12" y2="12"/><line x1="12" y1="8" x2="12.01" y2="8"/></svg>',
     warning: '<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#d97706" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M10.29 3.86L1.82 18a2 2 0 001.71 3h16.94a2 2 0 001.71-3L13.71 3.86a2 2 0 00-3.42 0z"/><line x1="12" y1="9" x2="12" y2="13"/><line x1="12" y1="17" x2="12.01" y2="17"/></svg>',
@@ -6514,14 +6597,23 @@ catch (e) {} }
     var icon = _dialogIcons[type] || _dialogIcons.info;
 
     return new Promise(function(resolve) {
+      // Inline transitions cannot be reached by a stylesheet media query, so the
+      // preference is read here instead (#1998 item 5). One matchMedia probe
+      // rather than usePreferredReducedMotion(): that returns a signal with a
+      // change listener, and an imperative dialog that reads the value once at
+      // open time would leak one listener per call.
+      var still = _dialogReducedMotion();
+      var fade = still ? '' : 'transition:opacity 0.2s ease;';
+      var scale = still ? '' : 'transition:transform 0.2s ease;';
+
       var backdrop = document.createElement('div');
       backdrop.id = id;
-      backdrop.style.cssText = 'position:fixed;inset:0;z-index:999999;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,0.5);backdrop-filter:blur(2px);opacity:0;transition:opacity 0.2s ease;font-family:system-ui,-apple-system,sans-serif';
+      backdrop.style.cssText = 'position:fixed;inset:0;z-index:999999;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,0.5);backdrop-filter:blur(2px);opacity:' + (still ? '1' : '0') + ';' + fade + 'font-family:system-ui,-apple-system,sans-serif';
       backdrop.setAttribute('role', 'alertdialog');
       backdrop.setAttribute('aria-modal', 'true');
 
       var panel = document.createElement('div');
-      panel.style.cssText = 'max-width:24rem;width:calc(100% - 2rem);border-radius:0.75rem;padding:1.5rem;background:' + bg + ';color:' + textColor + ';box-shadow:0 20px 60px rgba(0,0,0,0.3);transform:scale(0.95);transition:transform 0.2s ease;text-align:center';
+      panel.style.cssText = 'max-width:24rem;width:calc(100% - 2rem);border-radius:0.75rem;padding:1.5rem;background:' + bg + ';color:' + textColor + ';box-shadow:0 20px 60px rgba(0,0,0,0.3);transform:scale(' + (still ? '1' : '0.95') + ');' + scale + 'text-align:center';
 
       var iconDiv = document.createElement('div');
       iconDiv.style.cssText = 'display:flex;justify-content:center;margin-bottom:1rem';
@@ -6562,9 +6654,25 @@ catch (e) {} }
         if (closed) return;
         closed = true;
         document.removeEventListener('keydown', keyHandler, true);
+
+        // Out of the stack BEFORE resolving, so a caller that opens another
+        // dialog the moment this one answers does not land under a backdrop
+        // that is still fading.
+        var at = _dialogStack.indexOf(backdrop);
+        if (at !== -1) _dialogStack.splice(at, 1);
+
+        // The fade is 200ms and resolve() is immediate, so for those 200ms a
+        // full-viewport element at z-index 999999 was still hit-testing at the
+        // centre of the screen - after the caller's await had already returned
+        // (#1998 item 6). Fading out is right; swallowing clicks is not.
+        backdrop.style.pointerEvents = 'none';
         backdrop.style.opacity = '0';
-        panel.style.transform = 'scale(0.95)';
-        setTimeout(function() { backdrop.remove(); }, 200);
+        if (!still) panel.style.transform = 'scale(0.95)';
+        setTimeout(function() { backdrop.remove(); }, still ? 0 : 200);
+
+        // Unlocks the page and clears inert when this was the last dialog, or
+        // hands modality back to the one underneath when it was not.
+        _dialogSyncModality();
         if (previouslyFocused && typeof previouslyFocused.focus === 'function') {
           try { previouslyFocused.focus(); }
           catch (_e) { /* element may be gone; not worth failing the dialog over */ }
@@ -6572,8 +6680,11 @@ catch (e) {} }
         resolve(result);
       }
 
+      // Declared out here rather than inside the branch: the focus decision
+      // below needs to know whether a Cancel button exists at all.
+      var cancelBtn = null;
       if (isConfirm) {
-        var cancelBtn = document.createElement('button');
+        cancelBtn = document.createElement('button');
         cancelBtn.textContent = cancelText;
         cancelBtn.style.cssText = 'padding:0.5rem 1.25rem;border-radius:0.5rem;font-size:0.875rem;font-weight:500;cursor:pointer;border:1px solid ' + (isDark ? '#374151' : '#d1d5db') + ';background:transparent;color:' + textColor + ';transition:background 0.15s';
         cancelBtn.onmouseover = function() { this.style.background = isDark ? '#374151' : '#f3f4f6'; };
@@ -6594,11 +6705,15 @@ catch (e) {} }
       panel.appendChild(btnRow);
       backdrop.appendChild(panel);
       document.body.appendChild(backdrop);
+      _dialogStack.push(backdrop);
+      _dialogSyncModality();
 
       // Animate in
-      void backdrop.offsetHeight;
-      backdrop.style.opacity = '1';
-      panel.style.transform = 'scale(1)';
+      if (!still) {
+        void backdrop.offsetHeight;
+        backdrop.style.opacity = '1';
+        panel.style.transform = 'scale(1)';
+      }
 
       // Escape, plus a real focus trap.
       //
@@ -6611,6 +6726,11 @@ catch (e) {} }
       // walked straight out into the page behind it. Capture phase so the trap
       // wins over anything the page has bound.
       var keyHandler = function(e) {
+        // Every dialog binds its own capture-phase handler on document and none
+        // of them checked whether they were on top, so ONE Escape resolved every
+        // open dialog at once (#1998 item 4). The backgrounded dialogs are inert
+        // too, which is what stops their traps competing for Tab.
+        if (_dialogStack.length && _dialogStack[_dialogStack.length - 1] !== backdrop) return;
         if (e.key === 'Escape') {
           e.preventDefault();
           cleanup(isConfirm ? false : undefined);
@@ -6640,8 +6760,24 @@ catch (e) {} }
       };
       document.addEventListener('keydown', keyHandler, true);
 
-      // Focus the primary button
-      okBtn.focus();
+      /*
+       * Initial focus, which was an unconditional okBtn.focus() (#1998 item 3).
+       *
+       * type: 'error' already paints that button red, so the API knows the
+       * action is destructive - and still handed it the keyboard, where a stray
+       * Enter or Space confirmed the delete. An error-type confirm now defaults
+       * to Cancel, and defaultFocus overrides either way.
+       *
+       * An alert has only one button, so it keeps it: there is nothing
+       * destructive to land on and focus has to go somewhere inside the trap.
+       */
+      var focusTarget = okBtn;
+      if (isConfirm && cancelBtn) {
+        var want = opts.defaultFocus;
+        if (want === 'cancel' || (!want && type === 'error')) focusTarget = cancelBtn;
+        else if (want === 'confirm') focusTarget = okBtn;
+      }
+      focusTarget.focus();
     });
   }
 

package/dist/ssg.js

@@ -1,5 +1,5 @@
 // @bun
-import{Bk as Fq,wk as Uq,xk as Iq}from"./chunk-v7aa7v85.js";import{Ck as Eq,Dk as Tq,Ek as Dq}from"./chunk-c0n802j1.js";import{Zk as _q,al as zq,bl as Aq}from"./chunk-223makqc.js";import"./chunk-77p1kjg2.js";import"./chunk-fvsefztj.js";import{Jp as P,Sm as Oq,io as l,lo as Hq,sr as n}from"./chunk-4spaszfn.js";import"./chunk-8y1ve8tc.js";import"./chunk-njx93b4z.js";import"./chunk-bqdfbwdf.js";import"./chunk-89mqnh67.js";import"./chunk-xvh1k1a4.js";import{it as Xq}from"./chunk-r38xq7fp.js";import{nt as d}from"./chunk-y2f41kaq.js";import"./chunk-xj6bcwqa.js";import"./chunk-z8wb7kbj.js";import"./chunk-vhta1be7.js";import{Ut as Bq}from"./chunk-tc4pj651.js";import"./chunk-san1eq0r.js";import"./chunk-avwywzsj.js";import"./chunk-wj21f1e0.js";import"./chunk-d86q27j8.js";import"./chunk-72x62kch.js";import{rw as Yq,sw as Vq,tw as jq,uw as Gq,vw as Lq,ww as Nq}from"./chunk-yg5r7bnm.js";import"./chunk-9nrgjtah.js";import{Nw as y}from"./chunk-ejqpq0wc.js";import O from"fs";import j from"path";import{createHash as xq}from"crypto";function yq(q){try{return new Bun.Transpiler({loader:"js",minifyWhitespace:!0}).transformSync(q).replace(/\}(var |let |const |function )/g,"};$1").trim()}catch{return q}}var Pq=/<script\s+type="stx\/island"\s+data-stx-island="([^"]+)"([^>]*)>([\s\S]*?)<\/script>/g;function Cq(q){return Bun.hash(q).toString(16)}function Qq(q,Z={}){if(!q.includes('type="stx/island"'))return{html:q,chunks:[]};let $=new Map,Q=q.replace(Pq,(J,W,z,A)=>{let G=A.trim();if(!G)return J;if(/\bdata-stx-src=/.test(z))return J;if(Z.minify)G=yq(G);let X=Cq(G);if(!$.has(X))$.set(X,G);let B=Z.integrity?` data-stx-integrity="sha384-${xq("sha384").update(G).digest("base64")}"`:"";return`<script type="stx/island" data-stx-island="${W}" data-stx-src="/_stx/islands/${X}.js"${B}${z}></script>`}),K=Array.from($,([J,W])=>({hash:J,code:W}));return{html:Q,chunks:K}}var gq=new Set(["visible","idle"]);function Zq(q){if(!q.includes("data-stx-src="))return q;let Z=new Map,$=/data-stx-scope="([^"]+)"[^>]*?stx-hydrate="([^"]+)"/g,Q;while((Q=$.exec(q))!==null)Z.set(Q[1],Q[2]);let K=new Set,J=/data-stx-island="([^"]+)"[^>]*?data-stx-src="([^"]+)"/g,W;while((W=J.exec(q))!==null)if(gq.has(Z.get(W[1])||""))K.add(W[2]);let z=q.lastIndexOf("</head>");if(K.size===0||z===-1)return q;let A=Array.from(K).filter((G)=>!q.includes(`rel="prefetch" href="${G}"`)).map((G)=>`<link rel="prefetch" href="${G}" as="script">`).join("");if(!A)return q;return q.slice(0,z)+A+q.slice(z)}var fq=["STX_SITE_URL","SITE_URL","URL","VERCEL_URL","CF_PAGES_URL"];function h(q){let Z=q.trim();if(!Z)return null;let $=/^https?:\/\//i.test(Z)?Z:`https://${Z}`;try{return new URL($).origin+new URL($).pathname.replace(/\/$/,"")}catch{return null}}function mq(q){for(let Z of fq){let $=q[Z];if(!$)continue;let Q=h($);if(Q)return{url:Q,source:"env",via:Z}}return null}function $q(q){if(!q||typeof q!=="object")return null;let Z=q,$=Z.site?.url??Z.url??Z.app?.url;return typeof $==="string"?h($):null}async function dq(q){let{existsSync:Z}=await import("fs"),$=await import("path");for(let Q of["site.config.ts","site.config.js",".config/site.config.ts"]){let K=$.resolve(q,Q);if(!Z(K))continue;try{let J=await import(K),W=$q(J.default??J);if(W)return W}catch{}}return null}async function Kq(q={}){let Z=q.cwd??process.cwd(),$=q.env??process.env;if(q.explicit){let W=h(q.explicit);if(W)return{url:W,source:"option"}}let Q=$q(q.stxConfig);if(Q)return{url:Q,source:"stx.config",via:"site.url"};let K=await dq(Z);if(K)return{url:K,source:"site.config",via:"url"};let J=mq($);if(J)return J;return{url:"http://localhost",source:"fallback"}}function Wq(){return["No site URL configured \u2014 sitemap.xml and robots.txt will point at http://localhost.","  Set one in stx.config.ts (site: { url: 'https://example.com' }), in site.config.ts,","  via --domain, or with SITE_URL in the build environment."].join(`
+import{Bk as Fq,wk as Uq,xk as Iq}from"./chunk-p3p4d6g1.js";import{Ck as Eq,Dk as Tq,Ek as Dq}from"./chunk-c0n802j1.js";import{Zk as _q,al as zq,bl as Aq}from"./chunk-0vdng9sh.js";import"./chunk-9rc9gshn.js";import"./chunk-fvsefztj.js";import{Jp as P,Sm as Oq,io as l,lo as Hq,sr as n}from"./chunk-h2sbvyr4.js";import"./chunk-8y1ve8tc.js";import"./chunk-njx93b4z.js";import"./chunk-bqdfbwdf.js";import"./chunk-89mqnh67.js";import"./chunk-xvh1k1a4.js";import{it as Xq}from"./chunk-gnb15a8d.js";import{nt as d}from"./chunk-y2f41kaq.js";import"./chunk-xj6bcwqa.js";import"./chunk-qrhbqzz0.js";import"./chunk-vhta1be7.js";import{Ut as Bq}from"./chunk-tc4pj651.js";import"./chunk-san1eq0r.js";import"./chunk-avwywzsj.js";import"./chunk-wj21f1e0.js";import"./chunk-d86q27j8.js";import"./chunk-72x62kch.js";import{rw as Yq,sw as Vq,tw as jq,uw as Gq,vw as Lq,ww as Nq}from"./chunk-swvm1wgn.js";import"./chunk-9nrgjtah.js";import{Nw as y}from"./chunk-ejqpq0wc.js";import O from"fs";import j from"path";import{createHash as xq}from"crypto";function yq(q){try{return new Bun.Transpiler({loader:"js",minifyWhitespace:!0}).transformSync(q).replace(/\}(var |let |const |function )/g,"};$1").trim()}catch{return q}}var Pq=/<script\s+type="stx\/island"\s+data-stx-island="([^"]+)"([^>]*)>([\s\S]*?)<\/script>/g;function Cq(q){return Bun.hash(q).toString(16)}function Qq(q,Z={}){if(!q.includes('type="stx/island"'))return{html:q,chunks:[]};let $=new Map,Q=q.replace(Pq,(J,W,z,A)=>{let G=A.trim();if(!G)return J;if(/\bdata-stx-src=/.test(z))return J;if(Z.minify)G=yq(G);let X=Cq(G);if(!$.has(X))$.set(X,G);let B=Z.integrity?` data-stx-integrity="sha384-${xq("sha384").update(G).digest("base64")}"`:"";return`<script type="stx/island" data-stx-island="${W}" data-stx-src="/_stx/islands/${X}.js"${B}${z}></script>`}),K=Array.from($,([J,W])=>({hash:J,code:W}));return{html:Q,chunks:K}}var gq=new Set(["visible","idle"]);function Zq(q){if(!q.includes("data-stx-src="))return q;let Z=new Map,$=/data-stx-scope="([^"]+)"[^>]*?stx-hydrate="([^"]+)"/g,Q;while((Q=$.exec(q))!==null)Z.set(Q[1],Q[2]);let K=new Set,J=/data-stx-island="([^"]+)"[^>]*?data-stx-src="([^"]+)"/g,W;while((W=J.exec(q))!==null)if(gq.has(Z.get(W[1])||""))K.add(W[2]);let z=q.lastIndexOf("</head>");if(K.size===0||z===-1)return q;let A=Array.from(K).filter((G)=>!q.includes(`rel="prefetch" href="${G}"`)).map((G)=>`<link rel="prefetch" href="${G}" as="script">`).join("");if(!A)return q;return q.slice(0,z)+A+q.slice(z)}var fq=["STX_SITE_URL","SITE_URL","URL","VERCEL_URL","CF_PAGES_URL"];function h(q){let Z=q.trim();if(!Z)return null;let $=/^https?:\/\//i.test(Z)?Z:`https://${Z}`;try{return new URL($).origin+new URL($).pathname.replace(/\/$/,"")}catch{return null}}function mq(q){for(let Z of fq){let $=q[Z];if(!$)continue;let Q=h($);if(Q)return{url:Q,source:"env",via:Z}}return null}function $q(q){if(!q||typeof q!=="object")return null;let Z=q,$=Z.site?.url??Z.url??Z.app?.url;return typeof $==="string"?h($):null}async function dq(q){let{existsSync:Z}=await import("fs"),$=await import("path");for(let Q of["site.config.ts","site.config.js",".config/site.config.ts"]){let K=$.resolve(q,Q);if(!Z(K))continue;try{let J=await import(K),W=$q(J.default??J);if(W)return W}catch{}}return null}async function Kq(q={}){let Z=q.cwd??process.cwd(),$=q.env??process.env;if(q.explicit){let W=h(q.explicit);if(W)return{url:W,source:"option"}}let Q=$q(q.stxConfig);if(Q)return{url:Q,source:"stx.config",via:"site.url"};let K=await dq(Z);if(K)return{url:K,source:"site.config",via:"url"};let J=mq($);if(J)return J;return{url:"http://localhost",source:"fallback"}}function Wq(){return["No site URL configured \u2014 sitemap.xml and robots.txt will point at http://localhost.","  Set one in stx.config.ts (site: { url: 'https://example.com' }), in site.config.ts,","  via --domain, or with SITE_URL in the build environment."].join(`
 `)}class wq{cacheDir;cache=new Map;loaded=!1;salt;constructor(q,Z=""){this.cacheDir=q,this.salt=Z}async load(){if(this.loaded)return;let q=j.join(this.cacheDir,"build-cache.json");if(await Bun.file(q).exists())try{let Z=JSON.parse(await Bun.file(q).text());for(let[$,Q]of Object.entries(Z))this.cache.set($,Q)}catch{}this.loaded=!0}async save(){await O.promises.mkdir(this.cacheDir,{recursive:!0});let q=j.join(this.cacheDir,"build-cache.json"),Z={};for(let[$,Q]of this.cache)Z[$]=Q;await Bun.write(q,JSON.stringify(Z))}getHash(q,Z){let $=O.statSync(q),Q=`${this.salt}|${q}:${$.mtimeMs}`;for(let J of Z)if(O.existsSync(J)){let W=O.statSync(J);Q+=`:${J}:${W.mtimeMs}`}let K=0;for(let J=0;J<Q.length;J++){let W=Q.charCodeAt(J);K=(K<<5)-K+W,K=K&K}return Math.abs(K).toString(36)}get(q,Z){let $=this.cache.get(q);if(!$)return null;let Q=this.getHash(Z,$.dependencies??[]);if($.hash!==Q)return this.cache.delete(q),null;return $.html}set(q,Z,$,Q){let K=this.getHash(Z,$);this.cache.set(q,{hash:K,html:Q,generatedAt:Date.now(),dependencies:$})}}class Rq{cacheDir;constructor(q){this.cacheDir=q}getFilePath(q){let Z=q.replace(/[^a-zA-Z0-9]/g,"_")+".json";return j.join(this.cacheDir,"isr",Z)}async get(q){let Z=this.getFilePath(q);if(!await Bun.file(Z).exists())return null;try{return JSON.parse(await Bun.file(Z).text())}catch{return null}}async set(q,Z){let $=this.getFilePath(q);await O.promises.mkdir(j.dirname($),{recursive:!0}),await Bun.write($,JSON.stringify(Z))}async invalidate(q){let Z=this.getFilePath(q);if(await Bun.file(Z).exists())await O.promises.unlink(Z)}async invalidatePattern(q){let Z=j.join(this.cacheDir,"isr");if(!O.existsSync(Z))return;let $=await O.promises.readdir(Z);for(let Q of $){let K=Q.replace(/_/g,"/").replace(".json","");if(q.test(K))await O.promises.unlink(j.join(Z,Q))}}async needsRevalidation(q){let Z=await this.get(q);if(!Z)return!0;return Date.now()>Z.revalidateAfter}}async function pq(q){try{let $=(await Bun.file(q).text()).match(/<script\s+server\b[^>]*>([\s\S]*?)<\/script>/i);if(!$)return null;let Q=$[1];if(!Q.includes("getStaticPaths"))return null;let K=Q.match(/(?:export\s+)?(?:async\s+)?function\s+getStaticPaths\s*\([^)]*\)\s*\{([\s\S]*?)\n[\t ]*\}/);if(!K)return null;return await Function(`
       return (async function getStaticPaths() {
         ${K[1]}
@@ -41,7 +41,7 @@ ${q.map((Q)=>{let K=new URL(Q.loc,Z).href,J=`  <url>
 ${$.join(`
 `)}
   </channel>
-</rss>`}async function aq(q={}){let Z=Date.now();Aq();let $=await n(process.cwd()),Q=$.build||{},K=await Kq({explicit:q.domain||Q.domain,stxConfig:$});if(K.source==="fallback"&&(q.sitemap??Q.sitemap??!0))console.warn(Wq());let J={router:q.router??$?.router??{},pagesDir:q.pagesDir||Q.pagesDir||"pages",outputDir:q.outputDir||Q.outputDir||"dist",baseUrl:q.baseUrl||Q.baseUrl||"/",domain:K.url,revalidate:q.revalidate??Q.revalidate??!1,sitemap:q.sitemap??Q.sitemap??!0,sitemapExclude:q.sitemapExclude||Q.sitemapExclude||[],robots:q.robots??Q.robots??!0,rss:q.rss??Q.rss??!1,concurrency:q.concurrency||Q.concurrency||10,cache:q.cache??Q.cache??!0,cacheDir:q.cacheDir||Q.cacheDir||d(process.cwd(),"ssg-cache"),contentLoaders:q.contentLoaders||[],hooks:q.hooks||{},minify:q.minify??Q.minify??!0,generate404:q.generate404??Q.generate404??!0,publicDir:q.publicDir||Q.publicDir||"public",trailingSlash:q.trailingSlash??Q.trailingSlash??!1,cleanOutput:q.cleanOutput??Q.cleanOutput??!0,cacheSalt:q.cacheSalt??"",partialsDir:q.partialsDir||$?.partialsDir||"",componentsDir:q.componentsDir||$?.componentsDir||"",failOnIncludeError:q.failOnIncludeError??!0,chunkIslands:q.chunkIslands===!0,prefetchIslands:q.prefetchIslands===!0,integrityIslands:q.integrityIslands===!0},W={totalPages:0,successCount:0,failedCount:0,cachedCount:0,buildTime:0,pages:[],errors:[]},z=new Set,A=0,G={},X={};await J.hooks.onBuildStart?.();try{if(J.cleanOutput&&O.existsSync(J.outputDir))await O.promises.rm(J.outputDir,{recursive:!0});await O.promises.mkdir(J.outputDir,{recursive:!0});let L=J.cacheSalt;if(!L){let{resolveUserCssConfig:Y,fingerprintConfig:N}=await import("./chunk-jnbg3e4r.js");try{L=N(await Y(process.cwd()))}catch{}}let{prepareImageDelivery:_}=await import("./chunk-e631svvs.js"),F=await _(J.publicDir,J.outputDir);if(F.count>0)console.log(`Optimized ${F.count} image(s) for responsive delivery`),L=[L,F.fingerprint].filter(Boolean).join(":");let C=new wq(J.cacheDir,L);if(J.cache)await C.load();try{let{generateCss:Y}=await import("./chunk-jnbg3e4r.js");await Y('<div class="bg-black"></div>')}catch{}Yq();let kq=$?.routeMiddleware?.dir||"middleware";await jq(process.cwd(),kq);let p=Vq();if(p.length>0)console.log(`Loaded ${p.length} middleware: ${p.join(", ")}`);let bq=$?.routeMiddleware?.global||[];Fq($?.layoutsDir,d(process.cwd()));let i=l(".",{pagesDir:J.pagesDir,pagesDirs:$?._layerPageDirs});console.log(`Found ${i.length} routes`);let g=[];for(let Y of i){let N=await uq(Y);for(let H of N)g.push({route:Y,url:H.url,params:H.params,props:H.props,revalidate:H.revalidate??J.revalidate})}W.totalPages=g.length,console.log(`Generating ${W.totalPages} pages...`);let b=[],s=[];for(let Y=0;Y<g.length;Y+=J.concurrency)s.push(g.slice(Y,Y+J.concurrency));for(let Y of s)await Promise.all(Y.map(async(N)=>{let{route:H,url:V,params:S,props:Sq,revalidate:a}=N;try{await J.hooks.onPageStart?.(V);let w=await Bun.file(H.filePath).text(),R=JJ(w),vq=R?.middleware?Array.isArray(R.middleware)?R.middleware:[R.middleware]:[],t=[...bq,...vq];if(t.length>0){let D=Gq(V,S,R||{}),M=Lq(D,null,void 0,{isServer:!0}),E=await Nq(t,M);if(E.redirect){let U=typeof E.redirect==="string"?E.redirect:E.redirect.path||E.redirect,x=QJ(String(U),V),k=ZJ(V,J);await O.promises.mkdir(j.dirname(k),{recursive:!0}),await Bun.write(k,x),W.successCount++,W.pages.push({route:V,outputPath:k,size:Buffer.byteLength(x),cached:!1}),b.push({loc:V,lastmod:new Date().toISOString()}),console.log(`  \u21B3 ${V} \u2192 redirect to ${U}`);return}if(E.abort){let U=typeof E.abort==="string"?E.abort:E.abort?.error?.message||"aborted";console.warn(`  \u21B3 ${V} \u2014 middleware aborted: ${U}`);return}}let e=w.match(/definePageMeta\s*\(\s*\{[\s\S]*?validate\s*:\s*((?:\([^)]*\)|[^,}])*(?:\{[\s\S]*?\})?)/m);if(e)try{if(!await Function("route",`
+</rss>`}async function aq(q={}){let Z=Date.now();Aq();let $=await n(process.cwd()),Q=$.build||{},K=await Kq({explicit:q.domain||Q.domain,stxConfig:$});if(K.source==="fallback"&&(q.sitemap??Q.sitemap??!0))console.warn(Wq());let J={router:q.router??$?.router??{},pagesDir:q.pagesDir||Q.pagesDir||"pages",outputDir:q.outputDir||Q.outputDir||"dist",baseUrl:q.baseUrl||Q.baseUrl||"/",domain:K.url,revalidate:q.revalidate??Q.revalidate??!1,sitemap:q.sitemap??Q.sitemap??!0,sitemapExclude:q.sitemapExclude||Q.sitemapExclude||[],robots:q.robots??Q.robots??!0,rss:q.rss??Q.rss??!1,concurrency:q.concurrency||Q.concurrency||10,cache:q.cache??Q.cache??!0,cacheDir:q.cacheDir||Q.cacheDir||d(process.cwd(),"ssg-cache"),contentLoaders:q.contentLoaders||[],hooks:q.hooks||{},minify:q.minify??Q.minify??!0,generate404:q.generate404??Q.generate404??!0,publicDir:q.publicDir||Q.publicDir||"public",trailingSlash:q.trailingSlash??Q.trailingSlash??!1,cleanOutput:q.cleanOutput??Q.cleanOutput??!0,cacheSalt:q.cacheSalt??"",partialsDir:q.partialsDir||$?.partialsDir||"",componentsDir:q.componentsDir||$?.componentsDir||"",failOnIncludeError:q.failOnIncludeError??!0,chunkIslands:q.chunkIslands===!0,prefetchIslands:q.prefetchIslands===!0,integrityIslands:q.integrityIslands===!0},W={totalPages:0,successCount:0,failedCount:0,cachedCount:0,buildTime:0,pages:[],errors:[]},z=new Set,A=0,G={},X={};await J.hooks.onBuildStart?.();try{if(J.cleanOutput&&O.existsSync(J.outputDir))await O.promises.rm(J.outputDir,{recursive:!0});await O.promises.mkdir(J.outputDir,{recursive:!0});let L=J.cacheSalt;if(!L){let{resolveUserCssConfig:Y,fingerprintConfig:N}=await import("./chunk-rd02ysw3.js");try{L=N(await Y(process.cwd()))}catch{}}let{prepareImageDelivery:_}=await import("./chunk-e631svvs.js"),F=await _(J.publicDir,J.outputDir);if(F.count>0)console.log(`Optimized ${F.count} image(s) for responsive delivery`),L=[L,F.fingerprint].filter(Boolean).join(":");let C=new wq(J.cacheDir,L);if(J.cache)await C.load();try{let{generateCss:Y}=await import("./chunk-rd02ysw3.js");await Y('<div class="bg-black"></div>')}catch{}Yq();let kq=$?.routeMiddleware?.dir||"middleware";await jq(process.cwd(),kq);let p=Vq();if(p.length>0)console.log(`Loaded ${p.length} middleware: ${p.join(", ")}`);let bq=$?.routeMiddleware?.global||[];Fq($?.layoutsDir,d(process.cwd()));let i=l(".",{pagesDir:J.pagesDir,pagesDirs:$?._layerPageDirs});console.log(`Found ${i.length} routes`);let g=[];for(let Y of i){let N=await uq(Y);for(let H of N)g.push({route:Y,url:H.url,params:H.params,props:H.props,revalidate:H.revalidate??J.revalidate})}W.totalPages=g.length,console.log(`Generating ${W.totalPages} pages...`);let b=[],s=[];for(let Y=0;Y<g.length;Y+=J.concurrency)s.push(g.slice(Y,Y+J.concurrency));for(let Y of s)await Promise.all(Y.map(async(N)=>{let{route:H,url:V,params:S,props:Sq,revalidate:a}=N;try{await J.hooks.onPageStart?.(V);let w=await Bun.file(H.filePath).text(),R=JJ(w),vq=R?.middleware?Array.isArray(R.middleware)?R.middleware:[R.middleware]:[],t=[...bq,...vq];if(t.length>0){let D=Gq(V,S,R||{}),M=Lq(D,null,void 0,{isServer:!0}),E=await Nq(t,M);if(E.redirect){let U=typeof E.redirect==="string"?E.redirect:E.redirect.path||E.redirect,x=QJ(String(U),V),k=ZJ(V,J);await O.promises.mkdir(j.dirname(k),{recursive:!0}),await Bun.write(k,x),W.successCount++,W.pages.push({route:V,outputPath:k,size:Buffer.byteLength(x),cached:!1}),b.push({loc:V,lastmod:new Date().toISOString()}),console.log(`  \u21B3 ${V} \u2192 redirect to ${U}`);return}if(E.abort){let U=typeof E.abort==="string"?E.abort:E.abort?.error?.message||"aborted";console.warn(`  \u21B3 ${V} \u2014 middleware aborted: ${U}`);return}}let e=w.match(/definePageMeta\s*\(\s*\{[\s\S]*?validate\s*:\s*((?:\([^)]*\)|[^,}])*(?:\{[\s\S]*?\})?)/m);if(e)try{if(!await Function("route",`
                 const validate = ${e[1]};
                 return validate(route);
               `)({params:S})){console.warn(`Validation failed for ${V}, skipping...`);return}}catch{}let I=null,qq=!1;if(J.cache){if(I=C.get(V,H.filePath),I)qq=!0,W.cachedCount++}if(!I){let D=await Mq(H,S,Sq,J,$);if(I=D.html,J.failOnIncludeError&&D.includeFailures.length>0)throw Error(`${D.includeFailures.length} include(s) failed to resolve, so this page would have shipped with an error banner where the markup should be:

package/dist/stx-virtual-ts.d.ts

@@ -62,7 +62,7 @@ export interface TemplateExpression {
     line: number;
     /** 1-based column of the expression's first character. */
     column: number;
-    kind: 'interpolation' | 'directive';
+    kind: 'interpolation' | 'directive' | 'condition';
     /** For directives, the attribute name (`:if`, `@click`, `x-text`). */
     attribute?: string;
     /**
@@ -86,6 +86,15 @@ export interface MappedLine {
      * the start of the attribute.
      */
     prefixLength?: number;
+    /**
+     * Characters of `if (…) {` wrapper before the expression's own statement.
+     *
+     * A diagnostic inside this span is about the enclosing CONDITION, not about
+     * the expression this line carries - and the condition is checked on a line
+     * of its own, so reporting it here too would name innocent markup twice
+     * (stacksjs/stx#2013).
+     */
+    guardPrefixLength?: number;
 }
 export interface VirtualFile {
     text: string;
@@ -463,6 +472,12 @@ export interface ResolvedPosition {
     column: number;
     /** Set when the diagnostic came from a template expression. */
     expression?: TemplateExpression;
+    /**
+     * The hit landed in the `if (…) {` wrapper that markup guards put around an
+     * expression, so it is about the CONDITION rather than this expression. The
+     * condition has a line of its own (stacksjs/stx#2013).
+     */
+    inGuard?: boolean;
 }
 /**
  * Translate a position in a virtual buffer back to the `.stx` file.

package/dist/stx-virtual-ts.js

@@ -173,6 +173,35 @@ export function extractTemplateExpressions(source) {
       kind: "interpolation"
     });
   }
+  const condition = /@(if|elseif|else\s+if|unless)\b\s*\(/g;
+  while ((m = condition.exec(masked)) !== null) {
+    const open = m.index + m[0].length - 1;
+    let depth = 0, index = open;
+    for (;index < masked.length; index++) {
+      const char = masked[index];
+      if (char === "(")
+        depth++;
+      else if (char === ")") {
+        depth--;
+        if (depth === 0)
+          break;
+      }
+    }
+    if (depth !== 0)
+      continue;
+    const raw = masked.slice(open + 1, index), code = raw.trim();
+    condition.lastIndex = index + 1;
+    if (!code)
+      continue;
+    const start = open + 1 + (raw.length - raw.trimStart().length);
+    found.push({
+      code,
+      line: lineAt(masked, start),
+      column: columnAt(masked, start),
+      offset: m.index,
+      kind: "condition"
+    });
+  }
   DIRECTIVE_ATTR_RE.lastIndex = 0;
   while ((m = DIRECTIVE_ATTR_RE.exec(masked)) !== null) {
     const name = m[1], value = m[3] ?? "", base = name.replace(/\..*$/, "").replace(/^([^:].*?):.*$/, "$1");
@@ -648,7 +677,8 @@ export function buildVirtualTypeScript(source, options = {}) {
           line: expression.line,
           column: expression.column,
           expression,
-          prefixLength: statement.prefixLength + pad.length + guardPrefix.length
+          prefixLength: statement.prefixLength + pad.length + guardPrefix.length,
+          guardPrefixLength: pad.length + guardPrefix.length
         });
       }
       if (indent > 0)
@@ -689,6 +719,7 @@ export function resolvePosition(virtual, line, column) {
   return {
     line: mapped.line,
     column: mapped.column + within,
-    expression: mapped.expression
+    expression: mapped.expression,
+    inGuard: column <= (mapped.guardPrefixLength ?? 0)
   };
 }

package/dist/theme-tokens.js

@@ -3,22 +3,26 @@ export const SEMANTIC_TOKENS = {
   "fg-strong": { light: "neutral-700", dark: "neutral-300", description: "Labels, secondary headings" },
   "fg-muted": { light: "neutral-600", dark: "neutral-400", description: "Supporting text" },
   "fg-soft": { light: "neutral-500", dark: "neutral-400", description: "De-emphasised text" },
-  "fg-subtle": { light: "neutral-400", dark: "neutral-500", description: "Placeholders, disabled text" },
+  "fg-subtle": { light: "neutral-400", dark: "neutral-500", description: "Recessive, non-essential text" },
   surface: { light: "neutral-50", dark: "neutral-800", description: "Page and panel background" },
   "surface-raised": { light: "neutral-100", dark: "neutral-700", description: "Cards, popovers" },
   "surface-sunken": { light: "neutral-200", dark: "neutral-700", description: "Wells, track backgrounds" },
   panel: { light: "white", dark: "neutral-800", description: "Card, menu, dialog surface" },
   field: { light: "white", dark: "neutral-700", description: "Form control surface" },
+  page: { light: "neutral-50", dark: "neutral-900", description: "Page background, behind panels" },
+  content: { light: "white", dark: "neutral-900", description: "Content area under a chrome header - a table or list body" },
   "surface-hover": { light: "neutral-100", dark: "neutral-700", description: "Row or item highlight on a page or panel" },
   "surface-raised-hover": { light: "neutral-200", dark: "neutral-600", description: "Raised surface, hovered" },
   "surface-sunken-hover": { light: "neutral-300", dark: "neutral-600", description: "Sunken surface, hovered" },
   "field-hover": { light: "neutral-50", dark: "neutral-600", description: "Form control surface, hovered" },
+  link: { light: "blue-500", dark: "blue-400", description: "Hyperlink" },
+  "link-hover": { light: "blue-600", dark: "blue-300", description: "Hyperlink, hovered" },
   inverse: { light: "neutral-900", dark: "neutral-700", description: "Tooltip bubble, inverted surface" },
   "inverse-ink": { light: "white", dark: "white", description: "Text on an inverted surface" },
   line: { light: "neutral-200", dark: "neutral-700", description: "Default border, divider" },
   "line-strong": { light: "neutral-300", dark: "neutral-600", description: "Input border, focus ring track" },
   accent: { light: "blue-600", dark: "blue-400", description: "Primary action, selected state" },
-  info: { light: "cyan-600", dark: "cyan-400", description: "Informational emphasis, links" },
+  info: { light: "cyan-600", dark: "cyan-400", description: "Informational emphasis" },
   danger: { light: "red-600", dark: "red-400", description: "Errors, destructive actions" },
   success: { light: "green-600", dark: "green-400", description: "Confirmation" },
   warning: { light: "yellow-600", dark: "yellow-400", description: "Caution" },
@@ -33,9 +37,9 @@ export const SEMANTIC_TOKENS = {
   "success-solid-hover": { light: "green-600", dark: "green-700", description: "Confirmation fill, hovered" },
   "warning-solid-hover": { light: "yellow-600", dark: "yellow-700", description: "Caution fill, hovered" },
   "accent-ink": { light: "white", dark: "white", description: "Text on a primary fill" },
-  "info-ink": { light: "white", dark: "white", description: "Text on an informational fill" },
+  "info-ink": { light: "neutral-900", dark: "neutral-900", description: "Text on an informational fill" },
   "danger-ink": { light: "white", dark: "white", description: "Text on a destructive fill" },
-  "success-ink": { light: "white", dark: "white", description: "Text on a confirmation fill" },
+  "success-ink": { light: "neutral-900", dark: "neutral-900", description: "Text on a confirmation fill" },
   "warning-ink": { light: "neutral-900", dark: "neutral-900", description: "Text on a caution fill" },
   "accent-soft": { light: "blue-100", dark: "blue-900", description: "Tinted primary fill" },
   "accent-soft-ink": { light: "blue-800", dark: "blue-200", description: "Text on a tinted primary fill" },
@@ -54,7 +58,7 @@ export const SEMANTIC_TOKENS = {
   "secondary-soft": { light: "purple-100", dark: "purple-900", description: "Tinted secondary fill" },
   "secondary-soft-ink": { light: "purple-800", dark: "purple-200", description: "Text on a tinted secondary fill" },
   "danger-fg": { light: "red-900", dark: "red-300", description: "Text in a field with an error" },
-  "danger-fg-subtle": { light: "red-300", dark: "red-500", description: "Placeholder in a field with an error" },
+  "danger-fg-subtle": { light: "red-300", dark: "red-500", description: "Recessive text in a field with an error" },
   "danger-line": { light: "red-300", dark: "red-600", description: "Border of a field with an error" },
   "danger-focus": { light: "red-500", dark: "red-400", description: "Focus ring of a field with an error" }
 };

package/dist/typecheck.js

@@ -305,6 +305,8 @@ export async function typecheckStxFiles(files, options = {}) {
         const at = resolvePosition(entry.virtual, line, column);
         if (!at?.expression)
           continue;
+        if (at.inGuard)
+          continue;
         if (Number(code) === 2774)
           continue;
         line = at.line;

package/dist/types/config-types.d.ts

@@ -708,6 +708,16 @@ export interface StxConfig {
     defaultLayout?: string;
     /** Plugins to load — npm packages, local paths, or [path, options] tuples */
     plugins?: Array<string | [string, Record<string, any>]>;
+    /**
+     * Installed packages whose components resolve by bare tag, with no plugin
+     * entry and no import.
+     *
+     * Each is loaded through its own `<pkg>/stx-plugin` export if the project has
+     * it installed, and is searched AFTER every project directory - so a
+     * component the app wrote still wins. Defaults to `['@stacksjs/components']`;
+     * set it to `[]` to opt out entirely (stacksjs/stx#2011).
+     */
+    componentPackages?: string[];
     /** Path to public/static assets directory, defaults to 'public' */
     publicDir?: string;
     /** Path to .env file, defaults to '.env' in project root (Bun loads this automatically) */