@stacksjs/stx 0.2.95 → 0.2.97

package/dist/server-components.js

@@ -1,13 +1,339 @@
-// @bun
-import"./chunk-xv34zbp4.js";var W=new Map,X=new Map;function E(q){W.set(q.name,{component:q,type:"server"})}function K(q){W.set(q.name,{component:q,type:"client"})}function S(q){return W.get(q)}function C(q){return W.has(q)}function x(){return Array.from(W.keys())}function v(){W.clear(),X.clear()}function j(q,A){let z=JSON.stringify(A);return`${q}:${P(z)}`}function P(q){let A=0;for(let z=0;z<q.length;z++){let J=q.charCodeAt(z);A=(A<<5)-A+J,A=A|0}return Math.abs(A).toString(36)}function M(q,A,z){if(!z?.enabled)return null;let F=(z.keyGenerator||((Q)=>j(q,Q)))(A),I=X.get(F);if(!I)return null;let O=Date.now(),L=z.ttl||60000;if(O-I.timestamp>L){if(z.staleWhileRevalidate)return{html:I.html,data:I.data};return X.delete(F),null}return{html:I.html,data:I.data}}function N(q,A,z,J,F){if(!F?.enabled)return;let O=(F.keyGenerator||((L)=>j(q,L)))(A);X.set(O,{html:z,timestamp:Date.now(),data:J})}function g(q){if(q){for(let A of X.keys())if(A.startsWith(`${q}:`))X.delete(A)}else X.clear()}async function D(q,A={}){let z=performance.now(),{props:J={},signal:F}=A,I=W.get(q);if(!I)throw Error(`Server component "${q}" not found`);if(I.type!=="server")throw Error(`Component "${q}" is not a server component`);let O=I.component,L=M(q,J,O.cache);if(L)return{html:L.html,renderTime:performance.now()-z,data:L.data,dependencies:O.dependencies||[],cached:!0};if(F?.aborted)throw Error("Render aborted");try{let Q={...J};if(O.loader)Q={...Q,...await O.loader(J)};let U=await $(O.template,Q);return N(q,J,U,Q,O.cache),{html:U,renderTime:performance.now()-z,data:Q,dependencies:O.dependencies||[],cached:!1}}catch(Q){if(O.errorBoundary)return{html:await $(O.errorBoundary,{error:Q instanceof Error?Q.message:String(Q),...J}),renderTime:performance.now()-z,dependencies:O.dependencies||[],cached:!1};throw Q}}async function H(q,A={}){let z=performance.now(),{props:J={}}=A,F=W.get(q);if(!F)throw Error(`Client component "${q}" not found`);if(F.type!=="client")throw Error(`Component "${q}" is not a client component`);let I=F.component,O=`cc-${q}-${Math.random().toString(36).slice(2,9)}`,L=await $(I.template,J),Q={};if(I.clientProps){for(let _ of I.clientProps)if(_ in J)Q[_]=J[_]}let U=`<div data-client-component="${q}" data-component-id="${O}" data-priority="${I.priority||"lazy"}">
-${L}
-<script type="application/json" data-component-props="${O}">${JSON.stringify(Q)}</script>
-</div>`,Z=I.clientScript?`<script type="module" data-component-script="${O}">${I.clientScript}</script>`:void 0;return{html:U,renderTime:performance.now()-z,data:J,dependencies:[],cached:!1,hydrationScript:Z}}async function G(q,A={}){let z=W.get(q);if(!z)throw Error(`Component "${q}" not found`);if(z.type==="server")return D(q,A);else return H(q,A)}var Y=new Map;function y(){for(let[q,A]of Y)if(A.status==="resolved"||A.status==="error")Y.delete(q)}function V(q,A){let z={id:q,status:"pending"};return Y.set(q,z),{wrap:async(J)=>{z.promise=J;try{return z.result=await J,z.status="resolved",z.result}catch(F){throw z.error=F instanceof Error?F:Error(String(F)),z.status="error",F}},getFallback:()=>A}}function u(q){return Y.get(q)}function h(q){if(q)Y.delete(q);else Y.clear()}function d(q,A={}){return{renderToStream:()=>{return new ReadableStream({async start(z){for(let J of q)try{let F=await G(J,A);if(z.enqueue(F.html),F.hydrationScript)z.enqueue(F.hydrationScript)}catch(F){let I=F instanceof Error?F.message:String(F);z.enqueue(`<!-- Error rendering ${J}: ${I} -->`)}z.close()}})},renderToString:async()=>{let z=[];for(let J of q)try{let F=await G(J,A);if(z.push(F.html),F.hydrationScript)z.push(F.hydrationScript)}catch(F){let I=F instanceof Error?F.message:String(F);z.push(`<!-- Error rendering ${J}: ${I} -->`)}return z.join(`
-`)}}}async function $(q,A){let z=q;return z=z.replace(/@foreach\s*\((\w+(?:\.\w+)*)\s+as\s+(\w+)\)([\s\S]*?)@endforeach/g,(J,F,I,O)=>{let L=w(A,F.trim());if(!Array.isArray(L))return"";return L.map((Q,U)=>{let Z={...A,[I]:Q,loop:{index:U,first:U===0,last:U===L.length-1}};return b(O,Z)}).join("")}),z=z.replace(/@if\s*\(([^)]+)\)([\s\S]*?)@endif/g,(J,F,I)=>{return T(F.trim(),A)?I:""}),z=z.replace(/\{\{([^}]+)\}\}/g,(J,F)=>{let I=F.trim();if(I.startsWith("await ")){let Q=I.slice(6).split("(")[0].trim();return String(A[Q]??J)}let O=I.split("."),L=A;for(let Q of O){if(L===null||L===void 0)break;L=L[Q]}if(L===void 0||L===null)return"";return B(String(L))}),z}function b(q,A){let z=q;return z=z.replace(/\{\{([^}]+)\}\}/g,(J,F)=>{let I=w(A,F.trim());if(I===void 0||I===null)return"";return B(String(I))}),z}function w(q,A){let z=A.split("."),J=q;for(let F of z){if(J===null||J===void 0)return;J=J[F]}return J}function T(q,A){let z=w(A,q);return Boolean(z)}function B(q){return q.replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;").replace(/"/g,"&quot;").replace(/'/g,"&#039;")}var k={name:"serverComponent",hasEndTag:!0,handler:(q,A,z,J)=>{if(!A||A.length===0)throw Error("@serverComponent requires a name parameter");let F=A[0].replace(/['"`]/g,""),I=`sc-${F}-${Math.random().toString(36).slice(2,9)}`;return E({name:F,template:q}),`<div data-server-component="${F}" data-component-id="${I}">${q}</div>`}},R={name:"clientComponent",hasEndTag:!0,handler:(q,A,z,J)=>{if(!A||A.length===0)throw Error("@clientComponent requires a name parameter");let F=A[0].replace(/['"`]/g,""),I=A[1]?.replace(/['"`]/g,""),O=`cc-${F}-${Math.random().toString(36).slice(2,9)}`,L=q.match(/<script\b[^>]*>([\s\S]*?)<\/script>/i),Q=L?L[1]:void 0,U=L?q.replace(L[0],""):q;return K({name:F,template:U,clientScript:Q,priority:I||"lazy"}),`<div data-client-component="${F}" data-component-id="${O}" data-priority="${I||"lazy"}">
-${U}
-</div>`}},f={name:"suspense",hasEndTag:!0,handler:(q,A,z,J)=>{let F=A[0]?.replace(/['"`]/g,"")||"Loading...",I=`suspense-${Math.random().toString(36).slice(2,9)}`;return V(I,F),`<div data-suspense="${I}" data-fallback="${B(F)}">
-${q}
-</div>`}};function l(){return[k,R,f]}function i(){return`
+const componentRegistry = new Map, componentCache = new Map;
+export function registerServerComponent(component) {
+  componentRegistry.set(component.name, {
+    component,
+    type: "server"
+  });
+}
+export function registerClientComponent(component) {
+  componentRegistry.set(component.name, {
+    component,
+    type: "client"
+  });
+}
+export function getComponent(name) {
+  return componentRegistry.get(name);
+}
+export function hasComponent(name) {
+  return componentRegistry.has(name);
+}
+export function getComponentNames() {
+  return Array.from(componentRegistry.keys());
+}
+export function clearComponents() {
+  componentRegistry.clear();
+  componentCache.clear();
+}
+function generateCacheKey(name, props) {
+  const propsHash = JSON.stringify(props);
+  return `${name}:${hashString(propsHash)}`;
+}
+function hashString(str) {
+  let hash = 0;
+  for (let i = 0;i < str.length; i++) {
+    const char = str.charCodeAt(i);
+    hash = (hash << 5) - hash + char;
+    hash = hash | 0;
+  }
+  return Math.abs(hash).toString(36);
+}
+function getCached(name, props, config) {
+  if (!config?.enabled)
+    return null;
+  const key = (config.keyGenerator || ((p) => generateCacheKey(name, p)))(props), cached = componentCache.get(key);
+  if (!cached)
+    return null;
+  const now = Date.now(), ttl = config.ttl || 60000;
+  if (now - cached.timestamp > ttl) {
+    if (config.staleWhileRevalidate)
+      return { html: cached.html, data: cached.data };
+    componentCache.delete(key);
+    return null;
+  }
+  return { html: cached.html, data: cached.data };
+}
+function setCached(name, props, html, data, config) {
+  if (!config?.enabled)
+    return;
+  const key = (config.keyGenerator || ((p) => generateCacheKey(name, p)))(props);
+  componentCache.set(key, {
+    html,
+    timestamp: Date.now(),
+    data
+  });
+}
+export function clearComponentCache(name) {
+  if (name) {
+    for (const key of componentCache.keys())
+      if (key.startsWith(`${name}:`))
+        componentCache.delete(key);
+  } else
+    componentCache.clear();
+}
+export async function renderServerComponent(name, options = {}) {
+  const startTime = performance.now(), { props = {}, signal } = options, entry = componentRegistry.get(name);
+  if (!entry)
+    throw Error(`Server component "${name}" not found`);
+  if (entry.type !== "server")
+    throw Error(`Component "${name}" is not a server component`);
+  const component = entry.component, cached = getCached(name, props, component.cache);
+  if (cached)
+    return {
+      html: cached.html,
+      renderTime: performance.now() - startTime,
+      data: cached.data,
+      dependencies: component.dependencies || [],
+      cached: !0
+    };
+  if (signal?.aborted)
+    throw Error("Render aborted");
+  try {
+    let data = { ...props };
+    if (component.loader)
+      data = {
+        ...data,
+        ...await component.loader(props)
+      };
+    const html = await processServerTemplate(component.template, data);
+    setCached(name, props, html, data, component.cache);
+    return {
+      html,
+      renderTime: performance.now() - startTime,
+      data,
+      dependencies: component.dependencies || [],
+      cached: !1
+    };
+  } catch (error) {
+    if (component.errorBoundary)
+      return {
+        html: await processServerTemplate(component.errorBoundary, {
+          error: error instanceof Error ? error.message : String(error),
+          ...props
+        }),
+        renderTime: performance.now() - startTime,
+        dependencies: component.dependencies || [],
+        cached: !1
+      };
+    throw error;
+  }
+}
+export async function renderClientComponent(name, options = {}) {
+  const startTime = performance.now(), { props = {} } = options, entry = componentRegistry.get(name);
+  if (!entry)
+    throw Error(`Client component "${name}" not found`);
+  if (entry.type !== "client")
+    throw Error(`Component "${name}" is not a client component`);
+  const component = entry.component, id = `cc-${name}-${Math.random().toString(36).slice(2, 9)}`, innerHtml = await processServerTemplate(component.template, props), clientPropsData = {};
+  if (component.clientProps) {
+    for (const prop of component.clientProps)
+      if (prop in props)
+        clientPropsData[prop] = props[prop];
+  }
+  const html = `<div data-client-component="${name}" data-component-id="${id}" data-priority="${component.priority || "lazy"}">
+${innerHtml}
+<script type="application/json" data-component-props="${id}">${JSON.stringify(clientPropsData)}</script>
+</div>`, hydrationScript = component.clientScript ? `<script type="module" data-component-script="${id}">${component.clientScript}</script>` : void 0;
+  return {
+    html,
+    renderTime: performance.now() - startTime,
+    data: props,
+    dependencies: [],
+    cached: !1,
+    hydrationScript
+  };
+}
+export async function renderComponent(name, options = {}) {
+  const entry = componentRegistry.get(name);
+  if (!entry)
+    throw Error(`Component "${name}" not found`);
+  if (entry.type === "server")
+    return renderServerComponent(name, options);
+  else
+    return renderClientComponent(name, options);
+}
+const suspenseStates = new Map;
+export function cleanupSuspenseStates() {
+  for (const [id, state] of suspenseStates)
+    if (state.status === "resolved" || state.status === "error")
+      suspenseStates.delete(id);
+}
+export function createSuspenseBoundary(id, fallback) {
+  const state = {
+    id,
+    status: "pending"
+  };
+  suspenseStates.set(id, state);
+  return {
+    wrap: async (promise) => {
+      state.promise = promise;
+      try {
+        state.result = await promise;
+        state.status = "resolved";
+        return state.result;
+      } catch (error) {
+        state.error = error instanceof Error ? error : Error(String(error));
+        state.status = "error";
+        throw error;
+      }
+    },
+    getFallback: () => fallback
+  };
+}
+export function getSuspenseState(id) {
+  return suspenseStates.get(id);
+}
+export function clearSuspenseState(id) {
+  if (id)
+    suspenseStates.delete(id);
+  else
+    suspenseStates.clear();
+}
+export function createStreamingRenderer(components, options = {}) {
+  return {
+    renderToStream: () => {
+      return new ReadableStream({
+        async start(controller) {
+          for (const name of components)
+            try {
+              const result = await renderComponent(name, options);
+              controller.enqueue(result.html);
+              if (result.hydrationScript)
+                controller.enqueue(result.hydrationScript);
+            } catch (error) {
+              const message = error instanceof Error ? error.message : String(error);
+              controller.enqueue(`<!-- Error rendering ${name}: ${message} -->`);
+            }
+          controller.close();
+        }
+      });
+    },
+    renderToString: async () => {
+      const parts = [];
+      for (const name of components)
+        try {
+          const result = await renderComponent(name, options);
+          parts.push(result.html);
+          if (result.hydrationScript)
+            parts.push(result.hydrationScript);
+        } catch (error) {
+          const message = error instanceof Error ? error.message : String(error);
+          parts.push(`<!-- Error rendering ${name}: ${message} -->`);
+        }
+      return parts.join(`
+`);
+    }
+  };
+}
+async function processServerTemplate(template, context) {
+  let result = template;
+  result = result.replace(/@foreach\s*\((\w+(?:\.\w+)*)\s+as\s+(\w+)\)([\s\S]*?)@endforeach/g, (_match, arrayExpr, itemVar, content) => {
+    const array = getNestedValue(context, arrayExpr.trim());
+    if (!Array.isArray(array))
+      return "";
+    return array.map((item, index) => {
+      const itemContext = { ...context, [itemVar]: item, loop: { index, first: index === 0, last: index === array.length - 1 } };
+      return processServerTemplateSync(content, itemContext);
+    }).join("");
+  });
+  result = result.replace(/@if\s*\(([^)]+)\)([\s\S]*?)@endif/g, (_match, condition, content) => {
+    return evaluateCondition(condition.trim(), context) ? content : "";
+  });
+  result = result.replace(/\{\{([^}]+)\}\}/g, (match, expr) => {
+    const trimmed = expr.trim();
+    if (trimmed.startsWith("await ")) {
+      const varName = trimmed.slice(6).split("(")[0].trim();
+      return String(context[varName] ?? match);
+    }
+    const parts = trimmed.split(".");
+    let value = context;
+    for (const part of parts) {
+      if (value === null || value === void 0)
+        break;
+      value = value[part];
+    }
+    if (value === void 0 || value === null)
+      return "";
+    return escapeHtml(String(value));
+  });
+  return result;
+}
+function processServerTemplateSync(template, context) {
+  let result = template;
+  result = result.replace(/\{\{([^}]+)\}\}/g, (_match, expr) => {
+    const value = getNestedValue(context, expr.trim());
+    if (value === void 0 || value === null)
+      return "";
+    return escapeHtml(String(value));
+  });
+  return result;
+}
+function getNestedValue(obj, path) {
+  const parts = path.split(".");
+  let value = obj;
+  for (const part of parts) {
+    if (value === null || value === void 0)
+      return;
+    value = value[part];
+  }
+  return value;
+}
+function evaluateCondition(condition, context) {
+  const value = getNestedValue(context, condition);
+  return Boolean(value);
+}
+function escapeHtml(str) {
+  return str.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#039;");
+}
+export const serverComponentDirective = {
+  name: "serverComponent",
+  hasEndTag: !0,
+  handler: (content, params, _context, _filePath) => {
+    if (!params || params.length === 0)
+      throw Error("@serverComponent requires a name parameter");
+    const name = params[0].replace(/['"`]/g, ""), id = `sc-${name}-${Math.random().toString(36).slice(2, 9)}`;
+    registerServerComponent({
+      name,
+      template: content
+    });
+    return `<div data-server-component="${name}" data-component-id="${id}">${content}</div>`;
+  }
+}, clientComponentDirective = {
+  name: "clientComponent",
+  hasEndTag: !0,
+  handler: (content, params, _context, _filePath) => {
+    if (!params || params.length === 0)
+      throw Error("@clientComponent requires a name parameter");
+    const name = params[0].replace(/['"`]/g, ""), priority = params[1]?.replace(/['"`]/g, ""), id = `cc-${name}-${Math.random().toString(36).slice(2, 9)}`, scriptMatch = content.match(/<script\b[^>]*>([\s\S]*?)<\/script>/i), clientScript = scriptMatch ? scriptMatch[1] : void 0, templateContent = scriptMatch ? content.replace(scriptMatch[0], "") : content;
+    registerClientComponent({
+      name,
+      template: templateContent,
+      clientScript,
+      priority: priority || "lazy"
+    });
+    return `<div data-client-component="${name}" data-component-id="${id}" data-priority="${priority || "lazy"}">
+${templateContent}
+</div>`;
+  }
+}, suspenseDirective = {
+  name: "suspense",
+  hasEndTag: !0,
+  handler: (content, params, _context, _filePath) => {
+    const fallback = params[0]?.replace(/['"`]/g, "") || "Loading...", id = `suspense-${Math.random().toString(36).slice(2, 9)}`;
+    createSuspenseBoundary(id, fallback);
+    return `<div data-suspense="${id}" data-fallback="${escapeHtml(fallback)}">
+${content}
+</div>`;
+  }
+};
+export function registerServerComponentDirectives() {
+  return [
+    serverComponentDirective,
+    clientComponentDirective,
+    suspenseDirective
+  ];
+}
+export function generateServerComponentsRuntime() {
+  return `
 (function() {
   'use strict';
 
@@ -94,4 +420,5 @@ else {
 else {
     stxServerComponents.hydrateAll();
   }
-})();`}export{f as suspenseDirective,k as serverComponentDirective,D as renderServerComponent,G as renderComponent,H as renderClientComponent,l as registerServerComponentDirectives,E as registerServerComponent,K as registerClientComponent,C as hasComponent,u as getSuspenseState,x as getComponentNames,S as getComponent,i as generateServerComponentsRuntime,V as createSuspenseBoundary,d as createStreamingRenderer,R as clientComponentDirective,h as clearSuspenseState,v as clearComponents,g as clearComponentCache,y as cleanupSuspenseStates};
+})();`;
+}