malinajs 0.7.2-a7 → 0.7.2-a8

package/CHANGELOG.md

@@ -16,6 +16,7 @@
 * refactoring $onMount
 * optional deep checking for passed props: prop={value} prop|deep={value}
 * keep-alive
+* malina:self
 
 ## 0.6.x
 

package/malina.js

@@ -2187,7 +2187,13 @@
           if(n.name == 'malina' && !option.malinaElement) {
             let b;
             if(n.elArg == 'portal') b = this.attachPortal(n);
-            else b = this.attachHead(n);
+            else if(['window', 'body', 'head'].includes(n.elArg)) b = this.attachHead(n);
+            else if(n.elArg == 'self') {
+              this.glob.$$selfComponent.$value();
+              const label = requireLabel();
+              let component = this.makeComponent(n, {self: true});
+              binds.push(insertComponent(component, label));
+            } else throw 'Wrong tag';
             b && binds.push(b);
             return;
           }
@@ -2207,23 +2213,7 @@
               } else {
                 const label = requireLabel();
                 let component = this.makeComponent(n);
-                binds.push(xNode('insert-component', {
-                  component: component.bind,
-                  reference: component.reference,
-                  label
-                }, (ctx, n) => {
-                  if(n.reference) {
-                    ctx.write(true, `${n.reference} = `);
-                    ctx.add(n.component);
-                    if(n.label.node) ctx.write(true, `$runtime.insertBlock(${n.label.name}, ${n.reference});`);
-                    else ctx.write(true, `$runtime.addBlock(${n.label.name}, ${n.reference});`);
-                  } else {
-                    if(n.label.node) ctx.write(true, `$runtime.insertBlock(${n.label.name}, `);
-                    else ctx.write(true, `$runtime.addBlock(${n.label.name}, `);
-                    ctx.add(n.component);
-                    ctx.write(');');
-                  }
-                }));
+                binds.push(insertComponent(component, label));
               }
             } else {
               if(isRoot) requireFragment = true;
@@ -2644,6 +2634,26 @@
     throw e;
   }
 
+  function insertComponent(component, label) {
+    return xNode('insert-component', {
+      component: component.bind,
+      reference: component.reference,
+      label
+    }, (ctx, n) => {
+      if(n.reference) {
+        ctx.write(true, `${n.reference} = `);
+        ctx.add(n.component);
+        if(n.label.node) ctx.write(true, `$runtime.insertBlock(${n.label.name}, ${n.reference});`);
+        else ctx.write(true, `$runtime.addBlock(${n.label.name}, ${n.reference});`);
+      } else {
+        if(n.label.node) ctx.write(true, `$runtime.insertBlock(${n.label.name}, `);
+        else ctx.write(true, `$runtime.addBlock(${n.label.name}, `);
+        ctx.add(n.component);
+        ctx.write(');');
+      }
+    })
+  }
+
   var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
 
   function createCommonjsModule(fn, basedir, module) {
@@ -4882,7 +4892,7 @@
     return result;
   };
 
-  function makeComponent(node) {
+  function makeComponent(node, option={}) {
     let propList = node.attributes;
 
     this.require('$context');
@@ -4892,8 +4902,8 @@
     let slotBlocks = [];
     let anchorBlocks = [];
 
-    let componentName = node.name;
-    if(componentName != 'component' && this.config.autoimport) {
+    let componentName = option.self ? '$$selfComponent' : node.name;
+    if(componentName != 'component' && this.config.autoimport && !option.self) {
       let imported = this.script.autoimport[componentName] || this.script.importedNames.includes(componentName) ||
         this.script.rootVariables[componentName] || this.script.rootFunctions[componentName];
 
@@ -6750,7 +6760,7 @@
     });
   }
 
-  const version = '0.7.2-a7';
+  const version = '0.7.2-a8';
 
 
   async function compile(source, config = {}) {
@@ -6805,7 +6815,8 @@
         rootCD: xNode('root-cd', false),
         apply: xNode('apply', false),
         componentFn: xNode('componentFn', false),
-        $onMount: xNode('$onMount', false)
+        $onMount: xNode('$onMount', false),
+        $$selfComponent: xNode('$$selfComponent', false)
       },
       require: function(...args) {
         for(let name of args) {
@@ -6902,10 +6913,21 @@
         $compile: [ctx.module.head, ctx.module.code, ctx.module.body, ctx.glob.rootCD],
         name: config.name,
         componentFn: ctx.glob.componentFn
-      }, (ctx, n) => {
-        if(config.exportDefault) ctx.write(true, 'export default ');
-        else ctx.write(true, `const ${n.name} = `);
-        ctx.add(n.componentFn);
+      }, (ctx2, n) => {
+        if(config.exportDefault) {
+          if(ctx.glob.$$selfComponent.value) {
+            ctx2.write(true, 'const $$selfComponent = ');
+            ctx2.add(n.componentFn);
+            ctx2.write(true, 'export default $$selfComponent;');
+          } else {
+            ctx2.write(true, 'export default ');
+            ctx2.add(n.componentFn);
+          }
+        } else {
+          assert(!ctx.glob.$$selfComponent.value, 'Not supported');
+          ctx2.write(true, `const ${n.name} = `);
+          ctx2.add(n.componentFn);
+        }
       }));
 
       ctx.result = xBuild(result);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "malinajs",
-  "version": "0.7.2-a7",
+  "version": "0.7.2-a8",
   "license": "MIT",
   "scripts": {
     "prepare": "npm run build",