@kithinji/pod 1.0.14 → 1.0.16

package/dist/main.js

@@ -1438,6 +1438,38 @@ var ASTUtilities = class {
       body.push(...statements);
     }
   }
+  addEffectCleanup(scope, effectCall) {
+    const cleanupId = scope.generateUidIdentifier("cleanup");
+    return [
+      // const _cleanup1 = $effect(...)
+      this.t.variableDeclaration("const", [
+        this.t.variableDeclarator(cleanupId, effectCall)
+      ]),
+      // self.__cleanup = [...(self.__cleanup || []), _cleanup1]
+      this.t.expressionStatement(
+        this.t.assignmentExpression(
+          "=",
+          this.t.memberExpression(
+            this.t.identifier("self"),
+            this.t.identifier("__cleanup")
+          ),
+          this.t.arrayExpression([
+            this.t.spreadElement(
+              this.t.logicalExpression(
+                "||",
+                this.t.memberExpression(
+                  this.t.identifier("self"),
+                  this.t.identifier("__cleanup")
+                ),
+                this.t.arrayExpression([])
+              )
+            ),
+            cleanupId
+          ])
+        )
+      )
+    ];
+  }
 };
 var JSXUtilities = class {
   constructor(t) {
@@ -1629,6 +1661,7 @@ var ElementTransformer = class {
       jsxElement.openingElement.attributes,
       elId,
       statements,
+      scope,
       context2
     );
     if (hasRef && refValue) {
@@ -1758,7 +1791,7 @@ var ElementTransformer = class {
       }
     }
   }
-  processDOMAttributes(attributes, elId, statements, context2) {
+  processDOMAttributes(attributes, elId, statements, scope, context2) {
     let hasRef = false;
     let refValue = null;
     let hasDangerousHTML = false;
@@ -1775,14 +1808,20 @@ var ElementTransformer = class {
           context2.observableSignals,
           this.astUtils
         );
-        statements.push(
-          this.t.expressionStatement(
+        const effectCall = this.t.callExpression(this.t.identifier("$effect"), [
+          this.t.arrowFunctionExpression(
+            [],
             this.t.callExpression(this.t.identifier("$spread"), [
               elId,
               this.astUtils.replaceThisWithSelf(replaced)
             ])
           )
+        ]);
+        const cleanupStatements = this.astUtils.addEffectCleanup(
+          scope,
+          effectCall
         );
+        statements.push(...cleanupStatements);
         continue;
       }
       const key = attr.name.name;
@@ -1825,7 +1864,7 @@ var ElementTransformer = class {
         continue;
       }
       if (key === "style" && this.t.isJSXExpressionContainer(attr.value)) {
-        this.processStyleAttribute(attr, elId, statements, context2);
+        this.processStyleAttribute(attr, elId, statements, scope, context2);
         continue;
       }
       this.processRegularAttribute(key, attr, elId, statements, context2);
@@ -1857,7 +1896,7 @@ var ElementTransformer = class {
       )
     );
   }
-  processStyleAttribute(attr, elId, statements, context2) {
+  processStyleAttribute(attr, elId, statements, scope, context2) {
     if (!this.t.isJSXExpressionContainer(attr.value)) return;
     this.observableManager.collectObservables(
       attr.value.expression,
@@ -1869,17 +1908,17 @@ var ElementTransformer = class {
       context2.observableSignals,
       this.astUtils
     );
-    statements.push(
-      this.t.expressionStatement(
+    const effectCall = this.t.callExpression(this.t.identifier("$effect"), [
+      this.t.arrowFunctionExpression(
+        [],
         this.t.callExpression(this.t.identifier("$style"), [
           elId,
-          this.t.arrowFunctionExpression(
-            [],
-            this.astUtils.replaceThisWithSelf(replaced)
-          )
+          this.astUtils.replaceThisWithSelf(replaced)
         ])
       )
-    );
+    ]);
+    const cleanupStatements = this.astUtils.addEffectCleanup(scope, effectCall);
+    statements.push(...cleanupStatements);
   }
   processRegularAttribute(key, attr, elId, statements, context2) {
     const attrName = key === "className" ? "class" : key;
@@ -2027,7 +2066,8 @@ function j2d({ types: t }) {
             { local: "$createComponent", imported: "createComponent" },
             { local: "$style", imported: "style" },
             { local: "$spread", imported: "spread" },
-            { local: "$toSignal", imported: "toSignal" }
+            { local: "$toSignal", imported: "toSignal" },
+            { local: "$effect", imported: "effect" }
           ];
           for (const helper of helpers) {
             path14.unshiftContainer(
@@ -2148,36 +2188,59 @@ function j2d({ types: t }) {
 }
 
 // src/plugins/generators/generate_server_component.ts
-import { parseSync as parseSync3 } from "@swc/core";
+import { parseSync as parseSync3, printSync as printSync2 } from "@swc/core";
 function generateServerComponent(filePath, code) {
   const ast = parseSync3(code, {
     syntax: "typescript",
     tsx: filePath.endsWith("x"),
     decorators: true
   });
-  const componentInfo = extractComponentInfo(ast);
-  return generateStubCode(componentInfo);
-}
-function extractComponentInfo(ast) {
-  let componentClass = null;
+  const importMap = {};
   for (const item of ast.body) {
-    if (item.type === "ExportDeclaration" && item.declaration.type === "ClassDeclaration") {
+    if (item.type === "ImportDeclaration") {
+      const decl = item;
+      for (const specifier of decl.specifiers ?? []) {
+        let localName;
+        if (specifier.type === "ImportSpecifier") {
+          localName = specifier.local.value;
+        } else if (specifier.type === "ImportDefaultSpecifier") {
+          localName = specifier.local.value;
+        } else {
+          continue;
+        }
+        importMap[localName] = decl.source.value;
+      }
+    }
+  }
+  const preservedNodes = [];
+  const stubbedClasses = [];
+  for (const item of ast.body) {
+    let shouldStub = false;
+    if (item.type === "ExportDeclaration" && item.declaration?.type === "ClassDeclaration") {
       const classDecl = item.declaration;
       if (hasComponentDecorator2(classDecl.decorators)) {
-        componentClass = classDecl;
-        break;
+        shouldStub = true;
+        const stub = extractClassStub2(classDecl);
+        if (stub) {
+          stubbedClasses.push(stub);
+        }
       }
     }
+    if (!shouldStub) {
+      preservedNodes.push(item);
+    }
   }
-  if (!componentClass || !componentClass.identifier) {
-    throw new Error("Component class is undefined");
-  }
-  const className = componentClass.identifier.value;
-  const methods = extractMethods2(componentClass);
-  return {
-    className,
-    methods
-  };
+  const preservedCode = preservedNodes.length > 0 ? printSync2({
+    type: "Module",
+    span: ast.span,
+    body: preservedNodes,
+    interpreter: ast.interpreter
+  }).code : "";
+  const stubCode = stubbedClasses.map((stub) => generateStubCode(stub)).join("\n\n");
+  return `
+${preservedCode}
+${stubCode}
+  `.trim();
 }
 function hasComponentDecorator2(decorators) {
   if (!decorators) return false;
@@ -2194,6 +2257,111 @@ function hasComponentDecorator2(decorators) {
     return false;
   });
 }
+function extractClassStub2(classDecl) {
+  const className = classDecl.identifier?.value;
+  if (!className) return null;
+  let propsType = "{}";
+  const decorators = [];
+  const constructorParams = [];
+  if (classDecl.decorators) {
+    for (const dec of classDecl.decorators) {
+      const str = stringifyDecorator2(dec);
+      if (str) decorators.push(str);
+    }
+  }
+  for (const member of classDecl.body) {
+    if (member.type === "ClassProperty") {
+      if (member.key.type === "Identifier" && member.key.value === "props") {
+        propsType = extractPropsType2(member);
+      }
+    } else if (member.type === "Constructor") {
+      for (const param of member.params) {
+        const paramStr = stringifyParam2(param);
+        if (paramStr) constructorParams.push(paramStr);
+      }
+    }
+  }
+  const methods = extractMethods2(classDecl);
+  return {
+    name: className,
+    propsType,
+    decorators,
+    constructorParams,
+    methods
+  };
+}
+function stringifyDecorator2(decorator) {
+  const exprCode = printSync2({
+    type: "Module",
+    span: { start: 0, end: 0, ctxt: 0 },
+    body: [
+      {
+        type: "ExpressionStatement",
+        expression: decorator.expression,
+        span: { start: 0, end: 0, ctxt: 0 }
+      }
+    ],
+    interpreter: ""
+  }).code;
+  const cleanCode = exprCode.replace(/^#!.*\n/, "").trim();
+  return `@${cleanCode.replace(/;$/, "")}`;
+}
+function extractPropsType2(member) {
+  const typeAnn = member.typeAnnotation?.typeAnnotation;
+  if (!typeAnn) return "{}";
+  if (typeAnn.type === "TsTypeLiteral") {
+    const props = [];
+    for (const m of typeAnn.members) {
+      if (m.type === "TsPropertySignature") {
+        const key = m.key.type === "Identifier" ? m.key.value : "?";
+        const t = m.typeAnnotation ? stringifyType3(m.typeAnnotation.typeAnnotation) : "any";
+        props.push(`${key}: ${t}`);
+      }
+    }
+    return `{ ${props.join("; ")} }`;
+  }
+  return stringifyType3(typeAnn);
+}
+function stringifyParam2(param) {
+  let decorators = [];
+  if (param.decorators) {
+    for (const d of param.decorators) {
+      const str = stringifyDecorator2(d);
+      if (str) decorators.push(str);
+    }
+  }
+  const decoratorPrefix = decorators.length ? decorators.join(" ") + " " : "";
+  let typeName = "any";
+  let paramName = "";
+  let accessibility = "";
+  if (param.type === "TsParameterProperty") {
+    accessibility = param.accessibility || "";
+    const inner = param.param;
+    if (inner.type !== "Identifier") return "";
+    paramName = inner.value;
+    if (inner.typeAnnotation?.typeAnnotation) {
+      typeName = extractTypeName2(inner.typeAnnotation.typeAnnotation);
+    }
+  } else if (param.type === "Parameter") {
+    const pat = param.pat;
+    if (pat.type !== "Identifier") return "";
+    paramName = pat.value;
+    if (pat.typeAnnotation?.typeAnnotation) {
+      typeName = extractTypeName2(pat.typeAnnotation.typeAnnotation);
+    }
+  } else {
+    return "";
+  }
+  const accessPrefix = accessibility ? `${accessibility} ` : "";
+  const result = `${decoratorPrefix}${accessPrefix}${paramName}: ${typeName}`;
+  return result;
+}
+function extractTypeName2(typeNode) {
+  if (typeNode.type === "TsTypeReference" && typeNode.typeName.type === "Identifier") {
+    return typeNode.typeName.value;
+  }
+  return stringifyType3(typeNode);
+}
 function extractMethods2(classDecl) {
   const methods = [];
   for (const member of classDecl.body) {
@@ -2283,30 +2451,31 @@ function stringifyType3(typeNode) {
       return "any";
   }
 }
-function generateStubCode(componentInfo) {
-  const className = componentInfo.className;
-  const build = componentInfo.methods.find((p) => p.name == "build");
+function generateStubCode(stub) {
+  const className = stub.name;
+  const build = stub.methods.find((p) => p.name == "build");
   if (build == void 0) {
     throw new Error("Component has no build function");
   }
+  const decoratorsStr = stub.decorators.length > 0 ? stub.decorators.join("\n") + "\n" : "";
   return `import { 
-  Component, 
-  Inject, 
-  getCurrentInjector, 
-  OrcaComponent,
-  JSX,
-  OSC,
-  HttpClient,
-  symbolValueReviver
+  Inject as _Inject, 
+  getCurrentInjector as _getCurrentInjector, 
+  OrcaComponent as _OrcaComponent,
+  JSX as _JSX,
+  OSC as _OSC,
+  HttpClient as _HttpClient,
+  symbolValueReviver as _symbolValueReviver
 } from "@kithinji/orca";
 
-@Component()
-export class ${className} extends OrcaComponent {
+
+${decoratorsStr}export class ${className} extends _OrcaComponent {
     props!: any;
 
     constructor(
-      @Inject("OSC_URL", { maybe: true }) private oscUrl?: string,
-      private readonly http: HttpClient,
+      @_Inject("OSC_URL", { maybe: true }) private oscUrl?: string,
+      private readonly http: _HttpClient,
+      ${stub.constructorParams.join(", ")}
     ) {
       super();
 
@@ -2319,20 +2488,20 @@ export class ${className} extends OrcaComponent {
         const root = document.createElement("div");
         root.textContent = "loading...";
 
-        const injector = getCurrentInjector();
+        const injector = _getCurrentInjector();
 
         if(injector == null) {
           throw new Error("Injector is null");
         }
 
-        const osc = new OSC(root);
+        const osc = new _OSC(root);
 
-        const subscription = this.http.post<JSX.Element>(
+        const subscription = this.http.post<_JSX.Element>(
           \`\${this.oscUrl}?c=${className}\`, {
             body: this.props,
-            reviver: symbolValueReviver,
+            reviver: _symbolValueReviver,
           }
-        ).subscribe((jsx: JSX.Element) => {
+        ).subscribe((jsx: _JSX.Element) => {
           const action = jsx.action || "insert";
 
           if (action === "insert") {
@@ -4541,7 +4710,7 @@ function printNextSteps(projectName, env, services) {
 
 // src/main.ts
 var program = new Command();
-program.name("pod").description("Pod cli tool").version("1.0.14");
+program.name("pod").description("Pod cli tool").version("1.0.16");
 program.command("new <name>").description("Start a new Pod Project").action(async (name) => {
   await addNew(name);
   const appDir = path13.resolve(process.cwd(), name);