wiip

src/app/template_set.ts

@@ -55,7 +55,7 @@ export class TemplateSet {
       const template = this.getTemplate(subTemplate);
       return toggler(subTemplate, template.call(owner, ctx, parent, key));
     },
-    getTemplate: (name: string) => this.getTemplate(name),
+    getTemplate: (name: string, nameSpace?: string) => this.getTemplate(name, nameSpace),
   });
 
   constructor(config: TemplateSetConfig = {}) {
@@ -87,13 +87,15 @@ export class TemplateSet {
     }
   }
 
-  getTemplate(name: string): Template {
+  getTemplate(name: string, nameSpace?: string): Template {
+
     if (!(name in this.templates)) {
       const rawTemplate = this.rawTemplates[name];
       if (rawTemplate === undefined) {
         throw new Error(`Missing template: "${name}"`);
       }
-      const templateFn = this._compileTemplate(name, rawTemplate);
+          console.log("getTemplate", nameSpace);
+      const templateFn = this._compileTemplate(name, rawTemplate, nameSpace);
       // first add a function to lazily get the template, in case there is a
       // recursive call to the template name
       const templates = this.templates;
@@ -106,12 +108,14 @@ export class TemplateSet {
     return this.templates[name];
   }
 
-  _compileTemplate(name: string, template: string | Node) {
+  _compileTemplate(name: string, template: string | Node, nameSpace?: string) {
+    console.log("CompileTpm", nameSpace)
     return compile(template, {
       name,
       dev: this.dev,
       translateFn: this.translateFn,
       translatableAttributes: this.translatableAttributes,
+      nameSpace: nameSpace,
     });
   }
 }

src/compiler/code_generator.ts

@@ -33,6 +33,7 @@ export interface Config {
 export interface CodeGenOptions extends Config {
   hasSafeContext?: boolean;
   name?: string;
+  nameSpace?: string;
 }
 
 // using a non-html document so that <inner/outer>HTML serializes as XML instead
@@ -214,8 +215,9 @@ export class CodeGenerator {
   translateFn: (s: string) => string;
   translatableAttributes: string[];
   ast: AST;
-  staticCalls: { id: string; template: string }[] = [];
+  staticCalls: { id: string; template: string, nameSpace?: string }[] = [];
   helpers: Set<string> = new Set();
+  nameSpace?: string;
 
   constructor(ast: AST, options: CodeGenOptions) {
     this.translateFn = options.translateFn || ((s: string) => s);
@@ -224,6 +226,8 @@ export class CodeGenerator {
     this.dev = options.dev || false;
     this.ast = ast;
     this.templateName = options.name;
+    this.nameSpace = options.nameSpace;
+    console.log('ThisNS', this.nameSpace)
   }
 
   generateCode(): string {
@@ -238,6 +242,7 @@ export class CodeGenerator {
       isLast: true,
       translate: true,
       tKeyExpr: null,
+      nameSpace: this.nameSpace,
     });
     // define blocks and utility functions
     let mainCode = [
@@ -250,8 +255,12 @@ export class CodeGenerator {
       mainCode.push(`// Template name: "${this.templateName}"`);
     }
 
-    for (let { id, template } of this.staticCalls) {
-      mainCode.push(`const ${id} = getTemplate(${template});`);
+    for (let { id, template, nameSpace } of this.staticCalls) {
+      let ns;
+      if (nameSpace) {
+        ns = `, "${nameSpace}"`;
+      }
+      mainCode.push(`const ${id} = getTemplate(${template}${ns});`);
     }
 
     // define all blocks
@@ -539,6 +548,7 @@ export class CodeGenerator {
     // attributes
     const attrs: { [key: string]: string } = {};
     const nameSpace = ast.ns || ctx.nameSpace;
+    console.log(nameSpace)
     if (nameSpace && isNewBlock) {
       // specific namespace uri
       attrs["block-ns"] = nameSpace;
@@ -960,7 +970,7 @@ export class CodeGenerator {
     } else {
       const id = this.generateId(`callTemplate_`);
       this.helpers.add("getTemplate");
-      this.staticCalls.push({ id, template: subTemplate });
+      this.staticCalls.push({ id, template: subTemplate, nameSpace: ctx.nameSpace });
       block = this.createBlock(block, "multi", ctx);
       this.insertBlock(`${id}.call(this, ctx, node, ${key})`, block!, {
         ...ctx,

src/compiler/index.ts

@@ -8,6 +8,7 @@ export type TemplateFunction = (blocks: any, utils: any) => Template;
 
 interface CompileOptions extends Config {
   name?: string;
+  nameSpace?: string,
 }
 export function compile(template: string | Node, options: CompileOptions = {}): TemplateFunction {
   // parsing
@@ -20,8 +21,10 @@ export function compile(template: string | Node, options: CompileOptions = {}):
       : !template.includes("t-set") && !template.includes("t-call");
 
   // code generation
+  console.log("compile", options)
   const codeGenerator = new CodeGenerator(ast, { ...options, hasSafeContext });
   const code = codeGenerator.generateCode();
+  console.log(code)
   // template function
   return new Function("bdom, helpers", code) as TemplateFunction;
 }

tests/compiler/__snapshots__/svg.test.ts.snap

@@ -57,7 +57,7 @@ exports[`properly support svg svg namespace added to sub-blocks (t-call) 1`] = `
 ) {
   let { text, createBlock, list, multi, html, toggler, component, comment } = bdom;
   let { getTemplate } = helpers;
-  const callTemplate_1 = getTemplate(\`path\`);
+  const callTemplate_1 = getTemplate(\`path\`, \\"http://www.w3.org/2000/svg\\");
   
   let block1 = createBlock(\`<svg block-ns=\\"http://www.w3.org/2000/svg\\"><block-child-0/></svg>\`);