malinajs 0.6.59 → 0.6.62

package/compile.js

@@ -53,7 +53,7 @@ const isNumber = (value) => {
 function detectExpressionType(name) {
     if(isSimpleName(name)) return 'identifier';
 
-    let ast = acorn.parse(name, {allowReturnOutsideFunction: true});
+    let ast = acorn.parse(name, {allowReturnOutsideFunction: true, ecmaVersion: 'latest'});
 
     function checkIdentificator(body) {
         if(body.length != 1) return;
@@ -250,7 +250,7 @@ const genId = () => {
 
 
 const extractKeywords = (exp) => {
-    let ast = acorn.parse(exp, {sourceType: 'module', ecmaVersion: 12});
+    let ast = acorn.parse(exp, {sourceType: 'module', ecmaVersion: 'latest'});
 
     const keys = new Set();
     const rec = (n) => {
@@ -305,7 +305,7 @@ const replaceElementKeyword = (exp, fn) => {
 
 const parseJS = (exp) => {
     let self = {};
-    self.ast = acorn.parse(exp, {sourceType: 'module', ecmaVersion: 12});
+    self.ast = acorn.parse(exp, {sourceType: 'module', ecmaVersion: 'latest'});
 
     self.transform = function(fn) {
         const rec = (n, pk) => {
@@ -1126,7 +1126,7 @@ function parse$1() {
             if(isBlockComment) return;
             this.script.comments.push({start, end, value});
         };
-        this.script.ast = acorn.parse(source, {sourceType: 'module', ecmaVersion: 12, onComment});
+        this.script.ast = acorn.parse(source, {sourceType: 'module', ecmaVersion: 'latest', onComment});
 
         if(source.includes('$props')) this.require('$props');
         if(source.includes('$attributes')) this.require('$attributes');
@@ -3870,6 +3870,7 @@ function processCSS() {
                             }
                         } else cleanSelectorItems.push(s);
                     }
+                    while(cleanSelectorItems.length && ['WhiteSpace', 'Combinator'].includes(cleanSelectorItems[0].type)) cleanSelectorItems.shift();
                     while(cleanSelectorItems.length && ['WhiteSpace', 'Combinator'].includes(last(cleanSelectorItems).type)) cleanSelectorItems.pop();
                     if(!cleanSelectorItems.length || globalBlock) {  // fully global?
                         assert(origin.length);
@@ -5376,6 +5377,11 @@ function makeFragment(node) {
         });
     }
 
+    if(external) {
+      this.require('$component');
+      if(props?.length) this.require('apply');
+    }
+
     return xNode('fragment', {
         name,
         props,

package/malina.js

@@ -54,7 +54,7 @@
     function detectExpressionType(name) {
         if(isSimpleName(name)) return 'identifier';
 
-        let ast = acorn.parse(name, {allowReturnOutsideFunction: true});
+        let ast = acorn.parse(name, {allowReturnOutsideFunction: true, ecmaVersion: 'latest'});
 
         function checkIdentificator(body) {
             if(body.length != 1) return;
@@ -251,7 +251,7 @@
 
 
     const extractKeywords = (exp) => {
-        let ast = acorn.parse(exp, {sourceType: 'module', ecmaVersion: 12});
+        let ast = acorn.parse(exp, {sourceType: 'module', ecmaVersion: 'latest'});
 
         const keys = new Set();
         const rec = (n) => {
@@ -306,7 +306,7 @@
 
     const parseJS = (exp) => {
         let self = {};
-        self.ast = acorn.parse(exp, {sourceType: 'module', ecmaVersion: 12});
+        self.ast = acorn.parse(exp, {sourceType: 'module', ecmaVersion: 'latest'});
 
         self.transform = function(fn) {
             const rec = (n, pk) => {
@@ -1127,7 +1127,7 @@
                 if(isBlockComment) return;
                 this.script.comments.push({start, end, value});
             };
-            this.script.ast = acorn.parse(source, {sourceType: 'module', ecmaVersion: 12, onComment});
+            this.script.ast = acorn.parse(source, {sourceType: 'module', ecmaVersion: 'latest', onComment});
 
             if(source.includes('$props')) this.require('$props');
             if(source.includes('$attributes')) this.require('$attributes');
@@ -3871,6 +3871,7 @@
                                 }
                             } else cleanSelectorItems.push(s);
                         }
+                        while(cleanSelectorItems.length && ['WhiteSpace', 'Combinator'].includes(cleanSelectorItems[0].type)) cleanSelectorItems.shift();
                         while(cleanSelectorItems.length && ['WhiteSpace', 'Combinator'].includes(last(cleanSelectorItems).type)) cleanSelectorItems.pop();
                         if(!cleanSelectorItems.length || globalBlock) {  // fully global?
                             assert(origin.length);
@@ -5377,6 +5378,11 @@
             });
         }
 
+        if(external) {
+          this.require('$component');
+          if(props?.length) this.require('apply');
+        }
+
         return xNode('fragment', {
             name,
             props,
@@ -5925,7 +5931,7 @@
         return {event, fn};
     }
 
-    const version = '0.6.59';
+    const version = '0.6.62';
 
 
     async function compile(source, config = {}) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "malinajs",
-  "version": "0.6.59",
+  "version": "0.6.62",
   "license": "MIT",
   "scripts": {
     "prepare": "npm run build",
@@ -15,7 +15,7 @@
     "brotli": "brotli --input /app/malinajs/example/public/app.min.js --output /app/malinajs/example/public/app.min.js.br; brotli --input /app/malinajs/example/public/app.min2.js --output /app/malinajs/example/public/app.min2.js.br"
   },
   "dependencies": {
-    "acorn": "^7.3.1",
+    "acorn": "^8.7.1",
     "astring": "^1.4.3",
     "css-tree": "^1.0.0-alpha.39"
   },

package/readme.md

@@ -1,7 +1,7 @@
 
 ## Malina.js
 
-<img align="right" width="200" height="200" src="malinajs2.png" />
+<img align="right" width="200" height="200" src="https://github.com/malinajs/malinajs/raw/master/malinajs2.png" />
 
 Malina.js builds your web-application to use it **without framework on frontend side**. Therefore your web-app becomes thinner and faster, and the application itself consist of **vanilla JavaScript**, look at [examples](https://malinajs.github.io/repl/). [TodoMVC example](https://malina-todomvc.surge.sh) **2.7kb** (gzipped) and [source code](https://github.com/malinajs/todomvc)
 

package/runtime.js

@@ -718,7 +718,7 @@ const exportFragment = ($component, name, fn) => {
       let $cd = $childCD.new();
       cd_onDestroy($parentCD, () => $cd.destroy());
       fn($cd, label, props, events, slot);
-      $component.apply();
+      $component.apply?.();
     };
 };
 
@@ -734,7 +734,7 @@ const observeProps = (cmp, fn) => {
         let result;
         fire($watch(cd, fn, value => {
             result = value;
-            target.$$.apply();
+            target.$$.apply?.();
         }, {ro: true, value: {}, cmp}));
         return () => result;
     }
@@ -748,6 +748,18 @@ const unwrapProps = (cd, props, fn) => {
     }
 };
 
+
+const mount = (label, component, option) => {
+    const app = component(label, option);
+    const destroy = () => label.textContent = '';
+
+    if(app?._d) {
+        app._d.push(destroy);
+        return app;
+    }
+    return {destroy};
+};
+
 function $$htmlBlock($cd, tag, fn) {
     let lastElement;
     let create = (html) => {
@@ -947,4 +959,4 @@ function $$eachBlock($parentCD, label, onlyChild, fn, getKey, itemTemplate, bind
     }, {ro: true, cmp: $$compareArray});
 }
 
-export { $$addEventForComponent, $$awaitBlock, $$cloneDeep, $$compareArray, $$compareDeep, $$deepComparator, $$eachBlock, $$htmlBlock, $$htmlToFragment, $$htmlToFragmentClean, $$ifBlock, $$removeElements, $$removeItem, $ChangeDetector, $base, $context, $digest, $insertElementByOption, $makeEmitter, $onDestroy, $onMount, $readOnlyBase, $tick, $watch, $watchReadOnly, __app_onerror, __bindActionSubscribe, addClass, addEvent, addStyles, attachAnchor, attachSlot, attachSlotBase, attchExportedFragment, autoSubscribe, bindAction, bindAttribute, bindAttributeBase, bindClass, bindInput, bindStyle, bindText, callComponent, cd_onDestroy, childNodes, cloneDeep, configure, createTextNode, current_component, eachDefaultKey, exportFragment, fire, firstChild, getFinalLabel, insertAfter, isArray, isFunction, keyComparator, makeClassResolver, makeComponent, makeExternalProperty, makeSlot, makeSlotStatic, noop, observeProps, prefixPush, removeElementsBetween, setClassToElement, spreadAttributes, svgToFragment, unwrapProps };
+export { $$addEventForComponent, $$awaitBlock, $$cloneDeep, $$compareArray, $$compareDeep, $$deepComparator, $$eachBlock, $$htmlBlock, $$htmlToFragment, $$htmlToFragmentClean, $$ifBlock, $$removeElements, $$removeItem, $ChangeDetector, $base, $context, $digest, $insertElementByOption, $makeEmitter, $onDestroy, $onMount, $readOnlyBase, $tick, $watch, $watchReadOnly, __app_onerror, __bindActionSubscribe, addClass, addEvent, addStyles, attachAnchor, attachSlot, attachSlotBase, attchExportedFragment, autoSubscribe, bindAction, bindAttribute, bindAttributeBase, bindClass, bindInput, bindStyle, bindText, callComponent, cd_onDestroy, childNodes, cloneDeep, configure, createTextNode, current_component, eachDefaultKey, exportFragment, fire, firstChild, getFinalLabel, insertAfter, isArray, isFunction, keyComparator, makeClassResolver, makeComponent, makeExternalProperty, makeSlot, makeSlotStatic, mount, noop, observeProps, prefixPush, removeElementsBetween, setClassToElement, spreadAttributes, svgToFragment, unwrapProps };